Browse Source

HUE-1783 [beeswax] Result graphing

Added bar, line and map functionalities to the result page
Enrico Berti 12 years ago
parent
commit
bb77b4b

+ 237 - 0
apps/beeswax/src/beeswax/templates/watch_results.mako

@@ -60,7 +60,18 @@ ${layout.menubar(section='query')}
   .noLeftMargin {
     margin-left: 0!important;
   }
+
+  .empty {
+    text-align: center;
+    color: #CCCCCC;
+    font-size: 24px;
+    padding: 40px;
+  }
+  .map {
+    height: 400px;
+  }
 </style>
+<link href="/static/ext/css/leaflet.css" rel="stylesheet">
 
 <div class="container-fluid">
   <div id="expand"><i class="fa fa-chevron-right" style="color: #FFFFFF"></i></div>
@@ -135,6 +146,7 @@ ${layout.menubar(section='query')}
               <li><a href="#log" data-toggle="tab">${_('Log')}</a></li>
               % if not error:
               <li><a href="#columns" data-toggle="tab">${_('Columns')}</a></li>
+              <li><a href="#chart" data-toggle="tab">${_('Chart')}</a></li>
               % endif
             </ul>
 
@@ -213,6 +225,64 @@ ${layout.menubar(section='query')}
             </tbody>
           </table>
         </div>
+        <div class="tab-pane" id="chart">
+          <div style="text-align: center">
+          <form class="form-inline">
+            ${_('Chart type')}&nbsp;
+            <div class="btn-group" data-toggle="buttons-radio">
+              <a rel="tooltip" data-placement="top" title="${_('Bars')}" id="blueprintBars" href="javascript:void(0)" class="btn"><i class="fa fa-bar-chart-o"></i></a>
+              <a rel="tooltip" data-placement="top" title="${_('Lines')}" id="blueprintLines" href="javascript:void(0)" class="btn"><i class="fa fa-signal"></i></a>
+              <a rel="tooltip" data-placement="top" title="${_('Map')}" id="blueprintMap" href="javascript:void(0)" class="btn"><i class="fa fa-map-marker"></i></a>
+            </div>&nbsp;&nbsp;
+            <span id="blueprintAxis" class="hide">
+              <label>${_('X-Axis')}
+                <select id="blueprintX" class="blueprintSelect">
+                  <option value="-1">${ _("Please select a column")}</option>
+                  % for col in columns:
+                    <option value="${loop.index+2}">${ col.name }</option>
+                  % endfor
+                </select>
+              </label>&nbsp;&nbsp;
+              <label>${_('Y-Axis')}
+              <select id="blueprintY" class="blueprintSelect">
+                  <option value="-1">${ _("Please select a column")}</option>
+                  % for col in columns:
+                    <option value="${loop.index+2}">${ col.name }</option>
+                  % endfor
+                </select>
+              </label>&nbsp;&nbsp;
+              <a rel="tooltip" data-placement="top" title="${_('Download image')}" id="blueprintDownload" href="javascript:void(0)" class="btn hide"><i class="fa fa-download"></i></a>
+            </span>
+            <span id="blueprintLatLng" class="hide">
+              <label>${_('Latitude')}
+                <select id="blueprintLat" class="blueprintSelect">
+                  <option value="-1">${ _("Please select a column")}</option>
+                  % for col in columns:
+                    <option value="${loop.index+2}">${ col.name }</option>
+                  % endfor
+                </select>
+              </label>&nbsp;&nbsp;
+              <label>${_('Longitude')}
+              <select id="blueprintLng" class="blueprintSelect">
+                  <option value="-1">${ _("Please select a column")}</option>
+                  % for col in columns:
+                    <option value="${loop.index+2}">${ col.name }</option>
+                  % endfor
+                </select>
+              </label>&nbsp;&nbsp;
+              <label>${_('Label')}
+              <select id="blueprintDesc" class="blueprintSelect">
+                  <option value="-1">${ _("Please select a column")}</option>
+                  % for col in columns:
+                    <option value="${loop.index+2}">${ col.name }</option>
+                  % endfor
+                </select>
+              </label>
+            </span>
+          </form>
+          </div>
+          <div id="blueprint" class="empty">${_("Please select a chart type.")}</div>
+        </div>
         % endif
       </div>
             </p>
