[pLog-svn] r5383 - in plog/branches/lifetype-1.2: . flash flash/mp3player js/tinymce js/tinymce/plugins/insertresource js/ui locale/admin templates/admin/chooser
oscar at devel.lifetype.net
oscar at devel.lifetype.net
Wed May 9 17:14:23 EDT 2007
Author: oscar
Date: 2007-05-09 17:14:22 -0400 (Wed, 09 May 2007)
New Revision: 5383
Added:
plog/branches/lifetype-1.2/flash/
plog/branches/lifetype-1.2/flash/mp3player/
plog/branches/lifetype-1.2/flash/mp3player/mp3player.swf
Modified:
plog/branches/lifetype-1.2/js/tinymce/plugins/insertresource/editor_plugin.js
plog/branches/lifetype-1.2/js/tinymce/tiny_mce-plog-resourcelist.js
plog/branches/lifetype-1.2/js/ui/common.js
plog/branches/lifetype-1.2/locale/admin/locale_ca_ES.php
plog/branches/lifetype-1.2/locale/admin/locale_de_DE.php
plog/branches/lifetype-1.2/locale/admin/locale_en_UK.php
plog/branches/lifetype-1.2/locale/admin/locale_es_ES.php
plog/branches/lifetype-1.2/locale/admin/locale_fr_FR.php
plog/branches/lifetype-1.2/locale/admin/locale_it_IT.php
plog/branches/lifetype-1.2/locale/admin/locale_nl_NL.php
plog/branches/lifetype-1.2/locale/admin/locale_zh_CN.php
plog/branches/lifetype-1.2/locale/admin/locale_zh_TW.php
plog/branches/lifetype-1.2/templates/admin/chooser/resourcelist.template
Log:
Added support for embedding a flash-based mp3 player from within the resources pop-up window, we'got a few requests for something like this and I thought it'd be cool, so here it is.
The flash player is from here: http://www.jeroenwijering.com/?item=Flash_MP3_Player. It is licensed under the Creative Commons License for noncommercial use. I believe this means it is compatible with our GPL unless you're intending to or already making money from your site. In that case, please contact the author for licensing purposes.
As far as the functionality is concerned, there is an extra link labelled "Insert player" next to MP3 files that will insert the necessary code to get the player embedded both when tinymce is enabled and disabled. This should allow users to provide readers with an ad-hoc version of for example podcasts to listen, rather than downloading the file.
Added: plog/branches/lifetype-1.2/flash/mp3player/mp3player.swf
===================================================================
(Binary files differ)
Property changes on: plog/branches/lifetype-1.2/flash/mp3player/mp3player.swf
___________________________________________________________________
Name: svn:executable
+ *
Name: svn:mime-type
+ application/octet-stream
Modified: plog/branches/lifetype-1.2/js/tinymce/plugins/insertresource/editor_plugin.js
===================================================================
--- plog/branches/lifetype-1.2/js/tinymce/plugins/insertresource/editor_plugin.js 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/js/tinymce/plugins/insertresource/editor_plugin.js 2007-05-09 21:14:22 UTC (rev 5383)
@@ -23,6 +23,7 @@
},
initInstance : function(inst) {
+ tinyMCE.importCSS(inst.getDoc(), tinyMCE.baseURL + "/plugins/insertresource/css/content.css");
},
getControlHTML : function(cn) {
@@ -73,6 +74,178 @@
// Pass to next handler in chain
return false;
+ },
+
+ cleanup : function(type, content) {
+ switch (type) {
+ case "insert_to_editor_dom":
+ // Force relative/absolute
+ if (tinyMCE.getParam('convert_urls')) {
+ var imgs = content.getElementsByTagName("img");
+ for (var i=0; i<imgs.length; i++) {
+ if (tinyMCE.getAttrib(imgs[i], "class") == "ltFlashPlayer") {
+ var src = tinyMCE.getAttrib(imgs[i], "alt");
+
+ if (tinyMCE.getParam('convert_urls'))
+ src = eval(tinyMCE.settings['urlconverter_callback'] + "(src, null, true);");
+
+ imgs[i].setAttribute('alt', src);
+ imgs[i].setAttribute('title', src);
+ }
+ }
+ }
+ break;
+
+ case "get_from_editor_dom":
+ var imgs = content.getElementsByTagName("img");
+ for (var i=0; i<imgs.length; i++) {
+ if (tinyMCE.getAttrib(imgs[i], "class")== "ltFlashPlayer") {
+ var src = tinyMCE.getAttrib(imgs[i], "alt");
+
+ if (tinyMCE.getParam('convert_urls'))
+ src = eval(tinyMCE.settings['urlconverter_callback'] + "(src, null, true);");
+
+ imgs[i].setAttribute('alt', src);
+ imgs[i].setAttribute('title', src);
+ }
+ }
+ break;
+
+ case "insert_to_editor":
+ var startPos = 0;
+ var embedList = new Array();
+
+ // Fix the embed and object elements
+ content = content.replace(new RegExp('<[ ]*object','gi'),'<object');
+ content = content.replace(new RegExp('<[ ]*/object[ ]*>','gi'),'</object>');
+
+ // Parse all object tags and replace them with images from the embed data
+ var index = 0;
+ while ((startPos = content.indexOf('<object', startPos)) != -1) {
+
+ // Find end of object
+ endPos = content.indexOf('</object>', startPos);
+ endPos += 9;
+
+ objectTag = content.substring(startPos,endPos);
+
+ /**
+ * NOTE: this method call relies in a bug of the _parseAttributes method.
+ * This method parses a tag and returns a list of its attributes. It works fine
+ * when presented with a single tag but now that we're passing a whole <object>...</object>
+ * block, it will also parse any other tags in the block. This means that it will return the
+ * value we're looking for as long as "FlashVars" is passed as the last parameter
+ * in the <object> block.
+ */
+ attribs = TinyMCE_insertresourcePlugin._parseAttributes( objectTag );
+
+ var cssClass = "";
+ if( attribs["value"] == undefined || attribs["class"] != "ltPlayer" ) {
+ startPos++;
+ continue;
+ }
+
+ // find the value in "file=XXX"
+ var regexp = /.*file=([a-zA-Z0-9\-\/:._]*)/i;
+ result = regexp.exec( attribs["value"] );
+ var fileUrl = "";
+ if( result ) {
+ fileUrl = result[1];
+ }
+ //window.alert("val = " + attribs["value"] + " - " + fileUrl);
+
+ // Insert image
+ var contentAfter = content.substring(endPos);
+ content = content.substring(0, startPos);
+ content += '<img width="320" height="20"';
+ content += ' src="' + (tinyMCE.getParam("theme_href") + '/images/spacer.gif') + '" title="' + fileUrl + '"';
+ content += ' alt="' + fileUrl + '" class="ltFlashPlayer" />' + content.substring(endPos);
+ content += contentAfter;
+
+ index++;
+
+ startPos++;
+ }
+
+ break;
+
+ case "get_from_editor":
+ // Parse all img tags and replace them with object+embed
+ var startPos = -1;
+
+ while ((startPos = content.indexOf('<img', startPos+1)) != -1) {
+ var endPos = content.indexOf('/>', startPos);
+ var attribs = TinyMCE_insertresourcePlugin._parseAttributes(content.substring(startPos + 4, endPos));
+
+ // Is not flash, skip it
+ if (attribs['class'] != "ltFlashPlayer" )
+ continue;
+
+ type = attribs['class'];
+
+ endPos += 2;
+
+ var embedHTML = '';
+
+ embedHTML = getFlashPlayerHTML( attribs["alt"] );
+
+ // Insert embed/object chunk
+ chunkBefore = content.substring(0, startPos);
+ chunkAfter = content.substring(endPos);
+ content = chunkBefore + embedHTML + chunkAfter;
+ }
+ break;
+ }
+
+ // Pass through to next handler in chain
+ return content;
+ },
+
+ // Private plugin internal functions
+
+ _parseAttributes : function(attribute_string) {
+ var attributeName = "";
+ 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;
+ else if ((chr == '"' || chr == "'") && 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;
}
};
Modified: plog/branches/lifetype-1.2/js/tinymce/tiny_mce-plog-resourcelist.js
===================================================================
--- plog/branches/lifetype-1.2/js/tinymce/tiny_mce-plog-resourcelist.js 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/js/tinymce/tiny_mce-plog-resourcelist.js 2007-05-09 21:14:22 UTC (rev 5383)
@@ -75,4 +75,27 @@
function onCancel() {
tinyMCE.closeWindow(window);
-};
\ No newline at end of file
+};
+
+/**
+ * Generates the correct markup code for the Flash MP3 and video player
+ * depending on whether TinyMCE is enabled or not
+ *
+ * @param url
+ * @param tinyMCE
+ */
+function insertMediaPlayer( url, tinyMCEEnabled )
+{
+ if( tinyMCEEnabled ) {
+ var htmlCode = '<img src="' + (tinyMCE.getParam("theme_href") + "/images/spacer.gif") + '" mce_src="' + (tinyMCE.getParam("theme_href") + "/images/spacer.gif") + '" ' + 'width="300" height="100" ' + 'border="0" alt="' + url + '" title="' + url + '" class="ltFlashPlayer" />';
+
+ tinyMCE.execCommand( "mceInsertContent", true, htmlCode );
+ tinyMCE.selectedInstance.repaint();
+
+ // Close the dialog
+ tinyMCE.closeWindow(window);
+ }
+ else {
+ addText( parent.opener.document.newPost.postText, getFlashPlayerHTML( url ));
+ }
+}
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/js/ui/common.js
===================================================================
--- plog/branches/lifetype-1.2/js/ui/common.js 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/js/ui/common.js 2007-05-09 21:14:22 UTC (rev 5383)
@@ -352,3 +352,21 @@
return formData;
}
+
+/**
+ * Returns the HTML code required to embed the Flash MP3 and video player, given
+ * a URL to a playable media file.
+ *
+ * @param url
+ * @return
+ */
+function getFlashPlayerHTML( url )
+{
+ var htmlCode = "<object data=\"" + plogBaseUrl + "/flash/mp3player/mp3player.swf\" type=\"application/x-shockwave-flash\" width=\"320\" height=\"20\" class=\"ltPlayer\">"+
+ "<param name=\"quality\" value=\"best\" />"+
+ "<param name=\"bgcolor\" value=\"#FFFFFF\" />" +
+ "<param name=\"FlashVars\" value=\"&file="+ url + "&height=20&width=320\" />" +
+ "</object>";
+
+ return htmlCode;
+}
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_ca_ES.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_ca_ES.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_ca_ES.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1188,4 +1188,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Afegir reproductor';
?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_de_DE.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_de_DE.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_de_DE.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1175,4 +1175,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
-?>
+$messages['insert_player'] = 'Insert Player';
+?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_en_UK.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_en_UK.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_en_UK.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1170,4 +1170,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
-?>
+$messages['insert_player'] = 'Insert Player';
+?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_es_ES.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_es_ES.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_es_ES.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1182,4 +1182,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Añadir Reproductor';
?>
Modified: plog/branches/lifetype-1.2/locale/admin/locale_fr_FR.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_fr_FR.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_fr_FR.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1351,4 +1351,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
-?>
+$messages['insert_player'] = 'Insert Player';
+?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_it_IT.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_it_IT.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_it_IT.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1170,4 +1170,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Insert Player';
?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_nl_NL.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_nl_NL.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_nl_NL.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1249,4 +1249,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Insert Player';
?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_zh_CN.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_zh_CN.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_zh_CN.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1171,4 +1171,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Insert Player';
?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/locale/admin/locale_zh_TW.php
===================================================================
--- plog/branches/lifetype-1.2/locale/admin/locale_zh_TW.php 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/locale/admin/locale_zh_TW.php 2007-05-09 21:14:22 UTC (rev 5383)
@@ -1171,4 +1171,5 @@
/// new strings in LT 1.2.2 ///
$messages['posted_by_help'] = 'Select article owner';
+$messages['insert_player'] = 'Insert Player';
?>
\ No newline at end of file
Modified: plog/branches/lifetype-1.2/templates/admin/chooser/resourcelist.template
===================================================================
--- plog/branches/lifetype-1.2/templates/admin/chooser/resourcelist.template 2007-05-07 01:46:26 UTC (rev 5382)
+++ plog/branches/lifetype-1.2/templates/admin/chooser/resourcelist.template 2007-05-09 21:14:22 UTC (rev 5383)
@@ -142,6 +142,9 @@
<a href="javascript:addResourceLink('{$resourceId}','{$resourceMediumSizePreviewLink}','{$resourceDownloadLink}','{$resourceName|escape:"javascript"}','{$resourceDesc|escape:"javascript"}','{$resourceType}','{$resourceMimeType}');">{$locale->tr("add_resource_medium")}</a><br/>
{/if}
{/if}
+ {if $resource->isSound()}
+ <a href="javascript:insertMediaPlayer('{$resourceDownloadLink}', '{$htmlarea}')">{$locale->tr("insert_player")}</a>
+ {/if}
</td>
{/foreach}
</tbody>
More information about the pLog-svn
mailing list