From 72f4dddc9a4c72d1aed3a66fac194a9d9bae17bf Mon Sep 17 00:00:00 2001 From: Mali Akmanalp Date: Fri, 27 Jun 2014 16:04:02 -0400 Subject: [PATCH 1/2] Purge any remaining trace of chosen.js for the embetterment of humanity. --- django_files/observatory/views.py | 8 +-- html/explore/index.html | 97 ++++------------------------- media/css/style.css | 100 ++---------------------------- media/js/explore/dropdowns.js | 85 ++++++++++++++++--------- media/js/explore/general.js | 2 +- 5 files changed, 77 insertions(+), 215 deletions(-) diff --git a/django_files/observatory/views.py b/django_files/observatory/views.py index 1c5d87ed..8a46784b 100644 --- a/django_files/observatory/views.py +++ b/django_files/observatory/views.py @@ -459,12 +459,6 @@ def explore(request, app_name, trade_flow, country1, country2, product, year="20 # Return page without visualization data - # Making sure we return the product list every time - if prod_class == "sitc4": - product_list = Sitc4.objects.get_all(lang) - else: - product_list = Hs4.objects.get_all(lang) - # Record views in redis for "newest viewed pages" visualization if settings.REDIS: views_image_path = settings.STATIC_URL + "data/" + request_hash_string + ".png" @@ -506,6 +500,7 @@ def explore(request, app_name, trade_flow, country1, country2, product, year="20 "country1_3char": countries[0].name_3char if countries[0] else "", "country2_3char": countries[1].name_3char if countries[1] else "", "product": product, + "product_code": product.code if not isinstance(product, basestring) else product, "years_available": years_available, "year": year, "year_start": year_start, @@ -514,7 +509,6 @@ def explore(request, app_name, trade_flow, country1, country2, product, year="20 "year2_list": year2_list, "year_interval_list": year_interval_list, "trade_flow_list": trade_flow_list, - "product_list": product_list, "api_uri": api_uri, "app_type": app_type, "redesign_api_uri": redesign_api_uri, diff --git a/html/explore/index.html b/html/explore/index.html index c725e048..84bce2df 100644 --- a/html/explore/index.html +++ b/html/explore/index.html @@ -40,15 +40,13 @@ - + - - @@ -142,7 +140,7 @@

{% if title %}{{titl - @@ -184,7 +182,7 @@

{% if title %}{{titl - @@ -197,7 +195,7 @@

{% if title %}{{titl - @@ -274,8 +272,7 @@

{% if title %}{{titl -
- {% for y in year1_list %} {% if y == year or y == year_start %} @@ -284,10 +281,8 @@

{% if title %}{{titl {% endif %} {% endfor %} -

-
- {% for y in year1_list %} {% if y == year_end %} @@ -297,7 +292,6 @@

{% if title %}{{titl {% endif %} {% endfor %} -

@@ -580,17 +574,9 @@

Click Here To Refresh The Visualization

Highlight: - - {% if app_type = "casy" or app_type = "ccsy" %} - - {% elif app_type = "csay" or app_type = "cspy" or app_type = "sapy" %} - - {% endif %} + -
@@ -790,9 +776,9 @@

Click Here To Refresh The Visualization

function highlight(value) { + var v = value ? value : $("#highlight_select").select2("val").trim(); {% if app_name == "product_space" or app_name == "rings" or app_type = "cspy" %} - var v = value ? value : $("#highlight").find(":selected").val().trim(); d3.select("#viz").call(chart.highlight([])); d3.select("#viz").call(chart.highlight(v)); @@ -804,8 +790,6 @@

Click Here To Refresh The Visualization

{% if app_name == "pie_scatter" or app_name == "tree_map" or app_name == "stacked" %} - var v = value ? value : $("#highlight").find(":selected").val().trim(); - {% if app_type = "casy" %} if(v.length>0) @@ -835,8 +819,7 @@

Click Here To Refresh The Visualization

function reset_highlight() { - $("#highlight").find(":selected").prop("selected", false); - $("#highlight_select").trigger("chosen:updated"); + $("#highlight_select").select2("val", ""); queryParameters["highlight"] = ""; if(queryActivated) updateURLQueryParameters(); @@ -849,15 +832,7 @@

Click Here To Refresh The Visualization

Highlight: - {% if app_type = "casy" or app_type = "ccsy" %} - - {% elif app_type = "csay" or app_type = "cspy" or app_type = "sapy" %} - - {% endif %} + @@ -904,7 +879,6 @@

Click Here To Refresh The Visualization

Center for International Development Logo
-
Language:
@@ -1044,7 +1018,7 @@

- + @@ -1182,13 +1156,8 @@

*{ - } .app #main #tool_pane h3 { font-weight: normal; @@ -460,31 +457,6 @@ text-decoration: none; .app #main .ui-button-text{ padding: 2px 6px } -.app #main #tool_pane .dropdown_container { - clear: both; -} -.app #main #tool_pane .dropdown_container select { - margin: 0 0 14px 0; - width: 163px; -} -.app #main #tool_pane .dropdown_container#year_start { - float: left; - padding-right: 5px; - clear: none; -} -.app #main #tool_pane .dropdown_container#year_end { - float: left; - padding-left: 5px; - clear: none; -} -.app #main #tool_pane .dropdown_container#year_start select, -.app #main #tool_pane .dropdown_container#year_end select { - width: 75px; -} -.app #main #tool_pane .chzn-container { - cursor: pointer; - margin: 0 0 5px 0; -} .app #main #tool_pane button { background:#888; background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#888), to(#999)); @@ -500,6 +472,12 @@ text-decoration: none; margin: 12px 0; height: 0.5px; } +.app #main #tool_pane hr { + background: #cccccc; + clear: both; + margin: 12px 0; + height: 0.5px; +} .app #main #tool_pane .control_container { margin: 10px 0; } @@ -526,50 +504,6 @@ text-decoration: none; .product_class select { width: 52px } -.product_class .chzn-container-single .chzn-single { - height: 18px; - line-height: 18px; - padding: 0 0 0 3px; -} -.product_class .chzn-container-single .chzn-single div { - width: 15px; -} -.product_class .chzn-container-single .chzn-single div b { - background-position: -1px -3px; -} -.product_class .chzn-container-single .chzn-single span { - margin-right: 15px; -} -.product_class .chzn-container-single .chzn-search { - display: none; -} -.product_class .chzn-container .chzn-results li { - padding: 3px 7px 4px; -} -/* Nesting */ -.nesting select { - width: 52px -} -.nesting .chzn-container-single .chzn-single { - height: 18px; - line-height: 18px; - padding: 0 0 0 3px; -} -.nesting .chzn-container-single .chzn-single div { - width: 15px; -} -.nesting .chzn-container-single .chzn-single div b { - background-position: -1px -3px; -} -.nesting .chzn-container-single .chzn-single span { - margin-right: 15px; -} -.nesting .chzn-container-single .chzn-search { - display: none; -} -.nesting .chzn-container .chzn-results li { - padding: 3px 7px 4px; -} @@ -1887,18 +1821,6 @@ div.btn_label { color: #333333; } -#country1 .chosen-results li.active-result, #country-trade-partner .chosen-results li.active-result { - background-size:25px; - padding-left: 25px; - margin-top:-4px; -} - -#country1 .chosen-results li:hover, #country-trade-partner .chosen-results li:hover { - background-size:25px; - padding-left: 25px; - margin-top:-4px; - background-color: lightblue; -} .divBtn{ width: 100%; @@ -1971,16 +1893,6 @@ p .gTerm{ position:relative; z-index:1; } -#highlight{ - -} -#highlight .chosen-drop{ - max-height: 110px; -} -#highlight .chosen-drop .chosen-results{ - max-height: 75px; -} - table { margin: 0px 0 30px 0; width: 100%; diff --git a/media/js/explore/dropdowns.js b/media/js/explore/dropdowns.js index 9f5352b0..23963351 100644 --- a/media/js/explore/dropdowns.js +++ b/media/js/explore/dropdowns.js @@ -7,18 +7,30 @@ $(document).ready(function(){ url: "http://localhost:8000/api/dropdowns/products/" }) .done(function( data ){ - for(var i = 0; i < data.length; i++){ - $("#country_product_select").append(""); - if(app_type == "casy" || app_type == "ccsy"){ - $("#highlight_select").append(""); - } + var product_dropdowns = ["#country_product_select"]; + var highlight_contains_products = (app_type == "casy" || app_type == "ccsy"); + if(highlight_contains_products){ + product_dropdowns.push("#highlight_select"); } - $('#country_product_select, #highlight_select').chosen({ allow_single_deselect: true }); - $("#country_product_select_chosen, #highlight_select_chosen").css("width", "140px"); - $("#highlight_select").trigger("chosen:updated"); + for(var i = 0; i < data.length; i++){ + $(product_dropdowns.join(", ")).append($('"); - } else { - $("#country1_select").append(""); - } - if (c2 == data[i][1]){ - $("#country_trade_partner_select").append(""); - } else { - $("#country_trade_partner_select").append(""); - } - if(app_type == "cspy" || app_type == "csay" || app_type == "sapy"){ - $("#highlight_select").append(""); - } + + function format_country_dropdown(country){ + return " " + country.text; } - $('#country1_select, #country_trade_partner_select, #highlight_select').chosen({ allow_single_deselect: true }); - $("#country1_select_chosen .chosen-single span").css("background", "url('media/img/icons/flag_"+$("#country1 select").val()+".png') no-repeat") - .css("background-size", "25px") - .css("padding-left", "30px") - .css("margin-top", "-2px"); - $('#country_trade_partner_select_chosen').css("width", "140px"); + var country_options = { + placeholder:"All Countries", + formatResult: format_country_dropdown, + formatSelection: format_country_dropdown, + allowClear: true, + }; + + $("#country1_select") + .select2(country_options) + .select2("val", c1); + + $("#country_trade_partner_select") + .select2(country_options) + .select2("val", c2); + + if (highlight_contains_countries){ + $("#highlight_select") + .select2(country_options); + } }); - $('#year1_select, #year2_select').chosen({ allow_single_deselect: true }); + $('#year1_select, #year2_select').select2(); + $('.language_select select').select2(); }); diff --git a/media/js/explore/general.js b/media/js/explore/general.js index d68f3cfc..300d90db 100644 --- a/media/js/explore/general.js +++ b/media/js/explore/general.js @@ -190,7 +190,7 @@ function update_viz(viz) { var current_viz = (typeof viz != "undefined" ) ? viz : $("#viz_apps").find(".active").attr("value"); current_viz = (typeof current_viz == "undefined" || current_viz == "") ? "tree_map" : current_viz; - var current_year1 = $("#year1").find(":selected").val(); + var current_year1 = $("#year1_select").val(); // Import or Export var current_flow = $(".flow-direction").find(".active").index() == 0 ? "export": "import"; From b0ddac100add11a43db8a045ebfc498c67105982 Mon Sep 17 00:00:00 2001 From: Mali Akmanalp Date: Fri, 27 Jun 2014 16:21:02 -0400 Subject: [PATCH 2/2] Replace chosen with select2 on other pages --- html/template.html | 22 ++++++++++------------ 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/html/template.html b/html/template.html index 90cf3c45..de9dd424 100644 --- a/html/template.html +++ b/html/template.html @@ -16,9 +16,9 @@ + - - +