1 | /**
|
---|
2 | *
|
---|
3 | */
|
---|
4 | let hexToRgba = function(hex, opacity) {
|
---|
5 | let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
---|
6 | let rgb = result ? {
|
---|
7 | r: parseInt(result[1], 16),
|
---|
8 | g: parseInt(result[2], 16),
|
---|
9 | b: parseInt(result[3], 16)
|
---|
10 | } : null;
|
---|
11 |
|
---|
12 | return 'rgba(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ', ' + opacity + ')';
|
---|
13 | };
|
---|
14 |
|
---|
15 | /**
|
---|
16 | *
|
---|
17 | */
|
---|
18 | $(document).ready(function() {
|
---|
19 | /** Constant div card */
|
---|
20 | const DIV_CARD = 'div.card';
|
---|
21 |
|
---|
22 | /** Initialize tooltips */
|
---|
23 | $('[data-toggle="tooltip"]').tooltip();
|
---|
24 |
|
---|
25 | /** Initialize popovers */
|
---|
26 | $('[data-toggle="popover"]').popover({
|
---|
27 | html: true
|
---|
28 | });
|
---|
29 |
|
---|
30 | /** Function for remove card */
|
---|
31 | $('[data-toggle="card-remove"]').on('click', function(e) {
|
---|
32 | let $card = $(this).closest(DIV_CARD);
|
---|
33 |
|
---|
34 | $card.remove();
|
---|
35 |
|
---|
36 | e.preventDefault();
|
---|
37 | return false;
|
---|
38 | });
|
---|
39 |
|
---|
40 | /** Function for collapse card */
|
---|
41 | $('[data-toggle="card-collapse"]').on('click', function(e) {
|
---|
42 | let $card = $(this).closest(DIV_CARD);
|
---|
43 |
|
---|
44 | $card.toggleClass('card-collapsed');
|
---|
45 |
|
---|
46 | e.preventDefault();
|
---|
47 | return false;
|
---|
48 | });
|
---|
49 |
|
---|
50 | /** Function for fullscreen card */
|
---|
51 | $('[data-toggle="card-fullscreen"]').on('click', function(e) {
|
---|
52 | let $card = $(this).closest(DIV_CARD);
|
---|
53 |
|
---|
54 | $card.toggleClass('card-fullscreen').removeClass('card-collapsed');
|
---|
55 |
|
---|
56 | e.preventDefault();
|
---|
57 | return false;
|
---|
58 | });
|
---|
59 |
|
---|
60 | /** */
|
---|
61 | if ($('[data-sparkline]').length) {
|
---|
62 | let generateSparkline = function($elem, data, params) {
|
---|
63 | $elem.sparkline(data, {
|
---|
64 | type: $elem.attr('data-sparkline-type'),
|
---|
65 | height: '100%',
|
---|
66 | barColor: params.color,
|
---|
67 | lineColor: params.color,
|
---|
68 | fillColor: 'transparent',
|
---|
69 | spotColor: params.color,
|
---|
70 | spotRadius: 0,
|
---|
71 | lineWidth: 2,
|
---|
72 | highlightColor: hexToRgba(params.color, .6),
|
---|
73 | highlightLineColor: '#666',
|
---|
74 | defaultPixelsPerValue: 5
|
---|
75 | });
|
---|
76 | };
|
---|
77 |
|
---|
78 | require(['sparkline'], function() {
|
---|
79 | $('[data-sparkline]').each(function() {
|
---|
80 | let $chart = $(this);
|
---|
81 |
|
---|
82 | generateSparkline($chart, JSON.parse($chart.attr('data-sparkline')), {
|
---|
83 | color: $chart.attr('data-sparkline-color')
|
---|
84 | });
|
---|
85 | });
|
---|
86 | });
|
---|
87 | }
|
---|
88 |
|
---|
89 | /** */
|
---|
90 | if ($('.chart-circle').length) {
|
---|
91 | require(['circle-progress'], function() {
|
---|
92 | $('.chart-circle').each(function() {
|
---|
93 | let $this = $(this);
|
---|
94 |
|
---|
95 | $this.circleProgress({
|
---|
96 | fill: {
|
---|
97 | color: tabler.colors[$this.attr('data-color')] || tabler.colors.blue
|
---|
98 | },
|
---|
99 | size: $this.height(),
|
---|
100 | startAngle: -Math.PI / 4 * 2,
|
---|
101 | emptyFill: '#F4F4F4',
|
---|
102 | lineCap: 'round'
|
---|
103 | });
|
---|
104 | });
|
---|
105 | });
|
---|
106 | }
|
---|
107 | }); |
---|