← All changes | _inc/jetpack-modules.views.js +55 -13 13.5.2 → 16.3-a.1 View file →

		@@ -1,7 +1,7 @@
1	1	window.jetpackModules = window.jetpackModules || {};
2	2
3		-window.jetpackModules.views = ( function ( window, $, _, Backbone, wp ) {
	3	+window.jetpackModules.views = ( function ( window, $, Backbone, wp ) {
4	4	'use strict';
5	5
6	6	var views = {};
7	7
		@@ -18,10 +18,10 @@
18	18	}
19	19
20	20	var url = window.location.href.split( '?' )[ 0 ] + '?page=jetpack_modules',
21	21	m_tag = $( '.subsubsub .current' ),
22		- m_filter = $( '.button-group.filter-active .active' ),
23		- m_sort = $( '.button-group.sort .active' ),
	22	+ m_purpose = $( '.purpose-filter .current' ),
	23	+ m_availability = $( '.button-group.availability-filter .active' ),
24	24	m_search = $( '#srch-term-search-input' ).val();
25	25
26	26	if ( m_search.length ) {
27	27	url += '&s=' + encodeURIComponent( m_search );
		@@ -26,30 +26,72 @@
26	26	if ( m_search.length ) {
27	27	url += '&s=' + encodeURIComponent( m_search );
28	28	}
29	29
	30	+ // "Hide unavailable" is the default in Offline Mode, so only the opt-out
	31	+ // ("All") needs to be persisted in the URL.
	32	+ if ( 'all' === m_availability.data( 'availability' ) ) {
	33	+ url += '&offline_available=all';
	34	+ }
	35	+
30	36	if ( ! m_tag.hasClass( 'all' ) ) {
31	37	url += '&module_tag=' + encodeURIComponent( m_tag.find( 'a' ).data( 'title' ) );
32	38	}
33	39
34		- if ( m_filter.data( 'filter-by' ) ) {
35		- url +=
36		- '&' +
37		- encodeURIComponent( m_filter.data( 'filter-by' ) ) +
38		- '=' +
39		- encodeURIComponent( m_filter.data( 'filter-value' ) );
	40	+ if ( m_purpose.length && ! m_purpose.hasClass( 'all' ) ) {
	41	+ url += '&product_group=' + encodeURIComponent( m_purpose.find( 'a' ).data( 'group' ) );
40	42	}
41	43
42		- if ( 'name' !== m_sort.data( 'sort-by' ) ) {
43		- url += '&sort_by=' + encodeURIComponent( m_sort.data( 'sort-by' ) );
44		- }
	44	+ // State facet (segmented buttons). "All" carries no data-filter-by.
	45	+ $( '.button-group.module-filter .active' ).each( function () {
	46	+ var by = $( this ).data( 'filter-by' ),
	47	+ value = $( this ).data( 'filter-value' );
45	48
	49	+ if ( by ) {
	50	+ url += '&' + encodeURIComponent( by ) + '=' + encodeURIComponent( value );
	51	+ }
	52	+ } );
	53	+
46	54	window.history.replaceState( {}, '', url );
47	55	},
48	56
	57	+ /**
	58	+ * Writes faceted counts into a facet list (the tag list or the Purpose
	59	+ * list), and greys out entries that have no matches under the current
	60	+ * filters. The "All" entry always shows the total and is never disabled.
	61	+ *
	62	+ * @param {string} selector Facet list selector (e.g. '.subsubsub').
	63	+ * @param {Object} counts Map of key to count, plus `__all__`.
	64	+ * @param {string} dataKey data-* attribute on each link holding its key.
	65	+ */
	66	+ updateFacetCounts: function ( selector, counts, dataKey ) {
	67	+ $( selector + ' > li' ).each( function () {
	68	+ var $li = $( this ),
	69	+ isAll = $li.hasClass( 'all' ),
	70	+ key = $li.children( 'a' ).data( dataKey ),
	71	+ n = isAll ? counts.__all__ : counts[ key ] || 0;
	72	+
	73	+ $li.find( '.count' ).text( '(' + n + ')' );
	74	+
	75	+ if ( ! isAll ) {
	76	+ $li.toggleClass( 'is-empty', 0 === n );
	77	+ }
	78	+ } );
	79	+ },
	80	+
	81	+ /**
	82	+ * Refreshes both facet lists ("Show" tags and "Purpose") so their counts
	83	+ * reflect the currently-active filters.
	84	+ */
	85	+ updateCounts: function () {
	86	+ this.updateFacetCounts( '.subsubsub', this.model.tag_counts(), 'title' );
	87	+ this.updateFacetCounts( '.purpose-filter', this.model.purpose_counts(), 'group' );
	88	+ },
	89	+
49	90	render: function () {
50	91	this.model.filter_and_sort();
51	92	this.$el.html( this.template( this.model.attributes ) );
	93	+ this.updateCounts();
52	94	this.updateUrl();
53	95	return this;
54	96	},
55	97
		@@ -58,5 +100,5 @@
58	100	},
59	101	} );
60	102
61	103	return views;
62		-} )( window, jQuery, _, Backbone, wp );
	104	+} )( window, jQuery, Backbone, wp );