← All changes | assets/js/admin.js +80 -156 1.4 → trunk View file →

		@@ -1,168 +1,92 @@
1		-jQuery(function($){
2		- /*
3		- * Create a new Imagify account
4		- */
5		- $('#imagify-signup').click( function(e){
6		- e.preventDefault();
	1	+window.imagify = window.imagify || {};
7	2
8		- // Display the sign up form
9		- swal({
10		- title: imagify.signupTitle,
11		- text: imagify.signupText,
12		- confirmButtonText: imagify.signupConfirmButtonText,
13		- type: "input",
14		- closeOnConfirm: false,
15		- allowOutsideClick: true,
16		- showLoaderOnConfirm: true,
17		- customClass: "imagify-sweet-alert imagify-sweet-alert-signup"
18		- },
19		- function(inputValue){
20		- if ($.trim(inputValue) == "" || ! inputValue) {
21		- swal.showInputError(imagify.signupErrorEmptyEmail);
22		- return false;
23		- }
24		-
25		- $.get(ajaxurl + "?action=imagify_signup&email=" +inputValue + "&imagifysignupnonce="+ $('#imagifysignupnonce').val())
26		- .done(function(response){
27		- if( !response.success ) {
28		- swal.showInputError(response.data);
29		- } else {
30		- swal({
31		- title:imagify.signupSuccessTitle,
32		- text: imagify.signupSuccessText,
33		- type: "success",
34		- customClass: "imagify-sweet-alert"
35		- });
36		- }
37		- });
38		- });
39		- });
40		-
41		- /*
42		- * Check and save the Imagify API Key
43		- */
44		- $('#imagify-save-api-key').click( function(e){
45		- e.preventDefault();
	3	+jQuery.extend( window.imagify, {
	4	+ concat: ajaxurl.indexOf( '?' ) > 0 ? '&' : '?',
	5	+ log: function( content ) {
	6	+ if ( undefined !== console ) {
	7	+ console.log( content ); // eslint-disable-line no-console
	8	+ }
	9	+ },
	10	+ info: function( content ) {
	11	+ if ( undefined !== console ) {
	12	+ console.info( content ); // eslint-disable-line no-console
	13	+ }
	14	+ },
	15	+ openModal: function( $link ) {
	16	+ var target = $link.data( 'target' ) || $link.attr( 'href' ),
	17	+ $target = jQuery( target );
46	18
47		- // Display the sign up form
48		- swal({
49		- title: imagify.saveApiKeyTitle,
50		- text: imagify.saveApiKeyText,
51		- confirmButtonText: imagify.saveApiKeyConfirmButtonText,
52		- type: "input",
53		- closeOnConfirm: false,
54		- allowOutsideClick: true,
55		- showLoaderOnConfirm: true,
56		- customClass: "imagify-sweet-alert imagify-sweet-alert-signup"
57		- },
58		- function(inputValue){
59		- if ($.trim(inputValue) == "" || ! inputValue) {
60		- swal.showInputError(imagify.signupErrorEmptyEmail);
61		- return false;
62		- }
63		-
64		- $.get(ajaxurl + "?action=imagify_check_api_key_validity&api_key=" +inputValue + "&imagifycheckapikeynonce="+ $('#imagifycheckapikeynonce').val())
65		- .done(function(response){
66		- if( !response.success ) {
67		- swal.showInputError(response.data);
68		- } else {
69		- swal({
70		- title:imagify.ApiKeyCheckSuccessTitle,
71		- text: imagify.ApiKeyCheckSuccessText,
72		- type: "success",
73		- customClass: "imagify-sweet-alert"
74		- });
75		- }
76		- });
77		- });
78		- });
79		-
80		- /*
81		- * Toggle an Imagify notice
82		- */
83		- $('.imagify-notice-dismiss').click( function( e ) {
84		- e.preventDefault();
85		-
86		- var obj = $(this),
87		- parent = obj.parents('.imagify-welcome, .imagify-notice'),
88		- href = obj.attr('href');
89		-
90		- // Hide the notice
91		- parent.fadeTo( 100 , 0, function() {
92		- $(this).slideUp( 100, function() {
93		- $(this).remove();
94		- });
95		- });
96		-
97		- // Save the dismiss notice
98		- $.get( href.replace( 'admin-post.php', 'admin-ajax.php' ) );
99		- });
	19	+ $target.css( 'display', 'flex' ).hide().fadeIn( 400 ).attr( {
	20	+ 'aria-hidden': 'false',
	21	+ 'tabindex': '0'
	22	+ } ).trigger('focus').removeAttr( 'tabindex' ).addClass( 'modal-is-open' );
100	23
	24	+ jQuery( 'body' ).addClass( 'imagify-modal-is-open' );
	25	+ },
	26	+ template: function( id ) {
	27	+ if ( undefined === _ ) {
	28	+ // No need to load underscore everywhere if we don't use it.
	29	+ return '';
	30	+ }
101	31
102		- /*
103		- * Imagify Light modal
104		- */
105		-
106		- if ( $('.imagify-modal-trigger').length > 0 ) {
107		-
108		- // accessibility
109		- $('.imagify-modal').attr('aria-hidden', 'true');
	32	+ return _.memoize( function( data ) {
	33	+ var compiled,
	34	+ options = {
	35	+ evaluate: /<#([\s\S]+?)#>/g,
	36	+ interpolate: /\{\{\{([\s\S]+?)\}\}\}/g,
	37	+ escape: /\{\{([^}]+?)\}\}(?!\})/g,
	38	+ variable: 'data'
	39	+ };
110	40
111		- // on click on modal trigger
112		- $('.imagify-modal-trigger').on('click', function(){
113		- var the_target = $(this).attr('href') || $(this).data('target');
	41	+ return function() {
	42	+ compiled = compiled || _.template( jQuery( '#tmpl-' + id ).html(), null, options );
	43	+ data = data || {};
	44	+ return compiled( data );
	45	+ };
	46	+ } );
	47	+ }
	48	+} );
114	49
115		- $( the_target ).css('display', 'flex').hide().fadeIn(400).attr('aria-hidden', 'false').attr('tabindex', '0').focus().removeAttr('tabindex').addClass('modal-is-open');
116		- $('body').addClass('imagify-modal-is-open');
117	50
118		- return false;
119		- });
	51	+// Imagify light modal =============================================================================
	52	+(function($, d, w, undefined) { // eslint-disable-line no-unused-vars, no-shadow, no-shadow-restricted-names
120	53
121		- // on click on close button
122		- $('.imagify-modal').find('.close-btn').on('click', function(){
123		- $(this).closest('.imagify-modal').fadeOut(400).attr('aria-hidden', 'true').removeClass('modal-is-open');
124		- $('body').removeClass('imagify-modal-is-open');
125		- })
126		- .on('blur', function(){
127		- var $modal = $(this).closest('.imagify-modal');
128		- if ( $modal.attr('aria-hidden') === 'false' ) {
129		- $modal.attr('tabindex', '0').focus().removeAttr('tabindex');
130		- }
131		- });
	54	+ // Accessibility.
	55	+ $( '.imagify-modal' ).attr( 'aria-hidden', 'true' );
132	56
133		- // `Esc` key binding
134		- $(window).on('keydown', function(e){
135		- if ( e.keyCode == 27 && $('.imagify-modal.modal-is-open').length > 0 ) {
	57	+ $( d )
	58	+ // On click on modal trigger, open modal.
	59	+ .on( 'click.imagify', '.imagify-modal-trigger', function( e ) {
	60	+ e.preventDefault();
	61	+ w.imagify.openModal( $( this ) );
	62	+ } )
	63	+ // On click on close button, close modal.
	64	+ .on( 'click.imagify', '.imagify-modal .close-btn', function() {
	65	+ var $modal = $( this ).closest( '.imagify-modal' );
136	66
	67	+ $modal.fadeOut( 400 ).attr( 'aria-hidden', 'true' ).removeClass( 'modal-is-open' ).trigger( 'modalClosed.imagify' );
	68	+
	69	+ $( 'body' ).removeClass( 'imagify-modal-is-open' );
	70	+ } )
	71	+ // On close button blur, improve accessibility.
	72	+ .on( 'blur.imagify', '.imagify-modal .close-btn', function() {
	73	+ var $modal = $( this ).closest( '.imagify-modal' );
	74	+
	75	+ if ( $modal.attr( 'aria-hidden' ) === 'false' ) {
	76	+ $modal.attr( 'tabindex', '0' ).trigger('focus').removeAttr( 'tabindex' );
	77	+ }
	78	+ } )
	79	+ // On click on dropped layer of modal, close modal.
	80	+ .on( 'click.imagify', '.imagify-modal', function( e ) {
	81	+ $( e.target ).filter( '.modal-is-open' ).find( '.close-btn' ).trigger( 'click.imagify' );
	82	+ } )
	83	+ // `Esc` key binding, close modal.
	84	+ .on( 'keydown.imagify', function( e ) {
	85	+ if ( 27 === e.keyCode && $( '.imagify-modal.modal-is-open' ).length > 0 ) {
137	86	e.preventDefault();
138		-
139		- // trigger the event
140		- $('.imagify-modal.modal-is-open').find('.close-btn').trigger('click');
	87	+ // Trigger the event.
	88	+ $( '.imagify-modal.modal-is-open' ).find( '.close-btn' ).trigger( 'click.imagify' );
	89	+ }
	90	+ } );
141	91
142		- return false;
143		- }
144		- });
145		- }
146		-
147		- var busy = false,
148		- xhr = false;
149		-
150		- $('#wp-admin-bar-imagify').hover( function() {
151		- if ( true === busy ) {
152		- xhr.abort();
153		- }
154		-
155		- busy = true;
156		-
157		- var $adminBarProfile = $('#wp-admin-bar-imagify-profile-content');
158		-
159		- if( $adminBarProfile.is(':empty') ) {
160		- xhr = $.get(ajaxurl + "?action=imagify_get_admin_bar_profile&imagifygetadminbarprofilenonce="+ $('#imagifygetadminbarprofilenonce').val())
161		- .done(function(response){
162		- $adminBarProfile.html(response.data);
163		- $('#wp-admin-bar-imagify-profile-loading').remove();
164		- busy = false;
165		- });
166		- }
167		- });
168		-});
	92	+} )(jQuery, document, window);