demo.initChartsPages - Code Metrics - Inspection of "Merge remote-tracking branch 'origin/master'" - football-betting/symfony4 - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — master ( 802541...2f35f3 )

by Rafal

created 2018-07-12 08:57 UTC

demo.initChartsPages B

↳ Parent: assets/js/paper/demo.js

Complexity

Conditions	1
Paths	1

Size

Total Lines	189
Code Lines	125

Duplication

Lines	0
Ratio	0 %

Importance

Changes	1
Bugs	0	Features	0

Metric	Value
cc	1
eloc	125
nc	1
nop	0
dl	0
loc	189
rs	7
c	1
b	0
f	0

How to fix Long Method

demo = {

  initPickColor: function() {
    $('.pick-class-label').click(function() {
      var new_class = $(this).attr('new-class');
      var old_class = $('#display-buttons').attr('data-class');
      var display_div = $('#display-buttons');
      if (display_div.length) {
        var display_buttons = display_div.find('.btn');
        display_buttons.removeClass(old_class);
        display_buttons.addClass(new_class);
        display_div.attr('data-class', new_class);
      }
    });
  },

  initDocChart: function() {
    chartColor = "#FFFFFF";


    ctx = document.getElementById('chartHours').getContext("2d");


    myChart = new Chart(ctx, {

      type: 'line',

      data: {
        labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct"],
        datasets: [{
            borderColor: "#6bd098",
            backgroundColor: "#6bd098",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [300, 310, 316, 322, 330, 326, 333, 345, 338, 354]
          },
          {
            borderColor: "#f17e5d",
            backgroundColor: "#f17e5d",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [320, 340, 365, 360, 370, 385, 390, 384, 408, 420]
          },
          {
            borderColor: "#fcc468",
            backgroundColor: "#fcc468",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [370, 394, 415, 409, 425, 445, 460, 450, 478, 484]
          }
        ]
      },
      options: {
        legend: {
          display: false
        },

        tooltips: {
          enabled: false
        },

        scales: {
          yAxes: [{

            ticks: {
              fontColor: "#9f9f9f",
              beginAtZero: false,
              maxTicksLimit: 5,
              //padding: 20
            },
            gridLines: {
              drawBorder: false,
              zeroLineColor: "#ccc",
              color: 'rgba(255,255,255,0.05)'
            }

          }],

          xAxes: [{
            barPercentage: 1.6,
            gridLines: {
              drawBorder: false,
              color: 'rgba(255,255,255,0.1)',
              zeroLineColor: "transparent",
              display: false,
            },
            ticks: {
              padding: 20,
              fontColor: "#9f9f9f"
            }
          }]
        },
      }
    });

  },

  initChartsPages: function() {
    chartColor = "#FFFFFF";


    ctx = document.getElementById('chartHours').getContext("2d");


    myChart = new Chart(ctx, {

      type: 'line',

      data: {
        labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct"],
        datasets: [{
            borderColor: "#6bd098",
            backgroundColor: "#6bd098",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [300, 310, 316, 322, 330, 326, 333, 345, 338, 354]
          },
          {
            borderColor: "#f17e5d",
            backgroundColor: "#f17e5d",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [320, 340, 365, 360, 370, 385, 390, 384, 408, 420]
          },
          {
            borderColor: "#fcc468",
            backgroundColor: "#fcc468",
            pointRadius: 0,
            pointHoverRadius: 0,
            borderWidth: 3,
            data: [370, 394, 415, 409, 425, 445, 460, 450, 478, 484]
          }
        ]
      },
      options: {
        legend: {
          display: false
        },

        tooltips: {
          enabled: false
        },

        scales: {
          yAxes: [{

            ticks: {
              fontColor: "#9f9f9f",
              beginAtZero: false,
              maxTicksLimit: 5,
              //padding: 20
            },
            gridLines: {
              drawBorder: false,
              zeroLineColor: "#ccc",
              color: 'rgba(255,255,255,0.05)'
            }

          }],

          xAxes: [{
            barPercentage: 1.6,
            gridLines: {
              drawBorder: false,
              color: 'rgba(255,255,255,0.1)',
              zeroLineColor: "transparent",
              display: false,
            },
            ticks: {
              padding: 20,
              fontColor: "#9f9f9f"
            }
          }]
        },
      }
    });


    ctx = document.getElementById('chartEmail').getContext("2d");

    myChart = new Chart(ctx, {
      type: 'pie',
      data: {
        labels: [1, 2, 3],
        datasets: [{
          label: "Emails",
          pointRadius: 0,
          pointHoverRadius: 0,
          backgroundColor: [
            '#e3e3e3',
            '#4acccd',
            '#fcc468',
            '#ef8157'
          ],
          borderWidth: 0,
          data: [342, 480, 530, 120]
        }]
      },

      options: {

        legend: {
          display: false
        },

        pieceLabel: {
          render: 'percentage',
          fontColor: ['white'],
          precision: 2
        },

        tooltips: {
          enabled: false
        },

        scales: {
          yAxes: [{

            ticks: {
              display: false
            },
            gridLines: {
              drawBorder: false,
              zeroLineColor: "transparent",
              color: 'rgba(255,255,255,0.05)'
            }

          }],

          xAxes: [{
            barPercentage: 1.6,
            gridLines: {
              drawBorder: false,
              color: 'rgba(255,255,255,0.1)',
              zeroLineColor: "transparent"
            },
            ticks: {
              display: false,
            }
          }]
        },
      }
    });

    var speedCanvas = document.getElementById("speedChart");

    var dataFirst = {
      data: [0, 19, 15, 20, 30, 40, 40, 50, 25, 30, 50, 70],
      fill: false,
      borderColor: '#fbc658',
      backgroundColor: 'transparent',
      pointBorderColor: '#fbc658',
      pointRadius: 4,
      pointHoverRadius: 4,
      pointBorderWidth: 8,
    };

    var dataSecond = {
      data: [0, 5, 10, 12, 20, 27, 30, 34, 42, 45, 55, 63],
      fill: false,
      borderColor: '#51CACF',
      backgroundColor: 'transparent',
      pointBorderColor: '#51CACF',
      pointRadius: 4,
      pointHoverRadius: 4,
      pointBorderWidth: 8
    };

    var speedData = {
      labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
      datasets: [dataFirst, dataSecond]
    };

    var chartOptions = {
      legend: {
        display: false,
        position: 'top'
      }
    };

    var lineChart = new Chart(speedCanvas, {

      type: 'line',
      hover: false,
      data: speedData,
      options: chartOptions
    });
  },

  initGoogleMaps: function() {
    var myLatlng = new google.maps.LatLng(40.748817, -73.985428);

    var mapOptions = {
      zoom: 13,
      center: myLatlng,
      scrollwheel: false, //we disable de scroll over the map, it is a really annoing when you scroll through page
      styles: [{
        "featureType": "water",
        "stylers": [{
          "saturation": 43
        }, {
          "lightness": -11
        }, {
          "hue": "#0088ff"
        }]
      }, {
        "featureType": "road",
        "elementType": "geometry.fill",
        "stylers": [{
          "hue": "#ff0000"
        }, {
          "saturation": -100
        }, {
          "lightness": 99
        }]
      }, {
        "featureType": "road",
        "elementType": "geometry.stroke",
        "stylers": [{
          "color": "#808080"
        }, {
          "lightness": 54
        }]
      }, {
        "featureType": "landscape.man_made",
        "elementType": "geometry.fill",
        "stylers": [{
          "color": "#ece2d9"
        }]
      }, {
        "featureType": "poi.park",
        "elementType": "geometry.fill",
        "stylers": [{
          "color": "#ccdca1"
        }]
      }, {
        "featureType": "road",
        "elementType": "labels.text.fill",
        "stylers": [{
          "color": "#767676"
        }]
      }, {
        "featureType": "road",
        "elementType": "labels.text.stroke",
        "stylers": [{
          "color": "#ffffff"
        }]
      }, {
        "featureType": "poi",
        "stylers": [{
          "visibility": "off"
        }]
      }, {
        "featureType": "landscape.natural",
        "elementType": "geometry.fill",
        "stylers": [{
          "visibility": "on"
        }, {
          "color": "#b8cb93"
        }]
      }, {
        "featureType": "poi.park",
        "stylers": [{
          "visibility": "on"
        }]
      }, {
        "featureType": "poi.sports_complex",
        "stylers": [{
          "visibility": "on"
        }]
      }, {
        "featureType": "poi.medical",
        "stylers": [{
          "visibility": "on"
        }]
      }, {
        "featureType": "poi.business",
        "stylers": [{
          "visibility": "simplified"
        }]
      }]

    }
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);

    var marker = new google.maps.Marker({
      position: myLatlng,
      title: "Hello World!"
    });

    // To add the marker to the map, call setMap();
    marker.setMap(map);
  },

  showNotification: function(from, align) {
    color = 'primary';


    $.notify({
      icon: "nc-icon nc-bell-55",
      message: "Welcome to <b>Paper Dashboard</b> - a beautiful bootstrap dashboard for every web developer."

    }, {
      type: color,
      timer: 8000,
      placement: {
        from: from,
        align: align
      }
    });
  }

};

