3 tinymce.create('tinymce.plugins.wpGallery', {
5 init : function(ed, url) {
12 // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('...');
13 ed.addCommand('WP_Gallery', function() {
15 ed.selection.moveToBookmark( ed.wpGalleryBookmark );
17 var el = ed.selection.getNode(),
18 gallery = wp.media.gallery,
21 // Check if the `wp.media.gallery` API exists.
22 if ( typeof wp === 'undefined' || ! wp.media || ! wp.media.gallery )
25 // Make sure we've selected a gallery node.
26 if ( el.nodeName != 'IMG' || ed.dom.getAttrib(el, 'class').indexOf('wp-gallery') == -1 )
29 frame = gallery.edit( '[' + ed.dom.getAttrib( el, 'title' ) + ']' );
31 frame.state('gallery-edit').on( 'update', function( selection ) {
32 var shortcode = gallery.shortcode( selection ).string().slice( 1, -1 );
33 ed.dom.setAttrib( el, 'title', shortcode );
37 ed.onInit.add(function(ed) {
38 // iOS6 doesn't show the buttons properly on click, show them on 'touchstart'
39 if ( 'ontouchstart' in window ) {
40 ed.dom.events.add(ed.getBody(), 'touchstart', function(e){
41 var target = e.target;
43 if ( target.nodeName == 'IMG' && ed.dom.hasClass(target, 'wp-gallery') ) {
44 ed.selection.select(target);
45 ed.dom.events.cancel(e);
46 ed.plugins.wordpress._hideButtons();
47 ed.plugins.wordpress._showButtons(target, 'wp_gallerybtns');
53 ed.onMouseDown.add(function(ed, e) {
54 if ( e.target.nodeName == 'IMG' && ed.dom.hasClass(e.target, 'wp-gallery') ) {
55 ed.plugins.wordpress._hideButtons();
56 ed.plugins.wordpress._showButtons(e.target, 'wp_gallerybtns');
60 ed.onBeforeSetContent.add(function(ed, o) {
61 o.content = t._do_gallery(o.content);
64 ed.onPostProcess.add(function(ed, o) {
66 o.content = t._get_gallery(o.content);
70 _do_gallery : function(co) {
71 return co.replace(/\[gallery([^\]]*)\]/g, function(a,b){
72 return '<img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="wp-gallery mceItem" title="gallery'+tinymce.DOM.encode(b)+'" />';
76 _get_gallery : function(co) {
78 function getAttr(s, n) {
79 n = new RegExp(n + '=\"([^\"]+)\"', 'g').exec(s);
80 return n ? tinymce.DOM.decode(n[1]) : '';
83 return co.replace(/(?:<p[^>]*>)*(<img[^>]+>)(?:<\/p>)*/g, function(a,im) {
84 var cls = getAttr(im, 'class');
86 if ( cls.indexOf('wp-gallery') != -1 )
87 return '<p>['+tinymce.trim(getAttr(im, 'title'))+']</p>';
93 _createButtons : function() {
94 var t = this, ed = tinymce.activeEditor, DOM = tinymce.DOM, editButton, dellButton, isRetina;
96 if ( DOM.get('wp_gallerybtns') )
99 isRetina = ( window.devicePixelRatio && window.devicePixelRatio > 1 ) || // WebKit, Opera
100 ( window.matchMedia && window.matchMedia('(min-resolution:130dpi)').matches ); // Firefox, IE10, Opera
102 DOM.add(document.body, 'div', {
103 id : 'wp_gallerybtns',
104 style : 'display:none;'
107 editButton = DOM.add('wp_gallerybtns', 'img', {
108 src : isRetina ? t.url+'/img/edit-2x.png' : t.url+'/img/edit.png',
109 id : 'wp_editgallery',
112 title : ed.getLang('wordpress.editgallery')
115 tinymce.dom.Event.add(editButton, 'mousedown', function(e) {
116 var ed = tinymce.activeEditor;
117 ed.wpGalleryBookmark = ed.selection.getBookmark('simple');
118 ed.execCommand("WP_Gallery");
119 ed.plugins.wordpress._hideButtons();
122 dellButton = DOM.add('wp_gallerybtns', 'img', {
123 src : isRetina ? t.url+'/img/delete-2x.png' : t.url+'/img/delete.png',
124 id : 'wp_delgallery',
127 title : ed.getLang('wordpress.delgallery')
130 tinymce.dom.Event.add(dellButton, 'mousedown', function(e) {
131 var ed = tinymce.activeEditor, el = ed.selection.getNode();
133 if ( el.nodeName == 'IMG' && ed.dom.hasClass(el, 'wp-gallery') ) {
136 ed.execCommand('mceRepaint');
137 ed.dom.events.cancel(e);
140 ed.plugins.wordpress._hideButtons();
144 getInfo : function() {
146 longname : 'Gallery Settings',
147 author : 'WordPress',
148 authorurl : 'http://wordpress.org',
155 tinymce.PluginManager.add('wpgallery', tinymce.plugins.wpGallery);