summaryrefslogtreecommitdiff
blob: 8ba288dc66b324b65f86a601cb108b5681d9bc4d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
( function( window, $, items, models, views, i18n, modalinfo, nonces ) {
	'use strict';

	var modules, list_table, handle_module_tag_click, $the_table, $the_filters, $the_search, $jp_frame, $bulk_button, show_modal, hide_modal, set_modal_tab, originPoint;

	$the_table   = $( '.wp-list-table.jetpack-modules' );
	$the_filters = $( '.navbar-form' );
	$the_search  = $( '#srch-term-search-input' );
	$jp_frame    = $( '.jp-frame' );
	$bulk_button = $( '#doaction' );

	modules = new models.Modules( {
		items : items
	} );

	list_table = new views.List_Table( {
		el    : '#the-list',
		model : modules
	} );

	// Kick off an initial redraw.
	modules.trigger( 'change' );

	// Handle the filtering of modules.
	handle_module_tag_click = function( event ) {
		// Switch the item in the subsubsub list that's flagged as current.
		$( '.subsubsub' ).find( 'a[data-title="' + $(this).data('title') + '"]' ).addClass( 'current' )
			.closest( 'li' ).siblings().find( 'a.current' ).removeClass( 'current' );

		event.preventDefault();
		modules.trigger( 'change' );
	};

	$( '.subsubsub a' ).on( 'click', { modules : modules }, handle_module_tag_click );

	/**
	 * Attach event listener for ESC key to close modal
	 */

	$( window ).on( 'keydown', function( e ) {
		// If pressing ESC close the modal
		if ( 27 === e.keyCode ) {
			hide_modal();
		}
	});

	/**
	 * The modal details.
	 */

	show_modal = function( module ) {
		$jp_frame.children( '.modal, .shade' ).show();
		$( '.modal ').empty().html( wp.template( 'modal' )( items[ module ] ) );
		$( '.modal' )[0].setAttribute( 'tabindex', '0' );
		$( '.modal' ).focus();
		$( 'body' ).css( 'overflow', 'hidden' );
	};

	/**
	 * If modalinfo is defined, auto popup the modal
	 */
	$( document ).ready(function() {
		if ( modalinfo ) {
			show_modal( modalinfo );
		}
	});

	hide_modal = function() {
		$jp_frame.children( '.modal, .shade' ).hide();
		$jp_frame.children( '.modal' ).data( 'current-module', '' );
		set_modal_tab( null );
		originPoint.focus();
		$( '.modal' )[0].removeAttribute( 'tabindex' );
		$( 'body' ).css( 'overflow', 'auto' );
		event.preventDefault();
	};

	set_modal_tab = function( tab ) {
		$jp_frame.find( '.modal .active' ).removeClass( 'active' );
		switch ( tab ) {
			case 'learn-more':
				$jp_frame.find( '.modal .learn-more a' ).addClass( 'active' );
				$jp_frame.children( '.modal' ).trigger( 'learn-more' );
				break;
			case 'config':
				$jp_frame.find( '.modal .config a' ).addClass( 'active' );
				$jp_frame.children( '.modal' ).trigger( 'config' );
				break;
			default:
				break;
		}
	};

	$jp_frame.on( 'click', '.modal .close, .shade', hide_modal );

	$jp_frame.children( '.modal' ).on( 'learn-more', function() {
		var current_module = $jp_frame.children( '.modal' ).data( 'current-module' );
		$(this).find('.content').html( items[ current_module ].long_description );
	} );

	$jp_frame.children( '.modal' ).on( 'config', function() {
		var current_module = $jp_frame.children( '.modal' ).data( 'current-module' );
		// Hack.  Until we import the form to the modal, just redirect to where it would have gone.
		hide_modal();
		window.location.href = items[ current_module ].configure_url;
		// $(this).find('.content').html( items[ current_module ].configure_form );
	} );

	$the_table.on( 'click', '.info a', { modules : modules }, function( event ) {
		event.preventDefault();
		originPoint = this;
		show_modal( $(this).closest('.jetpack-module').attr('id'), 'learn-more' );
	} );

	$the_filters.on( 'click', '.button-group .button', { modules : modules }, function( event ) {
		event.preventDefault();
		$(this).addClass('active').siblings('.active').removeClass('active');
		modules.trigger( 'change' );
	} );

	$the_search.on( 'keyup search', function( e ) {
		// Don't trigger change on tab, since it's only used for accessibility
		// anyway, and will remove all checked boxes
		if ( e.keyCode !== 9 ) {
			modules.trigger( 'change' );
		}
	} );

	$the_search.prop( 'placeholder', i18n.search_placeholder );

	$bulk_button.on( 'click', function( event ) {
		var selectedModules = $('.jetpack-modules-list-table-form').serialize(),
			selectedAction = $(this).siblings('select').val(),
			url;

		if ( selectedModules.length && '-1' !== selectedAction ) {
			url = 'admin.php?page=jetpack&action=' + encodeURIComponent( selectedAction );
			url += '&' + selectedModules;
			url += '&_wpnonce=' + encodeURIComponent( nonces.bulk );

			window.location.href = url;
		} else {
			// Possibly add in an alert here explaining why nothing's happening?
		}

		event.preventDefault();
	} );

} ) ( this, jQuery, window.jetpackModulesData.modules, this.jetpackModules.models, this.jetpackModules.views, window.jetpackModulesData.i18n, window.jetpackModulesData.modalinfo, window.jetpackModulesData.nonces );