@@ -267,6 +337,10 @@ ${layout.menubar(section='query')}
 </div>
 % endif.resultTable
 
+<script src="/static/ext/js/jquery/plugins/jquery.flot.min.js" type="text/javascript" charset="utf-8"></script>
+<script src="/static/ext/js/jquery/plugins/jquery.flot.categories.min.js" type="text/javascript" charset="utf-8"></script>
+<script src="/static/ext/js/leaflet/leaflet.js" type="text/javascript" charset="utf-8"></script>
+<script src="/static/js/jquery.blueprint.js" type="text/javascript" charset="utf-8"></script>
 
 <script type="text/javascript" charset="utf-8">
 $(document).ready(function () {
@@ -374,11 +448,13 @@ $(document).ready(function () {
     $(".sidebar-nav").parent().css("margin-left", "-31%");
     $("#expand").show().css("top", $(".sidebar-nav i").position().top + "px");
     $(".sidebar-nav").parent().next().removeClass("span9").addClass("span12").addClass("noLeftMargin");
+    generateGraph(getGraphType());
   });
   $("#expand").click(function () {
     $(this).hide();
     $(".sidebar-nav").parent().next().removeClass("span12").addClass("span9").removeClass("noLeftMargin");
     $(".sidebar-nav").parent().css("margin-left", "0");
+    generateGraph(getGraphType());
   });
 
   $(document).on("click", ".column-selector", function () {
@@ -455,6 +531,167 @@ $(document).ready(function () {
 
   _dt.jHueScrollUp();
 
+  function getMapBounds(lats, lngs) {
+    lats = lats.sort();
+    lngs = lngs.sort();
+    return [
+      [lats[lats.length - 1], lngs[lngs.length - 1]], // north-east
+      [lats[0], lngs[0]] // south-west
+    ]
+  }
+  var map;
+  function generateGraph(graphType) {
+    if (graphType != "") {
+      if (map != null) {
+        try {
+          map.remove();
+        }
+        catch (err) { // do nothing
+        }
+      }
+      $("#blueprintDownload").addClass("hide");
+      $("#blueprint").attr("class", "").attr("style", "").empty();
+      $("#blueprint").data("plugin_jHueBlueprint", null);
+      if (graphType == $.jHueBlueprint.TYPES.MAP) {
+        if ($("#blueprintLat").val() != "-1" && $("#blueprintLng").val() != "-1") {
+          var _latCol = $("#blueprintLat").val() * 1;
+          var _lngCol = $("#blueprintLng").val() * 1;
+          var _descCol = $("#blueprintDesc").val() * 1;
+          var _lats = [];
+          var _lngs = [];
+          $(".resultTable>tbody>tr>td:nth-child(" + _latCol + ")").each(function (cnt) {
+            _lats.push($.trim($(this).text()) * 1);
+          });
+          $(".resultTable>tbody>tr>td:nth-child(" + _lngCol + ")").each(function (cnt) {
+            _lngs.push($.trim($(this).text()) * 1);
+          });
+          $("#blueprint").addClass("map");
+          map = L.map("blueprint").fitBounds(getMapBounds(_lats, _lngs));
+
+          L.tileLayer("http://{s}.tile.osm.org/{z}/{x}/{y}.png", {
+            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
+          }).addTo(map);
+
+          $(".resultTable>tbody>tr>td:nth-child(" + _latCol + ")").each(function (cnt) {
+            if (_descCol != "-1") {
+              L.marker([$.trim($(this).text()) * 1, $.trim($(".resultTable>tbody>tr:nth-child(" + (cnt + 1) + ")>td:nth-child(" + _lngCol + ")").text()) * 1]).addTo(map).bindPopup($.trim($(".resultTable>tbody>tr:nth-child(" + (cnt + 1) + ")>td:nth-child(" + _descCol + ")").text()));
+            }
+            else {
+              L.marker([$.trim($(this).text()) * 1, $.trim($(".resultTable>tbody>tr:nth-child(" + (cnt + 1) + ")>td:nth-child(" + _lngCol + ")").text()) * 1]).addTo(map);
+            }
+          });
+
+        }
+        else {
+          $("#blueprint").addClass("empty").text("${_("Please select the latitude and longitude columns.")}");
+        }
+      }
+      else {
+        if ($("#blueprintX").val() != "-1" && $("#blueprintY").val() != "-1") {
+          var _x = $("#blueprintX").val() * 1;
+          var _y = $("#blueprintY").val() * 1;
+          var _data = [];
+          $(".resultTable>tbody>tr>td:nth-child(" + _x + ")").each(function (cnt) {
+            _data.push([$.trim($(this).text()), $.trim($(".resultTable>tbody>tr:nth-child(" + (cnt + 1) + ")>td:nth-child(" + _y + ")").text()) * 1]);
+          });
+
+          $("#blueprint").jHueBlueprint({
+            data: _data,
+            label: $(".resultTable>thead>tr>th:nth-child(" + _y + ")").text(),
+            type: graphType,
+            color: $.jHueBlueprint.COLORS.BLUE,
+            isCategories: true,
+            fill: true,
+            enableSelection: false,
+            height: 250
+          });
+          if (_data.length > 30){
+            $(".flot-x-axis .flot-tick-label").hide();
+          }
+          $("#blueprintDownload").removeClass("hide");
+        }
+        else {
+          $("#blueprint").addClass("empty").text("${_("Please select the columns you would like to see in this chart.")}");
+        }
+      }
+    }
+  }
+
+  $("#blueprintDownload").on("click", function(){
+    window.open($(".flot-base")[0].toDataURL());
+  });
+
+  function getGraphType() {
+    var _type = "";
+    if ($("#blueprintBars").hasClass("active")) {
+      _type = $.jHueBlueprint.TYPES.BARCHART;
+    }
+    if ($("#blueprintLines").hasClass("active")) {
+      _type = $.jHueBlueprint.TYPES.LINECHART;
+    }
+    if ($("#blueprintMap").hasClass("active")) {
+      _type = $.jHueBlueprint.TYPES.MAP;
+    }
+    return _type;
+  }
+
+  var hasBeenPredicted = false;
+  function predictGraph() {
+    if (!hasBeenPredicted) {
+      hasBeenPredicted = true;
+      var _firstAllString, _firstAllNumeric;
+      for (var i = 1; i < $(".resultTable>thead>tr>th").length; i++) {
+        var _isNumeric = true;
+        $(".resultTable>tbody>tr>td:nth-child(" + (i + 1) + ")").each(function (cnt) {
+          if (!$.isNumeric($.trim($(this).text()))) {
+            _isNumeric = false;
+          }
+        });
+        if (_firstAllString == null && !_isNumeric) {
+          _firstAllString = i + 1;
+        }
+        if (_firstAllNumeric == null && _isNumeric) {
+          _firstAllNumeric = i + 1;
+        }
+      }
+      if (_firstAllString != null && _firstAllNumeric != null) {
+        $("#blueprintBars").addClass("active");
+        $("#blueprintAxis").removeClass("hide");
+        $("#blueprintLatLng").addClass("hide");
+        $("#blueprintX").val(_firstAllString);
+        $("#blueprintY").val(_firstAllNumeric);
+      }
+    }
+    generateGraph(getGraphType());
+  }
+
+
+  $("a[data-toggle='tab']").on("shown", function (e) {
+    if ($(e.target).attr("href") == "#chart") {
+      predictGraph();
+    }
+  });
+
+  $(".blueprintSelect").on("change", function () {
+    generateGraph(getGraphType())
+  });
+
+  $("#blueprintBars").on("click", function () {
+    $("#blueprintAxis").removeClass("hide");
+    $("#blueprintLatLng").addClass("hide");
+    generateGraph($.jHueBlueprint.TYPES.BARCHART)
+  });
+  $("#blueprintLines").on("click", function () {
+    $("#blueprintAxis").removeClass("hide");
+    $("#blueprintLatLng").addClass("hide");
+    generateGraph($.jHueBlueprint.TYPES.LINECHART)
+  });
+  $("#blueprintMap").on("click", function () {
+    $("#blueprintAxis").addClass("hide");
+    $("#blueprintLatLng").removeClass("hide");
+    generateGraph($.jHueBlueprint.TYPES.MAP)
+  });
+
   % if app_name == 'impala':
     window.onbeforeunload = function(e) {
       $.ajax({url: "${ url(app_name + ':close_operation', query.id) }", type: 'post', async: false});

+ 478 - 0
desktop/core/static/ext/css/leaflet.css

@@ -0,0 +1,478 @@
+/* required styles */
+
+.leaflet-map-pane,
+.leaflet-tile,
+.leaflet-marker-icon,
+.leaflet-marker-shadow,
+.leaflet-tile-pane,
+.leaflet-tile-container,
+.leaflet-overlay-pane,
+.leaflet-shadow-pane,
+.leaflet-marker-pane,
+.leaflet-popup-pane,
+.leaflet-overlay-pane svg,
+.leaflet-zoom-box,
+.leaflet-image-layer,
+.leaflet-layer {
+	position: absolute;
+	left: 0;
+	top: 0;
+	}
+.leaflet-container {
+	overflow: hidden;
+	-ms-touch-action: none;
+	}
+.leaflet-tile,
+.leaflet-marker-icon,
+.leaflet-marker-shadow {
+	-webkit-user-select: none;
+	   -moz-user-select: none;
+	        user-select: none;
+	-webkit-user-drag: none;
+	}
+.leaflet-marker-icon,
+.leaflet-marker-shadow {
+	display: block;
+	}
+/* map is broken in FF if you have max-width: 100% on tiles */
+.leaflet-container img {
+	max-width: none !important;
+	}
+/* stupid Android 2 doesn't understand "max-width: none" properly */
+.leaflet-container img.leaflet-image-layer {
+	max-width: 15000px !important;
+	}
+.leaflet-tile {
+	filter: inherit;
+	visibility: hidden;
+	}
+.leaflet-tile-loaded {
+	visibility: inherit;
+	}
+.leaflet-zoom-box {
+	width: 0;
+	height: 0;
+	}
+/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
+.leaflet-overlay-pane svg {
+	-moz-user-select: none;
+	}
+
+.leaflet-tile-pane    { z-index: 2; }
+.leaflet-objects-pane { z-index: 3; }
+.leaflet-overlay-pane { z-index: 4; }
+.leaflet-shadow-pane  { z-index: 5; }
+.leaflet-marker-pane  { z-index: 6; }
+.leaflet-popup-pane   { z-index: 7; }
+
+.leaflet-vml-shape {
+	width: 1px;
+	height: 1px;
+	}
+.lvml {
+	behavior: url(#default#VML);
+	display: inline-block;
+	position: absolute;
+	}
+
+
+/* control positioning */
+
+.leaflet-control {
+	position: relative;
+	z-index: 7;
+	pointer-events: auto;
+	}
+.leaflet-top,
+.leaflet-bottom {
+	position: absolute;
+	z-index: 1000;
+	pointer-events: none;
+	}
+.leaflet-top {
+	top: 0;
+	}
+.leaflet-right {
+	right: 0;
+	}
+.leaflet-bottom {
+	bottom: 0;
+	}
+.leaflet-left {
+	left: 0;
+	}
+.leaflet-control {
+	float: left;
+	clear: both;
+	}
+.leaflet-right .leaflet-control {
+	float: right;
+	}
+.leaflet-top .leaflet-control {
+	margin-top: 10px;
+	}
+.leaflet-bottom .leaflet-control {
+	margin-bottom: 10px;
+	}
+.leaflet-left .leaflet-control {
+	margin-left: 10px;
+	}
+.leaflet-right .leaflet-control {
+	margin-right: 10px;
+	}
+
+
+/* zoom and fade animations */
+
+.leaflet-fade-anim .leaflet-tile,
+.leaflet-fade-anim .leaflet-popup {
+	opacity: 0;
+	-webkit-transition: opacity 0.2s linear;
+	   -moz-transition: opacity 0.2s linear;
+	     -o-transition: opacity 0.2s linear;
+	        transition: opacity 0.2s linear;
+	}
+.leaflet-fade-anim .leaflet-tile-loaded,
+.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
+	opacity: 1;
+	}
+
+.leaflet-zoom-anim .leaflet-zoom-animated {
+	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
+	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
+	     -o-transition:      -o-transform 0.25s cubic-bezier(0,0,0.25,1);
+	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
+	}
+.leaflet-zoom-anim .leaflet-tile,
+.leaflet-pan-anim .leaflet-tile,
+.leaflet-touching .leaflet-zoom-animated {
+	-webkit-transition: none;
+	   -moz-transition: none;
+	     -o-transition: none;
+	        transition: none;
+	}
+
+.leaflet-zoom-anim .leaflet-zoom-hide {
+	visibility: hidden;
+	}
+
+
+/* cursors */
+
+.leaflet-clickable {
+	cursor: pointer;
+	}
+.leaflet-container {
+	cursor: -webkit-grab;
+	cursor:    -moz-grab;
+	}
+.leaflet-popup-pane,
+.leaflet-control {
+	cursor: auto;
+	}
+.leaflet-dragging .leaflet-container,
+.leaflet-dragging .leaflet-clickable {
+	cursor: move;
+	cursor: -webkit-grabbing;
+	cursor:    -moz-grabbing;
+	}
+
+
+/* visual tweaks */
+
+.leaflet-container {
+	background: #ddd;
+	outline: 0;
+	}
+.leaflet-container a {
+	color: #0078A8;
+	}
+.leaflet-container a.leaflet-active {
+	outline: 2px solid orange;
+	}
+.leaflet-zoom-box {
+	border: 2px dotted #38f;
+	background: rgba(255,255,255,0.5);
+	}
+
+
+/* general typography */
+.leaflet-container {
+	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
+	}
+
+
+/* general toolbar styles */
+
+.leaflet-bar {
+	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+	border-radius: 4px;
+	}
+.leaflet-bar a,
+.leaflet-bar a:hover {
+	background-color: #fff;
+	border-bottom: 1px solid #ccc;
+	width: 26px;
+	height: 26px;
+	line-height: 26px;
+	display: block;
+	text-align: center;
+	text-decoration: none;
+	color: black;
+	}
+.leaflet-bar a,
+.leaflet-control-layers-toggle {
+	background-position: 50% 50%;
+	background-repeat: no-repeat;
+	display: block;
+	}
+.leaflet-bar a:hover {
+	background-color: #f4f4f4;
+	}
+.leaflet-bar a:first-child {
+	border-top-left-radius: 4px;
+	border-top-right-radius: 4px;
+	}
+.leaflet-bar a:last-child {
+	border-bottom-left-radius: 4px;
+	border-bottom-right-radius: 4px;
+	border-bottom: none;
+	}
+.leaflet-bar a.leaflet-disabled {
+	cursor: default;
+	background-color: #f4f4f4;
+	color: #bbb;
+	}
+
+.leaflet-touch .leaflet-bar a {
+	width: 30px;
+	height: 30px;
+	line-height: 30px;
+	}
+
+
+/* zoom control */
+
+.leaflet-control-zoom-in,
+.leaflet-control-zoom-out {
+	font: bold 18px 'Lucida Console', Monaco, monospace;
+	text-indent: 1px;
+	}
+.leaflet-control-zoom-out {
+	font-size: 20px;
+	}
+
+.leaflet-touch .leaflet-control-zoom-in {
+	font-size: 22px;
+	}
+.leaflet-touch .leaflet-control-zoom-out {
+	font-size: 24px;
+	}
+
+
+/* layers control */
+
+.leaflet-control-layers {
+	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
+	background: #fff;
+	border-radius: 5px;
+	}
+.leaflet-control-layers-toggle {
+	background-image: url(images/layers.png);
+	width: 36px;
+	height: 36px;
+	}
+.leaflet-retina .leaflet-control-layers-toggle {
+	background-image: url(images/layers-2x.png);
+	background-size: 26px 26px;
+	}
+.leaflet-touch .leaflet-control-layers-toggle {
+	width: 44px;
+	height: 44px;
+	}
+.leaflet-control-layers .leaflet-control-layers-list,
+.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
+	display: none;
+	}
+.leaflet-control-layers-expanded .leaflet-control-layers-list {
+	display: block;
+	position: relative;
+	}
+.leaflet-control-layers-expanded {
+	padding: 6px 10px 6px 6px;
+	color: #333;
+	background: #fff;
+	}
+.leaflet-control-layers-selector {
+	margin-top: 2px;
+	position: relative;
+	top: 1px;
+	}
+.leaflet-control-layers label {
+	display: block;
+	}
+.leaflet-control-layers-separator {
+	height: 0;
+	border-top: 1px solid #ddd;
+	margin: 5px -10px 5px -6px;
+	}
+
+
+/* attribution and scale controls */
+
+.leaflet-container .leaflet-control-attribution {
+	background: #fff;
+	background: rgba(255, 255, 255, 0.7);
+	margin: 0;
+	}
+.leaflet-control-attribution,
+.leaflet-control-scale-line {
+	padding: 0 5px;
+	color: #333;
+	}
+.leaflet-control-attribution a {
+	text-decoration: none;
+	}
+.leaflet-control-attribution a:hover {
+	text-decoration: underline;
+	}
+.leaflet-container .leaflet-control-attribution,
+.leaflet-container .leaflet-control-scale {
+	font-size: 11px;
+	}
+.leaflet-left .leaflet-control-scale {
+	margin-left: 5px;
+	}
+.leaflet-bottom .leaflet-control-scale {
+	margin-bottom: 5px;
+	}
+.leaflet-control-scale-line {
+	border: 2px solid #777;
+	border-top: none;
+	line-height: 1.1;
+	padding: 2px 5px 1px;
+	font-size: 11px;
+	white-space: nowrap;
+	overflow: hidden;
+	-moz-box-sizing: content-box;
+	     box-sizing: content-box;
+
+	background: #fff;
+	background: rgba(255, 255, 255, 0.5);
+	}
+.leaflet-control-scale-line:not(:first-child) {
+	border-top: 2px solid #777;
+	border-bottom: none;
+	margin-top: -2px;
+	}
+.leaflet-control-scale-line:not(:first-child):not(:last-child) {
+	border-bottom: 2px solid #777;
+	}
+
+.leaflet-touch .leaflet-control-attribution,
+.leaflet-touch .leaflet-control-layers,
+.leaflet-touch .leaflet-bar {
+	box-shadow: none;
+	}
+.leaflet-touch .leaflet-control-layers,
+.leaflet-touch .leaflet-bar {
+	border: 2px solid rgba(0,0,0,0.2);
+	background-clip: padding-box;
+	}
+
+
+/* popup */
+
+.leaflet-popup {
+	position: absolute;
+	text-align: center;
+	}
+.leaflet-popup-content-wrapper {
+	padding: 1px;
+	text-align: left;
+	border-radius: 12px;
+	}
+.leaflet-popup-content {
+	margin: 13px 19px;
+	line-height: 1.4;
+	}
+.leaflet-popup-content p {
+	margin: 18px 0;
+	}
+.leaflet-popup-tip-container {
+	margin: 0 auto;
+	width: 40px;
+	height: 20px;
+	position: relative;
+	overflow: hidden;
+	}
+.leaflet-popup-tip {
+	width: 17px;
+	height: 17px;
+	padding: 1px;
+
+	margin: -10px auto 0;
+
+	-webkit-transform: rotate(45deg);
+	   -moz-transform: rotate(45deg);
+	    -ms-transform: rotate(45deg);
+	     -o-transform: rotate(45deg);
+	        transform: rotate(45deg);
+	}
+.leaflet-popup-content-wrapper,
+.leaflet-popup-tip {
+	background: white;
+
+	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
+	}
+.leaflet-container a.leaflet-popup-close-button {
+	position: absolute;
+	top: 0;
+	right: 0;
+	padding: 4px 4px 0 0;
+	text-align: center;
+	width: 18px;
+	height: 14px;
+	font: 16px/14px Tahoma, Verdana, sans-serif;
+	color: #c3c3c3;
+	text-decoration: none;
+	font-weight: bold;
+	background: transparent;
+	}
+.leaflet-container a.leaflet-popup-close-button:hover {
+	color: #999;
+	}
+.leaflet-popup-scrolled {
+	overflow: auto;
+	border-bottom: 1px solid #ddd;
+	border-top: 1px solid #ddd;
+	}
+
+.leaflet-oldie .leaflet-popup-content-wrapper {
+	zoom: 1;
+	}
+.leaflet-oldie .leaflet-popup-tip {
+	width: 24px;
+	margin: 0 auto;
+
+	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
+	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
+	}
+.leaflet-oldie .leaflet-popup-tip-container {
+	margin-top: -1px;
+	}
+
+.leaflet-oldie .leaflet-control-zoom,
+.leaflet-oldie .leaflet-control-layers,
+.leaflet-oldie .leaflet-popup-content-wrapper,
+.leaflet-oldie .leaflet-popup-tip {
+	border: 1px solid #999;
+	}
+
+
+/* div icon */
+
+.leaflet-div-icon {
+	background: #fff;
+	border: 1px solid #666;
+	}

File diff suppressed because it is too large
+ 0 - 0
desktop/core/static/ext/js/jquery/plugins/jquery.flot.canvas.min.js


File diff suppressed because it is too large
+ 0 - 0
desktop/core/static/ext/js/jquery/plugins/jquery.flot.categories.min.js


File diff suppressed because it is too large
+ 0 - 27
desktop/core/static/ext/js/jquery/plugins/jquery.flot.min.js


File diff suppressed because it is too large
+ 0 - 55
desktop/core/static/ext/js/jquery/plugins/jquery.flot.pie.min.js


File diff suppressed because it is too large
+ 0 - 78
desktop/core/static/ext/js/jquery/plugins/jquery.flot.selection.min.js


File diff suppressed because it is too large
+ 0 - 8
desktop/core/static/ext/js/jquery/plugins/jquery.flot.time.min.js


BIN
desktop/core/static/ext/js/leaflet/images/layers-2x.png


BIN
desktop/core/static/ext/js/leaflet/images/layers.png


BIN
desktop/core/static/ext/js/leaflet/images/marker-icon-2x.png


BIN
desktop/core/static/ext/js/leaflet/images/marker-icon.png


BIN
desktop/core/static/ext/js/leaflet/images/marker-shadow.png


File diff suppressed because it is too large
+ 5 - 0
desktop/core/static/ext/js/leaflet/leaflet.js


+ 18 - 3
desktop/core/static/js/jquery.blueprint.js

@@ -42,6 +42,8 @@
         tooltips: true,
         enableSelection: false,
         isDateTime: false,
+        isCategories: false,
+        useCanvas: false,
         onSelect: function () {
         },
         onItemClick: function () {
@@ -96,7 +98,6 @@
   function flot(plugin) {
     var _this = plugin;
     $(_this.element).width(_this.options.width).height(_this.options.height);
-    var _serie = getSerie(_this.options);
     var _options = {
       grid: {
         borderWidth: _this.options.borderWidth,
@@ -117,7 +118,17 @@
         mode: "time"
       }
     }
-    var _plot = $.plot(_this.element, [_serie], _options);
+    if (_this.options.isCategories) {
+      _options.xaxis = {
+        mode: "categories"
+      }
+    }
+    if (_this.options.useCanvas) {
+      _options.canvas = true;
+    }
+    var _serie = getSerie(_this.options);
+    var _plot = $.plot($(_this.element), [_serie], _options);
+
     $(_this.element).bind("plotselected", function (event, ranges) {
       _this.options.onSelect(ranges);
     });
@@ -139,6 +150,10 @@
               x = moment(x).utc().format("YYYY-MM-DD[T]HH:mm:ss[Z]");
             }
 
+            if (_this.options.isCategories){
+              x = item.series.data[item.dataIndex][0];
+            }
+
             showTooltip(item.pageX, item.pageY, "X: "+x+", Y: "+y);
           }
         } else {
@@ -197,7 +212,7 @@
       _flotSerie.points = {show: true}
     }
     if (options.type == TYPES.BARCHART) {
-      _flotSerie.bars = {show: true, fill: options.fill }
+      _flotSerie.bars = {show: true, fill: options.fill, barWidth: 0.6, align: "center" }
       _flotSerie.points = {show: true}
     }
     if (options.type == TYPES.POINTCHART) {

Some files were not shown because too many files changed in this diff