← All changes | assets/js/stockpack.js +137 -130 2.5.7 → 3.7.2 View file →

		@@ -2,158 +2,165 @@
2	2	import StockpackImages from './models/stockpack-images-model';
3	3	import StockpackSelection from './models/stockpack-selection-model';
4	4	import './stockpack-helpers';
5	5
6		-const oldMediaFrame = wp.media.view.MediaFrame.Post;
7		-const oldMediaFrameSelect = wp.media.view.MediaFrame.Select;
8		-window.StockpackQueue = new StockpackImages( [], { query: false } );
9		-window.StockpackQueueErrors = new Backbone.Collection();
	6	+const Stockpack = {
	7	+ init: () => {
	8	+ const oldMediaFrame = wp.media.view.MediaFrame.Post;
10	9
11		-// Extending the current media library frame to add a new tab
12		-wp.media.view.MediaFrame.Post = oldMediaFrame.extend( {
	10	+ const oldMediaFrameSelect = wp.media.view.MediaFrame.Select;
	11	+ window.StockpackQueue = new StockpackImages( [], { query: false } );
	12	+ window.StockpackQueueErrors = new Backbone.Collection();
13	13
14		- /**
15		- * overwrite router to
16		- *
17		- * @param {wp.media.view.Router} routerView
18		- */
19		- browseRouter( routerView ) {
20		- oldMediaFrame.prototype.browseRouter.apply( this, arguments );
21		- routerView.set( {
22		- stockpack: {
23		- text: wp.media.view.l10n.stockpack.title,
24		- priority: 60,
	14	+
	15	+ // Extending the current media library frame to add a new tab
	16	+ wp.media.view.MediaFrame.Post = oldMediaFrame.extend( {
	17	+
	18	+ /**
	19	+ * overwrite router to
	20	+ *
	21	+ * @param {wp.media.view.Router} routerView
	22	+ */
	23	+ browseRouter( routerView ) {
	24	+ oldMediaFrame.prototype.browseRouter.apply( this, arguments );
	25	+ routerView.set( {
	26	+ stockpack: {
	27	+ text: wp.media.view.l10n.stockpack.title,
	28	+ priority: 60,
	29	+ },
	30	+ } );
25	31	},
26		- } );
27		- },
28	32
29		- /**
30		- * Bind region mode event callbacks.
31		- *
32		- * @see media.controller.Region.render
33		- */
34		- bindHandlers() {
35		- oldMediaFrame.prototype.bindHandlers.apply( this, arguments );
36		- this.on( 'content:create:stockpack', this.stockpackContent, this );
37		- },
	33	+ /**
	34	+ * Bind region mode event callbacks.
	35	+ *
	36	+ * @see media.controller.Region.render
	37	+ */
	38	+ bindHandlers() {
	39	+ oldMediaFrame.prototype.bindHandlers.apply( this, arguments );
	40	+ this.on( 'content:create:stockpack', this.stockpackContent, this );
	41	+ },
38	42
39		- /**
40		- * Render callback for the content region in the `browse` mode.
41		- *
42		- * @param {wp.media.controller.Region} contentRegion
43		- */
44		- stockpackContent( contentRegion ) {
45		- const state = this.state();
46		- if ( ! state.get( 'stockpack-images' ) ) {
47		- state.set( 'stockpack-images', window.getStockpackQuery() );
48		- // Watch for downloaded images.
49		- state.get( 'library' ).observe( window.StockpackQueue );
50		- }
	43	+ /**
	44	+ * Render callback for the content region in the `browse` mode.
	45	+ *
	46	+ * @param {wp.media.controller.Region} contentRegion
	47	+ */
	48	+ stockpackContent( contentRegion ) {
	49	+ const state = this.state();
	50	+ if ( ! state.get( 'stockpack-images' ) ) {
	51	+ state.set( 'stockpack-images', window.getStockpackQuery() );
	52	+ // Watch for downloaded images.
	53	+ state.get( 'library' ).observe( window.StockpackQueue );
	54	+ }
51	55
52		- if ( ! state.get( 'stockpack-selection' ) ) {
53		- let props;
54		- props = state.get( 'stockpack-images' ).props.toJSON();
55		- props = _.omit( props, 'orderby', 'query' );
	56	+ if ( ! state.get( 'stockpack-selection' ) ) {
	57	+ let props;
	58	+ props = state.get( 'stockpack-images' ).props.toJSON();
	59	+ props = _.omit( props, 'orderby', 'query' );
56	60
57		- state.set( 'stockpack-selection', new StockpackSelection( null, {
58		- multiple: false,
59		- props,
60		- } ) );
61		- }
	61	+ state.set( 'stockpack-selection', new StockpackSelection( null, {
	62	+ multiple: false,
	63	+ props,
	64	+ } ) );
	65	+ }
62	66
63		- this.$el.removeClass( 'hide-toolbar' );
	67	+ this.$el.removeClass( 'hide-toolbar' );
64	68
65		- // Browse our library of attachments.
66		- contentRegion.view = new StockpackBrowser( {
67		- collection: state.get( 'stockpack-images' ),
68		- selection: state.get( 'stockpack-selection' ),
69		- controller: this,
70		- model: state,
71		- idealColumnWidth: state.get( 'idealColumnWidth' ),
72		- suggestedWidth: state.get( 'suggestedWidth' ),
73		- suggestedHeight: state.get( 'suggestedHeight' ),
74		- } );
75		- },
	69	+ // Browse our library of attachments.
	70	+ contentRegion.view = new StockpackBrowser( {
	71	+ collection: state.get( 'stockpack-images' ),
	72	+ selection: state.get( 'stockpack-selection' ),
	73	+ controller: this,
	74	+ model: state,
	75	+ idealColumnWidth: state.get( 'idealColumnWidth' ),
	76	+ suggestedWidth: state.get( 'suggestedWidth' ),
	77	+ suggestedHeight: state.get( 'suggestedHeight' ),
	78	+ } );
	79	+ },
76	80
77		- getFrame( id ) {
78		- return this.states.findWhere( { id } );
79		- },
	81	+ getFrame( id ) {
	82	+ return this.states.findWhere( { id } );
	83	+ },
80	84
81		-} );
	85	+ } );
82	86
83		-// Order is important, post is based on the old select
84		-wp.media.view.MediaFrame.Select = oldMediaFrameSelect.extend( {
	87	+ // Order is important, post is based on the old select
	88	+ wp.media.view.MediaFrame.Select = oldMediaFrameSelect.extend( {
85	89
86		- /**
87		- * overwrite router to
88		- *
89		- * @param {wp.media.view.Router} routerView
90		- */
91		- browseRouter( routerView ) {
92		- oldMediaFrameSelect.prototype.browseRouter.apply( this, arguments );
93		- routerView.set( {
94		- stockpack: {
95		- text: wp.media.view.l10n.stockpack.title,
96		- priority: 60,
	90	+ /**
	91	+ * overwrite router to
	92	+ *
	93	+ * @param {wp.media.view.Router} routerView
	94	+ */
	95	+ browseRouter( routerView ) {
	96	+ oldMediaFrameSelect.prototype.browseRouter.apply( this, arguments );
	97	+ routerView.set( {
	98	+ stockpack: {
	99	+ text: wp.media.view.l10n.stockpack.title,
	100	+ priority: 60,
	101	+ },
	102	+ } );
97	103	},
98		- } );
99		- },
100	104
101		- /**
102		- * Bind region mode event callbacks.
103		- *
104		- * @see media.controller.Region.render
105		- */
106		- bindHandlers() {
107		- oldMediaFrameSelect.prototype.bindHandlers.apply( this, arguments );
108		- this.on( 'content:create:stockpack', this.stockpackContent, this );
109		- },
	105	+ /**
	106	+ * Bind region mode event callbacks.
	107	+ *
	108	+ * @see media.controller.Region.render
	109	+ */
	110	+ bindHandlers() {
	111	+ oldMediaFrameSelect.prototype.bindHandlers.apply( this, arguments );
	112	+ this.on( 'content:create:stockpack', this.stockpackContent, this );
	113	+ },
110	114
111		- /**
112		- * Render callback for the content region in the `browse` mode.
113		- *
114		- * @param {wp.media.controller.Region} contentRegion
115		- */
116		- stockpackContent( contentRegion ) {
117		- const state = this.state();
118		- if ( ! state.get( 'stockpack-images' ) ) {
119		- state.set( 'stockpack-images', window.getStockpackQuery() );
120		- // Watch for downloaded images.
121		- state.get( 'library' ).observe( window.StockpackQueue );
122		- }
	115	+ /**
	116	+ * Render callback for the content region in the `browse` mode.
	117	+ *
	118	+ * @param {wp.media.controller.Region} contentRegion
	119	+ */
	120	+ stockpackContent( contentRegion ) {
	121	+ const state = this.state();
	122	+ if ( ! state.get( 'stockpack-images' ) ) {
	123	+ state.set( 'stockpack-images', window.getStockpackQuery() );
	124	+ // Watch for downloaded images.
	125	+ state.get( 'library' ).observe( window.StockpackQueue );
	126	+ }
123	127
124		- if ( ! state.get( 'stockpack-selection' ) ) {
125		- let props;
126		- props = state.get( 'stockpack-images' ).props.toJSON();
127		- props = _.omit( props, 'orderby', 'query' );
	128	+ if ( ! state.get( 'stockpack-selection' ) ) {
	129	+ let props;
	130	+ props = state.get( 'stockpack-images' ).props.toJSON();
	131	+ props = _.omit( props, 'orderby', 'query' );
128	132
129		- state.set( 'stockpack-selection', new StockpackSelection( null, {
130		- multiple: false,
131		- props,
132		- } ) );
133		- }
	133	+ state.set( 'stockpack-selection', new StockpackSelection( null, {
	134	+ multiple: false,
	135	+ props,
	136	+ } ) );
	137	+ }
134	138
135		- if ( ! state.get( 'provider' ) ) {
136		- state.set( 'provider', '' );
137		- }
	139	+ if ( ! state.get( 'provider' ) ) {
	140	+ state.set( 'provider', '' );
	141	+ }
138	142
139		- this.$el.removeClass( 'hide-toolbar' );
	143	+ this.$el.removeClass( 'hide-toolbar' );
140	144
141		- // Browse our library of attachments.
142		- contentRegion.view = new StockpackBrowser( {
143		- collection: state.get( 'stockpack-images' ),
144		- selection: state.get( 'stockpack-selection' ),
145		- controller: this,
146		- model: state,
147		- idealColumnWidth: state.get( 'idealColumnWidth' ),
148		- suggestedWidth: state.get( 'suggestedWidth' ),
149		- suggestedHeight: state.get( 'suggestedHeight' ),
150		- provider: state.get( 'provider' ),
151		- } );
152		- },
	145	+ // Browse our library of attachments.
	146	+ contentRegion.view = new StockpackBrowser( {
	147	+ collection: state.get( 'stockpack-images' ),
	148	+ selection: state.get( 'stockpack-selection' ),
	149	+ controller: this,
	150	+ model: state,
	151	+ idealColumnWidth: state.get( 'idealColumnWidth' ),
	152	+ suggestedWidth: state.get( 'suggestedWidth' ),
	153	+ suggestedHeight: state.get( 'suggestedHeight' ),
	154	+ provider: state.get( 'provider' ),
	155	+ } );
	156	+ },
153	157
154		- getFrame( id ) {
155		- return this.states.findWhere( { id } );
156		- },
	158	+ getFrame( id ) {
	159	+ return this.states.findWhere( { id } );
	160	+ },
157	161
158		-} );
	162	+ } );
	163	+ }
	164	+}
159	165
	166	+export default Stockpack;