1			demo = {
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `demo` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.demo`. Loading history...
2			initPickColor: function() {
3			$('.pick-class-label').click(function() {
4			var new_class = $(this).attr('new-class');
5			var old_class = $('#display-buttons').attr('data-class');
6			var display_div = $('#display-buttons');
7			if (display_div.length) {
8			var display_buttons = display_div.find('.btn');
9			display_buttons.removeClass(old_class);
10			display_buttons.addClass(new_class);
11			display_div.attr('data-class', new_class);
12			}
13			});
14			},
15
16			initDocChart: function() {
17			chartColor = "#FFFFFF";
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `chartColor` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.chartColor`. Loading history...
18
19			ctx = document.getElementById('chartHours').getContext("2d");
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `ctx` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.ctx`. Loading history...
20
21			myChart = new Chart(ctx, {
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `Chart` seems to be never declared. If this is a global, consider adding a `/** global: Chart */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history... Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `myChart` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.myChart`. Loading history...
22			type: 'line',
23
24			data: {
25			labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct"],
26			datasets: [{
27			borderColor: "#6bd098",
28			backgroundColor: "#6bd098",
29			pointRadius: 0,
30			pointHoverRadius: 0,
31			borderWidth: 3,
32			data: [300, 310, 316, 322, 330, 326, 333, 345, 338, 354]
33			},
34			{
35			borderColor: "#f17e5d",
36			backgroundColor: "#f17e5d",
37			pointRadius: 0,
38			pointHoverRadius: 0,
39			borderWidth: 3,
40			data: [320, 340, 365, 360, 370, 385, 390, 384, 408, 420]
41			},
42			{
43			borderColor: "#fcc468",
44			backgroundColor: "#fcc468",
45			pointRadius: 0,
46			pointHoverRadius: 0,
47			borderWidth: 3,
48			data: [370, 394, 415, 409, 425, 445, 460, 450, 478, 484]
49			}
50			]
51			},
52			options: {
53			legend: {
54			display: false
55			},
56
57			tooltips: {
58			enabled: false
59			},
60
61			scales: {
62			yAxes: [{
63
64			ticks: {
65			fontColor: "#9f9f9f",
66			beginAtZero: false,
67			maxTicksLimit: 5,
68			//padding: 20
69			},
70			gridLines: {
71			drawBorder: false,
72			zeroLineColor: "#ccc",
73			color: 'rgba(255,255,255,0.05)'
74			}
75
76			}],
77
78			xAxes: [{
79			barPercentage: 1.6,
80			gridLines: {
81			drawBorder: false,
82			color: 'rgba(255,255,255,0.1)',
83			zeroLineColor: "transparent",
84			display: false,
85			},
86			ticks: {
87			padding: 20,
88			fontColor: "#9f9f9f"
89			}
90			}]
91			},
92			}
93			});
94
95			},
96
97			initChartsPages: function() {
98			chartColor = "#FFFFFF";
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `chartColor` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.chartColor`. Loading history...
99
100			ctx = document.getElementById('chartHours').getContext("2d");
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `ctx` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.ctx`. Loading history...
101
102			myChart = new Chart(ctx, {
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `myChart` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.myChart`. Loading history... Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `Chart` seems to be never declared. If this is a global, consider adding a `/** global: Chart */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
103			type: 'line',
104
105			data: {
106			labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct"],
107			datasets: [{
108			borderColor: "#6bd098",
109			backgroundColor: "#6bd098",
110			pointRadius: 0,
111			pointHoverRadius: 0,
112			borderWidth: 3,
113			data: [300, 310, 316, 322, 330, 326, 333, 345, 338, 354]
114			},
115			{
116			borderColor: "#f17e5d",
117			backgroundColor: "#f17e5d",
118			pointRadius: 0,
119			pointHoverRadius: 0,
120			borderWidth: 3,
121			data: [320, 340, 365, 360, 370, 385, 390, 384, 408, 420]
122			},
123			{
124			borderColor: "#fcc468",
125			backgroundColor: "#fcc468",
126			pointRadius: 0,
127			pointHoverRadius: 0,
128			borderWidth: 3,
129			data: [370, 394, 415, 409, 425, 445, 460, 450, 478, 484]
130			}
131			]
132			},
133			options: {
134			legend: {
135			display: false
136			},
137
138			tooltips: {
139			enabled: false
140			},
141
142			scales: {
143			yAxes: [{
144
145			ticks: {
146			fontColor: "#9f9f9f",
147			beginAtZero: false,
148			maxTicksLimit: 5,
149			//padding: 20
150			},
151			gridLines: {
152			drawBorder: false,
153			zeroLineColor: "#ccc",
154			color: 'rgba(255,255,255,0.05)'
155			}
156
157			}],
158
159			xAxes: [{
160			barPercentage: 1.6,
161			gridLines: {
162			drawBorder: false,
163			color: 'rgba(255,255,255,0.1)',
164			zeroLineColor: "transparent",
165			display: false,
166			},
167			ticks: {
168			padding: 20,
169			fontColor: "#9f9f9f"
170			}
171			}]
172			},
173			}
174			});
175
176
177			ctx = document.getElementById('chartEmail').getContext("2d");
178
179			myChart = new Chart(ctx, {
180			type: 'pie',
181			data: {
182			labels: [1, 2, 3],
183			datasets: [{
184			label: "Emails",
185			pointRadius: 0,
186			pointHoverRadius: 0,
187			backgroundColor: [
188			'#e3e3e3',
189			'#4acccd',
190			'#fcc468',
191			'#ef8157'
192			],
193			borderWidth: 0,
194			data: [342, 480, 530, 120]
195			}]
196			},
197
198			options: {
199
200			legend: {
201			display: false
202			},
203
204			pieceLabel: {
205			render: 'percentage',
206			fontColor: ['white'],
207			precision: 2
208			},
209
210			tooltips: {
211			enabled: false
212			},
213
214			scales: {
215			yAxes: [{
216
217			ticks: {
218			display: false
219			},
220			gridLines: {
221			drawBorder: false,
222			zeroLineColor: "transparent",
223			color: 'rgba(255,255,255,0.05)'
224			}
225
226			}],
227
228			xAxes: [{
229			barPercentage: 1.6,
230			gridLines: {
231			drawBorder: false,
232			color: 'rgba(255,255,255,0.1)',
233			zeroLineColor: "transparent"
234			},
235			ticks: {
236			display: false,
237			}
238			}]
239			},
240			}
241			});
242
243			var speedCanvas = document.getElementById("speedChart");
244
245			var dataFirst = {
246			data: [0, 19, 15, 20, 30, 40, 40, 50, 25, 30, 50, 70],
247			fill: false,
248			borderColor: '#fbc658',
249			backgroundColor: 'transparent',
250			pointBorderColor: '#fbc658',
251			pointRadius: 4,
252			pointHoverRadius: 4,
253			pointBorderWidth: 8,
254			};
255
256			var dataSecond = {
257			data: [0, 5, 10, 12, 20, 27, 30, 34, 42, 45, 55, 63],
258			fill: false,
259			borderColor: '#51CACF',
260			backgroundColor: 'transparent',
261			pointBorderColor: '#51CACF',
262			pointRadius: 4,
263			pointHoverRadius: 4,
264			pointBorderWidth: 8
265			};
266
267			var speedData = {
268			labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
269			datasets: [dataFirst, dataSecond]
270			};
271
272			var chartOptions = {
273			legend: {
274			display: false,
275			position: 'top'
276			}
277			};
278
279			var lineChart = new Chart(speedCanvas, {
			0 ignored issues – show Unused Code introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `lineChart` seems to be never used. Consider removing it. Loading history...
280			type: 'line',
281			hover: false,
282			data: speedData,
283			options: chartOptions
284			});
285			},
286
287			initGoogleMaps: function() {
288			var myLatlng = new google.maps.LatLng(40.748817, -73.985428);
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `google` seems to be never declared. If this is a global, consider adding a `/** global: google */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
289			var mapOptions = {
290			zoom: 13,
291			center: myLatlng,
292			scrollwheel: false, //we disable de scroll over the map, it is a really annoing when you scroll through page
293			styles: [{
294			"featureType": "water",
295			"stylers": [{
296			"saturation": 43
297			}, {
298			"lightness": -11
299			}, {
300			"hue": "#0088ff"
301			}]
302			}, {
303			"featureType": "road",
304			"elementType": "geometry.fill",
305			"stylers": [{
306			"hue": "#ff0000"
307			}, {
308			"saturation": -100
309			}, {
310			"lightness": 99
311			}]
312			}, {
313			"featureType": "road",
314			"elementType": "geometry.stroke",
315			"stylers": [{
316			"color": "#808080"
317			}, {
318			"lightness": 54
319			}]
320			}, {
321			"featureType": "landscape.man_made",
322			"elementType": "geometry.fill",
323			"stylers": [{
324			"color": "#ece2d9"
325			}]
326			}, {
327			"featureType": "poi.park",
328			"elementType": "geometry.fill",
329			"stylers": [{
330			"color": "#ccdca1"
331			}]
332			}, {
333			"featureType": "road",
334			"elementType": "labels.text.fill",
335			"stylers": [{
336			"color": "#767676"
337			}]
338			}, {
339			"featureType": "road",
340			"elementType": "labels.text.stroke",
341			"stylers": [{
342			"color": "#ffffff"
343			}]
344			}, {
345			"featureType": "poi",
346			"stylers": [{
347			"visibility": "off"
348			}]
349			}, {
350			"featureType": "landscape.natural",
351			"elementType": "geometry.fill",
352			"stylers": [{
353			"visibility": "on"
354			}, {
355			"color": "#b8cb93"
356			}]
357			}, {
358			"featureType": "poi.park",
359			"stylers": [{
360			"visibility": "on"
361			}]
362			}, {
363			"featureType": "poi.sports_complex",
364			"stylers": [{
365			"visibility": "on"
366			}]
367			}, {
368			"featureType": "poi.medical",
369			"stylers": [{
370			"visibility": "on"
371			}]
372			}, {
373			"featureType": "poi.business",
374			"stylers": [{
375			"visibility": "simplified"
376			}]
377			}]
378
379			}
380			var map = new google.maps.Map(document.getElementById("map"), mapOptions);
381
382			var marker = new google.maps.Marker({
383			position: myLatlng,
384			title: "Hello World!"
385			});
386
387			// To add the marker to the map, call setMap();
388			marker.setMap(map);
389			},
390
391			showNotification: function(from, align) {
392			color = 'primary';
			0 ignored issues – show Bug introduced 2018-06-13 23:06 UTC by Report Bug Copy Issue Report The variable `color` seems to be never declared. Assigning variables without defining them first makes them global. If this was intended, consider making it explicit like using `window.color`. Loading history...
393
394			$.notify({
395			icon: "nc-icon nc-bell-55",
396			message: "Welcome to <b>Paper Dashboard</b> - a beautiful bootstrap dashboard for every web developer."
397
398			}, {
399			type: color,
400			timer: 8000,
401			placement: {
402			from: from,
403			align: align
404			}
405			});
406			}
407
408			};

football-betting / symfony4

Push — master ( 802541...2f35f3 )

demo.initChartsPages B

Complexity

Size

Duplication

Importance

How to fix Long Method

Long Method

Duplication Side-by-Side

Filter issues like