← All changes | js/media/view.js +77 -37 3.1.1 → 1.2.0 View file →

		@@ -1,9 +1,5 @@
1		-/*jshint scripturl:true*/
2		-/* global google */
3		-/* global visualizer */
4		-/* global showNotice */
5		-(function($, wpm, visualizer) {
	1	+(function($, wpm) {
6	2	var libraryWidth, libraryHeight, wpmv, wpmV, wpmvv, wpmvvl, wpmvvb, l10n;
7	3
8	4	wpmv = wpm.view;
9	5	wpmV = wpm.View;
		@@ -38,11 +34,12 @@
38	34	wpmV.apply(this, arguments);
39	35	},
40	36
41	37	render: function() {
42		- var self, model, chart;
	38	+ var self, model, chart, gv, type, series, data, table, settings, i, j, row, date;
43	39
44	40	self = this;
	41	+ gv = google.visualization;
45	42	model = self.model;
46	43
47	44	self.$el
48	45	.width(self.options.width)
		@@ -48,19 +45,70 @@
48	45	.width(self.options.width)
49	46	.height(self.options.height)
50	47	.css('background-image', 'none');
51	48
52		- chart = {};
53		- chart.type = model.get('type');
54		- chart.series = model.get('series');
55		- chart.data = model.get('data');
56		- chart.library = model.get('library');
57		- chart.settings = model.get('settings');
58		- chart.settings.width = self.options.width;
59		- chart.settings.height = self.options.height;
60		- $('#' + self.id).append(model.get('css'));
	49	+ type = model.get('type');
	50	+ series = model.get('series');
	51	+ data = model.get('data');
	52	+ settings = model.get('settings');
61	53
62		- $('body').trigger('visualizer:render:specificchart:start', {id: self.id, chart: chart, v: {page_type: 'post'}} );
	54	+ table = new gv.DataTable({cols: series});
	55	+ chart = type == 'gauge' ? 'Gauge' : type.charAt(0).toUpperCase() + type.slice(1) + 'Chart';
	56	+ chart = new gv[chart](self.el);
	57	+
	58	+ switch (type) {
	59	+ case 'pie':
	60	+ if (settings.slices) {
	61	+ for (i in settings.slices) {
	62	+ if (settings.slices[i]['color'] == '') {
	63	+ delete settings.slices[i]['color'];
	64	+ }
	65	+ }
	66	+ }
	67	+ break;
	68	+ case 'line':
	69	+ case 'bar':
	70	+ case 'column':
	71	+ case 'area':
	72	+ case 'scatter':
	73	+ case 'candlestick':
	74	+ if (settings.series) {
	75	+ for (i in settings.series) {
	76	+ if (settings.series[i]['color'] == '') {
	77	+ delete settings.series[i]['color'];
	78	+ }
	79	+ }
	80	+ }
	81	+ break;
	82	+ case 'geo':
	83	+ if (settings.region != undefined && settings.region.replace(/^\s+|\s+$/g, '') == '') {
	84	+ settings['region'] = 'world';
	85	+ }
	86	+ break;
	87	+ case 'gauge':
	88	+ break;
	89	+ default:
	90	+ return;
	91	+ }
	92	+
	93	+ for (i = 0; i < data.length; i++) {
	94	+ row = [];
	95	+ for (j = 0; j < series.length; j++) {
	96	+ if (series[j].type == 'date' || series[j].type == 'datetime') {
	97	+ date = new Date(data[i][j]);
	98	+ data[i][j] = null;
	99	+ if (Object.prototype.toString.call(date) === "[object Date]") {
	100	+ if (!isNaN(date.getTime())) {
	101	+ data[i][j] = date;
	102	+ }
	103	+ }
	104	+ }
	105	+ row.push(data[i][j]);
	106	+ }
	107	+ table.addRow(row);
	108	+ }
	109	+
	110	+ chart.draw(table, settings);
63	111	}
64	112	});
65	113
66	114	/**
		@@ -147,20 +195,8 @@
147	195	paginationView.render();
148	196	}
149	197
150	198	self.renderCollection();
151		- $('.visualizer-library-chart').css('position', 'relative')
152		- .append($(
153		- // jshint ignore:start
154		- '<div class="visualizer-chart-bg"></div>'
155		- + '<div class="visualizer-chart-insert-bg">'
156		- + '<button class="button button-primary visualizer-library-chart-insert">' + visualizer.i10n.insert + '</button>'
157		- + '</div>'
158		- // jshint ignore:end
159		- ))
160		- .on('mouseover', function(){
161		- $(this).addClass('hover');
162		- });
163	199	content.unlock();
164	200	}
165	201	}
166	202	});
		@@ -259,9 +295,9 @@
259	295	createFilters: function() {
260	296	var self = this;
261	297
262	298	self.filters = {};
263		- _.each(l10n.library.types, function(type, i) {
	299	+ _.each(['all', 'pie', 'line', 'area', 'bar', 'column', 'geo', 'scatter', 'gauge', 'candlestick'], function(type, i) {
264	300	self.filters[type] = {
265	301	text: l10n.library.filters[type],
266	302	key: type,
267	303	priority: (i + 1) * 10
		@@ -302,11 +338,15 @@
302	338
303	339	self.$el.html(_.chain(items).map(function(item) {
304	340	var content, className;
305	341
306		- content = item === '...' || item === self.options.page ? self.make('span', { class: 'visualizer-library-pagination-page' }, item) : self.make('a', { class: 'visualizer-library-pagination-page', href: 'javascript:;', 'data-page': item }, item);
	342	+ content = item == '...' || item == self.options.page
	343	+ ? self.make('span', { class: 'visualizer-library-pagination-page' }, item)
	344	+ : self.make('a', { class: 'visualizer-library-pagination-page', href: 'javascript:;', 'data-page': item }, item);
307	345
308		- className = item === self.options.page ? 'visualizer-library-pagination-item visualizer-library-pagination-active' : 'visualizer-library-pagination-item';
	346	+ className = item == self.options.page
	347	+ ? 'visualizer-library-pagination-item visualizer-library-pagination-active'
	348	+ : 'visualizer-library-pagination-item';
309	349
310	350	return self.make('li', { class: className }, content);
311	351	}).value());
312	352	},
		@@ -320,9 +360,9 @@
320	360	}
321	361	} else {
322	362	tmp = current - Math.floor( max / 2 );
323	363
324		- if ( max % 2 === 0 ) {
	364	+ if ( max % 2 == 0 ) {
325	365	tmp++;
326	366	}
327	367
328	368	if ( tmp < 1 ) {
		@@ -336,14 +376,14 @@
336	376	for ( i = 1; i <= max; i++ ) {
337	377	pagenation.push(tmp++);
338	378	}
339	379
340		- if ( pagenation[0] !== 1 ) {
	380	+ if ( pagenation[0] != 1 ) {
341	381	pagenation[0] = 1;
342	382	pagenation[1] = '...';
343	383	}
344	384
345		- if ( pagenation[max - 1] !== total ) {
	385	+ if ( pagenation[max - 1] != total ) {
346	386	pagenation[max - 1] = total;
347	387	pagenation[max - 2] = '...';
348	388	}
349	389	}
		@@ -354,9 +394,9 @@
354	394	onPageChange: function(e) {
355	395	this.controller.trigger('visualizer:library:page', $(e.target).data('page'));
356	396	}
357	397	});
358		-})(jQuery, wp.media, visualizer);
	398	+})(jQuery, wp.media);
359	399
360	400	(function($) {
361	401	$.fn.lock = function() {
362	402	$(this).each(function() {
		@@ -388,9 +428,9 @@
388	428	$this.append(locker);
389	429	});
390	430
391	431	return $(this);
392		- };
	432	+ }
393	433
394	434	$.fn.unlock = function() {
395	435	$(this).each(function() {
396	436	var $this = $(this);
		@@ -401,6 +441,6 @@
401	441	}).find('.locker').remove();
402	442	});
403	443
404	444	return $(this);
405		- };
	445	+ }
406	446	})(jQuery);