1/*! 2 3========================================================= 4* Argon Dashboard - v1.0.0 5========================================================= 6 7* Product Page: https://www.creative-tim.com/product/argon-dashboard 8* Copyright 2018 Creative Tim (https://www.creative-tim.com) 9* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard/blob/master/LICENSE.md) 10 11* Coded by www.creative-tim.com 12 13========================================================= 14 15* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 16 17*/ 18 19// 20// Bootstrap Datepicker 21// 22 23'use strict'; 24 25var Datepicker = (function() { 26 27 // Variables 28 29 var $datepicker = $('.datepicker'); 30 31 32 // Methods 33 34 function init($this) { 35 var options = { 36 disableTouchKeyboard: true, 37 autoclose: false, 38 format: 'yyyy-mm-dd', 39 }; 40 41 $this.datepicker(options); 42 } 43 44 45 // Events 46 47 if ($datepicker.length) { 48 $datepicker.each(function() { 49 init($(this)); 50 }); 51 } 52 53})(); 54 55// 56// Icon code copy/paste 57// 58 59'use strict'; 60 61var CopyIcon = (function() { 62 63 // Variables 64 65 var $element = '.btn-icon-clipboard', 66 $btn = $($element); 67 68 69 // Methods 70 71 function init($this) { 72 $this.tooltip().on('mouseleave', function() { 73 // Explicitly hide tooltip, since after clicking it remains 74 // focused (as it's a button), so tooltip would otherwise 75 // remain visible until focus is moved away 76 $this.tooltip('hide'); 77 }); 78 79 var clipboard = new ClipboardJS($element); 80 81 clipboard.on('success', function(e) { 82 $(e.trigger) 83 .attr('title', 'Copied!') 84 .tooltip('_fixTitle') 85 .tooltip('show') 86 .attr('title', 'Copy to clipboard') 87 .tooltip('_fixTitle') 88 89 e.clearSelection() 90 }); 91 } 92 93 94 // Events 95 if ($btn.length) { 96 init($btn); 97 } 98 99})(); 100 101// 102// Form control 103// 104 105'use strict'; 106 107var FormControl = (function() { 108 109 // Variables 110 111 var $input = $('.form-control'); 112 113 114 // Methods 115 116 function init($this) { 117 $this.on('focus blur', function(e) { 118 var hasValue = typeof this.value === 'string' && this.value.length > 0; 119 $(this).parents('.form-group').toggleClass('focused', (e.type === 'focus' || hasValue)); 120 }).trigger('blur'); 121 } 122 123 124 // Events 125 126 if ($input.length) { 127 init($input); 128 } 129 130})(); 131 132// 133// Google maps 134// 135 136var $map = $('#map-canvas'), 137 map, 138 lat, 139 lng, 140 color = "#5e72e4"; 141 142function initMap() { 143 144 map = document.getElementById('map-canvas'); 145 lat = map.getAttribute('data-lat'); 146 lng = map.getAttribute('data-lng'); 147 148 var myLatlng = new google.maps.LatLng(lat, lng); 149 var mapOptions = { 150 zoom: 12, 151 scrollwheel: false, 152 center: myLatlng, 153 mapTypeId: google.maps.MapTypeId.ROADMAP, 154 styles: [{"featureType":"administrative","elementType":"labels.text.fill","stylers":[{"color":"#444444"}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#f2f2f2"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"saturation":-100},{"lightness":45}]},{"featureType":"road.highway","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"road.arterial","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"color":color},{"visibility":"on"}]}] 155 } 156 157 map = new google.maps.Map(map, mapOptions); 158 159 var marker = new google.maps.Marker({ 160 position: myLatlng, 161 map: map, 162 animation: google.maps.Animation.DROP, 163 title: 'Hello World!' 164 }); 165 166 var contentString = '<div class="info-window-content"><h2>Argon Dashboard</h2>' + 167 '<p>A beautiful Dashboard for Bootstrap 4. It is Free and Open Source.</p></div>'; 168 169 var infowindow = new google.maps.InfoWindow({ 170 content: contentString 171 }); 172 173 google.maps.event.addListener(marker, 'click', function() { 174 infowindow.open(map, marker); 175 }); 176} 177 178if($map.length) { 179 //google.maps.event.addDomListener(window, 'load', initMap); 180} 181 182// // 183// // Headroom - show/hide navbar on scroll 184// // 185// 186// 'use strict'; 187// 188// var Headroom = (function() { 189// 190// // Variables 191// 192// var $headroom = $('#navbar-main'); 193// 194// 195// // Methods 196// 197// function init($this) { 198// 199// var headroom = new Headroom(document.querySelector("#navbar-main"), { 200// offset: 300, 201// tolerance: { 202// up: 30, 203// down: 30 204// }, 205// }); 206// 207// 208// 209// // Events 210// 211// if ($headroom.length) { 212// headroom.init(); 213// } 214// 215// })(); 216 217// 218// Navbar 219// 220 221'use strict'; 222 223var Navbar = (function() { 224 225 // Variables 226 227 var $nav = $('.navbar-nav, .navbar-nav .nav'); 228 var $collapse = $('.navbar .collapse'); 229 var $dropdown = $('.navbar .dropdown'); 230 231 // Methods 232 233 function accordion($this) { 234 $this.closest($nav).find($collapse).not($this).collapse('hide'); 235 } 236 237 function closeDropdown($this) { 238 var $dropdownMenu = $this.find('.dropdown-menu'); 239 240 $dropdownMenu.addClass('close'); 241 242 setTimeout(function() { 243 $dropdownMenu.removeClass('close'); 244 }, 200); 245 } 246 247 248 // Events 249 250 $collapse.on({ 251 'show.bs.collapse': function() { 252 accordion($(this)); 253 } 254 }) 255 256 $dropdown.on({ 257 'hide.bs.dropdown': function() { 258 closeDropdown($(this)); 259 } 260 }) 261 262})(); 263 264 265// 266// Navbar collapse 267// 268 269
270var NavbarCollapse = (function() { 271 272 // Variables 273 274 var $nav = $('.navbar-nav'), 275 $collapse = $('.navbar .collapse'); 276 277 278 // Methods 279 280 function hideNavbarCollapse($this) { 281 $this.addClass('collapsing-out'); 282 } 283 284 function hiddenNavbarCollapse($this) { 285 $this.removeClass('collapsing-out'); 286 } 287 288 289 // Events 290 291 if ($collapse.length) { 292 $collapse.on({ 293 'hide.bs.collapse': function() { 294 hideNavbarCollapse($collapse); 295 } 296 }) 297 298 $collapse.on({ 299 'hidden.bs.collapse': function() { 300 hiddenNavbarCollapse($collapse); 301 } 302 }) 303 } 304 305})(); 306 307// 308// Form control 309// 310 311'use strict'; 312 313var noUiSlider = (function() { 314 315 // Variables 316 317 // var $sliderContainer = $('.input-slider-container'), 318 // $slider = $('.input-slider'), 319 // $sliderId = $slider.attr('id'), 320 // $sliderMinValue = $slider.data('range-value-min'); 321 // $sliderMaxValue = $slider.data('range-value-max');; 322 323 324 // // Methods 325 // 326 // function init($this) { 327 // $this.on('focus blur', function(e) { 328 // $this.parents('.form-group').toggleClass('focused', (e.type === 'focus' || this.value.length > 0)); 329 // }).trigger('blur'); 330 // } 331 // 332 // 333 // // Events 334 // 335 // if ($input.length) { 336 // init($input); 337 // } 338 339 340 341 if ($(".input-slider-container")[0]) { 342 $('.input-slider-container').each(function() { 343 344 var slider = $(this).find('.input-slider'); 345 var sliderId = slider.attr('id'); 346 var minValue = slider.data('range-value-min'); 347 var maxValue = slider.data('range-value-max'); 348 349 var sliderValue = $(this).find('.range-slider-value'); 350 var sliderValueId = sliderValue.attr('id'); 351 var startValue = sliderValue.data('range-value-low'); 352 353 var c = document.getElementById(sliderId), 354 d = document.getElementById(sliderValueId); 355 356 noUiSlider.create(c, { 357 start: [parseInt(startValue)], 358 connect: [true, false], 359 //step: 1000, 360 range: { 361 'min': [parseInt(minValue)], 362 'max': [parseInt(maxValue)] 363 } 364 }); 365 366 c.noUiSlider.on('update', function(a, b) { 367 d.textContent = a[b]; 368 }); 369 }) 370 } 371 372 if ($("#input-slider-range")[0]) { 373 var c = document.getElementById("input-slider-range"), 374 d = document.getElementById("input-slider-range-value-low"), 375 e = document.getElementById("input-slider-range-value-high"), 376 f = [d, e]; 377 378 noUiSlider.create(c, { 379 start: [parseInt(d.getAttribute('data-range-value-low')), parseInt(e.getAttribute('data-range-value-high'))], 380 connect: !0, 381 range: { 382 min: parseInt(c.getAttribute('data-range-value-min')), 383 max: parseInt(c.getAttribute('data-range-value-max')) 384 } 385 }), c.noUiSlider.on("update", function(a, b) { 386 f[b].textContent = a[b] 387 }) 388 } 389 390})(); 391 392// 393// Popover 394// 395 396'use strict'; 397 398var Popover = (function() { 399 400 // Variables 401 402 var $popover = $('[data-toggle="popover"]'), 403 $popoverClass = ''; 404 405 406 // Methods 407 408 function init($this) { 409 if ($this.data('color')) { 410 $popoverClass = 'popover-' + $this.data('color'); 411 } 412 413 var options = { 414 trigger: 'focus', 415 template: '<div class="popover ' + $popoverClass + '" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>' 416 }; 417 418 $this.popover(options); 419 } 420 421 422 // Events 423 424 if ($popover.length) { 425 $popover.each(function() { 426 init($(this)); 427 }); 428 } 429 430})(); 431 432// 433// Scroll to (anchor links) 434// 435 436'use strict'; 437 438var ScrollTo = (function() { 439 440 // 441 // Variables 442 // 443 444 var $scrollTo = $('.scroll-me, [data-scroll-to], .toc-entry a'); 445 446 447 // 448 // Methods 449 // 450 451 function scrollTo($this) { 452 var $el = $this.attr('href'); 453 var offset = $this.data('scroll-to-offset') ? $this.data('scroll-to-offset') : 0; 454 var options = { 455 scrollTop: $($el).offset().top - offset 456 }; 457 458 // Animate scroll to the selected section 459 $('html, body').stop(true, true).animate(options, 600); 460 461 event.preventDefault(); 462 } 463 464 465 // 466 // Events 467 // 468 469 if ($scrollTo.length) { 470 $scrollTo.on('click', function(event) { 471 scrollTo($(this)); 472 }); 473 } 474 475})(); 476 477// 478// Tooltip 479// 480 481'use strict'; 482 483var Tooltip = (function() { 484 485 // Variables 486 487 var $tooltip = $('[data-toggle="tooltip"]'); 488 489 490 // Methods 491
492 function init() { 493 $tooltip.tooltip(); 494 } 495 496 497 // Events 498 499 if ($tooltip.length) { 500 init(); 501 } 502 503})(); 504 505// 506// Charts 507// 508 509'use strict'; 510 511var Charts = (function() { 512 513 // Variable 514 515 var $toggle = $('[data-toggle="chart"]'); 516 var mode = 'light';//(themeMode) ? themeMode : 'light'; 517 var fonts = { 518 base: 'Open Sans' 519 } 520 521 // Colors 522 var colors = { 523 gray: { 524 100: '#f6f9fc', 525 200: '#e9ecef', 526 300: '#dee2e6', 527 400: '#ced4da', 528 500: '#adb5bd', 529 600: '#8898aa', 530 700: '#525f7f', 531 800: '#32325d', 532 900: '#212529' 533 }, 534 theme: { 535 'default': '#172b4d', 536 'primary': '#5e72e4', 537 'secondary': '#f4f5f7', 538 'info': '#11cdef', 539 'success': '#2dce89', 540 'danger': '#f5365c', 541 'warning': '#fb6340' 542 }, 543 black: '#12263F', 544 white: '#FFFFFF', 545 transparent: 'transparent', 546 }; 547 548 549 // Methods 550 551 // Chart.js global options 552 function chartOptions() { 553 554 // Options 555 var options = { 556 defaults: { 557 global: { 558 responsive: true, 559 maintainAspectRatio: false, 560 defaultColor: (mode == 'dark') ? colors.gray[700] : colors.gray[600], 561 defaultFontColor: (mode == 'dark') ? colors.gray[700] : colors.gray[600], 562 defaultFontFamily: fonts.base, 563 defaultFontSize: 13, 564 layout: { 565 padding: 0 566 }, 567 legend: { 568 display: false, 569 position: 'bottom', 570 labels: { 571 usePointStyle: true, 572 padding: 16 573 } 574 }, 575 elements: { 576 point: { 577 radius: 0, 578 backgroundColor: colors.theme['primary'] 579 }, 580 line: { 581 tension: .4, 582 borderWidth: 4, 583 borderColor: colors.theme['primary'], 584 backgroundColor: colors.transparent, 585 borderCapStyle: 'rounded' 586 }, 587 rectangle: { 588 backgroundColor: colors.theme['warning'] 589 }, 590 arc: { 591 backgroundColor: colors.theme['primary'], 592 borderColor: (mode == 'dark') ? colors.gray[800] : colors.white, 593 borderWidth: 4 594 } 595 }, 596 tooltips: { 597 enabled: false, 598 mode: 'index', 599 intersect: false, 600 custom: function(model) { 601 602 // Get tooltip 603 var $tooltip = $('#chart-tooltip'); 604 605 // Create tooltip on first render 606 if (!$tooltip.length) { 607 $tooltip = $('<div id="chart-tooltip" class="popover bs-popover-top" role="tooltip"></div>'); 608 609 // Append to body 610 $('body').append($tooltip); 611 } 612 613 // Hide if no tooltip 614 if (model.opacity === 0) { 615 $tooltip.css('display', 'none'); 616 return; 617 } 618 619 function getBody(bodyItem) { 620 return bodyItem.lines; 621 } 622 623 // Fill with content 624 if (model.body) { 625 var titleLines = model.title || []; 626 var bodyLines = model.body.map(getBody); 627 var html = ''; 628 629 // Add arrow 630 html += '<div class="arrow"></div>'; 631 632 // Add header 633 titleLines.forEach(function(title) { 634 html += '<h3 class="popover-header text-center">' + title + '</h3>'; 635 }); 636 637 // Add body 638 bodyLines.forEach(function(body, i) { 639 var colors = model.labelColors[i]; 640 var styles = 'background-color: ' + colors.backgroundColor; 641 var indicator = '<span class="badge badge-dot"><i class="bg-primary"></i></span>';
642 var align = (bodyLines.length > 1) ? 'justify-content-left' : 'justify-content-center'; 643 html += '<div class="popover-body d-flex align-items-center ' + align + '">' + indicator + body + '</div>'; 644 }); 645 646 $tooltip.html(html); 647 } 648 649 // Get tooltip position 650 var $canvas = $(this._chart.canvas); 651 652 var canvasWidth = $canvas.outerWidth(); 653 var canvasHeight = $canvas.outerHeight(); 654 655 var canvasTop = $canvas.offset().top; 656 var canvasLeft = $canvas.offset().left; 657 658 var tooltipWidth = $tooltip.outerWidth(); 659 var tooltipHeight = $tooltip.outerHeight(); 660 661 var top = canvasTop + model.caretY - tooltipHeight - 16; 662 var left = canvasLeft + model.caretX - tooltipWidth / 2; 663 664 // Display tooltip 665 $tooltip.css({ 666 'top': top + 'px', 667 'left': left + 'px', 668 'display': 'block', 669 'z-index': '100' 670 }); 671 672 }, 673 callbacks: { 674 label: function(item, data) { 675 var label = data.datasets[item.datasetIndex].label || ''; 676 var yLabel = item.yLabel; 677 var content = ''; 678 679 if (data.datasets.length > 1) { 680 content += '<span class="badge badge-primary mr-auto">' + label + '</span>'; 681 } 682 683 content += '<span class="popover-body-value">' + yLabel + '</span>' ; 684 return content; 685 } 686 } 687 } 688 }, 689 doughnut: { 690 cutoutPercentage: 83, 691 tooltips: { 692 callbacks: { 693 title: function(item, data) { 694 var title = data.labels[item[0].index]; 695 return title; 696 }, 697 label: function(item, data) { 698 var value = data.datasets[0].data[item.index]; 699 var content = ''; 700 701 content += '<span class="popover-body-value">' + value + '</span>'; 702 return content; 703 } 704 } 705 }, 706 legendCallback: function(chart) { 707 var data = chart.data; 708 var content = ''; 709 710 data.labels.forEach(function(label, index) { 711 var bgColor = data.datasets[0].backgroundColor[index]; 712 713 content += '<span class="chart-legend-item">'; 714 content += '<i class="chart-legend-indicator" style="background-color: ' + bgColor + '"></i>'; 715 content += label; 716 content += '</span>'; 717 }); 718 719 return content; 720 } 721 } 722 } 723 } 724 725 // yAxes 726 Chart.scaleService.updateScaleDefaults('linear', { 727 gridLines: { 728 borderDash: [2], 729 borderDashOffset: [2], 730 color: (mode == 'dark') ? colors.gray[900] : colors.gray[300], 731 drawBorder: false, 732 drawTicks: false, 733 lineWidth: 0, 734 zeroLineWidth: 0, 735 zeroLineColor: (mode == 'dark') ? colors.gray[900] : colors.gray[300], 736 zeroLineBorderDash: [2], 737 zeroLineBorderDashOffset: [2] 738 }, 739 ticks: { 740 beginAtZero: true, 741 padding: 10, 742 callback: function(value) { 743 if (!(value % 10)) { 744 return value 745 } 746 } 747 } 748 }); 749 750 // xAxes 751 Chart.scaleService.updateScaleDefaults('category', { 752 gridLines: { 753 drawBorder: false, 754 drawOnChartArea: false, 755 drawTicks: false 756 }, 757 ticks: { 758 padding: 20 759 }, 760 maxBarThickness: 10 761 }); 762 763 return options; 764 765 } 766 767 // Parse global options 768 function parseOptions(parent, options) { 769 for (var item in options) { 770 if (typeof options[item] !== 'object') { 771 parent[item] = options[item]; 772 } else { 773 parseOptions(parent[item], options[item]); 774 } 775 } 776 } 777 778 // Push options 779 function pushOptions(parent, options) { 780 for (var item in options) { 781 if (Array.isArray(options[item])) { 782 options[item].forEach(function(data) { 783 parent[item].push(data); 784 }); 785 } else { 786 pushOptions(parent[item], options[item]); 787 } 788 } 789 } 790 791 // Pop options 792 function popOptions(parent, options) { 793 for (var item in options) { 794 if (Array.isArray(options[item])) { 795 options[item].forEach(function(data) { 796 parent[item].pop(); 797 }); 798 } else { 799 popOptions(parent[item], options[item]); 800 } 801 } 802 } 803 804 // Toggle options 805 function toggleOptions(elem) { 806 var options = elem.data('add'); 807 var $target = $(elem.data('target')); 808 var $chart = $target.data('chart'); 809 810 if (elem.is(':checked')) { 811 812 // Add options 813 pushOptions($chart, options); 814 815 // Update chart
816 $chart.update(); 817 } else { 818 819 // Remove options 820 popOptions($chart, options); 821 822 // Update chart 823 $chart.update(); 824 } 825 } 826 827 // Update options 828 function updateOptions(elem) { 829 var options = elem.data('update'); 830 var $target = $(elem.data('target')); 831 var $chart = $target.data('chart'); 832 833 // Parse options 834 parseOptions($chart, options); 835 836 // Toggle ticks 837 toggleTicks(elem, $chart); 838 839 // Update chart 840 $chart.update(); 841 } 842 843 // Toggle ticks 844 function toggleTicks(elem, $chart) { 845 846 if (elem.data('prefix') !== undefined || elem.data('prefix') !== undefined) { 847 var prefix = elem.data('prefix') ? elem.data('prefix') : ''; 848 var suffix = elem.data('suffix') ? elem.data('suffix') : ''; 849 850 // Update ticks 851 $chart.options.scales.yAxes[0].ticks.callback = function(value) { 852 if (!(value % 10)) { 853 return prefix + value + suffix; 854 } 855 } 856 857 // Update tooltips 858 $chart.options.tooltips.callbacks.label = function(item, data) { 859 var label = data.datasets[item.datasetIndex].label || ''; 860 var yLabel = item.yLabel; 861 var content = ''; 862 863 if (data.datasets.length > 1) { 864 content += '<span class="popover-body-label mr-auto">' + label + '</span>'; 865 } 866 867 content += '<span class="popover-body-value">' + prefix + yLabel + suffix + '</span>'; 868 return content; 869 } 870 871 } 872 } 873 874 875 // Events 876 877 // Parse global options 878 if (window.Chart) { 879 parseOptions(Chart, chartOptions()); 880 } 881 882 // Toggle options 883 $toggle.on({ 884 'change': function() { 885 var $this = $(this); 886 887 if ($this.is('[data-add]')) { 888 toggleOptions($this); 889 } 890 }, 891 'click': function() { 892 var $this = $(this); 893 894 if ($this.is('[data-update]')) { 895 updateOptions($this); 896 } 897 } 898 }); 899 900 901 // Return 902 903 return { 904 colors: colors, 905 fonts: fonts, 906 mode: mode 907 }; 908 909})(); 910 911// 912// Orders chart 913// 914 915var OrdersChart = (function() { 916 917 // 918 // Variables 919 // 920 921 var $chart = $('#chart-orders'); 922 var $ordersSelect = $('[name="ordersSelect"]'); 923 924 925 // 926 // Methods 927 // 928 929 // Init chart 930 function initChart($chart) { 931 // Create chart 932 var ordersChart = new Chart($chart, { 933 type: 'line', 934 options: { 935 scales: { 936 yAxes: [{ 937 ticks: { 938 callback: function(value) { 939 if (!(value % 10)) { 940 //return '$' + value + 'k' 941 return value 942 } 943 } 944 } 945 }] 946 }, 947 tooltips: { 948 callbacks: { 949 label: function(item, data) { 950 var label = data.datasets[item.datasetIndex].label || ''; 951 var yLabel = item.yLabel; 952 var content = ''; 953 954 if (data.datasets.length > 1) { 955 content += '<span class="popover-body-label mr-auto">' + label + '</span>'; 956 } 957 958 content += '<span class="popover-body-value">' + yLabel + '</span>'; 959 960 return content; 961 } 962 } 963 } 964 }, 965 data: { 966 labels: monthLabels,//['Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 967 datasets: [ 968 { 969 label: js.trans('Pride'), 970 data: datavals, 971 lineTension: 0, 972 borderColor: "#46a6dd", 973 backgroundColor: '#36a2eb3b' 974 } 975 ] 976 } 977 }); 978 979 // Save to jQuery object 980 $chart.data('chart', ordersChart); 981 } 982 983 984 // Init chart 985 if ($chart.length) { 986 initChart($chart); 987 } 988 989})(); 990 991var IncomeChart = (function() { 992 993 // 994 // Variables 995 // 996 997 var $chart = $('#chart-income'); 998 var $ordersSelect = $('[name="ordersSelect"]'); 999 1000 1001 // 1002 // Methods 1003 // 1004 1005 // Init chart 1006 function initChart($chart) { 1007 1008 // Create chart 1009 var incomeChart = new Chart($chart, { 1010 type: 'bar', 1011 options: { 1012 scales: { 1013 yAxes: [{ 1014 ticks: { 1015 callback: function(value) { 1016 if (!(value % 10)) { 1017 //return '$' + value + 'k' 1018 return value 1019 } 1020 } 1021 } 1022 }] 1023 }, 1024 tooltips: { 1025 callbacks: { 1026 label: function(item, data) { 1027 var label = data.datasets[item.datasetIndex].label || ''; 1028 var yLabel = item.yLabel; 1029 var content = ''; 1030 1031 if (data.datasets.length > 1) { 1032 content += '<span class="popover-body-label mr-auto">' + label + '</span>'; 1033 } 1034 1035 content += '<span class="popover-body-value">' + yLabel + '</span>'; 1036 1037 return content; 1038 } 1039 } 1040 } 1041 }, 1042 1043 data: { 1044 labels: monthLabels,//['Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 1045 datasets: [ 1046 { 1047 label: js.trans('Pride'), 1048 data: pridevals, 1049 backgroundColor: '#36A2EB' 1050 }, 1051 { 1052 label: js.trans('Circus'), 1053 data: salesValues, 1054 backgroundColor: '#d2283d' 1055 }, 1056 { 1057 label: js.trans('Circus VIP'), 1058 data: circusvipvals, 1059 backgroundColor: '#9100ff' 1060 }, 1061 ] 1062 } 1063 }); 1064 1065 // Save to jQuery object 1066 $chart.data('chart', incomeChart); 1067 } 1068 1069 1070 // Init chart 1071 if ($chart.length) { 1072 initChart($chart); 1073 } 1074 1075})(); 1076 1077// 1078// Charts 1079// 1080 1081'use strict'; 1082 1083// 1084// Sales chart 1085// 1086 1087var SalesChart = (function() { 1088 1089 // Variables 1090
1091 var $chart = $('#chart-sales'); 1092 1093 1094 // Methods 1095 1096 function init($chart) { 1097 1098 var salesChart = new Chart($chart, { 1099 type: 'line', 1100 options: { 1101 scales: { 1102 yAxes: [{ 1103 gridLines: { 1104 color: Charts.colors.gray[900], 1105 zeroLineColor: Charts.colors.gray[900] 1106 }, 1107 ticks: { 1108 callback: function(value) { 1109 if (!(value % 10)) { 1110 //return '$' + value + 'k'; 1111 return value; 1112 } 1113 } 1114 } 1115 }] 1116 }, 1117 tooltipss: { 1118 callbacks: { 1119 label: function(item, data) { 1120 var label = data.datasets[item.datasetIndex].label || ''; 1121 var yLabel = item.yLabel; 1122 var content = ''; 1123 1124 if (data.datasets.length > 1) { 1125 content += '<span class="popover-body-label mr-auto">' + label + '</span>'; 1126 } 1127 1128 //content += '<span class="popover-body-value">$' + yLabel + '</span>'; 1129 content += '<span class="popover-body-value">' + yLabel + '</span>'; 1130 return content; 1131 } 1132 } 1133 } 1134 }, 1135 data: { 1136 labels: monthLabels,// ['May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 1137 datasets: [{ 1138 label: js.trans('Sales')+" ", 1139 data: salesValues //[0, 20, 10, 30, 15, 40, 20, 60, 60] 1140 },{ 1141 label: js.trans('Expenses')+" ", 1142 borderColor: "#ff0000", 1143 data: costValues //[0, 20, 10, 30, 15, 40, 20, 60, 60] 1144 }] 1145 } 1146 }); 1147 1148 // Save to jQuery object 1149 1150 $chart.data('chart', salesChart); 1151 1152 }; 1153 1154 1155 // Events 1156 1157 if ($chart.length) { 1158 init($chart); 1159 } 1160 1161})(); 1162 1163// 1164// Orders chart 1165// 1166 1167var ExpensesChart = (function() { 1168 1169 // 1170 // Variables 1171 // 1172 1173 var $chartByCategory = $('#chart-bycategory'); 1174 var $chartByVendor = $('#chart-byvendor'); 1175 1176 1177 1178 // 1179 // Methods 1180 // 1181 1182 // Init chart 1183 function initChart($chart,theLabels,theValues) { 1184 1185 // Create chart 1186 var ordersChart = new Chart($chart, { 1187 type: 'pie', 1188 1189 1190 data: { 1191 labels: theLabels,//['Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 1192 datasets: [{ 1193 label: 'Expenses', 1194 backgroundColor: ["#172b4d","#5e72e4","#11cdef","#2dce89","#f5365c","#fb6340"], 1195 data: theValues//[25, 20, 30, 22, 17, 29] 1196 }] 1197 }, 1198 options: { 1199 responsive: true, 1200 plugins: { 1201 legend: { 1202 position: 'top', 1203 }, 1204 title: { 1205 display: true, 1206 text: '' 1207 } 1208 } 1209 }, 1210 }); 1211 1212 // Save to jQuery object 1213 $chart.data('chart', ordersChart); 1214 } 1215 1216 1217 // Init chart 1218 if ($chartByCategory.length) { 1219 initChart($chartByCategory,categoriesLabels,categoriesValues); 1220 } 1221 if ($chartByVendor.length) { 1222 initChart($chartByVendor,vendorsLabels,vendorsValues); 1223 } 1224 1225})();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.