Wordpress/wp-includes/js/media-views.min.js
2012-10-10 22:58:38 +00:00

1 line
14 KiB
JavaScript

(function(e){var f=wp.media,d=f.model.Attachment,c=f.model.Attachments,a=f.model.Query,b;b=f.view.l10n=_.isUndefined(_wpMediaViewsL10n)?{}:_wpMediaViewsL10n;f.controller.Workflow=Backbone.Model.extend({defaults:{title:"",multiple:false,view:"library",library:{},selection:[]},initialize:function(){this.createSelection();this._views={};this._pendingViews={};this.modal=new f.view.Modal({controller:this});this.add("library",f.view.Workspace.Library,{collection:f.query(this.get("library"))});this.unset("library");this.add("gallery",f.view.Workspace.Gallery,{collection:this.selection});this.add("gallery-library",f.view.Workspace.Library.Gallery,{collection:f.query({type:"image"})})},add:function(i,h,g){this.remove(i);this._pendingViews[i]={view:h,options:g};this.trigger("add add:"+i,h,g);return this},view:function(h){var g;h=h||this.get("view");g=this._pendingViews[h];if(!this._views[h]&&g){this._views[h]=new g.view(_.extend({controller:this},g.options||{}));delete this._pendingViews[h];this.trigger("init init:"+h,this._views[h])}return this._views[h]},remove:function(g){delete this._views[g];delete this._pendingViews[g];this.trigger("remove remove:"+g);return this},render:function(j,i,h){var g;j=j||this.get("view");if(i){this.add(j,i,h)}g=this.view(j);if(!g){return this}g.render();this.modal.content(g);return this},update:function(g){this.close();this.trigger("update",this.selection,this);this.trigger("update:"+g,this.selection,this);this.selection.clear()},createSelection:function(){var g=this;this.selection=new c(this.get("selection"));this.unset("selection");_.extend(this.selection,{add:function(i,h){if(!g.get("multiple")){i=_.isArray(i)?_.first(i):i;this.clear(h)}return c.prototype.add.call(this,i,h)},clear:function(h){return this.remove(this.models,h)},reset:function(i,h){return this.clear(h).add(i,h)},has:function(h){return !!(this.getByCid(h.cid)||this.get(h.id))}})}});_.each(["attach","detach","open","close"],function(g){f.controller.Workflow.prototype[g]=function(){this.modal[g].apply(this.modal,arguments);return this}});f.view.Modal=Backbone.View.extend({tagName:"div",template:f.template("media-modal"),events:{"click .media-modal-backdrop, .media-modal-close":"closeHandler"},initialize:function(){this.controller=this.options.controller;this.controller.on("change:title",this.render,this);_.defaults(this.options,{container:document.body})},render:function(){this.options.$content=this.options.$content||e("<div />");this.options.$content.detach();this.$el.html(this.template(this.controller.toJSON()));this.$(".media-modal-content").append(this.options.$content);return this},attach:function(){this.$el.appendTo(this.options.container);this.controller.trigger("attach",this.controller)},detach:function(){this.$el.detach();this.controller.trigger("detach",this.controller)},open:function(){this.$el.show();this.controller.trigger("open",this.controller)},close:function(){this.$el.hide();this.controller.trigger("close",this.controller)},closeHandler:function(g){g.preventDefault();this.close()},content:function(g){if(this.options.$content){this.options.$content.detach()}this.options.$content=(g instanceof Backbone.View)?g.$el:g;return this.render()}});f.view.Toolbar=Backbone.View.extend({tagName:"div",className:"media-toolbar",initialize:function(){this._views={};this.$primary=e('<div class="media-toolbar-primary" />').prependTo(this.$el);this.$secondary=e('<div class="media-toolbar-secondary" />').prependTo(this.$el);if(this.options.items){_.each(this.options.items,function(g,h){this.add(h,g,{silent:true})},this);this.render()}},render:function(){var g=_.chain(this._views).sortBy(function(h){return h.options.priority||10}).groupBy(function(h){return(h.options.priority||10)>0?"primary":"secondary"}).value();e(_.pluck(this._views,"el")).detach();this.$primary.html(_.pluck(g.primary||[],"el"));this.$secondary.html(_.pluck(g.secondary||[],"el"));return this},add:function(i,g,h){if(!(g instanceof Backbone.View)){g.classes=[i].concat(g.classes||[]);g=new f.view.Button(g).render()}this._views[i]=g;if(!h||!h.silent){this.render()}return this},get:function(g){return this._views[g]},remove:function(h,g){delete this._views[h];if(!g||!g.silent){this.render()}return this}});f.view.Button=Backbone.View.extend({tagName:"a",className:"media-button",attributes:{href:"#"},events:{click:"click"},defaults:{text:"",style:"",size:"large"},initialize:function(){this.model=new Backbone.Model(this.defaults);_.each(this.defaults,function(i,g){var h=this.options[g];if(_.isUndefined(h)){return}this.model.set(g,h);delete this.options[g]},this);this.model.on("change",this.render,this)},render:function(){var g=["button",this.className];if(this.model.get("style")){g.push("button-"+this.model.get("style"))}if(this.model.get("size")){g.push("button-"+this.model.get("size"))}g=g.concat(this.options.classes);this.el.className=g.join(" ");this.$el.text(this.model.get("text"));return this},click:function(g){g.preventDefault();if(this.options.click){this.options.click.apply(this,arguments)}}});f.view.Attachment=Backbone.View.extend({tagName:"li",className:"attachment",template:f.template("attachment"),events:{click:"toggleSelection",mouseenter:"shrink",mouseleave:"expand"},buttons:{},initialize:function(){this.controller=this.options.controller;this.model.on("change:sizes change:uploading",this.render,this);this.model.on("change:percent",this.progress,this);this.model.on("add",this.select,this);this.model.on("remove",this.deselect,this);this.$el.on("click","a",this.preventDefault)},render:function(){var h=this.model.toJSON(),g=_.defaults(this.model.toJSON(),{orientation:"landscape",uploading:false,type:"",subtype:"",icon:"",filename:""});g.buttons=this.buttons;if("image"===g.type){_.extend(g,this.crop())}this.$el.html(this.template(g));if(g.uploading){this.$bar=this.$(".media-progress-bar div")}else{delete this.$bar}if(this.controller.selection.has(this.model)){this.select()}return this},progress:function(){if(this.$bar&&this.$bar.length){this.$bar.width(this.model.get("percent")+"%")}},toggleSelection:function(h){var g=this.controller.selection;g[g.has(this.model)?"remove":"add"](this.model)},select:function(g,h){if(h&&h!==this.controller.selection){return}this.$el.addClass("selected")},deselect:function(g,h){if(h&&h!==this.controller.selection){return}this.$el.removeClass("selected")},preventDefault:function(g){g.preventDefault()},imageSize:function(g){var h=this.model.get("sizes");g=g||"medium";if(h&&h[g]){return h[g]}else{return{url:this.model.get("url"),width:this.model.get("width"),height:this.model.get("height"),orientation:this.model.get("orientation")}}},crop:function(g){var j=199,i=this.imageSize(g),h,k;h=wp.media.fit(_.extend({maxWidth:j},i));k=wp.media.fit(_.extend({maxHeight:j},i));_.extend(i,h.width>k.width?h:k);i.top=(j-i.height)/2;i.left=(j-i.width)/2;return i},fit:function(g){var k=10,i=199,j=i-(k*2),h=_.extend(wp.media.fit(_.extend({maxWidth:j,maxHeight:j},this.imageSize(g))));h.top=Math.round(k+(j-h.height)/2);h.left=Math.round(k+(j-h.width)/2);return h},shrink:function(){var g=_.pick(this.fit(),"top","left","width","height");this.$el.addClass("fit");this.$(".thumbnail").css(g);this.$(".thumbnail img").css(_.extend(g,{top:0,left:0}))},expand:function(){var g=_.pick(this.crop(),"top","left","width","height");this.$el.removeClass("fit");this.$(".thumbnail img").css(g);this.$(".thumbnail").css({top:0,left:0,width:199,height:199})}});f.view.Attachment.Library=f.view.Attachment.extend({className:"attachment library"});f.view.Attachment.Gallery=f.view.Attachment.extend({buttons:{close:true},events:{"click .close":"toggleSelection"}});f.view.Workspace=Backbone.View.extend({tagName:"div",className:"media-workspace",template:f.template("media-workspace"),attachmentsView:{},events:{dragenter:"maybeInitUploader",mouseenter:"maybeInitUploader"},initialize:function(){this.controller=this.options.controller;_.defaults(this.options,{selectOne:false,uploader:{},attachmentsView:{}});this.$content=e('<div class="existing-attachments" />');this.attachmentsView=_.extend({directions:this.controller.get("multiple")?b.selectMediaMultiple:b.selectMediaSingular},this.attachmentsView,this.options.attachmentsView,{controller:this.controller,collection:this.collection});this.attachmentsView=new f.view.Attachments(this.attachmentsView);this.$content.append(this.attachmentsView.$el);wp.Uploader.queue.on("add remove reset change:percent",this.renderUploadProgress,this);wp.Uploader.queue.on("add",this.selectUpload,this)},render:function(){this.$content.detach();this.attachmentsView.render();this.renderUploadProgress();this.$el.html(this.template(this.options)).append(this.$content);this.$bar=this.$(".upload-attachments .media-progress-bar div");return this},maybeInitUploader:function(){var g=this;if(this.uploader||!this.$el.closest("body").length){return}this.uploader=new wp.Uploader(_.extend({container:this.$el,dropzone:this.$el,browser:this.$(".upload-attachments a")},this.options.uploader))},selectUpload:function(g){this.controller.selection.add(g)},renderUploadProgress:function(){var g=wp.Uploader.queue;this.$el.toggleClass("uploading",!!g.length);if(!this.$bar||!g.length){return}this.$bar.width((g.reduce(function(h,i){if(i.get("uploading")){return h+(i.get("percent")||0)}else{return h+100}},0)/g.length)+"%")}});f.view.Workspace.Library=f.view.Workspace.extend({attachmentsView:{AttachmentView:f.view.Attachment.Library},initialize:function(){f.view.Workspace.prototype.initialize.apply(this,arguments);if(this.controller.get("multiple")){this.initToolbarView()}},initToolbarView:function(){var g=this.controller;this.toolbarView=new f.view.Toolbar({items:{"selection-preview":new f.view.SelectionPreview({controller:this.controller,collection:this.controller.selection,priority:-40}),"create-new-gallery":{style:"primary",text:b.createNewGallery,priority:40,click:function(){g.render("gallery")}},"insert-into-post":{text:b.insertIntoPost,priority:30,click:_.bind(g.update,g,"insert")},"add-to-gallery":{text:b.addToGallery,priority:20}}});this.controller.selection.on("add remove",function(){var i=this.controller.selection.length,h;this.$el.toggleClass("with-toolbar",!!i);h=i>1&&this.controller.selection.all(function(j){return"image"===j.get("type")});this.toolbarView.get("create-new-gallery").$el.toggle(h);insert=this.toolbarView.get("insert-into-post");insert.model.set("style",h?"":"primary")},this);this.$content.append(this.toolbarView.$el)}});f.view.Workspace.Library.Gallery=f.view.Workspace.Library.extend({initToolbarView:function(){var h=this.controller,g=h.get("editing"),i={"selection-preview":new f.view.SelectionPreview({controller:this.controller,collection:this.controller.selection,priority:-40,clearable:false}),"continue-editing-gallery":{style:"primary",text:b.continueEditingGallery,priority:40,click:function(){h.render("gallery")}}};this.toolbarView=new f.view.Toolbar({items:i});this.$el.addClass("with-toolbar");this.$content.append(this.toolbarView.$el)}});f.view.Workspace.Gallery=f.view.Workspace.extend({attachmentsView:{AttachmentView:f.view.Attachment.Gallery,sortable:true},initialize:function(){f.view.Workspace.prototype.initialize.apply(this,arguments);this.initToolbarView()},initToolbarView:function(){var h=this.controller,g=h.get("editing"),i={"update-gallery":{style:"primary",text:g?b.updateGallery:b.insertGalleryIntoPost,priority:40,click:_.bind(h.update,h,"gallery")},"return-to-library":{text:g?b.addImagesFromLibrary:b.returnToLibrary,priority:-40,click:function(){h.render(g?"gallery-library":"library")}}};this.toolbarView=new f.view.Toolbar({items:i});this.$el.addClass("with-toolbar");this.$content.append(this.toolbarView.$el)}});f.view.Attachments=Backbone.View.extend({tagName:"div",className:"attachments",template:f.template("attachments"),events:{"keyup input":"search"},initialize:function(){this.controller=this.options.controller;_.defaults(this.options,{refreshSensitivity:200,refreshThreshold:3,AttachmentView:f.view.Attachment,sortable:false});_.each(["add","remove"],function(g){this.collection.on(g,function(j,h,i){this[g](j,i.index)},this)},this);this.collection.on("reset",this.refresh,this);this.$list=e("<ul />");this.list=this.$list[0];this.scroll=_.chain(this.scroll).bind(this).throttle(this.options.refreshSensitivity).value();this.$list.on("scroll.attachments",this.scroll);this.initSortable()},initSortable:function(){var g=this.collection,h;if(!this.options.sortable||!e.fn.sortable){return}this.$list.sortable({disabled:!!g.comparator,containment:this.$list,tolerance:"pointer",start:function(i,j){h=j.item.index()},update:function(j,k){var i=g.at(h);g.remove(i,{silent:true}).add(i,{at:k.item.index(),silent:true})}});g.props.on("change:orderby",function(){this.$list.sortable("option","disabled",!!g.comparator)},this)},render:function(){this.$list.detach();this.$el.html(this.template(this.options)).append(this.$list);this.refresh();return this},refresh:function(){if(!this.collection.length){this.collection.more();this.$list.empty();return this}this.$list.html(this.collection.map(function(g){return new this.options.AttachmentView({controller:this.controller,model:g}).render().$el},this));this.scroll();return this},add:function(j,h){var g,i;g=new this.options.AttachmentView({controller:this.controller,model:j}).render();i=this.$list.children();if(i.length>h){i.eq(h).before(g.$el)}else{this.$list.append(g.$el)}},remove:function(i,g){var h=this.$list.children();if(h.length){h.eq(g).detach()}},scroll:function(g){if(!this.$list.is(":visible")){return}if(this.list.scrollHeight<this.list.scrollTop+(this.list.clientHeight*this.options.refreshThreshold)){this.collection.more()}},search:function(h){var g=this.collection.props;if(h.target.value){g.set("search",h.target.value)}else{g.unset("search")}}});f.view.SelectionPreview=Backbone.View.extend({tagName:"div",className:"selection-preview",template:f.template("media-selection-preview"),events:{"click .clear-selection":"clear"},initialize:function(){_.defaults(this.options,{clearable:true});this.controller=this.options.controller;this.collection.on("add change:url remove",this.render,this);this.render()},render:function(){var g=_.clone(this.options),j,i,h;if(!this.collection.length){this.$el.empty();return this}g.count=this.collection.length;j=this.collection.first();i=j.get("sizes");if("image"===j.get("type")){g.thumbnail=(i&&i.thumbnail)?i.thumbnail.url:j.get("url")}else{g.thumbnail=j.get("icon")}this.$el.html(this.template(g));return this},clear:function(g){g.preventDefault();this.collection.clear()}})}(jQuery));