From 2eeb128d06ad37dea9bd1765784fb53e47ef527c Mon Sep 17 00:00:00 2001 From: alecpl <alec@alec.pl> Date: Tue, 15 Nov 2011 11:47:40 -0500 Subject: [PATCH] - Fix washing styles with quoted values e.g. font-family --- program/js/tiny_mce/plugins/media/editor_plugin_src.js | 1223 +++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 839 insertions(+), 384 deletions(-) diff --git a/program/js/tiny_mce/plugins/media/editor_plugin_src.js b/program/js/tiny_mce/plugins/media/editor_plugin_src.js index 4478ebb..ea79db1 100644 --- a/program/js/tiny_mce/plugins/media/editor_plugin_src.js +++ b/program/js/tiny_mce/plugins/media/editor_plugin_src.js @@ -1,435 +1,890 @@ /** - * $Id: editor_plugin_src.js 275 2007-05-01 15:35:08Z spocke $ + * editor_plugin_src.js * - * @author Moxiecode - * @copyright Copyright � 2004-2007, Moxiecode Systems AB, All rights reserved. + * Copyright 2009, Moxiecode Systems AB + * Released under LGPL License. + * + * License: http://tinymce.moxiecode.com/license + * Contributing: http://tinymce.moxiecode.com/contributing */ -/* Import plugin specific language pack */ -tinyMCE.importPluginLanguagePack('media'); +(function() { + var rootAttributes = tinymce.explode('id,name,width,height,style,align,class,hspace,vspace,bgcolor,type'), excludedAttrs = tinymce.makeMap(rootAttributes.join(',')), Node = tinymce.html.Node, + mediaTypes, scriptRegExp, JSON = tinymce.util.JSON, mimeTypes; -var TinyMCE_MediaPlugin = { - getInfo : function() { - return { - longname : 'Media', - author : 'Moxiecode Systems AB', - authorurl : 'http://tinymce.moxiecode.com', - infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/media', - version : tinyMCE.majorVersion + "." + tinyMCE.minorVersion - }; - }, + // Media types supported by this plugin + mediaTypes = [ + // Type, clsid:s, mime types, codebase + ["Flash", "d27cdb6e-ae6d-11cf-96b8-444553540000", "application/x-shockwave-flash", "http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"], + ["ShockWave", "166b1bca-3f9c-11cf-8075-444553540000", "application/x-director", "http://download.macromedia.com/pub/shockwave/cabs/director/sw.cab#version=8,5,1,0"], + ["WindowsMedia", "6bf52a52-394a-11d3-b153-00c04f79faa6,22d6f312-b0f6-11d0-94ab-0080c74c7e95,05589fa1-c356-11ce-bf01-00aa0055595a", "application/x-mplayer2", "http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"], + ["QuickTime", "02bf25d5-8c17-4b23-bc80-d3488abddc6b", "video/quicktime", "http://www.apple.com/qtactivex/qtplugin.cab#version=6,0,2,0"], + ["RealMedia", "cfcdaa03-8be4-11cf-b84b-0020afbbccfa", "audio/x-pn-realaudio-plugin", "http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"], + ["Java", "8ad9c840-044e-11d1-b3e9-00805f499d93", "application/x-java-applet", "http://java.sun.com/products/plugin/autodl/jinstall-1_5_0-windows-i586.cab#Version=1,5,0,0"], + ["Silverlight", "dfeaf541-f3e1-4c24-acac-99c30715084a", "application/x-silverlight-2"], + ["Iframe"], + ["Video"], + ["EmbeddedAudio"], + ["Audio"] + ]; - initInstance : function(inst) { - // Warn if user has flash plugin and media plugin at the same time - if (inst.hasPlugin('flash') && !tinyMCE.flashWarn) { - alert('Flash plugin is deprecated and should not be used together with the media plugin.'); - tinyMCE.flashWarn = true; + function toArray(obj) { + var undef, out, i; + + if (obj && !obj.splice) { + out = []; + + for (i = 0; true; i++) { + if (obj[i]) + out[i] = obj[i]; + else + break; + } + + return out; } - if (!tinyMCE.settings['media_skip_plugin_css']) - tinyMCE.importCSS(inst.getDoc(), tinyMCE.baseURL + "/plugins/media/css/content.css"); - }, + return obj; + }; - getControlHTML : function(cn) { - switch (cn) { - case "media": - return tinyMCE.getButtonHTML(cn, 'lang_media_desc', '{$pluginurl}/images/media.gif', 'mceMedia'); - } + tinymce.create('tinymce.plugins.MediaPlugin', { + init : function(ed, url) { + var self = this, lookup = {}, i, y, item, name; - return ""; - }, + function isMediaImg(node) { + return node && node.nodeName === 'IMG' && ed.dom.hasClass(node, 'mceItemMedia'); + }; - execCommand : function(editor_id, element, command, user_interface, value) { - // Handle commands - switch (command) { - case "mceMedia": - tinyMCE.openWindow({ - file : '../../plugins/media/media.htm', - width : 430 + tinyMCE.getLang('lang_media_delta_width', 0), - height : 470 + tinyMCE.getLang('lang_media_delta_height', 0) - }, { - editor_id : editor_id, - inline : "yes" + self.editor = ed; + self.url = url; + + // Parse media types into a lookup table + scriptRegExp = ''; + for (i = 0; i < mediaTypes.length; i++) { + name = mediaTypes[i][0]; + + item = { + name : name, + clsids : tinymce.explode(mediaTypes[i][1] || ''), + mimes : tinymce.explode(mediaTypes[i][2] || ''), + codebase : mediaTypes[i][3] + }; + + for (y = 0; y < item.clsids.length; y++) + lookup['clsid:' + item.clsids[y]] = item; + + for (y = 0; y < item.mimes.length; y++) + lookup[item.mimes[y]] = item; + + lookup['mceItem' + name] = item; + lookup[name.toLowerCase()] = item; + + scriptRegExp += (scriptRegExp ? '|' : '') + name; + } + + // Handle the media_types setting + tinymce.each(ed.getParam("media_types", + "video=mp4,m4v,ogv,webm;" + + "silverlight=xap;" + + "flash=swf,flv;" + + "shockwave=dcr;" + + "quicktime=mov,qt,mpg,mpeg;" + + "shockwave=dcr;" + + "windowsmedia=avi,wmv,wm,asf,asx,wmx,wvx;" + + "realmedia=rm,ra,ram;" + + "java=jar;" + + "audio=mp3,ogg" + ).split(';'), function(item) { + var i, extensions, type; + + item = item.split(/=/); + extensions = tinymce.explode(item[1].toLowerCase()); + for (i = 0; i < extensions.length; i++) { + type = lookup[item[0].toLowerCase()]; + + if (type) + lookup[extensions[i]] = type; + } + }); + + scriptRegExp = new RegExp('write(' + scriptRegExp + ')\\(([^)]+)\\)'); + self.lookup = lookup; + + ed.onPreInit.add(function() { + // Allow video elements + ed.schema.addValidElements('object[id|style|width|height|classid|codebase|*],param[name|value],embed[id|style|width|height|type|src|*],video[*],audio[*],source[*]'); + + // Convert video elements to image placeholder + ed.parser.addNodeFilter('object,embed,video,audio,script,iframe', function(nodes) { + var i = nodes.length; + + while (i--) + self.objectToImg(nodes[i]); }); - return true; - } + // Convert image placeholders to video elements + ed.serializer.addNodeFilter('img', function(nodes, name, args) { + var i = nodes.length, node; - // Pass to next handler in chain - return false; - }, + while (i--) { + node = nodes[i]; + if ((node.attr('class') || '').indexOf('mceItemMedia') !== -1) + self.imgToObject(node, args); + } + }); + }); - cleanup : function(type, content, inst) { - var nl, img, i, ne, d, s, ci; + ed.onInit.add(function() { + // Display "media" instead of "img" in element path + if (ed.theme && ed.theme.onResolveName) { + ed.theme.onResolveName.add(function(theme, path_object) { + if (path_object.name === 'img' && ed.dom.hasClass(path_object.node, 'mceItemMedia')) + path_object.name = 'media'; + }); + } - switch (type) { - case "insert_to_editor": - img = tinyMCE.getParam("theme_href") + '/images/spacer.gif'; - content = content.replace(/<script[^>]*>\s*write(Flash|ShockWave|WindowsMedia|QuickTime|RealMedia)\(\{([^\)]*)\}\);\s*<\/script>/gi, '<img class="mceItem$1" title="$2" src="' + img + '" />'); - content = content.replace(/<object([^>]*)>/gi, '<div class="mceItemObject" $1>'); - content = content.replace(/<embed([^>]*)>/gi, '<div class="mceItemObjectEmbed" $1>'); - content = content.replace(/<\/(object|embed)([^>]*)>/gi, '</div>'); - content = content.replace(/<param([^>]*)>/gi, '<div $1 class="mceItemParam"></div>'); - content = content.replace(new RegExp('\\/ class="mceItemParam"><\\/div>', 'gi'), 'class="mceItemParam"></div>'); - break; + // Add contect menu if it's loaded + if (ed && ed.plugins.contextmenu) { + ed.plugins.contextmenu.onContextMenu.add(function(plugin, menu, element) { + if (element.nodeName === 'IMG' && element.className.indexOf('mceItemMedia') !== -1) + menu.add({title : 'media.edit', icon : 'media', cmd : 'mceMedia'}); + }); + } + }); - case "insert_to_editor_dom": - d = inst.getDoc(); - nl = content.getElementsByTagName("img"); - for (i=0; i<nl.length; i++) { - if (/mceItem(Flash|ShockWave|WindowsMedia|QuickTime|RealMedia)/.test(nl[i].className)) { - nl[i].width = nl[i].title.replace(/.*width:[^0-9]?([0-9]+)%?.*/g, '$1'); - nl[i].height = nl[i].title.replace(/.*height:[^0-9]?([0-9]+)%?.*/g, '$1'); - //nl[i].align = nl[i].title.replace(/.*align:([a-z]+).*/gi, '$1'); + // Register commands + ed.addCommand('mceMedia', function() { + var data, img; + + img = ed.selection.getNode(); + if (isMediaImg(img)) { + data = ed.dom.getAttrib(img, 'data-mce-json'); + if (data) { + data = JSON.parse(data); + + // Add some extra properties to the data object + tinymce.each(rootAttributes, function(name) { + var value = ed.dom.getAttrib(img, name); + + if (value) + data[name] = value; + }); + + data.type = self.getType(img.className).name.toLowerCase(); } } - nl = tinyMCE.selectElements(content, 'DIV', function (n) {return tinyMCE.hasCSSClass(n, 'mceItemObject');}); - for (i=0; i<nl.length; i++) { - ci = tinyMCE.getAttrib(nl[i], "classid").toLowerCase().replace(/\s+/g, ''); - - switch (ci) { - case 'clsid:d27cdb6e-ae6d-11cf-96b8-444553540000': - nl[i].parentNode.replaceChild(TinyMCE_MediaPlugin._createImg('mceItemFlash', d, nl[i]), nl[i]); - break; - - case 'clsid:166b1bca-3f9c-11cf-8075-444553540000': - nl[i].parentNode.replaceChild(TinyMCE_MediaPlugin._createImg('mceItemShockWave', d, nl[i]), nl[i]); - break; - - case 'clsid:6bf52a52-394a-11d3-b153-00c04f79faa6': - case 'clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95': - case 'clsid:05589fa1-c356-11ce-bf01-00aa0055595a': - nl[i].parentNode.replaceChild(TinyMCE_MediaPlugin._createImg('mceItemWindowsMedia', d, nl[i]), nl[i]); - break; - - case 'clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b': - nl[i].parentNode.replaceChild(TinyMCE_MediaPlugin._createImg('mceItemQuickTime', d, nl[i]), nl[i]); - break; - - case 'clsid:cfcdaa03-8be4-11cf-b84b-0020afbbccfa': - nl[i].parentNode.replaceChild(TinyMCE_MediaPlugin._createImg('mceItemRealMedia', d, nl[i]), nl[i]); - break; - } + if (!data) { + data = { + type : 'flash', + video: {sources:[]}, + params: {} + }; } - // Handle embed (if any) - nl = tinyMCE.selectNodes(content, function (n) {return n.className == 'mceItemObjectEmbed';}); - for (i=0; i<nl.length; i++) { - switch (tinyMCE.getAttrib(nl[i], 'type')) { - case 'application/x-shockwave-flash': - TinyMCE_MediaPlugin._createImgFromEmbed(nl[i], d, 'mceItemFlash'); - break; + ed.windowManager.open({ + file : url + '/media.htm', + width : 430 + parseInt(ed.getLang('media.delta_width', 0)), + height : 500 + parseInt(ed.getLang('media.delta_height', 0)), + inline : 1 + }, { + plugin_url : url, + data : data + }); + }); - case 'application/x-director': - TinyMCE_MediaPlugin._createImgFromEmbed(nl[i], d, 'mceItemShockWave'); - break; + // Register buttons + ed.addButton('media', {title : 'media.desc', cmd : 'mceMedia'}); - case 'application/x-mplayer2': - TinyMCE_MediaPlugin._createImgFromEmbed(nl[i], d, 'mceItemWindowsMedia'); - break; + // Update media selection status + ed.onNodeChange.add(function(ed, cm, node) { + cm.setActive('media', isMediaImg(node)); + }); + }, - case 'video/quicktime': - TinyMCE_MediaPlugin._createImgFromEmbed(nl[i], d, 'mceItemQuickTime'); - break; + convertUrl : function(url, force_absolute) { + var self = this, editor = self.editor, settings = editor.settings, + urlConverter = settings.url_converter, + urlConverterScope = settings.url_converter_scope || self; - case 'audio/x-pn-realaudio-plugin': - TinyMCE_MediaPlugin._createImgFromEmbed(nl[i], d, 'mceItemRealMedia'); - break; - } - } - break; + if (!url) + return url; - case "get_from_editor": - var startPos = -1, endPos, attribs, chunkBefore, chunkAfter, embedHTML, at, pl, cb, mt, ex; + if (force_absolute) + return editor.documentBaseURI.toAbsolute(url); - while ((startPos = content.indexOf('<img', startPos+1)) != -1) { - endPos = content.indexOf('/>', startPos); - attribs = TinyMCE_MediaPlugin._parseAttributes(content.substring(startPos + 4, endPos)); + return urlConverter.call(urlConverterScope, url, 'src', 'object'); + }, - // Is not flash, skip it - if (!/mceItem(Flash|ShockWave|WindowsMedia|QuickTime|RealMedia)/.test(attribs['class'])) - continue; + getInfo : function() { + return { + longname : 'Media', + author : 'Moxiecode Systems AB', + authorurl : 'http://tinymce.moxiecode.com', + infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/media', + version : tinymce.majorVersion + "." + tinymce.minorVersion + }; + }, - endPos += 2; + /** + * Converts the JSON data object to an img node. + */ + dataToImg : function(data, force_absolute) { + var self = this, editor = self.editor, baseUri = editor.documentBaseURI, sources, attrs, img, i; - // Parse attributes - at = attribs['title']; - if (at) { - at = at.replace(/&(#39|apos);/g, "'"); - at = at.replace(/&#quot;/g, '"'); + data.params.src = self.convertUrl(data.params.src, force_absolute); - try { - pl = eval('x={' + at + '};'); - } catch (ex) { - pl = {}; - } - } + attrs = data.video.attrs; + if (attrs) + attrs.src = self.convertUrl(attrs.src, force_absolute); - // Use object/embed - if (!tinyMCE.getParam('media_use_script', false)) { - switch (attribs['class']) { - case 'mceItemFlash': - ci = 'd27cdb6e-ae6d-11cf-96b8-444553540000'; - cb = 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0'; - mt = 'application/x-shockwave-flash'; - break; + if (attrs) + attrs.poster = self.convertUrl(attrs.poster, force_absolute); - case 'mceItemShockWave': - ci = '166B1BCA-3F9C-11CF-8075-444553540000'; - cb = 'http://download.macromedia.com/pub/shockwave/cabs/director/sw.cab#version=8,5,1,0'; - mt = 'application/x-director'; - break; - - case 'mceItemWindowsMedia': - ci = tinyMCE.getParam('media_wmp6_compatible') ? '05589FA1-C356-11CE-BF01-00AA0055595A' : '6BF52A52-394A-11D3-B153-00C04F79FAA6'; - cb = 'http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'; - mt = 'application/x-mplayer2'; - break; - - case 'mceItemQuickTime': - ci = '02BF25D5-8C17-4B23-BC80-D3488ABDDC6B'; - cb = 'http://www.apple.com/qtactivex/qtplugin.cab#version=6,0,2,0'; - mt = 'video/quicktime'; - break; - - case 'mceItemRealMedia': - ci = 'CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA'; - cb = 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0'; - mt = 'audio/x-pn-realaudio-plugin'; - break; - } - - // Force absolute URL - if (!tinyMCE.getParam("relative_urls")) - pl.src = tinyMCE.convertRelativeToAbsoluteURL(tinyMCE.settings['base_href'], pl.src); - - embedHTML = TinyMCE_MediaPlugin._getEmbed(ci, cb, mt, pl, attribs); - } else { - // Use script version - switch (attribs['class']) { - case 'mceItemFlash': - s = 'writeFlash'; - break; - - case 'mceItemShockWave': - s = 'writeShockWave'; - break; - - case 'mceItemWindowsMedia': - s = 'writeWindowsMedia'; - break; - - case 'mceItemQuickTime': - s = 'writeQuickTime'; - break; - - case 'mceItemRealMedia': - s = 'writeRealMedia'; - break; - } - - if (attribs.width) - at = at.replace(/width:[^0-9]?[0-9]+%?[^0-9]?/g, "width:'" + attribs.width + "'"); - - if (attribs.height) - at = at.replace(/height:[^0-9]?[0-9]+%?[^0-9]?/g, "height:'" + attribs.height + "'"); - - // Force absolute URL - if (!tinyMCE.getParam("relative_urls")) { - pl.src = tinyMCE.convertRelativeToAbsoluteURL(tinyMCE.settings['base_href'], pl.src); - at = at.replace(new RegExp("src:'[^']*'", "g"), "src:'" + pl.src + "'"); - } - - embedHTML = '<script type="text/javascript">' + s + '({' + at + '});</script>'; - } - - // Insert embed/object chunk - chunkBefore = content.substring(0, startPos); - chunkAfter = content.substring(endPos); - content = chunkBefore + embedHTML + chunkAfter; - } - break; - } - - return content; - }, - - handleNodeChange : function(editor_id, node, undo_index, undo_levels, visual_aid, any_selection) { - if (node == null) - return; - - do { - if (node.nodeName == "IMG" && /mceItem(Flash|ShockWave|WindowsMedia|QuickTime|RealMedia)/.test(tinyMCE.getAttrib(node, 'class'))) { - tinyMCE.switchClass(editor_id + '_media', 'mceButtonSelected'); - return true; + sources = toArray(data.video.sources); + if (sources) { + for (i = 0; i < sources.length; i++) + sources[i].src = self.convertUrl(sources[i].src, force_absolute); } - } while ((node = node.parentNode)); - tinyMCE.switchClass(editor_id + '_media', 'mceButtonNormal'); + img = self.editor.dom.create('img', { + id : data.id, + style : data.style, + align : data.align, + hspace : data.hspace, + vspace : data.vspace, + src : self.editor.theme.url + '/img/trans.gif', + 'class' : 'mceItemMedia mceItem' + self.getType(data.type).name, + 'data-mce-json' : JSON.serialize(data, "'") + }); - return true; - }, + img.width = data.width || (data.type == 'audio' ? "300" : "320"); + img.height = data.height || (data.type == 'audio' ? "32" : "240"); - _createImgFromEmbed : function(n, d, cl) { - var ne, at, i, ti = '', an; + return img; + }, - ne = d.createElement('img'); - ne.src = tinyMCE.getParam("theme_href") + '/images/spacer.gif'; - ne.width = tinyMCE.getAttrib(n, 'width'); - ne.height = tinyMCE.getAttrib(n, 'height'); - ne.className = cl; + /** + * Converts the JSON data object to a HTML string. + */ + dataToHtml : function(data, force_absolute) { + return this.editor.serializer.serialize(this.dataToImg(data, force_absolute), {forced_root_block : '', force_absolute : force_absolute}); + }, - at = n.attributes; - for (i=0; i<at.length; i++) { - if (at[i].specified && at[i].nodeValue) { - an = at[i].nodeName.toLowerCase(); + /** + * Converts the JSON data object to a HTML string. + */ + htmlToData : function(html) { + var fragment, img, data; - if (an == 'src') - continue; + data = { + type : 'flash', + video: {sources:[]}, + params: {} + }; - if (an == 'mce_src') - an = 'src'; + fragment = this.editor.parser.parse(html); + img = fragment.getAll('img')[0]; - if (an.indexOf('mce_') == -1 && !new RegExp('^(class|type)$').test(an)) - ti += an.toLowerCase() + ':\'' + at[i].nodeValue + "',"; + if (img) { + data = JSON.parse(img.attr('data-mce-json')); + data.type = this.getType(img.attr('class')).name.toLowerCase(); + + // Add some extra properties to the data object + tinymce.each(rootAttributes, function(name) { + var value = img.attr(name); + + if (value) + data[name] = value; + }); } - } - ti = ti.length > 0 ? ti.substring(0, ti.length - 1) : ti; - ne.title = ti; + return data; + }, - n.parentNode.replaceChild(ne, n); - }, + /** + * Get type item by extension, class, clsid or mime type. + * + * @method getType + * @param {String} value Value to get type item by. + * @return {Object} Type item object or undefined. + */ + getType : function(value) { + var i, values, typeItem; - _createImg : function(cl, d, n) { - var i, nl, ti = "", an, av, al = new Array(); + // Find type by checking the classes + values = tinymce.explode(value, ' '); + for (i = 0; i < values.length; i++) { + typeItem = this.lookup[values[i]]; - ne = d.createElement('img'); - ne.src = tinyMCE.getParam("theme_href") + '/images/spacer.gif'; - ne.width = tinyMCE.getAttrib(n, 'width'); - ne.height = tinyMCE.getAttrib(n, 'height'); - ne.className = cl; - - al.id = tinyMCE.getAttrib(n, 'id'); - al.name = tinyMCE.getAttrib(n, 'name'); - al.width = tinyMCE.getAttrib(n, 'width'); - al.height = tinyMCE.getAttrib(n, 'height'); - al.bgcolor = tinyMCE.getAttrib(n, 'bgcolor'); - al.align = tinyMCE.getAttrib(n, 'align'); - al.class_name = tinyMCE.getAttrib(n, 'mce_class'); - - nl = n.getElementsByTagName('div'); - for (i=0; i<nl.length; i++) { - av = tinyMCE.getAttrib(nl[i], 'value'); - av = av.replace(new RegExp('\\\\', 'g'), '\\\\'); - av = av.replace(new RegExp('"', 'g'), '\\"'); - av = av.replace(new RegExp("'", 'g'), "\\'"); - an = tinyMCE.getAttrib(nl[i], 'name'); - al[an] = av; - } - - if (al.movie) { - al.src = al.movie; - al.movie = null; - } - - for (an in al) { - if (al[an] != null && typeof(al[an]) != "function" && al[an] != '') - ti += an.toLowerCase() + ':\'' + al[an] + "',"; - } - - ti = ti.length > 0 ? ti.substring(0, ti.length - 1) : ti; - ne.title = ti; - - return ne; - }, - - _getEmbed : function(cls, cb, mt, p, at) { - var h = '', n; - - p.width = at.width ? at.width : p.width; - p.height = at.height ? at.height : p.height; - - h += '<object classid="clsid:' + cls + '" codebase="' + cb + '"'; - h += typeof(p.id) != "undefined" ? ' id="' + p.id + '"' : ''; - h += typeof(p.name) != "undefined" ? ' name="' + p.name + '"' : ''; - h += typeof(p.width) != "undefined" ? ' width="' + p.width + '"' : ''; - h += typeof(p.height) != "undefined" ? ' height="' + p.height + '"' : ''; - h += typeof(p.align) != "undefined" ? ' align="' + p.align + '"' : ''; - h += '>'; - - for (n in p) { - if (typeof(p[n]) != "undefined" && typeof(p[n]) != "function") { - h += '<param name="' + n + '" value="' + p[n] + '" />'; - - // Add extra url parameter if it's an absolute URL on WMP - if (n == 'src' && p[n].indexOf('://') != -1 && mt == 'application/x-mplayer2') - h += '<param name="url" value="' + p[n] + '" />'; + if (typeItem) + return typeItem; } + }, + + /** + * Converts a tinymce.html.Node image element to video/object/embed. + */ + imgToObject : function(node, args) { + var self = this, editor = self.editor, video, object, embed, iframe, name, value, data, + source, sources, params, param, typeItem, i, item, mp4Source, replacement, + posterSrc, style, audio; + + // Adds the flash player + function addPlayer(video_src, poster_src) { + var baseUri, flashVars, flashVarsOutput, params, flashPlayer; + + flashPlayer = editor.getParam('flash_video_player_url', self.convertUrl(self.url + '/moxieplayer.swf')); + if (flashPlayer) { + baseUri = editor.documentBaseURI; + data.params.src = flashPlayer; + + // Convert the movie url to absolute urls + if (editor.getParam('flash_video_player_absvideourl', true)) { + video_src = baseUri.toAbsolute(video_src || '', true); + poster_src = baseUri.toAbsolute(poster_src || '', true); + } + + // Generate flash vars + flashVarsOutput = ''; + flashVars = editor.getParam('flash_video_player_flashvars', {url : '$url', poster : '$poster'}); + tinymce.each(flashVars, function(value, name) { + // Replace $url and $poster variables in flashvars value + value = value.replace(/\$url/, video_src || ''); + value = value.replace(/\$poster/, poster_src || ''); + + if (value.length > 0) + flashVarsOutput += (flashVarsOutput ? '&' : '') + name + '=' + escape(value); + }); + + if (flashVarsOutput.length) + data.params.flashvars = flashVarsOutput; + + params = editor.getParam('flash_video_player_params', { + allowfullscreen: true, + allowscriptaccess: true + }); + + tinymce.each(params, function(value, name) { + data.params[name] = "" + value; + }); + } + }; + + data = node.attr('data-mce-json'); + if (!data) + return; + + data = JSON.parse(data); + typeItem = this.getType(node.attr('class')); + + style = node.attr('data-mce-style') + if (!style) { + style = node.attr('style'); + + if (style) + style = editor.dom.serializeStyle(editor.dom.parseStyle(style, 'img')); + } + + // Handle iframe + if (typeItem.name === 'Iframe') { + replacement = new Node('iframe', 1); + + tinymce.each(rootAttributes, function(name) { + var value = node.attr(name); + + if (name == 'class' && value) + value = value.replace(/mceItem.+ ?/g, ''); + + if (value && value.length > 0) + replacement.attr(name, value); + }); + + for (name in data.params) + replacement.attr(name, data.params[name]); + + replacement.attr({ + style: style, + src: data.params.src + }); + + node.replace(replacement); + + return; + } + + // Handle scripts + if (this.editor.settings.media_use_script) { + replacement = new Node('script', 1).attr('type', 'text/javascript'); + + value = new Node('#text', 3); + value.value = 'write' + typeItem.name + '(' + JSON.serialize(tinymce.extend(data.params, { + width: node.attr('width'), + height: node.attr('height') + })) + ');'; + + replacement.append(value); + node.replace(replacement); + + return; + } + + // Add HTML5 video element + if (typeItem.name === 'Video' && data.video.sources[0]) { + // Create new object element + video = new Node('video', 1).attr(tinymce.extend({ + id : node.attr('id'), + width: node.attr('width'), + height: node.attr('height'), + style : style + }, data.video.attrs)); + + // Get poster source and use that for flash fallback + if (data.video.attrs) + posterSrc = data.video.attrs.poster; + + sources = data.video.sources = toArray(data.video.sources); + for (i = 0; i < sources.length; i++) { + if (/\.mp4$/.test(sources[i].src)) + mp4Source = sources[i].src; + } + + if (!sources[0].type) { + video.attr('src', sources[0].src); + sources.splice(0, 1); + } + + for (i = 0; i < sources.length; i++) { + source = new Node('source', 1).attr(sources[i]); + source.shortEnded = true; + video.append(source); + } + + // Create flash fallback for video if we have a mp4 source + if (mp4Source) { + addPlayer(mp4Source, posterSrc); + typeItem = self.getType('flash'); + } else + data.params.src = ''; + } + + // Add HTML5 audio element + if (typeItem.name === 'Audio' && data.video.sources[0]) { + // Create new object element + audio = new Node('audio', 1).attr(tinymce.extend({ + id : node.attr('id'), + width: node.attr('width'), + height: node.attr('height'), + style : style + }, data.video.attrs)); + + // Get poster source and use that for flash fallback + if (data.video.attrs) + posterSrc = data.video.attrs.poster; + + sources = data.video.sources = toArray(data.video.sources); + if (!sources[0].type) { + audio.attr('src', sources[0].src); + sources.splice(0, 1); + } + + for (i = 0; i < sources.length; i++) { + source = new Node('source', 1).attr(sources[i]); + source.shortEnded = true; + audio.append(source); + } + + data.params.src = ''; + } + + if (typeItem.name === 'EmbeddedAudio') { + embed = new Node('embed', 1); + embed.shortEnded = true; + embed.attr({ + id: node.attr('id'), + width: node.attr('width'), + height: node.attr('height'), + style : style, + type: node.attr('type') + }); + + for (name in data.params) + embed.attr(name, data.params[name]); + + tinymce.each(rootAttributes, function(name) { + if (data[name] && name != 'type') + embed.attr(name, data[name]); + }); + + data.params.src = ''; + } + + // Do we have a params src then we can generate object + if (data.params.src) { + // Is flv movie add player for it + if (/\.flv$/i.test(data.params.src)) + addPlayer(data.params.src, ''); + + if (args && args.force_absolute) + data.params.src = editor.documentBaseURI.toAbsolute(data.params.src); + + // Create new object element + object = new Node('object', 1).attr({ + id : node.attr('id'), + width: node.attr('width'), + height: node.attr('height'), + style : style + }); + + tinymce.each(rootAttributes, function(name) { + var value = data[name]; + + if (name == 'class' && value) + value = value.replace(/mceItem.+ ?/g, ''); + + if (value && name != 'type') + object.attr(name, value); + }); + + // Add params + for (name in data.params) { + param = new Node('param', 1); + param.shortEnded = true; + value = data.params[name]; + + // Windows media needs to use url instead of src for the media URL + if (name === 'src' && typeItem.name === 'WindowsMedia') + name = 'url'; + + param.attr({name: name, value: value}); + object.append(param); + } + + // Setup add type and classid if strict is disabled + if (this.editor.getParam('media_strict', true)) { + object.attr({ + data: data.params.src, + type: typeItem.mimes[0] + }); + } else { + object.attr({ + classid: "clsid:" + typeItem.clsids[0], + codebase: typeItem.codebase + }); + + embed = new Node('embed', 1); + embed.shortEnded = true; + embed.attr({ + id: node.attr('id'), + width: node.attr('width'), + height: node.attr('height'), + style : style, + type: typeItem.mimes[0] + }); + + for (name in data.params) + embed.attr(name, data.params[name]); + + tinymce.each(rootAttributes, function(name) { + if (data[name] && name != 'type') + embed.attr(name, data[name]); + }); + + object.append(embed); + } + + // Insert raw HTML + if (data.object_html) { + value = new Node('#text', 3); + value.raw = true; + value.value = data.object_html; + object.append(value); + } + + // Append object to video element if it exists + if (video) + video.append(object); + } + + if (video) { + // Insert raw HTML + if (data.video_html) { + value = new Node('#text', 3); + value.raw = true; + value.value = data.video_html; + video.append(value); + } + } + + if (audio) { + // Insert raw HTML + if (data.video_html) { + value = new Node('#text', 3); + value.raw = true; + value.value = data.video_html; + audio.append(value); + } + } + + var n = video || audio || object || embed; + if (n) + node.replace(n); + else + node.remove(); + }, + + /** + * Converts a tinymce.html.Node video/object/embed to an img element. + * + * The video/object/embed will be converted into an image placeholder with a JSON data attribute like this: + * <img class="mceItemMedia mceItemFlash" width="100" height="100" data-mce-json="{..}" /> + * + * The JSON structure will be like this: + * {'params':{'flashvars':'something','quality':'high','src':'someurl'}, 'video':{'sources':[{src: 'someurl', type: 'video/mp4'}]}} + */ + objectToImg : function(node) { + var object, embed, video, iframe, img, name, id, width, height, style, i, html, + param, params, source, sources, data, type, lookup = this.lookup, + matches, attrs, urlConverter = this.editor.settings.url_converter, + urlConverterScope = this.editor.settings.url_converter_scope, + hspace, vspace, align, bgcolor; + + function getInnerHTML(node) { + return new tinymce.html.Serializer({ + inner: true, + validate: false + }).serialize(node); + }; + + function lookupAttribute(o, attr) { + return lookup[(o.attr(attr) || '').toLowerCase()]; + } + + function lookupExtension(src) { + var ext = src.replace(/^.*\.([^.]+)$/, '$1'); + return lookup[ext.toLowerCase() || '']; + } + + // If node isn't in document + if (!node.parent) + return; + + // Handle media scripts + if (node.name === 'script') { + if (node.firstChild) + matches = scriptRegExp.exec(node.firstChild.value); + + if (!matches) + return; + + type = matches[1]; + data = {video : {}, params : JSON.parse(matches[2])}; + width = data.params.width; + height = data.params.height; + } + + // Setup data objects + data = data || { + video : {}, + params : {} + }; + + // Setup new image object + img = new Node('img', 1); + img.attr({ + src : this.editor.theme.url + '/img/trans.gif' + }); + + // Video element + name = node.name; + if (name === 'video' || name == 'audio') { + video = node; + object = node.getAll('object')[0]; + embed = node.getAll('embed')[0]; + width = video.attr('width'); + height = video.attr('height'); + id = video.attr('id'); + data.video = {attrs : {}, sources : []}; + + // Get all video attributes + attrs = data.video.attrs; + for (name in video.attributes.map) + attrs[name] = video.attributes.map[name]; + + source = node.attr('src'); + if (source) + data.video.sources.push({src : urlConverter.call(urlConverterScope, source, 'src', node.name)}); + + // Get all sources + sources = video.getAll("source"); + for (i = 0; i < sources.length; i++) { + source = sources[i].remove(); + + data.video.sources.push({ + src: urlConverter.call(urlConverterScope, source.attr('src'), 'src', 'source'), + type: source.attr('type'), + media: source.attr('media') + }); + } + + // Convert the poster URL + if (attrs.poster) + attrs.poster = urlConverter.call(urlConverterScope, attrs.poster, 'poster', node.name); + } + + // Object element + if (node.name === 'object') { + object = node; + embed = node.getAll('embed')[0]; + } + + // Embed element + if (node.name === 'embed') + embed = node; + + // Iframe element + if (node.name === 'iframe') { + iframe = node; + type = 'Iframe'; + } + + if (object) { + // Get width/height + width = width || object.attr('width'); + height = height || object.attr('height'); + style = style || object.attr('style'); + id = id || object.attr('id'); + hspace = hspace || object.attr('hspace'); + vspace = vspace || object.attr('vspace'); + align = align || object.attr('align'); + bgcolor = bgcolor || object.attr('bgcolor'); + data.name = object.attr('name'); + + // Get all object params + params = object.getAll("param"); + for (i = 0; i < params.length; i++) { + param = params[i]; + name = param.remove().attr('name'); + + if (!excludedAttrs[name]) + data.params[name] = param.attr('value'); + } + + data.params.src = data.params.src || object.attr('data'); + } + + if (embed) { + // Get width/height + width = width || embed.attr('width'); + height = height || embed.attr('height'); + style = style || embed.attr('style'); + id = id || embed.attr('id'); + hspace = hspace || embed.attr('hspace'); + vspace = vspace || embed.attr('vspace'); + align = align || embed.attr('align'); + bgcolor = bgcolor || embed.attr('bgcolor'); + + // Get all embed attributes + for (name in embed.attributes.map) { + if (!excludedAttrs[name] && !data.params[name]) + data.params[name] = embed.attributes.map[name]; + } + } + + if (iframe) { + // Get width/height + width = iframe.attr('width'); + height = iframe.attr('height'); + style = style || iframe.attr('style'); + id = iframe.attr('id'); + hspace = iframe.attr('hspace'); + vspace = iframe.attr('vspace'); + align = iframe.attr('align'); + bgcolor = iframe.attr('bgcolor'); + + tinymce.each(rootAttributes, function(name) { + img.attr(name, iframe.attr(name)); + }); + + // Get all iframe attributes + for (name in iframe.attributes.map) { + if (!excludedAttrs[name] && !data.params[name]) + data.params[name] = iframe.attributes.map[name]; + } + } + + // Use src not movie + if (data.params.movie) { + data.params.src = data.params.src || data.params.movie; + delete data.params.movie; + } + + // Convert the URL to relative/absolute depending on configuration + if (data.params.src) + data.params.src = urlConverter.call(urlConverterScope, data.params.src, 'src', 'object'); + + if (video) { + if (node.name === 'video') + type = lookup.video.name; + else if (node.name === 'audio') + type = lookup.audio.name; + } + + if (object && !type) + type = (lookupAttribute(object, 'clsid') || lookupAttribute(object, 'classid') || lookupAttribute(object, 'type') || {}).name; + + if (embed && !type) + type = (lookupAttribute(embed, 'type') || lookupExtension(data.params.src) || {}).name; + + // for embedded audio we preserve the original specified type + if (embed && type == 'EmbeddedAudio') { + data.params.type = embed.attr('type'); + } + + // Replace the video/object/embed element with a placeholder image containing the data + node.replace(img); + + // Remove embed + if (embed) + embed.remove(); + + // Serialize the inner HTML of the object element + if (object) { + html = getInnerHTML(object.remove()); + + if (html) + data.object_html = html; + } + + // Serialize the inner HTML of the video element + if (video) { + html = getInnerHTML(video.remove()); + + if (html) + data.video_html = html; + } + + data.hspace = hspace; + data.vspace = vspace; + data.align = align; + data.bgcolor = bgcolor; + + // Set width/height of placeholder + img.attr({ + id : id, + 'class' : 'mceItemMedia mceItem' + (type || 'Flash'), + style : style, + width : width || (node.name == 'audio' ? "300" : "320"), + height : height || (node.name == 'audio' ? "32" : "240"), + hspace : hspace, + vspace : vspace, + align : align, + bgcolor : bgcolor, + "data-mce-json" : JSON.serialize(data, "'") + }); } + }); - h += '<embed type="' + mt + '"'; - - for (n in p) { - if (typeof(p[n]) == "function") - continue; - - // Skip url parameter for embed tag on WMP - if (!(n == 'url' && mt == 'application/x-mplayer2')) - h += ' ' + n + '="' + p[n] + '"'; - } - - h += '></embed></object>'; - - return h; - }, - - _parseAttributes : function(attribute_string) { - var attributeName = "", endChr = '"'; - var attributeValue = ""; - var withInName; - var withInValue; - var attributes = new Array(); - var whiteSpaceRegExp = new RegExp('^[ \n\r\t]+', 'g'); - - if (attribute_string == null || attribute_string.length < 2) - return null; - - withInName = withInValue = false; - - for (var i=0; i<attribute_string.length; i++) { - var chr = attribute_string.charAt(i); - - if ((chr == '"' || chr == "'") && !withInValue) { - withInValue = true; - endChr = chr; - } else if (chr == endChr && withInValue) { - withInValue = false; - - var pos = attributeName.lastIndexOf(' '); - if (pos != -1) - attributeName = attributeName.substring(pos+1); - - attributes[attributeName.toLowerCase()] = attributeValue.substring(1); - - attributeName = ""; - attributeValue = ""; - } else if (!whiteSpaceRegExp.test(chr) && !withInName && !withInValue) - withInName = true; - - if (chr == '=' && withInName) - withInName = false; - - if (withInName) - attributeName += chr; - - if (withInValue) - attributeValue += chr; - } - - return attributes; - } -}; - -tinyMCE.addPlugin("media", TinyMCE_MediaPlugin); + // Register plugin + tinymce.PluginManager.add('media', tinymce.plugins.MediaPlugin); +})(); -- Gitblit v1.9.1