← All changes | js/media/view.js +133 -52 4.0.6 → 1.4.2 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, format, formatter, axis, property;
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,34 +45,128 @@
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.code = model.get('code');
59		- chart.settings.width = self.options.width;
60		- chart.settings.height = self.options.height;
61		- $('#' + self.id).parent().append(model.get('css'));
	49	+ type = model.get('type');
	50	+ series = model.get('series');
	51	+ data = model.get('data');
	52	+ settings = model.get('settings');
62	53
63		- if ( chart.library && 'd3' === chart.library ) {
64		- $('body').trigger('visualizer:render:chart:start', {
65		- id: self.id,
66		- charts: {
67		- [self.id]: {
68		- library: 'd3',
69		- code: chart.code,
70		- series: chart.series,
71		- data: chart.data
	54	+ settings.width = self.options.width;
	55	+ settings.height = self.options.height;
	56	+
	57	+ table = new gv.DataTable({cols: series});
	58	+ chart = type == 'gauge' ? 'Gauge' : type.charAt(0).toUpperCase() + type.slice(1) + 'Chart';
	59	+ chart = new gv[chart](self.el);
	60	+
	61	+ switch (type) {
	62	+ case 'pie':
	63	+ if (settings.slices) {
	64	+ for (i in settings.slices) {
	65	+ if (settings.slices[i]['color'] == '') {
	66	+ delete settings.slices[i]['color'];
	67	+ }
72	68	}
73	69	}
74		- });
75		- } else {
76		- $('body').trigger('visualizer:render:specificchart:start', {id: self.id, chart: chart, v: {page_type: 'post'}} );
	70	+ break;
	71	+ case 'line':
	72	+ case 'bar':
	73	+ case 'column':
	74	+ case 'area':
	75	+ case 'scatter':
	76	+ case 'candlestick':
	77	+ if (settings.series) {
	78	+ for (i in settings.series) {
	79	+ if (settings.series[i]['color'] == '') {
	80	+ delete settings.series[i]['color'];
	81	+ }
	82	+ }
	83	+ }
	84	+ break;
	85	+ case 'geo':
	86	+ if (settings.region != undefined && settings.region.replace(/^\s+|\s+$/g, '') == '') {
	87	+ settings['region'] = 'world';
	88	+ }
	89	+ break;
	90	+ case 'gauge':
	91	+ break;
	92	+ default:
	93	+ return;
77	94	}
	95	+
	96	+ if (series[0] && (series[0].type == 'date' || series[0].type == 'datetime')) {
	97	+ axis = false;
	98	+ switch (type) {
	99	+ case 'line':
	100	+ case 'area':
	101	+ case 'scatter':
	102	+ case 'candlestick':
	103	+ case 'column':
	104	+ axis = settings.hAxis;
	105	+ break;
	106	+ case 'bar':
	107	+ axis = settings.vAxis;
	108	+ break;
	109	+ }
	110	+
	111	+ if (axis) {
	112	+ for (property in axis.viewWindow) {
	113	+ date = new Date(axis.viewWindow[property]);
	114	+ if (Object.prototype.toString.call(date) === "[object Date]") {
	115	+ if (!isNaN(date.getTime())) {
	116	+ axis.viewWindow[property] = date;
	117	+ continue;
	118	+ }
	119	+ }
	120	+
	121	+ delete axis.viewWindow[property];
	122	+ }
	123	+ }
	124	+ }
	125	+
	126	+ for (i = 0; i < data.length; i++) {
	127	+ row = [];
	128	+ for (j = 0; j < series.length; j++) {
	129	+ if (series[j].type == 'date' || series[j].type == 'datetime') {
	130	+ date = new Date(data[i][j]);
	131	+ data[i][j] = null;
	132	+ if (Object.prototype.toString.call(date) === "[object Date]") {
	133	+ if (!isNaN(date.getTime())) {
	134	+ data[i][j] = date;
	135	+ }
	136	+ }
	137	+ }
	138	+ row.push(data[i][j]);
	139	+ }
	140	+ table.addRow(row);
	141	+ }
	142	+
	143	+ if (settings.series) {
	144	+ for (i = 0; i < settings.series.length; i++) {
	145	+ format = settings.series[i].format;
	146	+ if (!format || format == '') {
	147	+ continue;
	148	+ }
	149	+
	150	+ formatter = null;
	151	+ switch (series[i + 1].type) {
	152	+ case 'number':
	153	+ formatter = new gv.NumberFormat({pattern: format});
	154	+ break;
	155	+ case 'date':
	156	+ case 'datetime':
	157	+ case 'timeofday':
	158	+ formatter = new gv.DateFormat({pattern: format});
	159	+ break;
	160	+ }
	161	+
	162	+ if (formatter) {
	163	+ formatter.format(table, i + 1);
	164	+ }
	165	+ }
	166	+ }
	167	+
	168	+ chart.draw(table, settings);
78	169	}
79	170	});
80	171
81	172	/**
		@@ -162,22 +253,8 @@
162	253	paginationView.render();
163	254	}
164	255
165	256	self.renderCollection();
166		- if (self.collection.length > 0) {
167		- $('.visualizer-library-chart').css('position', 'relative')
168		- .append($(
169		- // jshint ignore:start
170		- '<div class="visualizer-chart-bg"></div>'
171		- + '<div class="visualizer-chart-insert-bg">'
172		- + '<button class="button button-primary visualizer-library-chart-insert">' + visualizer.i10n.insert + '</button>'
173		- + '</div>'
174		- // jshint ignore:end
175		- ))
176		- .on('mouseover', function(){
177		- $(this).addClass('hover');
178		- });
179		- }
180	257	content.unlock();
181	258	}
182	259	}
183	260	});
		@@ -276,9 +353,9 @@
276	353	createFilters: function() {
277	354	var self = this;
278	355
279	356	self.filters = {};
280		- _.each(l10n.library.types, function(type, i) {
	357	+ _.each(['all', 'pie', 'line', 'area', 'bar', 'column', 'geo', 'scatter', 'gauge', 'candlestick'], function(type, i) {
281	358	self.filters[type] = {
282	359	text: l10n.library.filters[type],
283	360	key: type,
284	361	priority: (i + 1) * 10
		@@ -319,11 +396,15 @@
319	396
320	397	self.$el.html(_.chain(items).map(function(item) {
321	398	var content, className;
322	399
323		- 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);
	400	+ content = item == '...' || item == self.options.page
	401	+ ? self.make('span', { class: 'visualizer-library-pagination-page' }, item)
	402	+ : self.make('a', { class: 'visualizer-library-pagination-page', href: 'javascript:;', 'data-page': item }, item);
324	403
325		- className = item === self.options.page ? 'visualizer-library-pagination-item visualizer-library-pagination-active' : 'visualizer-library-pagination-item';
	404	+ className = item == self.options.page
	405	+ ? 'visualizer-library-pagination-item visualizer-library-pagination-active'
	406	+ : 'visualizer-library-pagination-item';
326	407
327	408	return self.make('li', { class: className }, content);
328	409	}).value());
329	410	},
		@@ -337,9 +418,9 @@
337	418	}
338	419	} else {
339	420	tmp = current - Math.floor( max / 2 );
340	421
341		- if ( max % 2 === 0 ) {
	422	+ if ( max % 2 == 0 ) {
342	423	tmp++;
343	424	}
344	425
345	426	if ( tmp < 1 ) {
		@@ -353,14 +434,14 @@
353	434	for ( i = 1; i <= max; i++ ) {
354	435	pagenation.push(tmp++);
355	436	}
356	437
357		- if ( pagenation[0] !== 1 ) {
	438	+ if ( pagenation[0] != 1 ) {
358	439	pagenation[0] = 1;
359	440	pagenation[1] = '...';
360	441	}
361	442
362		- if ( pagenation[max - 1] !== total ) {
	443	+ if ( pagenation[max - 1] != total ) {
363	444	pagenation[max - 1] = total;
364	445	pagenation[max - 2] = '...';
365	446	}
366	447	}
		@@ -371,9 +452,9 @@
371	452	onPageChange: function(e) {
372	453	this.controller.trigger('visualizer:library:page', $(e.target).data('page'));
373	454	}
374	455	});
375		-})(jQuery, wp.media, visualizer);
	456	+})(jQuery, wp.media);
376	457
377	458	(function($) {
378	459	$.fn.lock = function() {
379	460	$(this).each(function() {
		@@ -405,9 +486,9 @@
405	486	$this.append(locker);
406	487	});
407	488
408	489	return $(this);
409		- };
	490	+ }
410	491
411	492	$.fn.unlock = function() {
412	493	$(this).each(function() {
413	494	var $this = $(this);
		@@ -418,6 +499,6 @@
418	499	}).find('.locker').remove();
419	500	});
420	501
421	502	return $(this);
422		- };
423		-})(jQuery);
	503	+ }
	504	+})(jQuery);