]>
Commit | Line | Data |
---|---|---|
31f18b77 FG |
1 | /* |
2 | * Author: Abdullah A Almsaeed | |
3 | * Date: 4 Jan 2014 | |
4 | * Description: | |
5 | * This is a demo file used only for the main dashboard (index.html) | |
6 | **/ | |
7 | ||
8 | $(function () { | |
9 | ||
10 | "use strict"; | |
11 | ||
12 | //Make the dashboard widgets sortable Using jquery UI | |
13 | $(".connectedSortable").sortable({ | |
14 | placeholder: "sort-highlight", | |
15 | connectWith: ".connectedSortable", | |
16 | handle: ".box-header, .nav-tabs", | |
17 | forcePlaceholderSize: true, | |
18 | zIndex: 999999 | |
19 | }); | |
20 | $(".connectedSortable .box-header, .connectedSortable .nav-tabs-custom").css("cursor", "move"); | |
21 | ||
22 | //jQuery UI sortable for the todo list | |
23 | $(".todo-list").sortable({ | |
24 | placeholder: "sort-highlight", | |
25 | handle: ".handle", | |
26 | forcePlaceholderSize: true, | |
27 | zIndex: 999999 | |
28 | }); | |
29 | ||
30 | //bootstrap WYSIHTML5 - text editor | |
31 | $(".textarea").wysihtml5(); | |
32 | ||
33 | $('.daterange').daterangepicker({ | |
34 | ranges: { | |
35 | 'Today': [moment(), moment()], | |
36 | 'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], | |
37 | 'Last 7 Days': [moment().subtract(6, 'days'), moment()], | |
38 | 'Last 30 Days': [moment().subtract(29, 'days'), moment()], | |
39 | 'This Month': [moment().startOf('month'), moment().endOf('month')], | |
40 | 'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] | |
41 | }, | |
42 | startDate: moment().subtract(29, 'days'), | |
43 | endDate: moment() | |
44 | }, function (start, end) { | |
45 | window.alert("You chose: " + start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')); | |
46 | }); | |
47 | ||
48 | /* jQueryKnob */ | |
49 | $(".knob").knob(); | |
50 | ||
51 | //jvectormap data | |
52 | var visitorsData = { | |
53 | "US": 398, //USA | |
54 | "SA": 400, //Saudi Arabia | |
55 | "CA": 1000, //Canada | |
56 | "DE": 500, //Germany | |
57 | "FR": 760, //France | |
58 | "CN": 300, //China | |
59 | "AU": 700, //Australia | |
60 | "BR": 600, //Brazil | |
61 | "IN": 800, //India | |
62 | "GB": 320, //Great Britain | |
63 | "RU": 3000 //Russia | |
64 | }; | |
65 | //World map by jvectormap | |
66 | $('#world-map').vectorMap({ | |
67 | map: 'world_mill_en', | |
68 | backgroundColor: "transparent", | |
69 | regionStyle: { | |
70 | initial: { | |
71 | fill: '#e4e4e4', | |
72 | "fill-opacity": 1, | |
73 | stroke: 'none', | |
74 | "stroke-width": 0, | |
75 | "stroke-opacity": 1 | |
76 | } | |
77 | }, | |
78 | series: { | |
79 | regions: [{ | |
80 | values: visitorsData, | |
81 | scale: ["#92c1dc", "#ebf4f9"], | |
82 | normalizeFunction: 'polynomial' | |
83 | }] | |
84 | }, | |
85 | onRegionLabelShow: function (e, el, code) { | |
86 | if (typeof visitorsData[code] != "undefined") | |
87 | el.html(el.html() + ': ' + visitorsData[code] + ' new visitors'); | |
88 | } | |
89 | }); | |
90 | ||
91 | //Sparkline charts | |
92 | var myvalues = [1000, 1200, 920, 927, 931, 1027, 819, 930, 1021]; | |
93 | $('#sparkline-1').sparkline(myvalues, { | |
94 | type: 'line', | |
95 | lineColor: '#92c1dc', | |
96 | fillColor: "#ebf4f9", | |
97 | height: '50', | |
98 | width: '80' | |
99 | }); | |
100 | myvalues = [515, 519, 520, 522, 652, 810, 370, 627, 319, 630, 921]; | |
101 | $('#sparkline-2').sparkline(myvalues, { | |
102 | type: 'line', | |
103 | lineColor: '#92c1dc', | |
104 | fillColor: "#ebf4f9", | |
105 | height: '50', | |
106 | width: '80' | |
107 | }); | |
108 | myvalues = [15, 19, 20, 22, 33, 27, 31, 27, 19, 30, 21]; | |
109 | $('#sparkline-3').sparkline(myvalues, { | |
110 | type: 'line', | |
111 | lineColor: '#92c1dc', | |
112 | fillColor: "#ebf4f9", | |
113 | height: '50', | |
114 | width: '80' | |
115 | }); | |
116 | ||
117 | //The Calender | |
118 | $("#calendar").datepicker(); | |
119 | ||
120 | //SLIMSCROLL FOR CHAT WIDGET | |
121 | $('#chat-box').slimScroll({ | |
122 | height: '250px' | |
123 | }); | |
124 | ||
125 | /* Morris.js Charts */ | |
126 | // Sales chart | |
127 | var area = new Morris.Area({ | |
128 | element: 'revenue-chart', | |
129 | resize: true, | |
130 | data: [ | |
131 | {y: '2011 Q1', item1: 2666, item2: 2666}, | |
132 | {y: '2011 Q2', item1: 2778, item2: 2294}, | |
133 | {y: '2011 Q3', item1: 4912, item2: 1969}, | |
134 | {y: '2011 Q4', item1: 3767, item2: 3597}, | |
135 | {y: '2012 Q1', item1: 6810, item2: 1914}, | |
136 | {y: '2012 Q2', item1: 5670, item2: 4293}, | |
137 | {y: '2012 Q3', item1: 4820, item2: 3795}, | |
138 | {y: '2012 Q4', item1: 15073, item2: 5967}, | |
139 | {y: '2013 Q1', item1: 10687, item2: 4460}, | |
140 | {y: '2013 Q2', item1: 8432, item2: 5713} | |
141 | ], | |
142 | xkey: 'y', | |
143 | ykeys: ['item1', 'item2'], | |
144 | labels: ['Item 1', 'Item 2'], | |
145 | lineColors: ['#a0d0e0', '#3c8dbc'], | |
146 | hideHover: 'auto' | |
147 | }); | |
148 | var line = new Morris.Line({ | |
149 | element: 'line-chart', | |
150 | resize: true, | |
151 | data: [ | |
152 | {y: '2011 Q1', item1: 2666}, | |
153 | {y: '2011 Q2', item1: 2778}, | |
154 | {y: '2011 Q3', item1: 4912}, | |
155 | {y: '2011 Q4', item1: 3767}, | |
156 | {y: '2012 Q1', item1: 6810}, | |
157 | {y: '2012 Q2', item1: 5670}, | |
158 | {y: '2012 Q3', item1: 4820}, | |
159 | {y: '2012 Q4', item1: 15073}, | |
160 | {y: '2013 Q1', item1: 10687}, | |
161 | {y: '2013 Q2', item1: 8432} | |
162 | ], | |
163 | xkey: 'y', | |
164 | ykeys: ['item1'], | |
165 | labels: ['Item 1'], | |
166 | lineColors: ['#efefef'], | |
167 | lineWidth: 2, | |
168 | hideHover: 'auto', | |
169 | gridTextColor: "#fff", | |
170 | gridStrokeWidth: 0.4, | |
171 | pointSize: 4, | |
172 | pointStrokeColors: ["#efefef"], | |
173 | gridLineColor: "#efefef", | |
174 | gridTextFamily: "Open Sans", | |
175 | gridTextSize: 10 | |
176 | }); | |
177 | ||
178 | //Donut Chart | |
179 | var donut = new Morris.Donut({ | |
180 | element: 'sales-chart', | |
181 | resize: true, | |
182 | colors: ["#3c8dbc", "#f56954", "#00a65a"], | |
183 | data: [ | |
184 | {label: "Download Sales", value: 12}, | |
185 | {label: "In-Store Sales", value: 30}, | |
186 | {label: "Mail-Order Sales", value: 20} | |
187 | ], | |
188 | hideHover: 'auto' | |
189 | }); | |
190 | ||
191 | //Fix for charts under tabs | |
192 | $('.box ul.nav a').on('shown.bs.tab', function () { | |
193 | area.redraw(); | |
194 | donut.redraw(); | |
195 | line.redraw(); | |
196 | }); | |
197 | ||
198 | /* The todo list plugin */ | |
199 | $(".todo-list").todolist({ | |
200 | onCheck: function (ele) { | |
201 | window.console.log("The element has been checked"); | |
202 | return ele; | |
203 | }, | |
204 | onUncheck: function (ele) { | |
205 | window.console.log("The element has been unchecked"); | |
206 | return ele; | |
207 | } | |
208 | }); | |
209 | ||
210 | }); |