/******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // identity function for calling harmony imports with the correct context /******/ __webpack_require__.i = function(value) { return value; }; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { /******/ configurable: false, /******/ enumerable: true, /******/ get: getter /******/ }); /******/ } /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = 1); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ (function(module, exports, __webpack_require__) { wp.media.model.IconPickerTarget = __webpack_require__(6); wp.media.model.IconPickerFonts = __webpack_require__(5); wp.media.controller.iconPickerMixin = __webpack_require__(4); wp.media.controller.IconPickerFont = __webpack_require__(2); wp.media.controller.IconPickerImg = __webpack_require__(3); wp.media.view.IconPickerBrowser = __webpack_require__(7); wp.media.view.IconPickerSidebar = __webpack_require__(14); wp.media.view.IconPickerFontItem = __webpack_require__(10); wp.media.view.IconPickerFontLibrary = __webpack_require__(11); wp.media.view.IconPickerFontFilter = __webpack_require__(9); wp.media.view.IconPickerFontBrowser = __webpack_require__(8); wp.media.view.IconPickerImgBrowser = __webpack_require__(13); wp.media.view.IconPickerSvgItem = __webpack_require__(15); wp.media.view.MediaFrame.IconPicker = __webpack_require__(12); /***/ }), /* 1 */ /***/ (function(module, exports, __webpack_require__) { __webpack_require__(0); (function ($) { var l10n = wp.media.view.l10n.iconPicker, templates = {}, frame, selectIcon, removeIcon, getFrame, updateField, updatePreview, $field; getFrame = function getFrame() { if (!frame) { frame = new wp.media.view.MediaFrame.IconPicker(); frame.target.on('change', updateField); } return frame; }; updateField = function updateField(model) { _.each(model.get('inputs'), function ($input, key) { $input.val(model.get(key)); }); model.clear({ silent: true }); $field.trigger('ipf:update'); }; updatePreview = function updatePreview(e) { var $el = $(e.currentTarget), $select = $el.find('a.ipf-select'), $remove = $el.find('a.ipf-remove'), type = $el.find('input.ipf-type').val(), icon = $el.find('input.ipf-icon').val(), url = $el.find('input.url').val(), template; if (type === '' || icon === '' || !_.has(iconPicker.types, type)) { $remove.addClass('hidden'); $select.removeClass('has-icon').addClass('button').text(l10n.selectIcon).attr('title', ''); return; } if (templates[type]) { template = templates[type]; } else { template = templates[type] = wp.template('iconpicker-' + iconPicker.types[type].templateId + '-icon'); } $remove.removeClass('hidden'); $select.attr('title', l10n.selectIcon).addClass('has-icon').removeClass('button').html(template({ type: type, icon: icon, url: url })); }; selectIcon = function selectIcon(e) { var frame = getFrame(), model = { inputs: {} }; e.preventDefault(); $field = $(e.currentTarget).closest('.ipf'); model.id = $field.attr('id'); // Collect input fields and use them as the model's attributes. $field.find('input').each(function () { var $input = $(this), key = $input.attr('class').replace('ipf-', ''), value = $input.val(); model[key] = value; model.inputs[key] = $input; }); frame.target.set(model, { silent: true }); frame.open(); }; removeIcon = function removeIcon(e) { var $el = $(e.currentTarget).closest('div.ipf'); $el.find('input').val(''); $el.trigger('ipf:update'); }; $(document).on('click', 'a.ipf-select', selectIcon).on('click', 'a.ipf-remove', removeIcon).on('ipf:update', 'div.ipf', updatePreview); $('div.ipf').trigger('ipf:update'); })(jQuery); /***/ }), /* 2 */ /***/ (function(module, exports) { /** * wp.media.controller.IconPickerFont * * @class * @augments wp.media.controller.State * @augments Backbone.Model * @mixes wp.media.controller.iconPickerMixin */ var IconPickerFont = wp.media.controller.State.extend(_.extend({}, wp.media.controller.iconPickerMixin, { defaults: { multiple: false, menu: 'default', toolbar: 'select', baseType: 'font' }, initialize: function initialize() { var data = this.get('data'); this.set('groups', new Backbone.Collection(data.groups)); this.set('library', new wp.media.model.IconPickerFonts(data.items)); this.set('selection', new wp.media.model.Selection(null, { multiple: this.get('multiple') })); }, activate: function activate() { this.frame.on('open', this.updateSelection, this); this.resetFilter(); this.updateSelection(); }, deactivate: function deactivate() { this.frame.off('open', this.updateSelection, this); }, resetFilter: function resetFilter() { this.get('library').props.set('group', 'all'); }, updateSelection: function updateSelection() { var selection = this.get('selection'), library = this.get('library'), target = this.frame.target, icon = target.get('icon'), type = target.get('type'), selected; if (this.id === type) { selected = library.findWhere({ id: icon }); } selection.reset(selected ? selected : null); }, getContentView: function getContentView() { return new wp.media.view.IconPickerFontBrowser(_.extend({ controller: this.frame, model: this, groups: this.get('groups'), collection: this.get('library'), selection: this.get('selection'), baseType: this.get('baseType'), type: this.get('id') }, this.ipGetSidebarOptions())); } })); module.exports = IconPickerFont; /***/ }), /* 3 */ /***/ (function(module, exports) { var Library = wp.media.controller.Library, l10n = wp.media.view.l10n, models = wp.media.model, views = wp.media.view, IconPickerImg; /** * wp.media.controller.IconPickerImg * * @augments wp.media.controller.Library * @augments wp.media.controller.State * @augments Backbone.Model * @mixes media.selectionSync * @mixes wp.media.controller.iconPickerMixin */ IconPickerImg = Library.extend(_.extend({}, wp.media.controller.iconPickerMixin, { defaults: _.defaults({ id: 'image', baseType: 'image', syncSelection: false }, Library.prototype.defaults), initialize: function initialize(options) { var selection = this.get('selection'); this.options = options; this.set('library', wp.media.query({ type: options.data.mimeTypes })); this.routers = { upload: { text: l10n.uploadFilesTitle, priority: 20 }, browse: { text: l10n.mediaLibraryTitle, priority: 40 } }; if (!(selection instanceof models.Selection)) { this.set('selection', new models.Selection(selection, { multiple: false })); } Library.prototype.initialize.apply(this, arguments); }, activate: function activate() { Library.prototype.activate.apply(this, arguments); this.get('library').observe(wp.Uploader.queue); this.frame.on('open', this.updateSelection, this); this.updateSelection(); }, deactivate: function deactivate() { Library.prototype.deactivate.apply(this, arguments); this.get('library').unobserve(wp.Uploader.queue); this.frame.off('open', this.updateSelection, this); }, getContentView: function getContentView(mode) { var content = mode === 'upload' ? this.uploadContent() : this.browseContent(); this.frame.$el.removeClass('hide-toolbar'); return content; }, /** * Media library content * * @returns {wp.media.view.IconPickerImgBrowser} "Browse" content view. */ browseContent: function browseContent() { var options = _.extend({ model: this, controller: this.frame, collection: this.get('library'), selection: this.get('selection'), sortable: this.get('sortable'), search: this.get('searchable'), filters: this.get('filterable'), dragInfo: this.get('dragInfo'), idealColumnWidth: this.get('idealColumnWidth'), suggestedWidth: this.get('suggestedWidth'), suggestedHeight: this.get('suggestedHeight') }, this.ipGetSidebarOptions()); if (this.id === 'svg') { options.AttachmentView = views.IconPickerSvgItem; } return new views.IconPickerImgBrowser(options); }, /** * Render callback for the content region in the `upload` mode. * * @returns {wp.media.view.UploaderInline} "Upload" content view. */ uploadContent: function uploadContent() { return new wp.media.view.UploaderInline({ controller: this.frame }); }, updateSelection: function updateSelection() { var selection = this.get('selection'), target = this.frame.target, icon = target.get('icon'), type = target.get('type'), selected; if (this.id === type) { selected = models.Attachment.get(icon); this.dfd = selected.fetch(); } selection.reset(selected ? selected : null); }, /** * Get image icon URL * * @param {object} model - Selected icon model. * @param {string} size - Image size. * * @returns {string} Icon URL. */ ipGetIconUrl: function ipGetIconUrl(model, size) { var url = model.get('url'), sizes = model.get('sizes'); if (undefined === size) { size = 'thumbnail'; } if (sizes && sizes[size]) { url = sizes[size].url; } return url; } })); module.exports = IconPickerImg; /***/ }), /* 4 */ /***/ (function(module, exports) { /** * Methods for the state * * @mixin */ var iconPickerMixin = { /** * @returns {object} */ ipGetSidebarOptions: function ipGetSidebarOptions() { var frameOptions = this.frame.options, options = {}; if (frameOptions.SidebarView && frameOptions.SidebarView.prototype instanceof wp.media.view.IconPickerSidebar) { options.sidebar = true; options.SidebarView = frameOptions.SidebarView; } else { options.sidebar = false; } return options; }, /** * Get image icon URL * * @returns {string} */ ipGetIconUrl: function ipGetIconUrl() { return ''; } }; module.exports = iconPickerMixin; /***/ }), /* 5 */ /***/ (function(module, exports) { /** * wp.media.model.IconPickerFonts */ var IconPickerFonts = Backbone.Collection.extend({ constructor: function constructor() { Backbone.Collection.prototype.constructor.apply(this, arguments); this.items = new Backbone.Collection(this.models); this.props = new Backbone.Model({ group: 'all', search: '' }); this.props.on('change', this.refresh, this); }, /** * Refresh library when props is changed * * @param {Backbone.Model} props */ refresh: function refresh(props) { var _this = this; var items = _.clone(this.items.models); _.each(props.toJSON(), function (value, filter) { var method = _this.filters[filter]; if (method) { items = items.filter(function (item) { return method(item, value); }); } }); this.reset(items); }, filters: { /** * @static * * @param {Backbone.Model} item Item model. * @param {string} group Group ID. * * @returns {Boolean} */ group: function group(item, _group) { return _group === 'all' || item.get('group') === _group || item.get('group') === ''; }, /** * @static * * @param {Backbone.Model} item Item model. * @param {string} term Search term. * * @returns {Boolean} */ search: function search(item, term) { var result = void 0; if (term === '') { result = true; } else { result = _.any(['id', 'name'], function (attribute) { var value = item.get(attribute); return value && value.search(term) >= 0; }, term); } return result; } } }); module.exports = IconPickerFonts; /***/ }), /* 6 */ /***/ (function(module, exports) { /** * wp.media.model.IconPickerTarget * * A target where the picked icon should be sent to * * @augments Backbone.Model */ var IconPickerTarget = Backbone.Model.extend({ defaults: { type: '', group: 'all', icon: '', url: '', sizes: [] } }); module.exports = IconPickerTarget; /***/ }), /* 7 */ /***/ (function(module, exports) { /** * Methods for the browser views */ var IconPickerBrowser = { createSidebar: function createSidebar() { this.sidebar = new this.options.SidebarView({ controller: this.controller, selection: this.options.selection }); this.views.add(this.sidebar); } }; module.exports = IconPickerBrowser; /***/ }), /* 8 */ /***/ (function(module, exports) { /** * wp.media.view.IconPickerFontBrowser */ var IconPickerFontBrowser = wp.media.View.extend(_.extend({ className: function className() { var className = 'attachments-browser iconpicker-fonts-browser'; if (!this.options.sidebar) { className += ' hide-sidebar'; } return className; }, initialize: function initialize() { this.groups = this.options.groups; this.createToolbar(); this.createLibrary(); if (this.options.sidebar) { this.createSidebar(); } }, createLibrary: function createLibrary() { this.items = new wp.media.view.IconPickerFontLibrary({ controller: this.controller, collection: this.collection, selection: this.options.selection, baseType: this.options.baseType, type: this.options.type }); // Add keydown listener to the instance of the library view this.views.add(this.items); }, createToolbar: function createToolbar() { this.toolbar = new wp.media.view.Toolbar({ controller: this.controller }); this.views.add(this.toolbar); // Dropdown filter this.toolbar.set('filters', new wp.media.view.IconPickerFontFilter({ controller: this.controller, model: this.collection.props, priority: -80 }).render()); // Search field this.toolbar.set('search', new wp.media.view.Search({ controller: this.controller, model: this.collection.props, priority: 60 }).render()); } }, wp.media.view.IconPickerBrowser)); module.exports = IconPickerFontBrowser; /***/ }), /* 9 */ /***/ (function(module, exports) { /** * wp.media.view.IconPickerFontFilter */ var IconPickerFontFilter = wp.media.view.AttachmentFilters.extend({ createFilters: function createFilters() { var groups = this.controller.state().get('groups'), filters = {}; filters.all = { text: wp.media.view.l10n.iconPicker.allFilter, props: { group: 'all' } }; groups.each(function (group) { filters[group.id] = { text: group.get('name'), props: { group: group.id } }; }); this.filters = filters; }, change: function change() { var filter = this.filters[this.el.value]; if (filter) { this.model.set('group', filter.props.group); } } }); module.exports = IconPickerFontFilter; /***/ }), /* 10 */ /***/ (function(module, exports) { var Attachment = wp.media.view.Attachment.Library, IconPickerFontItem; /** * wp.media.view.IconPickerFontItem */ IconPickerFontItem = Attachment.extend({ className: 'attachment iconpicker-item', initialize: function initialize() { this.template = wp.media.template('iconpicker-' + this.options.baseType + '-item'); Attachment.prototype.initialize.apply(this, arguments); }, render: function render() { var options = _.defaults(this.model.toJSON(), { baseType: this.options.baseType, type: this.options.type }); this.views.detach(); this.$el.html(this.template(options)); this.updateSelect(); this.views.render(); return this; } }); module.exports = IconPickerFontItem; /***/ }), /* 11 */ /***/ (function(module, exports) { var $ = jQuery, Attachments = wp.media.view.Attachments, IconPickerFontLibrary; /** * wp.media.view.IconPickerFontLibrary */ IconPickerFontLibrary = Attachments.extend({ className: 'attachments iconpicker-items clearfix', initialize: function initialize() { Attachments.prototype.initialize.apply(this, arguments); _.bindAll(this, 'scrollToSelected'); _.defer(this.scrollToSelected, this); this.controller.on('open', this.scrollToSelected, this); $(this.options.scrollElement).off('scroll', this.scroll); }, _addItem: function _addItem(model) { this.views.add(this.createAttachmentView(model), { at: this.collection.indexOf(model) }); }, _removeItem: function _removeItem(model) { var view = this._viewsByCid[model.cid]; delete this._viewsByCid[model.cid]; if (view) { view.remove(); } }, render: function render() { _.each(this._viewsByCid, this._removeItem, this); this.collection.each(this._addItem, this); return this; }, createAttachmentView: function createAttachmentView(model) { var view = new wp.media.view.IconPickerFontItem({ controller: this.controller, model: model, collection: this.collection, selection: this.options.selection, baseType: this.options.baseType, type: this.options.type }); return this._viewsByCid[view.cid] = view; }, /** * Scroll to selected item */ scrollToSelected: function scrollToSelected() { var selected = this.options.selection.single(), singleView, distance; if (!selected) { return; } singleView = this.getView(selected); if (singleView && !this.isInView(singleView.$el)) { distance = singleView.$el.offset().top - parseInt(singleView.$el.css('paddingTop'), 10) - this.$el.offset().top + this.$el.scrollTop() - parseInt(this.$el.css('paddingTop'), 10); this.$el.scrollTop(distance); } }, getView: function getView(model) { return _.findWhere(this._viewsByCid, { model: model }); }, isInView: function isInView($elem) { var docViewTop = this.$window.scrollTop(), docViewBottom = docViewTop + this.$window.height(), elemTop = $elem.offset().top, elemBottom = elemTop + $elem.height(); return elemBottom <= docViewBottom && elemTop >= docViewTop; }, prepare: function prepare() {}, ready: function ready() {}, initSortable: function initSortable() {}, scroll: function scroll() {} }); module.exports = IconPickerFontLibrary; /***/ }), /* 12 */ /***/ (function(module, exports) { /** * wp.media.view.MediaFrame.IconPicker * * A frame for selecting an icon. * * @class * @augments wp.media.view.MediaFrame.Select * @augments wp.media.view.MediaFrame * @augments wp.media.view.Frame * @augments wp.media.View * @augments wp.Backbone.View * @augments Backbone.View * @mixes wp.media.controller.StateMachine */ var l10n = wp.media.view.l10n, Select = wp.media.view.MediaFrame.Select, IconPicker; IconPicker = Select.extend({ initialize: function initialize() { _.defaults(this.options, { title: l10n.iconPicker.frameTitle, multiple: false, ipTypes: iconPicker.types, target: null, SidebarView: null }); if (this.options.target instanceof wp.media.model.IconPickerTarget) { this.target = this.options.target; } else { this.target = new wp.media.model.IconPickerTarget(); } Select.prototype.initialize.apply(this, arguments); }, createStates: function createStates() { var Controller; _.each(this.options.ipTypes, function (props) { if (!wp.media.controller.hasOwnProperty('IconPicker' + props.controller)) { return; } Controller = wp.media.controller['IconPicker' + props.controller]; this.states.add(new Controller({ id: props.id, content: props.id, title: props.name, data: props.data })); }, this); }, /** * Bind region mode event callbacks. */ bindHandlers: function bindHandlers() { this.on('router:create:browse', this.createRouter, this); this.on('router:render:browse', this.browseRouter, this); this.on('content:render', this.ipRenderContent, this); this.on('toolbar:create:select', this.createSelectToolbar, this); this.on('open', this._ipSetState, this); this.on('select', this._ipUpdateTarget, this); }, /** * Set state based on the target's icon type */ _ipSetState: function _ipSetState() { var stateId = this.target.get('type'); if (!stateId || !this.states.findWhere({ id: stateId })) { stateId = this.states.at(0).id; } this.setState(stateId); }, /** * Update target's attributes after selecting an icon */ _ipUpdateTarget: function _ipUpdateTarget() { var state = this.state(), selected = state.get('selection').single(), props; props = { type: state.id, icon: selected.get('id'), sizes: selected.get('sizes'), url: state.ipGetIconUrl(selected) }; this.target.set(props); }, browseRouter: function browseRouter(routerView) { var routers = this.state().routers; if (routers) { routerView.set(routers); } }, ipRenderContent: function ipRenderContent() { var state = this.state(), mode = this.content.mode(), content = state.getContentView(mode); this.content.set(content); } }); module.exports = IconPicker; /***/ }), /* 13 */ /***/ (function(module, exports) { /** * wp.media.view.IconPickerImgBrowser */ var IconPickerImgBrowser = wp.media.view.AttachmentsBrowser.extend(wp.media.view.IconPickerBrowser); module.exports = IconPickerImgBrowser; /***/ }), /* 14 */ /***/ (function(module, exports) { /** * wp.media.view.IconPickerSidebar */ var IconPickerSidebar = wp.media.view.Sidebar.extend({ initialize: function initialize() { var selection = this.options.selection; wp.media.view.Sidebar.prototype.initialize.apply(this, arguments); selection.on('selection:single', this.createSingle, this); selection.on('selection:unsingle', this.disposeSingle, this); if (selection.single()) { this.createSingle(); } }, /** * @abstract */ createSingle: function createSingle() {}, /** * @abstract */ disposeSingle: function disposeSingle() {} }); module.exports = IconPickerSidebar; /***/ }), /* 15 */ /***/ (function(module, exports) { /** * wp.media.view.IconPickerSvgItem */ var IconPickerSvgItem = wp.media.view.Attachment.Library.extend({ template: wp.template('iconpicker-svg-item') }); module.exports = IconPickerSvgItem; /***/ }) /******/ ]);