55 |
82 |
83 |
84 |
87 |
88 |
89 | <% if ($groupedFields['string']) : %>
90 | <% foreach ($groupedFields['string'] as $field) : %>
91 | <% if (isset($associationFields[$field])) :
92 | $details = $associationFields[$field];
93 | %>
94 |
95 | | <%= Inflector::humanize($details['property']) %> |
96 | ->has('<%= $details['property'] %>') ? $this->Html->link($<%= $singularVar %>-><%= $details['property'] %>-><%= $details['displayField'] %>, ['controller' => '<%= $details['controller'] %>', 'action' => 'view', $<%= $singularVar %>-><%= $details['property'] %>-><%= $details['primaryKey'][0] %>]) : '' ?> |
97 |
98 | <% else : %>
99 |
100 | | <%= Inflector::humanize($field) %> |
101 | -><%= $field %>) ?> |
102 |
103 | <% endif; %>
104 | <% endforeach; %>
105 | <% endif; %>
106 | <% if ($groupedFields['number']) : %>
107 | <% foreach ($groupedFields['number'] as $field) : %>
108 |
109 | | <%= Inflector::humanize($field) %> |
110 | Number->format($<%= $singularVar %>-><%= $field %>) ?> |
111 |
112 | <% endforeach; %>
113 | <% endif; %>
114 | <% if ($groupedFields['date']) : %>
115 | <% foreach ($groupedFields['date'] as $field) : %>
116 |
117 | | <%= Inflector::humanize($field) %> |
118 | -><%= $field %>) ?> |
119 |
120 | <% endforeach; %>
121 | <% endif; %>
122 | <% if ($groupedFields['boolean']) : %>
123 | <% foreach ($groupedFields['boolean'] as $field) : %>
124 |
125 | | <%= Inflector::humanize($field) %> |
126 | -><%= $field %> ? __('Yes') : __('No'); ?> |
127 |
128 | <% endforeach; %>
129 | <% endif; %>
130 |
131 | <% if ($groupedFields['text']) : %>
132 | <% foreach ($groupedFields['text'] as $field) : %>
133 |
134 |
<%= Inflector::humanize($field) %>
135 | Text->autoParagraph(h($<%= $singularVar %>-><%= $field %>)); ?>
136 |
137 | <% endforeach; %>
138 | <% endif; %>
139 | <%
140 | $relations = $associations['HasMany'] + $associations['BelongsToMany'];
141 | foreach ($relations as $alias => $details):
142 | $otherSingularVar = Inflector::variable($alias);
143 | $otherPluralHumanName = Inflector::humanize(Inflector::underscore($details['controller']));
144 | %>
145 |
171 | <% endforeach; %>
172 |
173 |
174 |
175 |
--------------------------------------------------------------------------------
/webroot/js/pages/dashboard2.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | 'use strict';
4 |
5 | /* ChartJS
6 | * -------
7 | * Here we will create a few charts using ChartJS
8 | */
9 |
10 | //-----------------------
11 | //- MONTHLY SALES CHART -
12 | //-----------------------
13 |
14 | // Get context with jQuery - using jQuery's .get() method.
15 | var salesChartCanvas = $("#salesChart").get(0).getContext("2d");
16 | // This will get the first returned node in the jQuery collection.
17 | var salesChart = new Chart(salesChartCanvas);
18 |
19 | var salesChartData = {
20 | labels: ["January", "February", "March", "April", "May", "June", "July"],
21 | datasets: [
22 | {
23 | label: "Electronics",
24 | fillColor: "rgb(210, 214, 222)",
25 | strokeColor: "rgb(210, 214, 222)",
26 | pointColor: "rgb(210, 214, 222)",
27 | pointStrokeColor: "#c1c7d1",
28 | pointHighlightFill: "#fff",
29 | pointHighlightStroke: "rgb(220,220,220)",
30 | data: [65, 59, 80, 81, 56, 55, 40]
31 | },
32 | {
33 | label: "Digital Goods",
34 | fillColor: "rgba(60,141,188,0.9)",
35 | strokeColor: "rgba(60,141,188,0.8)",
36 | pointColor: "#3b8bba",
37 | pointStrokeColor: "rgba(60,141,188,1)",
38 | pointHighlightFill: "#fff",
39 | pointHighlightStroke: "rgba(60,141,188,1)",
40 | data: [28, 48, 40, 19, 86, 27, 90]
41 | }
42 | ]
43 | };
44 |
45 | var salesChartOptions = {
46 | //Boolean - If we should show the scale at all
47 | showScale: true,
48 | //Boolean - Whether grid lines are shown across the chart
49 | scaleShowGridLines: false,
50 | //String - Colour of the grid lines
51 | scaleGridLineColor: "rgba(0,0,0,.05)",
52 | //Number - Width of the grid lines
53 | scaleGridLineWidth: 1,
54 | //Boolean - Whether to show horizontal lines (except X axis)
55 | scaleShowHorizontalLines: true,
56 | //Boolean - Whether to show vertical lines (except Y axis)
57 | scaleShowVerticalLines: true,
58 | //Boolean - Whether the line is curved between points
59 | bezierCurve: true,
60 | //Number - Tension of the bezier curve between points
61 | bezierCurveTension: 0.3,
62 | //Boolean - Whether to show a dot for each point
63 | pointDot: false,
64 | //Number - Radius of each point dot in pixels
65 | pointDotRadius: 4,
66 | //Number - Pixel width of point dot stroke
67 | pointDotStrokeWidth: 1,
68 | //Number - amount extra to add to the radius to cater for hit detection outside the drawn point
69 | pointHitDetectionRadius: 20,
70 | //Boolean - Whether to show a stroke for datasets
71 | datasetStroke: true,
72 | //Number - Pixel width of dataset stroke
73 | datasetStrokeWidth: 2,
74 | //Boolean - Whether to fill the dataset with a color
75 | datasetFill: true,
76 | //String - A legend template
77 | legendTemplate: "
-legend\"><% for (var i=0; i- \"><%=datasets[i].label%>
<%}%>
",
78 | //Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
79 | maintainAspectRatio: true,
80 | //Boolean - whether to make the chart responsive to window resizing
81 | responsive: true
82 | };
83 |
84 | //Create the line chart
85 | salesChart.Line(salesChartData, salesChartOptions);
86 |
87 | //---------------------------
88 | //- END MONTHLY SALES CHART -
89 | //---------------------------
90 |
91 | //-------------
92 | //- PIE CHART -
93 | //-------------
94 | // Get context with jQuery - using jQuery's .get() method.
95 | var pieChartCanvas = $("#pieChart").get(0).getContext("2d");
96 | var pieChart = new Chart(pieChartCanvas);
97 | var PieData = [
98 | {
99 | value: 700,
100 | color: "#f56954",
101 | highlight: "#f56954",
102 | label: "Chrome"
103 | },
104 | {
105 | value: 500,
106 | color: "#00a65a",
107 | highlight: "#00a65a",
108 | label: "IE"
109 | },
110 | {
111 | value: 400,
112 | color: "#f39c12",
113 | highlight: "#f39c12",
114 | label: "FireFox"
115 | },
116 | {
117 | value: 600,
118 | color: "#00c0ef",
119 | highlight: "#00c0ef",
120 | label: "Safari"
121 | },
122 | {
123 | value: 300,
124 | color: "#3c8dbc",
125 | highlight: "#3c8dbc",
126 | label: "Opera"
127 | },
128 | {
129 | value: 100,
130 | color: "#d2d6de",
131 | highlight: "#d2d6de",
132 | label: "Navigator"
133 | }
134 | ];
135 | var pieOptions = {
136 | //Boolean - Whether we should show a stroke on each segment
137 | segmentShowStroke: true,
138 | //String - The colour of each segment stroke
139 | segmentStrokeColor: "#fff",
140 | //Number - The width of each segment stroke
141 | segmentStrokeWidth: 1,
142 | //Number - The percentage of the chart that we cut out of the middle
143 | percentageInnerCutout: 50, // This is 0 for Pie charts
144 | //Number - Amount of animation steps
145 | animationSteps: 100,
146 | //String - Animation easing effect
147 | animationEasing: "easeOutBounce",
148 | //Boolean - Whether we animate the rotation of the Doughnut
149 | animateRotate: true,
150 | //Boolean - Whether we animate scaling the Doughnut from the centre
151 | animateScale: false,
152 | //Boolean - whether to make the chart responsive to window resizing
153 | responsive: true,
154 | // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
155 | maintainAspectRatio: false,
156 | //String - A legend template
157 | legendTemplate: "
-legend\"><% for (var i=0; i- \"><%if(segments[i].label){%><%=segments[i].label%><%}%>
<%}%>
",
158 | //String - A tooltip template
159 | tooltipTemplate: "<%=value %> <%=label%> users"
160 | };
161 | //Create pie or douhnut chart
162 | // You can switch between pie and douhnut using the method below.
163 | pieChart.Doughnut(PieData, pieOptions);
164 | //-----------------
165 | //- END PIE CHART -
166 | //-----------------
167 |
168 | /* jVector Maps
169 | * ------------
170 | * Create a world map with markers
171 | */
172 | $('#world-map-markers').vectorMap({
173 | map: 'world_mill_en',
174 | normalizeFunction: 'polynomial',
175 | hoverOpacity: 0.7,
176 | hoverColor: false,
177 | backgroundColor: 'transparent',
178 | regionStyle: {
179 | initial: {
180 | fill: 'rgba(210, 214, 222, 1)',
181 | "fill-opacity": 1,
182 | stroke: 'none',
183 | "stroke-width": 0,
184 | "stroke-opacity": 1
185 | },
186 | hover: {
187 | "fill-opacity": 0.7,
188 | cursor: 'pointer'
189 | },
190 | selected: {
191 | fill: 'yellow'
192 | },
193 | selectedHover: {}
194 | },
195 | markerStyle: {
196 | initial: {
197 | fill: '#00a65a',
198 | stroke: '#111'
199 | }
200 | },
201 | markers: [
202 | {latLng: [41.90, 12.45], name: 'Vatican City'},
203 | {latLng: [43.73, 7.41], name: 'Monaco'},
204 | {latLng: [-0.52, 166.93], name: 'Nauru'},
205 | {latLng: [-8.51, 179.21], name: 'Tuvalu'},
206 | {latLng: [43.93, 12.46], name: 'San Marino'},
207 | {latLng: [47.14, 9.52], name: 'Liechtenstein'},
208 | {latLng: [7.11, 171.06], name: 'Marshall Islands'},
209 | {latLng: [17.3, -62.73], name: 'Saint Kitts and Nevis'},
210 | {latLng: [3.2, 73.22], name: 'Maldives'},
211 | {latLng: [35.88, 14.5], name: 'Malta'},
212 | {latLng: [12.05, -61.75], name: 'Grenada'},
213 | {latLng: [13.16, -61.23], name: 'Saint Vincent and the Grenadines'},
214 | {latLng: [13.16, -59.55], name: 'Barbados'},
215 | {latLng: [17.11, -61.85], name: 'Antigua and Barbuda'},
216 | {latLng: [-4.61, 55.45], name: 'Seychelles'},
217 | {latLng: [7.35, 134.46], name: 'Palau'},
218 | {latLng: [42.5, 1.51], name: 'Andorra'},
219 | {latLng: [14.01, -60.98], name: 'Saint Lucia'},
220 | {latLng: [6.91, 158.18], name: 'Federated States of Micronesia'},
221 | {latLng: [1.3, 103.8], name: 'Singapore'},
222 | {latLng: [1.46, 173.03], name: 'Kiribati'},
223 | {latLng: [-21.13, -175.2], name: 'Tonga'},
224 | {latLng: [15.3, -61.38], name: 'Dominica'},
225 | {latLng: [-20.2, 57.5], name: 'Mauritius'},
226 | {latLng: [26.02, 50.55], name: 'Bahrain'},
227 | {latLng: [0.33, 6.73], name: 'São Tomé and Príncipe'}
228 | ]
229 | });
230 |
231 | /* SPARKLINE CHARTS
232 | * ----------------
233 | * Create a inline charts with spark line
234 | */
235 |
236 | //-----------------
237 | //- SPARKLINE BAR -
238 | //-----------------
239 | $('.sparkbar').each(function () {
240 | var $this = $(this);
241 | $this.sparkline('html', {
242 | type: 'bar',
243 | height: $this.data('height') ? $this.data('height') : '30',
244 | barColor: $this.data('color')
245 | });
246 | });
247 |
248 | //-----------------
249 | //- SPARKLINE PIE -
250 | //-----------------
251 | $('.sparkpie').each(function () {
252 | var $this = $(this);
253 | $this.sparkline('html', {
254 | type: 'pie',
255 | height: $this.data('height') ? $this.data('height') : '90',
256 | sliceColors: $this.data('color')
257 | });
258 | });
259 |
260 | //------------------
261 | //- SPARKLINE LINE -
262 | //------------------
263 | $('.sparkline').each(function () {
264 | var $this = $(this);
265 | $this.sparkline('html', {
266 | type: 'line',
267 | height: $this.data('height') ? $this.data('height') : '90',
268 | width: '100%',
269 | lineColor: $this.data('linecolor'),
270 | fillColor: $this.data('fillcolor'),
271 | spotColor: $this.data('spotcolor')
272 | });
273 | });
274 | });
275 |
--------------------------------------------------------------------------------
/webroot/js/demo.js:
--------------------------------------------------------------------------------
1 | /**
2 | * AdminLTE Demo Menu
3 | * ------------------
4 | * You should not use this file in production.
5 | * This file is for demo purposes only.
6 | */
7 | (function ($, AdminLTE) {
8 |
9 | "use strict";
10 |
11 | /**
12 | * List of all the available skins
13 | *
14 | * @type Array
15 | */
16 | var my_skins = [
17 | "skin-blue",
18 | "skin-black",
19 | "skin-red",
20 | "skin-yellow",
21 | "skin-purple",
22 | "skin-green",
23 | "skin-blue-light",
24 | "skin-black-light",
25 | "skin-red-light",
26 | "skin-yellow-light",
27 | "skin-purple-light",
28 | "skin-green-light"
29 | ];
30 |
31 | //Create the new tab
32 | var tab_pane = $("
", {
33 | "id": "control-sidebar-theme-demo-options-tab",
34 | "class": "tab-pane active"
35 | });
36 |
37 | //Create the tab button
38 | var tab_button = $("
", {"class": "active"})
39 | .html("
"
40 | + ""
41 | + "");
42 |
43 | //Add the tab button to the right sidebar tabs
44 | $("[href='#control-sidebar-home-tab']")
45 | .parent()
46 | .before(tab_button);
47 |
48 | //Create the menu
49 | var demo_settings = $("
");
50 |
51 | //Layout options
52 | demo_settings.append(
53 | ""
56 | //Fixed layout
57 | + "
"
64 | //Boxed layout
65 | + "
"
72 | //Sidebar Toggle
73 | + "
"
80 | //Sidebar mini expand on hover toggle
81 | + "
"
88 | //Control Sidebar Toggle
89 | + "
"
96 | //Control Sidebar Skin Toggle
97 | + "
"
104 | );
105 | var skins_list = $("
", {"class": 'list-unstyled clearfix'});
106 |
107 | //Dark sidebar skins
108 | var skin_blue =
109 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
110 | .append("
"
111 | + "
"
112 | + "
"
113 | + ""
114 | + "
Blue
");
115 | skins_list.append(skin_blue);
116 | var skin_black =
117 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
118 | .append("
"
119 | + "
"
120 | + "
"
121 | + ""
122 | + "
Black
");
123 | skins_list.append(skin_black);
124 | var skin_purple =
125 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
126 | .append("
"
127 | + "
"
128 | + "
"
129 | + ""
130 | + "
Purple
");
131 | skins_list.append(skin_purple);
132 | var skin_green =
133 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
134 | .append("
"
135 | + "
"
136 | + "
"
137 | + ""
138 | + "
Green
");
139 | skins_list.append(skin_green);
140 | var skin_red =
141 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
142 | .append("
"
143 | + "
"
144 | + "
"
145 | + ""
146 | + "
Red
");
147 | skins_list.append(skin_red);
148 | var skin_yellow =
149 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
150 | .append("
"
151 | + "
"
152 | + "
"
153 | + ""
154 | + "
Yellow
");
155 | skins_list.append(skin_yellow);
156 |
157 | //Light sidebar skins
158 | var skin_blue_light =
159 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
160 | .append("
"
161 | + "
"
162 | + "
"
163 | + ""
164 | + "
Blue Light
");
165 | skins_list.append(skin_blue_light);
166 | var skin_black_light =
167 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
168 | .append("
"
169 | + "
"
170 | + "
"
171 | + ""
172 | + "
Black Light
");
173 | skins_list.append(skin_black_light);
174 | var skin_purple_light =
175 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
176 | .append("
"
177 | + "
"
178 | + "
"
179 | + ""
180 | + "
Purple Light
");
181 | skins_list.append(skin_purple_light);
182 | var skin_green_light =
183 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
184 | .append("
"
185 | + "
"
186 | + "
"
187 | + ""
188 | + "
Green Light
");
189 | skins_list.append(skin_green_light);
190 | var skin_red_light =
191 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
192 | .append("
"
193 | + "
"
194 | + "
"
195 | + ""
196 | + "
Red Light
");
197 | skins_list.append(skin_red_light);
198 | var skin_yellow_light =
199 | $("
", {style: "float:left; width: 33.33333%; padding: 5px;"})
200 | .append("
"
201 | + "
"
202 | + "
"
203 | + ""
204 | + "
Yellow Light
");
205 | skins_list.append(skin_yellow_light);
206 |
207 | demo_settings.append("");
208 | demo_settings.append(skins_list);
209 |
210 | tab_pane.append(demo_settings);
211 | $("#control-sidebar-home-tab").after(tab_pane);
212 |
213 | setup();
214 |
215 | /**
216 | * Toggles layout classes
217 | *
218 | * @param String cls the layout class to toggle
219 | * @returns void
220 | */
221 | function change_layout(cls) {
222 | $("body").toggleClass(cls);
223 | AdminLTE.layout.fixSidebar();
224 | //Fix the problem with right sidebar and layout boxed
225 | if (cls == "layout-boxed")
226 | AdminLTE.controlSidebar._fix($(".control-sidebar-bg"));
227 | if ($('body').hasClass('fixed') && cls == 'fixed') {
228 | AdminLTE.pushMenu.expandOnHover();
229 | AdminLTE.layout.activate();
230 | }
231 | AdminLTE.controlSidebar._fix($(".control-sidebar-bg"));
232 | AdminLTE.controlSidebar._fix($(".control-sidebar"));
233 | }
234 |
235 | /**
236 | * Replaces the old skin with the new skin
237 | * @param String cls the new skin class
238 | * @returns Boolean false to prevent link's default action
239 | */
240 | function change_skin(cls) {
241 | $.each(my_skins, function (i) {
242 | $("body").removeClass(my_skins[i]);
243 | });
244 |
245 | $("body").addClass(cls);
246 | store('skin', cls);
247 | return false;
248 | }
249 |
250 | /**
251 | * Store a new settings in the browser
252 | *
253 | * @param String name Name of the setting
254 | * @param String val Value of the setting
255 | * @returns void
256 | */
257 | function store(name, val) {
258 | if (typeof (Storage) !== "undefined") {
259 | localStorage.setItem(name, val);
260 | } else {
261 | window.alert('Please use a modern browser to properly view this template!');
262 | }
263 | }
264 |
265 | /**
266 | * Get a prestored setting
267 | *
268 | * @param String name Name of of the setting
269 | * @returns String The value of the setting | null
270 | */
271 | function get(name) {
272 | if (typeof (Storage) !== "undefined") {
273 | return localStorage.getItem(name);
274 | } else {
275 | window.alert('Please use a modern browser to properly view this template!');
276 | }
277 | }
278 |
279 | /**
280 | * Retrieve default settings and apply them to the template
281 | *
282 | * @returns void
283 | */
284 | function setup() {
285 | var tmp = get('skin');
286 | if (tmp && $.inArray(tmp, my_skins))
287 | change_skin(tmp);
288 |
289 | //Add the change skin listener
290 | $("[data-skin]").on('click', function (e) {
291 | e.preventDefault();
292 | change_skin($(this).data('skin'));
293 | });
294 |
295 | //Add the layout manager
296 | $("[data-layout]").on('click', function () {
297 | change_layout($(this).data('layout'));
298 | });
299 |
300 | $("[data-controlsidebar]").on('click', function () {
301 | change_layout($(this).data('controlsidebar'));
302 | var slide = !AdminLTE.options.controlSidebarOptions.slide;
303 | AdminLTE.options.controlSidebarOptions.slide = slide;
304 | if (!slide)
305 | $('.control-sidebar').removeClass('control-sidebar-open');
306 | });
307 |
308 | $("[data-sidebarskin='toggle']").on('click', function () {
309 | var sidebar = $(".control-sidebar");
310 | if (sidebar.hasClass("control-sidebar-dark")) {
311 | sidebar.removeClass("control-sidebar-dark")
312 | sidebar.addClass("control-sidebar-light")
313 | } else {
314 | sidebar.removeClass("control-sidebar-light")
315 | sidebar.addClass("control-sidebar-dark")
316 | }
317 | });
318 |
319 | $("[data-enable='expandOnHover']").on('click', function () {
320 | $(this).attr('disabled', true);
321 | AdminLTE.pushMenu.expandOnHover();
322 | if (!$('body').hasClass('sidebar-collapse'))
323 | $("[data-layout='sidebar-collapse']").click();
324 | });
325 |
326 | // Reset options
327 | if ($('body').hasClass('fixed')) {
328 | $("[data-layout='fixed']").attr('checked', 'checked');
329 | }
330 | if ($('body').hasClass('layout-boxed')) {
331 | $("[data-layout='layout-boxed']").attr('checked', 'checked');
332 | }
333 | if ($('body').hasClass('sidebar-collapse')) {
334 | $("[data-layout='sidebar-collapse']").attr('checked', 'checked');
335 | }
336 |
337 | }
338 | })(jQuery, $.AdminLTE);
339 |
--------------------------------------------------------------------------------