From f32f559ab78a57f2b7ad596f0b99bd2520672f52 Mon Sep 17 00:00:00 2001 From: "tg@umbraco.com" Date: Fri, 31 Aug 2012 09:37:35 -0200 Subject: [PATCH] Adds tinyMCE umbraco embed plugin --- src/Umbraco.Web.UI/Umbraco.Web.UI.csproj | 10 +- .../tinymce3/plugins/umbracoembed/dialog.htm | 92 ++++++++++++++++++ .../plugins/umbracoembed/editor_plugin.js | 1 + .../plugins/umbracoembed/editor_plugin_src.js | 84 ++++++++++++++++ .../plugins/umbracoembed/img/ajax-loader.gif | Bin 0 -> 1928 bytes .../plugins/umbracoembed/img/embed.png | Bin 0 -> 537 bytes .../plugins/umbracoembed/js/dialog.js | 82 ++++++++++++++++ .../tinymce3/plugins/umbracoembed/langs/en.js | 10 ++ .../plugins/umbracoembed/langs/en_dlg.js | 10 ++ 9 files changed, 288 insertions(+), 1 deletion(-) create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/dialog.htm create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin.js create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin_src.js create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/img/ajax-loader.gif create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/img/embed.png create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/js/dialog.js create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en.js create mode 100644 src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en_dlg.js diff --git a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj index e551354d14..628c1d2022 100644 --- a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj +++ b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj @@ -323,7 +323,7 @@ - + @@ -735,6 +735,14 @@ + + + + + + + + diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/dialog.htm b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/dialog.htm new file mode 100644 index 0000000000..8587621d74 --- /dev/null +++ b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/dialog.htm @@ -0,0 +1,92 @@ + + + + {#embed_dlg.title} + + + + + + + + +
+ +
+
+
+ {#embed_dlg.general} + + + + + + + + + +
+ +
+ + + + + + +
x   
+
+ +
+
+ {#embed_dlg.preview} +
+
+ +
+
+
+
+
+
+ {#embed_dlg.source} + +
+
+
+ + +
+ + +
+
+ + + diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin.js b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin.js new file mode 100644 index 0000000000..ec1f81ea40 --- /dev/null +++ b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin.js @@ -0,0 +1 @@ +(function(){tinymce.PluginManager.requireLangPack("example");tinymce.create("tinymce.plugins.ExamplePlugin",{init:function(a,b){a.addCommand("mceExample",function(){a.windowManager.open({file:b+"/dialog.htm",width:320+parseInt(a.getLang("example.delta_width",0)),height:120+parseInt(a.getLang("example.delta_height",0)),inline:1},{plugin_url:b,some_custom_arg:"custom arg"})});a.addButton("example",{title:"example.desc",cmd:"mceExample",image:b+"/img/example.gif"});a.onNodeChange.add(function(d,c,e){c.setActive("example",e.nodeName=="IMG")})},createControl:function(b,a){return null},getInfo:function(){return{longname:"Example plugin",author:"Some author",authorurl:"http://tinymce.moxiecode.com",infourl:"http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/example",version:"1.0"}}});tinymce.PluginManager.add("example",tinymce.plugins.ExamplePlugin)})(); \ No newline at end of file diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin_src.js b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin_src.js new file mode 100644 index 0000000000..2404fd4362 --- /dev/null +++ b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/editor_plugin_src.js @@ -0,0 +1,84 @@ +/** + * editor_plugin_src.js + * + * Copyright 2009, Moxiecode Systems AB + * Released under LGPL License. + * + * License: http://tinymce.moxiecode.com/license + * Contributing: http://tinymce.moxiecode.com/contributing + */ + +(function() { + // Load plugin specific language pack + tinymce.PluginManager.requireLangPack('umbracoembed'); + + tinymce.create('tinymce.plugins.umbracoembed', { + /** + * Initializes the plugin, this will be executed after the plugin has been created. + * This call is done before the editor instance has finished it's initialization so use the onInit event + * of the editor instance to intercept that event. + * + * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. + * @param {string} url Absolute URL to where the plugin is located. + */ + init : function(ed, url) { + // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample'); + ed.addCommand('mceUmbracoEmbed', function() { + ed.windowManager.open({ + file : url + '/dialog.htm', + width : 600 + parseInt(ed.getLang('example.delta_width', 0)), + height : 400 + parseInt(ed.getLang('example.delta_height', 0)), + inline : 1 + }, { + plugin_url : url, // Plugin absolute URL + some_custom_arg : 'custom arg' // Custom argument + }); + }); + + // Register example button + ed.addButton('umbracoembed', { + title : 'Embed third party media', + cmd : 'mceUmbracoEmbed', + image : url + '/img/embed.png' + }); + + // Add a node change handler, selects the button in the UI when a image is selected + /*ed.onNodeChange.add(function(ed, cm, n) { + cm.setActive('example', n.nodeName == 'IMG'); + });*/ + }, + + /** + * Creates control instances based in the incomming name. This method is normally not + * needed since the addButton method of the tinymce.Editor class is a more easy way of adding buttons + * but you sometimes need to create more complex controls like listboxes, split buttons etc then this + * method can be used to create those. + * + * @param {String} n Name of the control to create. + * @param {tinymce.ControlManager} cm Control manager to use inorder to create new control. + * @return {tinymce.ui.Control} New control instance or null if no control was created. + */ + createControl : function(n, cm) { + return null; + }, + + /** + * Returns information about the plugin as a name/value array. + * The current keys are longname, author, authorurl, infourl and version. + * + * @return {Object} Name/value array containing information about the plugin. + */ + getInfo : function() { + return { + longname : 'Umbraco Embed', + author : 'Tim Geyssens', + authorurl : 'http://http://umbraco.com/', + infourl : 'http://http://umbraco.com/', + version : "1.0" + }; + } + }); + + // Register plugin + tinymce.PluginManager.add('umbracoembed', tinymce.plugins.umbracoembed); +})(); \ No newline at end of file diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/img/ajax-loader.gif b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/img/ajax-loader.gif new file mode 100644 index 0000000000000000000000000000000000000000..521a291d748c84b37cf75fe7003ca0ff04f33fb5 GIT binary patch literal 1928 zcmdVa?@tz=)H2#yZ97W^J8C-PQkOKwEW@eMrL&ze+4jWP zV^YDJfAZl`ssWC@PoBeLmm#__$Cg ztgWrx+1V*BF3!x%EGsMP>+3@hq_eZr@At2)tZ=#9hK2?l$A^c9o12?kTU#qDD+7Um zLZMh%S{fJ_u-R<&_4OK!rm(P3B9Rmn6u8}PtybIA)Kp$xUQ<)!bUFnB!TS1oV`HPs zn98)6rvP@y%!q zMV&DtHhafuf;rg1LChe_Wrd{#ZNmBv0YI}NH$b0A>2g~JlT#OgmBF-MmtE=N#f6EC zMaC>U(GB_rCE4z$vt9z>Zh8omx7kndovud@Kj?PWx3Lm`e)!R7vsnFz2j$#+a(%E= z6fTI0>CN*;VWpM@HMKcTD-1@J!7Uj5&7lc{BL?6w^HVimm8!a$mFaTn3c) zx+3)(5qm9L6Du8m`Qp|3Fe_0}b-Vl7eKQSo)@kC9uo{e1+m5T*`NxO+ubTf>9rHaN zRNF5G(L-nTAZwHoillnlWXJRj4$ZOWP4vlSv&He8SaopH2+TWq=`!J2ymHROSR|or z1NhrkK`K77MKVL^OGcEp#am$AXf-@gtJJa5(U+8M9{(JZRZO>vZ$V(9Otof~#)R3l zNOu4K*umZSZ`iOr%uYJaPU_MJ-OQkS%pr@%Xj4O37&OLz2PF zCIFu!{i@1qdOjz-!YnlY|di&S4|F-Jwp z$El=B_lG1t=g!ymdr@lRO}h4WjK7~6QH2Yj$bxT=7YMmfLj2LXz|6PXO>&~cgGWQ_ zV&@?EQ2`4K6(j@;91uqL*m;=6+ap-bgjtr{_Fz+j0%(Kk>nFObU3o$Px#24YJ`L;(K){{a7>y{D4^000SaNLh0L01FcU01FcV0GgZ_00007bV*G`2iXP; z6%!Cz#+@<%00EgvL_t(I%k7jsOCwPfhM!2XsH8|BYNa?@3^qX#gM}~_u?RMzh+sDs zasR+p+oT+~@()PZW{WArM#a)jP%upj323kp#bQK_;wbMni5rtyMX^xu>Fzm)d(VB( z2Lxbv(}N-yxsIN3*HcVJRZK=D*AZawI{aVX1)!Cm|6bGVumG+m2gLg#*O6~qIRM|b zBo$Yt?nm|`=v$QE>1M(v)6}!IKV~^%Wn|jV^A-LZ(F%)MIUJa@TLb9 z9vkEO;sSt3e*5=*xlDa<3qWf}2M_1x#8wNTs{QC>eI0gpY1G!ZnjEM#5XEFvnjKa# z84WDHQ56{=UKRg~z+TU$rEEGEV9zO={;zPMMnh$ORBcmJkLR1UHQN8|gkJJBU3i)? z)oI&ME_3I3c>DWwZ65RiM~!7Z&6tO=p&`D-V$j>mSw2tK=0Q_(Mk$q0Wo|@T7?)f} zrBtHnYo$~|avf=5T$Q4;abzN)gNB2_q}%FjoP|sApU7r b2LOKoGp)W|>}K$200000NkvXXu0mjf'); + $('#source').val(''); + $.ajax( + { + type: 'POST', + async: true, + url: '/umbraco/plugins/embedemall/service/Embed.asmx/EmbedIt', + data: '{ url: "' + url + '", width: "' + width + '", height: "' + height + '" }', + contentType: 'application/json; charset=utf-8', + dataType: 'json', + success: function (msg) { + var resultAsJson = msg.d; + switch (resultAsJson.Status) { + case 0: + //not supported + $('#preview').html('Not Supported'); + break; + case 1: + //error + $('#preview').html('Error'); + break; + case 2: + $('#preview').html(resultAsJson.Markup); + $('#source').val(resultAsJson.Markup); + if (resultAsJson.SupportsDimensions) { + $('#dimensions').show(); + } else { + $('#dimensions').hide(); + } + $('#insert').removeAttr('disabled'); + break; + } + + }, + error: function (xhr, ajaxOptions, thrownError) { + $('#preview').html("Error"); + //alert(xhr.status); + //alert(thrownError); + } + }); + }, + beforeResize: function () { + this.width = parseInt($('#width').val(), 10); + this.height = parseInt($('#height').val(), 10); + }, + changeSize: function (type) { + var width, height, scale, size; + + if ($('#constrain').is(':checked')) { + width = parseInt($('#width').val(), 10); + height = parseInt($('#height').val(), 10); + if (type == 'width') { + this.height = Math.round((width / this.width) * height); + $('#height').val(this.height); + } else { + this.width = Math.round((height / this.height) * width); + $('#width').val(this.width); + } + } + + if ($('#url').val() != '') { + UmbracoEmbedDialog.showPreview(); + } + } +}; + diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en.js b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en.js new file mode 100644 index 0000000000..14d2a1506b --- /dev/null +++ b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en.js @@ -0,0 +1,10 @@ +tinyMCE.addI18n('en.embed_dlg', { + title: 'Insert rich media', + general: 'General', + url: 'Url:', + size: 'Size:', + constrain_proportions: 'Constrain', + preview: 'Preview', + source: 'Source' + +}); \ No newline at end of file diff --git a/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en_dlg.js b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en_dlg.js new file mode 100644 index 0000000000..c7b5fa2c31 --- /dev/null +++ b/src/Umbraco.Web.UI/umbraco_client/tinymce3/plugins/umbracoembed/langs/en_dlg.js @@ -0,0 +1,10 @@ +tinyMCE.addI18n('en.embed_dlg', { + title: 'Insert rich media', + general: 'General', + url: 'Url:', + size: 'Size:', + constrain_proportions: 'Constrain', + preview: 'Preview', + source: 'Source' + +});