PluginProbe ʕ •ᴥ•ʔ
Menu Icons by Themeisle – Add Icons to Navigation Menus / 0.12.4
Menu Icons by Themeisle – Add Icons to Navigation Menus v0.12.4
trunk 0.1.0 0.1.1 0.1.2 0.1.3 0.1.4 0.1.5 0.10.0 0.10.1 0.10.2 0.11.0 0.11.1 0.11.2 0.11.3 0.11.4 0.11.5 0.12.0 0.12.1 0.12.10 0.12.11 0.12.12 0.12.2 0.12.3 0.12.4 0.12.5 0.12.6 0.12.7 0.12.8 0.12.9 0.13.0 0.13.1 0.13.10 0.13.11 0.13.12 0.13.13 0.13.14 0.13.15 0.13.16 0.13.17 0.13.18 0.13.19 0.13.2 0.13.20 0.13.21 0.13.22 0.13.23 0.13.3 0.13.4 0.13.5 0.13.6 0.13.7 0.13.8 0.13.9 0.2.0 0.2.1 0.2.2 0.2.3 0.3.0 0.3.1 0.3.2 0.4.0 0.5.0 0.5.1 0.6.0 0.7.0 0.8.0 0.8.1 0.9.0 0.9.2
menu-icons / js / admin.js
menu-icons / js Last commit date
src 6 years ago admin.js 6 years ago admin.min.js 6 years ago
admin.js
700 lines
1 /******/ (function(modules) { // webpackBootstrap
2 /******/ // The module cache
3 /******/ var installedModules = {};
4 /******/
5 /******/ // The require function
6 /******/ function __webpack_require__(moduleId) {
7 /******/
8 /******/ // Check if module is in cache
9 /******/ if(installedModules[moduleId]) {
10 /******/ return installedModules[moduleId].exports;
11 /******/ }
12 /******/ // Create a new module (and put it into the cache)
13 /******/ var module = installedModules[moduleId] = {
14 /******/ i: moduleId,
15 /******/ l: false,
16 /******/ exports: {}
17 /******/ };
18 /******/
19 /******/ // Execute the module function
20 /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21 /******/
22 /******/ // Flag the module as loaded
23 /******/ module.l = true;
24 /******/
25 /******/ // Return the exports of the module
26 /******/ return module.exports;
27 /******/ }
28 /******/
29 /******/
30 /******/ // expose the modules object (__webpack_modules__)
31 /******/ __webpack_require__.m = modules;
32 /******/
33 /******/ // expose the module cache
34 /******/ __webpack_require__.c = installedModules;
35 /******/
36 /******/ // identity function for calling harmony imports with the correct context
37 /******/ __webpack_require__.i = function(value) { return value; };
38 /******/
39 /******/ // define getter function for harmony exports
40 /******/ __webpack_require__.d = function(exports, name, getter) {
41 /******/ if(!__webpack_require__.o(exports, name)) {
42 /******/ Object.defineProperty(exports, name, {
43 /******/ configurable: false,
44 /******/ enumerable: true,
45 /******/ get: getter
46 /******/ });
47 /******/ }
48 /******/ };
49 /******/
50 /******/ // getDefaultExport function for compatibility with non-harmony modules
51 /******/ __webpack_require__.n = function(module) {
52 /******/ var getter = module && module.__esModule ?
53 /******/ function getDefault() { return module['default']; } :
54 /******/ function getModuleExports() { return module; };
55 /******/ __webpack_require__.d(getter, 'a', getter);
56 /******/ return getter;
57 /******/ };
58 /******/
59 /******/ // Object.prototype.hasOwnProperty.call
60 /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
61 /******/
62 /******/ // __webpack_public_path__
63 /******/ __webpack_require__.p = "";
64 /******/
65 /******/ // Load entry module and return exports
66 /******/ return __webpack_require__(__webpack_require__.s = 2);
67 /******/ })
68 /************************************************************************/
69 /******/ ([
70 /* 0 */
71 /***/ (function(module, exports, __webpack_require__) {
72
73 /* global menuIcons:false */
74
75 __webpack_require__(3);
76
77 (function ($) {
78 var miPicker;
79
80 if (!menuIcons.activeTypes || _.isEmpty(menuIcons.activeTypes)) {
81 return;
82 }
83
84 /**
85 * @namespace
86 * @property {object} templates - Cached templates for the item previews on the fields
87 * @property {string} wrapClass - Field wrapper's class
88 * @property {object} frame - Menu Icons' media frame instance
89 * @property {object} target - Frame's target model
90 */
91 miPicker = {
92 templates: {},
93 wrapClass: 'div.menu-icons-wrap',
94 frame: null,
95 target: new wp.media.model.IconPickerTarget(),
96
97 /**
98 * Callback function to filter active icon types
99 *
100 * TODO: Maybe move to frame view?
101 *
102 * @param {string} type - Icon type.
103 */
104 typesFilter: function typesFilter(type) {
105 return $.inArray(type.id, menuIcons.activeTypes) >= 0;
106 },
107
108 /**
109 * Create Menu Icons' media frame
110 */
111 createFrame: function createFrame() {
112 miPicker.frame = new wp.media.view.MediaFrame.MenuIcons({
113 target: miPicker.target,
114 ipTypes: _.filter(iconPicker.types, miPicker.typesFilter),
115 SidebarView: wp.media.view.MenuIconsSidebar
116 });
117 },
118
119 /**
120 * Pick icon for a menu item and open the frame
121 *
122 * @param {object} model - Menu item model.
123 */
124 pickIcon: function pickIcon(model) {
125 miPicker.frame.target.set(model, { silent: true });
126 miPicker.frame.open();
127 },
128
129 /**
130 * Set or unset icon
131 *
132 * @param {object} e - jQuery click event.
133 */
134 setUnset: function setUnset(e) {
135 var $el = $(e.currentTarget),
136 $clicked = $(e.target);
137
138 e.preventDefault();
139
140 if ($clicked.hasClass('_select') || $clicked.hasClass('_icon')) {
141 miPicker.setIcon($el);
142 } else if ($clicked.hasClass('_remove')) {
143 miPicker.unsetIcon($el);
144 }
145 },
146
147 /**
148 * Set Icon
149 *
150 * @param {object} $el - jQuery object.
151 */
152 setIcon: function setIcon($el) {
153 var id = $el.data('id'),
154 frame = miPicker.frame,
155 items = frame.menuItems,
156 model = items.get(id);
157
158 if (model) {
159 miPicker.pickIcon(model.toJSON());
160 return;
161 }
162
163 model = {
164 id: id,
165 $el: $el,
166 $title: $('#edit-menu-item-title-' + id),
167 $inputs: {}
168 };
169
170 // Collect menu item's settings fields and use them
171 // as the model's attributes.
172 $el.find('div._settings input').each(function () {
173 var $input = $(this),
174 key = $input.attr('class').replace('_mi-', ''),
175 value = $input.val();
176
177 if (!value) {
178 if (_.has(menuIcons.menuSettings, key)) {
179 value = menuIcons.menuSettings[key];
180 } else if (_.has(menuIcons.settingsFields, key)) {
181 value = menuIcons.settingsFields[key]['default'];
182 }
183 }
184
185 model[key] = value;
186 model.$inputs[key] = $input;
187 });
188
189 items.add(model);
190 miPicker.pickIcon(model);
191 },
192
193 /**
194 * Unset icon
195 *
196 * @param {object} $el - jQuery object.
197 */
198 unsetIcon: function unsetIcon($el) {
199 var id = $el.data('id');
200
201 $el.find('div._settings input').val('');
202 $el.trigger('mi:update');
203 miPicker.frame.menuItems.remove(id);
204 },
205
206 /**
207 * Update valeus of menu item's setting fields
208 *
209 * When the type and icon is set, this will (re)generate the icon
210 * preview on the menu item field.
211 *
212 * @param {object} e - jQuery event.
213 */
214 updateField: function updateField(e) {
215 var $el = $(e.currentTarget),
216 $set = $el.find('a._select'),
217 $unset = $el.find('a._remove'),
218 type = $el.find('input._mi-type').val(),
219 icon = $el.find('input._mi-icon').val(),
220 url = $el.find('input._mi-url').val(),
221 template;
222
223 if (type === '' || icon === '' || _.indexOf(menuIcons.activeTypes, type) < 0) {
224 $set.text(menuIcons.text.select).attr('title', '');
225 $unset.addClass('hidden');
226
227 return;
228 }
229
230 if (miPicker.templates[type]) {
231 template = miPicker.templates[type];
232 } else {
233 template = miPicker.templates[type] = wp.template('menu-icons-item-field-preview-' + iconPicker.types[type].templateId);
234 }
235
236 $unset.removeClass('hidden');
237 $set.attr('title', menuIcons.text.change);
238 $set.html(template({
239 type: type,
240 icon: icon,
241 url: url
242 }));
243 },
244
245 /**
246 * Initialize picker functionality
247 *
248 * #fires mi:update
249 */
250 init: function init() {
251 miPicker.createFrame();
252 $(document).on('click', miPicker.wrapClass, miPicker.setUnset).on('mi:update', miPicker.wrapClass, miPicker.updateField);
253
254 // Trigger 'mi:update' event to generate the icons on the item fields.
255 $(miPicker.wrapClass).trigger('mi:update');
256 }
257 };
258
259 miPicker.init();
260 })(jQuery);
261
262 /***/ }),
263 /* 1 */
264 /***/ (function(module, exports) {
265
266 (function ($) {
267 /**
268 * Settings box tabs
269 *
270 * We can't use core's tabs script here because it will clear the
271 * checkboxes upon tab switching
272 */
273 $('#menu-icons-settings-tabs').on('click', 'a.mi-settings-nav-tab', function (e) {
274 var $el = $(this).blur(),
275 $target = $('#' + $el.data('type'));
276
277 e.preventDefault();
278 e.stopPropagation();
279
280 $el.parent().addClass('tabs').siblings().removeClass('tabs');
281 $target.removeClass('tabs-panel-inactive').addClass('tabs-panel-active').show().siblings('div.tabs-panel').hide().addClass('tabs-panel-inactive').removeClass('tabs-panel-active');
282 }).find('a.mi-settings-nav-tab').first().click();
283
284 // Settings meta box
285 $('#menu-icons-settings-save').on('click', function (e) {
286 var $button = $(this).prop('disabled', true),
287 $spinner = $button.siblings('span.spinner');
288
289 e.preventDefault();
290 e.stopPropagation();
291
292 $spinner.css({
293 display: 'inline-block',
294 visibility: 'visible'
295 });
296
297 $.ajax({
298 type: 'POST',
299 url: window.menuIcons.ajaxUrls.update,
300 data: $('#menu-icons-settings :input').serialize(),
301
302 success: function success(response) {
303 if (response.success && response.data.redirectUrl === true) {
304 window.location = response.data.redirectUrl;
305 } else {
306 $button.prop('disabled', false);
307 }
308 $spinner.hide();
309 },
310
311 fail: function fail() {
312 $spinner.hide();
313 }
314 });
315 });
316 })(jQuery);
317
318 /***/ }),
319 /* 2 */
320 /***/ (function(module, exports, __webpack_require__) {
321
322 __webpack_require__(1);
323 __webpack_require__(0);
324
325 /***/ }),
326 /* 3 */
327 /***/ (function(module, exports, __webpack_require__) {
328
329 wp.media.model.MenuIconsItemSettingField = __webpack_require__(4);
330 wp.media.model.MenuIconsItemSettings = __webpack_require__(5);
331 wp.media.model.MenuIconsItem = __webpack_require__(6);
332
333 wp.media.view.MenuIconsItemSettingField = __webpack_require__(9);
334 wp.media.view.MenuIconsItemSettings = __webpack_require__(10);
335 wp.media.view.MenuIconsItemPreview = __webpack_require__(8);
336 wp.media.view.MenuIconsSidebar = __webpack_require__(11);
337 wp.media.view.MediaFrame.MenuIcons = __webpack_require__(7);
338
339 /***/ }),
340 /* 4 */
341 /***/ (function(module, exports) {
342
343 /**
344 * wp.media.model.MenuIconsItemSettingField
345 *
346 * @class
347 * @augments Backbone.Model
348 */
349 var MenuIconsItemSettingField = Backbone.Model.extend({
350 defaults: {
351 id: '',
352 label: '',
353 value: '',
354 type: 'text'
355 }
356 });
357
358 module.exports = MenuIconsItemSettingField;
359
360 /***/ }),
361 /* 5 */
362 /***/ (function(module, exports) {
363
364 /**
365 * wp.media.model.MenuIconsItemSettings
366 *
367 * @class
368 * @augments Backbone.Collection
369 */
370 var MenuIconsItemSettings = Backbone.Collection.extend({
371 model: wp.media.model.MenuIconsItemSettingField
372 });
373
374 module.exports = MenuIconsItemSettings;
375
376 /***/ }),
377 /* 6 */
378 /***/ (function(module, exports) {
379
380 /**
381 * wp.media.model.MenuIconsItem
382 *
383 * @class
384 * @augments Backbone.Model
385 */
386 var Item = Backbone.Model.extend({
387 initialize: function initialize() {
388 this.on('change', this.updateValues, this);
389 },
390
391 /**
392 * Update the values of menu item's settings fields
393 *
394 * #fires mi:update
395 */
396 updateValues: function updateValues() {
397 _.each(this.get('$inputs'), function ($input, key) {
398 $input.val(this.get(key));
399 }, this);
400
401 // Trigger the 'mi:update' event to regenerate the icon on the field.
402 this.get('$el').trigger('mi:update');
403 }
404 });
405
406 module.exports = Item;
407
408 /***/ }),
409 /* 7 */
410 /***/ (function(module, exports) {
411
412 /**
413 * wp.media.view.MediaFrame.MenuIcons
414 *
415 * @class
416 * @augments wp.media.view.MediaFrame.IconPicker
417 * @augments wp.media.view.MediaFrame.Select
418 * @augments wp.media.view.MediaFrame
419 * @augments wp.media.view.Frame
420 * @augments wp.media.View
421 * @augments wp.Backbone.View
422 * @augments Backbone.View
423 */
424
425 var MenuIcons = wp.media.view.MediaFrame.IconPicker.extend({
426 initialize: function initialize() {
427 this.menuItems = new Backbone.Collection([], {
428 model: wp.media.model.MenuIconsItem
429 });
430
431 wp.media.view.MediaFrame.IconPicker.prototype.initialize.apply(this, arguments);
432 if (this.setMenuTabPanelAriaAttributes) {
433 this.off('open', this.setMenuTabPanelAriaAttributes, this);
434 // Set the router ARIA tab panel attributes when the modal opens.
435 this.off('open', this.setRouterTabPanelAriaAttributes, this);
436
437 // Update the menu ARIA tab panel attributes when the content updates.
438 this.off('content:render', this.setMenuTabPanelAriaAttributes, this);
439 // Update the router ARIA tab panel attributes when the content updates.
440 this.off('content:render', this.setRouterTabPanelAriaAttributes, this);
441 }
442 this.listenTo(this.target, 'change', this.miUpdateItemProps);
443 this.on('select', this.miClearTarget, this);
444 },
445
446 miUpdateItemProps: function miUpdateItemProps(props) {
447 var model = this.menuItems.get(props.id);
448
449 model.set(props.changed);
450 },
451
452 miClearTarget: function miClearTarget() {
453 this.target.clear({ silent: true });
454 }
455 });
456
457 module.exports = MenuIcons;
458
459 /***/ }),
460 /* 8 */
461 /***/ (function(module, exports) {
462
463 /**
464 * wp.media.view.MenuIconsItemPreview
465 *
466 * @class
467 * @augments wp.media.View
468 * @augments wp.Backbone.View
469 * @augments Backbone.View
470 */
471 var MenuIconsItemPreview = wp.media.View.extend({
472 tagName: 'p',
473 className: 'mi-preview menu-item attachment-info',
474 events: {
475 'click a': 'preventDefault'
476 },
477
478 initialize: function initialize() {
479 wp.media.View.prototype.initialize.apply(this, arguments);
480 this.model.on('change', this.render, this);
481 },
482
483 render: function render() {
484 var frame = this.controller,
485 state = frame.state(),
486 selected = state.get('selection').single(),
487 props = this.model.toJSON(),
488 data = _.extend(props, {
489 type: state.id,
490 icon: selected.id,
491 title: this.model.get('$title').val(),
492 url: state.ipGetIconUrl(selected, props.image_size)
493 }),
494 template = 'menu-icons-item-sidebar-preview-' + iconPicker.types[state.id].templateId + '-';
495
496 if (data.hide_label) {
497 template += 'hide_label';
498 } else {
499 template += data.position;
500 }
501
502 this.template = wp.media.template(template);
503 this.$el.html(this.template(data));
504
505 return this;
506 },
507
508 preventDefault: function preventDefault(e) {
509 e.preventDefault();
510 }
511 });
512
513 module.exports = MenuIconsItemPreview;
514
515 /***/ }),
516 /* 9 */
517 /***/ (function(module, exports) {
518
519 var $ = jQuery,
520 MenuIconsItemSettingField;
521
522 /**
523 * wp.media.view.MenuIconsItemSettingField
524 *
525 * @class
526 * @augments wp.media.View
527 * @augments wp.Backbone.View
528 * @augments Backbone.View
529 */
530 MenuIconsItemSettingField = wp.media.View.extend({
531 tagName: 'label',
532 className: 'setting',
533 events: {
534 'change :input': '_update'
535 },
536
537 initialize: function initialize() {
538 wp.media.View.prototype.initialize.apply(this, arguments);
539
540 this.template = wp.media.template('menu-icons-settings-field-' + this.model.get('type'));
541 this.model.on('change', this.render, this);
542 },
543
544 prepare: function prepare() {
545 return this.model.toJSON();
546 },
547
548 _update: function _update(e) {
549 var value = $(e.currentTarget).val();
550
551 this.model.set('value', value);
552 this.options.item.set(this.model.id, value);
553 }
554 });
555
556 module.exports = MenuIconsItemSettingField;
557
558 /***/ }),
559 /* 10 */
560 /***/ (function(module, exports) {
561
562 /**
563 * wp.media.view.MenuIconsItemSettings
564 *
565 * @class
566 * @augments wp.media.view.PriorityList
567 * @augments wp.media.View
568 * @augments wp.Backbone.View
569 * @augments Backbone.View
570 */
571 var MenuIconsItemSettings = wp.media.view.PriorityList.extend({
572 className: 'mi-settings attachment-info',
573
574 prepare: function prepare() {
575 _.each(this.collection.map(this.createField, this), function (view) {
576 this.set(view.model.id, view);
577 }, this);
578 },
579
580 createField: function createField(model) {
581 var field = new wp.media.view.MenuIconsItemSettingField({
582 item: this.model,
583 model: model,
584 collection: this.collection
585 });
586
587 return field;
588 }
589 });
590
591 module.exports = MenuIconsItemSettings;
592
593 /***/ }),
594 /* 11 */
595 /***/ (function(module, exports) {
596
597 /**
598 * wp.media.view.MenuIconsSidebar
599 *
600 * @class
601 * @augments wp.media.view.IconPickerSidebar
602 * @augments wp.media.view.Sidebar
603 * @augments wp.media.view.PriorityList
604 * @augments wp.media.View
605 * @augments wp.Backbone.View
606 * @augments Backbone.View
607 */
608 var MenuIconsSidebar = wp.media.view.IconPickerSidebar.extend({
609 initialize: function initialize() {
610 var title = new wp.media.View({
611 tagName: 'h3',
612 priority: -10
613 });
614
615 var info = new wp.media.View({
616 tagName: 'p',
617 className: '_info',
618 priority: 1000
619 });
620
621 wp.media.view.IconPickerSidebar.prototype.initialize.apply(this, arguments);
622
623 title.$el.text(window.menuIcons.text.preview);
624 this.set('title', title);
625
626 info.$el.html(window.menuIcons.text.settingsInfo);
627 this.set('info', info);
628 },
629
630 createSingle: function createSingle() {
631 this.createPreview();
632 this.createSettings();
633 },
634
635 disposeSingle: function disposeSingle() {
636 this.unset('preview');
637 this.unset('settings');
638 },
639
640 createPreview: function createPreview() {
641 var self = this,
642 frame = self.controller,
643 state = frame.state();
644
645 // If the selected icon is still being downloaded (image or svg type),
646 // wait for it to complete before creating the preview.
647 if (state.dfd && state.dfd.state() === 'pending') {
648 state.dfd.done(function () {
649 self.createPreview();
650 });
651
652 return;
653 }
654
655 self.set('preview', new wp.media.view.MenuIconsItemPreview({
656 controller: frame,
657 model: frame.target,
658 priority: 80
659 }));
660 },
661
662 createSettings: function createSettings() {
663 var frame = this.controller,
664 state = frame.state(),
665 fieldIds = state.get('data').settingsFields,
666 fields = [];
667
668 _.each(fieldIds, function (fieldId) {
669 var field = window.menuIcons.settingsFields[fieldId],
670 model;
671
672 if (!field) {
673 return;
674 }
675
676 model = _.defaults({
677 value: frame.target.get(fieldId) || field['default']
678 }, field);
679
680 fields.push(model);
681 });
682
683 if (!fields.length) {
684 return;
685 }
686
687 this.set('settings', new wp.media.view.MenuIconsItemSettings({
688 controller: this.controller,
689 collection: new wp.media.model.MenuIconsItemSettings(fields),
690 model: frame.target,
691 type: this.options.type,
692 priority: 120
693 }));
694 }
695 });
696
697 module.exports = MenuIconsSidebar;
698
699 /***/ })
700 /******/ ]);