MDL-29624 Media embedding system, part 2: preview in file picker
authorsam marshall <s.marshall@open.ac.uk>
Tue, 13 Dec 2011 17:19:03 +0000 (17:19 +0000)
committersam marshall <s.marshall@open.ac.uk>
Wed, 9 May 2012 17:29:30 +0000 (18:29 +0100)
The JavaScript file picker API shows a preview of the media file you have chosen.
This preview facility now uses an iframe, in order not to duplicate the embed code
in JavaScript. The iframe uses the standard embed API.

lib/editor/tinymce/tiny_mce/3.5/plugins/moodlemedia/js/media.js
lib/editor/tinymce/tiny_mce/3.5/plugins/moodlemedia/preview.php [new file with mode: 0644]
theme/base/style/core.css

index f79a787..c8520da 100644 (file)
@@ -103,38 +103,6 @@ function generatePreview(c) {
 
     // After constrain
     pl = serializeParameters();
-
-    switch (type) {
-        case 'flash':
-            cls = 'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000';
-            codebase = 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0';
-            type = 'application/x-shockwave-flash';
-            break;
-               case "shockwave":
-                       cls = 'clsid:166B1BCA-3F9C-11CF-8075-444553540000';
-                       codebase = 'http://download.macromedia.com/pub/shockwave/cabs/director/sw.cab#version=8,5,1,0';
-                       type = 'application/x-director';
-                       break;
-
-               case "qt":
-                       cls = 'clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B';
-                       codebase = 'http://www.apple.com/qtactivex/qtplugin.cab#version=6,0,2,0';
-                       type = 'video/quicktime';
-                       break;
-
-               case "wmp":
-                       cls = ed.getParam('media_wmp6_compatible') ? 'clsid:05589FA1-C356-11CE-BF01-00AA0055595A' : 'clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6';
-                       codebase = 'http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701';
-                       type = 'application/x-mplayer2';
-                       break;
-
-               case "rmp":
-                       cls = 'clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA';
-                       codebase = 'http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701';
-                       type = 'audio/x-pn-realaudio-plugin';
-                       break;
-    }
-
     if (pl == '') {
             p.innerHTML = '';
             return;
@@ -156,29 +124,13 @@ function generatePreview(c) {
 
     // Avoid annoying warning about insecure items
     if (!tinymce.isIE || document.location.protocol != 'https:') {
-        h += '<object classid="' + cls + '" codebase="' + codebase + '" width="' + pl.width + '" height="' + pl.height + '" id="' + pl.id + '" name="' + pl.name + '" align="' + pl.align + '">';
-
-        for (n in pl) {
-                h += '<param name="' + n + '" value="' + pl[n] + '">';
-
-                // Add extra url parameter if it's an absolute URL
-                if (n == 'src' && pl[n].indexOf('://') != -1)
-                        h += '<param name="url" value="' + pl[n] + '" />';
-        }
+        // Include all the draftfile params after the ?
+        var draftparams = pl.src.toString().replace(/^.*\/draftfile.php\//, '');
+        h = '<iframe src="' + tinyMCE.baseURL + '/plugins/moodlemedia/preview.php?path=' +
+                draftparams + '" width="100%" height="100%"></iframe>';
     }
 
-    h += '<embed type="' + type + '" ';
-
-    for (n in pl) {
-        h += n + '="' + pl[n] + '" ';
-    }
-
-    h += '></embed>';
-
-    // Avoid annoying warning about insecure items
-    if (!tinymce.isIE || document.location.protocol != 'https:')
-        h += '</object>';
-
+    // I don't know why the HTML comment is there, but leaving it just in case
     p.innerHTML = "<!-- x --->" + h;
 }
 
diff --git a/lib/editor/tinymce/tiny_mce/3.5/plugins/moodlemedia/preview.php b/lib/editor/tinymce/tiny_mce/3.5/plugins/moodlemedia/preview.php
new file mode 100644 (file)
index 0000000..431b077
--- /dev/null
@@ -0,0 +1,50 @@
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * Provides A/V preview features for the TinyMCE editor Moodle Media plugin.
+ * The preview is included in an iframe within the popup dialog.
+ * @package editor
+ * @subpackage tinymce
+ * @copyright 1999 onwards Martin Dougiamas   {@link http://moodle.com}
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+require(dirname(__FILE__) . '/../../../../../../../config.php');
+require_once($CFG->libdir . '/filelib.php');
+
+// Must be logged in
+require_login();
+
+// Require path to draftfile.php file
+$path = required_param('path', PARAM_PATH);
+
+// Now output this file which is super-simple
+$PAGE->set_pagelayout('embedded');
+$PAGE->set_url(new moodle_url('/lib/editor/tinymce/tiny_mce/3.4.6/plugins/moodlemedia/preview.php',
+        array('path' => $path)));
+$PAGE->set_context(context_system::instance());
+$PAGE->add_body_class('core_media_preview');
+
+echo $OUTPUT->header();
+
+$mediarenderer = $PAGE->get_renderer('core', 'media');
+$url = new moodle_url('/draftfile.php/' . $path);
+if ($mediarenderer->can_embed_url($url)) {
+    echo $mediarenderer->embed_url($url);
+}
+
+echo $OUTPUT->footer();
index 6eb8fa3..4eca54e 100644 (file)
@@ -773,6 +773,11 @@ body.tag .managelink {padding: 5px;}
 .mediaplugin_mp3 object {height:15px;width:300px}
 audio.mediaplugin_html5audio {width: 300px}
 
+/* TinyMCE moodle media preview frame should not have padding */
+.core_media_preview.pagelayout-embedded #content {padding:0;}
+.core_media_preview.pagelayout-embedded #maincontent {height:0;}
+.core_media_preview.pagelayout-embedded .mediaplugin {margin:0;}
+
 /*
 Fix for SubScript & SuperScript
 ------------------------------*/