← All changes | js/frame.js +81 -150 3.10.13 → 3.3.4 View file →

		@@ -1,11 +1,9 @@
1	1	/* global prompt */
2	2	/* global visualizer */
3	3	/* global alert */
4		-/* global confirm */
5	4	/* global ajaxurl */
6	5	/* global CodeMirror */
7		-/* global vizHaveSettingsChanged */
8	6
9	7	(function ($) {
10	8	$(window).on('load', function(){
11	9	// scroll to the selected chart type.
		@@ -17,27 +15,9 @@
17	15	$(document).ready(function () {
18	16	onReady();
19	17	});
20	18
21		- function initTabs(){
22		- $( "#sidebar" ).lock();
23		- $( "#viz-tabs" ).tabs({
24		- create: function( event, ui ) {
25		- $(this).addClass('done');
26		- $( "#sidebar" ).unlock();
27		- },
28		- beforeActivate: function( event, ui ) {
29		- // if settings have changed in tab #2 and tab #1 is being activated, warn the user.
30		- if(vizHaveSettingsChanged() && ui.newTab.find( 'a' ).attr( 'id' ).includes('viz-tab-basic')){
31		- return confirm(visualizer.l10n.save_settings);
32		- }
33		- }
34		- });
35		- }
36		-
37	19	function onReady() {
38		- initTabs();
39		-
40	20	// open the correct source tab/sub-tab.
41	21	var source = $('#visualizer-chart-id').attr('data-chart-source');
42	22	$('li.viz-group.' + source).addClass('open');
43	23	$('li.viz-group.' + source + ' span.viz-section-title.' + source).addClass('open');
		@@ -73,10 +53,24 @@
73	53	$('.type-label-selected').removeClass('type-label-selected');
74	54	$(this).parent().addClass('type-label-selected');
75	55	});
76	56
	57	+ $('#vz-chart-settings h2').click(function () {
	58	+ $("#vz-chart-source").hide();
	59	+ $("#vz-chart-permissions").removeClass('open').addClass('bottom-fixed');
	60	+ $(this).parent().removeClass('bottom-fixed').addClass('open');
	61	+ $("#vz-chart-permissions .viz-group-header").hide();
	62	+ return false;
	63	+ });
	64	+ $('#vz-chart-settings .customize-section-back').click(function () {
	65	+ $("#vz-chart-source").show();
	66	+ $(this).parent().parent().removeClass('open').addClass('bottom-fixed');
	67	+
	68	+ return false;
	69	+ });
	70	+
77	71	// collapse other open sections of this group
78		- $(document).on('click', '.viz-group-title', function () {
	72	+ $('.viz-group-title').click(function () {
79	73	var parent = $(this).parent();
80	74
81	75	if (parent.hasClass('open')) {
82	76	parent.removeClass('open');
		@@ -84,21 +78,19 @@
84	78	parent.parent().find('.viz-group.open').removeClass('open');
85	79	parent.addClass('open');
86	80	}
87	81
88		- /*
89		- * if the user wants to perform an action and click that tab to change the source
90		- * and the chart is no longer showing because that particular LHS screen is showing
91		- * e.g. create parameters, import json, db query box etc.
92		- * we need to make sure we cancel the current process WITHOUT saving
93		- * and then show the chart as it was
94		- * let's close the LHS window and show the chart that is hidden
95		- */
96		- $('body').trigger('visualizer:change:action');
	82	+ // if the user wanted to perform an action
	83	+ // and the chart is no longer showing because that particular screen is showing
	84	+ // e.g. create parameters
	85	+ // and then the user decided to click on another action
	86	+ // let's invoke the show chart of the previous action so that the chart shows
	87	+ // and the user does not get confused
	88	+ $('input[type="button"][data-current!="chart"].show-chart-toggle').trigger('click');
97	89	});
98	90
99	91	// collapse other open subsections of this section
100		- $(document).on('click', '.viz-section-title', function () {
	92	+ $('.viz-section-title').click(function () {
101	93	var grandparent = $(this).parent().parent();
102	94	grandparent.find('.viz-section-title.open ~ .viz-section-items').hide();
103	95	grandparent.find('.viz-section-title.open').removeClass('open');
104	96	});
		@@ -103,12 +95,12 @@
103	95	grandparent.find('.viz-section-title.open').removeClass('open');
104	96	});
105	97
106	98	$('#view-remote-file').click(function () {
107		- var url = $(this).parent().find('#vz-schedule-url').val();
	99	+ var url = $(this).parent().find('#remote-data').val();
108	100
109	101	if (url !== '') {
110		- if (url.indexOf('localhost') !== -1 || /^([a-z]([a-z]|\d|\+|-|\.)*):(\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?((\[(|(v[\da-f]{1,}\.(([a-z]|\d|-|\.|_|~)|[!\$&'\(\)\*\+,;=]|:)+))\])|((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=])*)(:\d*)?)(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*|(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)){0})(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url)) {
	102	+ if (/^([a-z]([a-z]|\d|\+|-|\.)*):(\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?((\[(|(v[\da-f]{1,}\.(([a-z]|\d|-|\.|_|~)|[!\$&'\(\)\*\+,;=]|:)+))\])|((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=])*)(:\d*)?)(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*|(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)){0})(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url)) {
111	103	if (url.substr(url.length - 8) === '/pubhtml') {
112	104	url = url.substring(0, url.length - 8) + '/export?format=csv';
113	105	}
114	106
		@@ -127,17 +119,17 @@
127	119	$(this).parent().submit();
128	120	}
129	121	});
130	122
131		- $( window ).on( 'load', function() {
	123	+ $('#thehole').load(function () {
132	124	$('#canvas').unlock();
133		- } );
	125	+ });
134	126
135		- $(document).on('click', '.viz-section-title', function () {
	127	+ $('.viz-section-title').click(function () {
136	128	$(this).toggleClass('open').parent().find('.viz-section-items').toggle();
137	129	});
138	130
139		- $(document).on('click', '.more-info', function () {
	131	+ $('.more-info').click(function () {
140	132	$(this).parent().find('.viz-section-description:first').toggle();
141	133	return false;
142	134	});
143	135
		@@ -177,8 +169,37 @@
177	169	$('select.viz-select-library').val( $('select.viz-select-library option:not(.disabled)').val() );
178	170	}
179	171
180	172	function init_permissions(){
	173	+ $('#vz-chart-permissions h2').click(function () {
	174	+ $("#vz-chart-source").hide();
	175	+ $("#vz-chart-permissions .viz-group-header").show();
	176	+ $("#vz-chart-settings").removeClass('open').addClass('bottom-fixed');
	177	+
	178	+ $('#settings-button').click(function(e) {
	179	+ e.preventDefault();
	180	+ $('#permissions-form').submit();
	181	+ $('#settings-form').submit();
	182	+ });
	183	+
	184	+ $(this).parent().removeClass('bottom-fixed').addClass('open');
	185	+
	186	+ return false;
	187	+ });
	188	+ $('#vz-chart-permissions .customize-section-back').click(function () {
	189	+ $("#vz-chart-source").show();
	190	+
	191	+ $("#vz-chart-permissions .viz-group-header").hide();
	192	+ $('#settings-button').click(function(e) {
	193	+ e.preventDefault();
	194	+ $('#settings-form').submit();
	195	+ });
	196	+
	197	+ $(this).parent().parent().removeClass('open').addClass('bottom-fixed');
	198	+
	199	+ return false;
	200	+ });
	201	+
181	202	$('.visualizer-permission').chosen({
182	203	width : '50%',
183	204	search_contains : true
184	205	});
		@@ -256,20 +277,8 @@
256	277	// from the editor. Let's force this.
257	278	$('body').on('visualizer:db:query:update', function(event, data){
258	279	cm.save();
259	280	});
260		-
261		- // clear the editor.
262		- $('body').on('visualizer:db:query:setvalue', function(event, data){
263		- cm.setValue(data.value);
264		- cm.clearHistory();
265		- cm.refresh();
266		- });
267		-
268		- // set an option at runtime?
269		- $('body').on('visualizer:db:query:changeoption', function(event, data){
270		- cm.setOption(data.name, data.value);
271		- });
272	281	}
273	282
274	283	function init_filter_import() {
275	284	$( '#db-filter-save-button' ).on( 'click', function(){
		@@ -316,18 +325,8 @@
316	325	});
317	326	});
318	327
319	328	$( '#db-chart-button' ).on( 'click', function(){
320		-
321		- $('body').off('visualizer:change:action').on('visualizer:change:action', function(e){
322		- var filter_button = $( '#db-chart-button' );
323		- $( '#visualizer-db-query' ).css("z-index", "-1").hide();
324		- filter_button.val( filter_button.attr( 'data-t-chart' ) );
325		- filter_button.html( filter_button.attr( 'data-t-chart' ) );
326		- filter_button.attr( 'data-current', 'chart' );
327		- $( '#canvas' ).css("z-index", "1").show();
328		- });
329		-
330	329	$('#content').css('width', 'calc(100% - 300px)');
331	330	if( $(this).attr( 'data-current' ) === 'chart'){
332	331	$(this).val( $(this).attr( 'data-t-filter' ) );
333	332	$(this).html( $(this).attr( 'data-t-filter' ) );
		@@ -370,73 +369,31 @@
370	369	$('.visualizer-json-form').accordion({
371	370	heightStyle: 'content',
372	371	active: 0
373	372	});
374		- $('.visualizer-json-subform').accordion({
375		- heightStyle: 'content',
376		- active: false,
377		- collapsible: true
378		- });
379		-
380		- // open the accordions by default if they are indicated with the 'open' class.
381		- $('.visualizer-json-subform .viz-substep.open').each(function(i, e){
382		- $('.visualizer-json-subform').accordion( "option", "active", i );
383		- });
384	373
385	374	// toggle between chart and create/modify parameters
386		- $( '#json-chart-button, #woo-chart-button' ).on( 'click', function(){
387		-
388		- $('body').off('visualizer:change:action').on('visualizer:change:action', function(e){
389		- var filter_button = $( '#json-chart-button, #woo-chart-button' );
390		- $( '#visualizer-json-screen' ).css("z-index", "-1").hide();
391		- filter_button.val( filter_button.attr( 'data-t-chart' ) );
392		- filter_button.html( filter_button.attr( 'data-t-chart' ) );
393		- filter_button.attr( 'data-current', 'chart' );
394		- $( '#canvas' ).css("z-index", "1").show();
395		- $( '#vz-import-woo-report' ).find( 'select, input' ).removeAttr( 'disabled' );
396		- });
397		-
398		- if ( 'json-chart-button' === $( this ).attr( 'id' ) ) {
399		- $( '#vz-import-woo-report' ).find( 'select, input' ).attr( 'disabled', true );
400		- } else {
401		- $( '#vz-import-woo-report' ).find( 'select, input' ).removeAttr( 'disabled' );
402		- }
403		- $('#content').css('width', 'calc(100% - 100px)');
	375	+ $( '#json-chart-button' ).on( 'click', function(){
	376	+ $('#content').css('width', 'calc(100% - 300px)');
404	377	if( $(this).attr( 'data-current' ) === 'chart'){
405		- // toggle from chart to LHS form
406	378	$(this).val( $(this).attr( 'data-t-filter' ) );
407	379	$(this).html( $(this).attr( 'data-t-filter' ) );
408	380	$(this).attr( 'data-current', 'filter' );
409	381	$( '.visualizer-editor-lhs' ).hide();
410	382	$( '#visualizer-json-screen' ).css("z-index", "9999").show();
411		- if ( 'woo-chart-button' === $( this ).attr( 'id' ) && '' !== $( '#vz-woo-source:visible' ).val() ) {
412		- $( '#vz-import-json-url' ).val( visualizer.rest_base + $( '#vz-woo-source' ).val() ).attr( 'readonly', true );
413		- } else {
414		- if ( 'undefined' !== $( '#vz-import-json-url' ).attr( 'readonly' ) ) {
415		- $( '#vz-import-json-url' ).val( '' ).removeAttr( 'readonly' ).removeAttr( 'value' );
416		- $('#json-endpoint-form')[0].reset();
417		- $('.visualizer-json-form h3.viz-step:not(.step1)').addClass('ui-state-disabled');
418		- }
419		- }
420	383	$( '#canvas' ).hide();
421	384	}else{
422		- // toggle from LHS form to chart
423		- $( '#json-conclude-form' ).trigger('submit');
	385	+ var filter_button = $(this);
	386	+ $( '#visualizer-json-screen' ).css("z-index", "-1").hide();
	387	+ $('#canvas').lock();
	388	+ filter_button.val( filter_button.attr( 'data-t-chart' ) );
	389	+ filter_button.html( filter_button.attr( 'data-t-chart' ) );
	390	+ filter_button.attr( 'data-current', 'chart' );
	391	+ $( '#canvas' ).css("z-index", "1").show();
	392	+ $('#canvas').unlock();
424	393	}
425	394	} );
426	395
427		- $('body').on('visualizer:json:form:submit', function() {
428		- var filter_button = $( '#json-chart-button, #woo-chart-button' );
429		- $( '#visualizer-json-screen' ).css("z-index", "-1").hide();
430		- $('#canvas').lock();
431		- filter_button.val( filter_button.attr( 'data-t-chart' ) );
432		- filter_button.html( filter_button.attr( 'data-t-chart' ) );
433		- filter_button.attr( 'data-current', 'chart' );
434		- end_ajax( $( '#visualizer-json-screen' ) );
435		- $( '#canvas' ).removeClass('visualizer-chart-loaded').css("z-index", "1").show();
436		- });
437		-
438		-
439	396	// fetch the roots for the provided endpoint
440	397	$( '#visualizer-json-fetch' ).on( 'click', function(e){
441	398	e.preventDefault();
442	399	$('.visualizer-json-form').accordion( 'option', 'active', 0 );
		@@ -452,8 +409,9 @@
452	409	'params' : $('#json-endpoint-form').serialize()
453	410	},
454	411	success : function(data){
455	412	if(data.success){
	413	+ $('#json-root-form [name="url"]').val(data.data.url);
456	414	$('#vz-import-json-root').empty();
457	415	$.each(data.data.roots, function(i, name){
458	416	$('#vz-import-json-root').append('<option value="' + name + '">' + name.replace(regex, visualizer.json_tag_separator_view) + '</option>');
459	417	});
		@@ -480,9 +438,9 @@
480	438	method : 'post',
481	439	data : {
482	440	'action' : visualizer.ajax['actions']['json_get_data'],
483	441	'security' : visualizer.ajax['nonces']['json_get_data'],
484		- 'params' : $('#json-root-form, #json-endpoint-form').serialize()
	442	+ 'params' : $('#json-root-form').serialize()
485	443	},
486	444	success : function(data){
487	445	if(data.success){
488	446	$('#vz-import-json-paging option:not(.static)').remove();
		@@ -494,8 +452,10 @@
494	452	$('#vz-import-json-paging').append('<option value="' + name + '">' + display + '</option>');
495	453	});
496	454	$('.json-pagination').show();
497	455	}
	456	+ $('#json-conclude-form [name="url"]').val(data.data.url);
	457	+ $('#json-conclude-form [name="root"]').val(data.data.root);
498	458	$('#json-conclude-form .json-table').html(data.data.table);
499	459
500	460	var $table = create_editor_table( '#json-conclude-form' );
501	461
		@@ -513,33 +473,20 @@
513	473	});
514	474
515	475	// when the data is set and the chart is updated, toggle the screen so that the chart is shown
516	476	$('#json-conclude-form').on( 'submit', function(e){
517		- // at least one column has to be selected as non-excluded.
518		- var count_selected = 0;
519		- $('select.viz-select-data-type').each(function(i, element){
520		- if($(element).prop('selectedIndex') > 0){
521		- count_selected++;
522		- }
523		- });
524		- if(count_selected === 0){
525		- alert(visualizer.l10n.select_columns);
526		- return false;
527		- }
528		-
529		- // populate the form elements that are in the other tabs.
530		- $('#json-conclude-form-helper .json-form-element, #json-endpoint-form .json-form-element, #json-root-form .json-form-element, #vz-import-json .json-form-element, #vz-import-woo-report .json-form-element:not(:disabled)').each(function(x, y){
	477	+ // populate the form elements that are in the misc tab.
	478	+ $('#json-conclude-form-helper .json-form-element').each(function(x, y){
531	479	$('#json-conclude-form').append('<input type="hidden" name="' + y.name + '" value="' + y.value + '">');
532	480	});
533		-
534		- $('body').trigger('visualizer:json:form:submit');
	481	+ $( '#json-chart-button' ).trigger('click');
	482	+ $('#canvas').lock();
535	483	});
536	484
537	485	// update the schedule
538		- $('#json-chart-save-button, #woo-chart-save-button').on('click', function(e){
	486	+ $('#json-chart-save-button').on('click', function(e){
539	487	e.preventDefault();
540	488	$('#canvas').lock();
541		- var btnID = jQuery( this ).attr( 'id' );
542	489	$.ajax({
543	490	url : ajaxurl,
544	491	method : 'post',
545	492	data : {
		@@ -544,11 +491,10 @@
544	491	method : 'post',
545	492	data : {
546	493	'action' : visualizer.ajax['actions']['json_set_schedule'],
547	494	'security' : visualizer.ajax['nonces']['json_set_schedule'],
548		- 'chart' : $('#vz-json-time, #vz-woo-time').attr('data-chart'),
549		- 'time' : $('#vz-json-time, #vz-woo-time').val(),
550		- 'is_woocommerce_report': 'woo-chart-save-button' === btnID,
	495	+ 'chart' : $('#vz-json-time').attr('data-chart'),
	496	+ 'time' : $('#vz-json-time').val()
551	497	},
552	498	success : function(data){
553	499	// do nothing.
554	500	},
		@@ -557,25 +503,13 @@
557	503	}
558	504	});
559	505	});
560	506
561		- // Select WooCommerce report endpoint.
562		- $( '#vz-woo-source' ).on( 'click', function( e ) {
563		- // Trigger change action.
564		- $( 'body' ).trigger( 'visualizer:change:action' );
565		-
566		- if ( '' !== $( this ).val() ) {
567		- $( '#woo-chart-button, #woo-chart-save-button' ).removeAttr( 'disabled' );
568		- } else {
569		- $( '#woo-chart-button, #woo-chart-save-button' ).attr( 'disabled', true );
570		- }
571		- } );
572		-
573	507	}
574	508
575	509	function init_editor_table() {
576	510	$('body').on('visualizer:db:editor:table:init', function(event, data){
577		- var $table = create_editor_table('.viz-table-editor', data.config);
	511	+ var $table = create_editor_table('.viz-table-editor');
578	512	$('body').on('visualizer:db:editor:table:redraw', function(event, data){
579	513	$table.draw();
580	514	});
581	515	});
		@@ -580,9 +514,9 @@
580	514	});
581	515	});
582	516	}
583	517
584		- function create_editor_table(element, config) {
	518	+ function create_editor_table(element) {
585	519	var settings = {
586	520	paging: false,
587	521	searching: false,
588	522	ordering: false,
		@@ -606,11 +540,8 @@
606	540	collectionLayout: 'four-column'
607	541	}
608	542	]
609	543	} );
610		- }
611		- if(config){
612		- $.extend( settings, config );
613	544	}
614	545
615	546	var $table = $(element + ' .viz-editor-table').DataTable(settings);
616	547	return $table;