Upload images using the slide app

www/common/common-file.js

@@ -6,7 +6,7 @@ define([
     var Nacl = window.nacl;
     var module = {};
 
-    module.create = function (common) {
+    module.create = function (common, config) {
         var File = {};
 
         var Messages = common.Messages;
@@ -32,7 +32,24 @@ define([
             return File.$container;
         };
 
-        var upload = function (blob, metadata, id) {
+        var getData = function (file, href) {
+            var data = {};
+
+            data.name = file.metadata.name;
+            data.url = href;
+            if (file.metadata.type.slice(0,6) === 'image/') {
+                data.mediatag = true;
+            }
+            //var generatedBlob = new Blob([file.blob]);
+            //window.URL.createObjectURL(generatedBlob);
+
+            return data;
+        };
+
+        var upload = function (file) {
+            var blob = file.blob;
+            var metadata = file.metadata;
+            var id = file.id;
             if (queue.inProgress) { return; }
             queue.inProgress = true;
 
@@ -102,12 +119,18 @@ define([
                     // TODO add button to table which copies link to clipboard?
                     //APP.toolbar.addElement(['fileshare'], {});
 
-                    var title = document.title = metadata.name;
+                    var title = metadata.name;
 
                     common.renamePad(title || "", href, function (err) {
-                        if (err) { console.error(err); } // TODO
+                        if (err) { return void console.error(err); } // TODO
                         console.log(title);
                         common.log(Messages._getKey('upload_success', [title]));
+
+                        if (config.onUploaded) {
+                            var data = getData(file, href);
+                            config.onUploaded(file.dropEvent, data);
+                        }
+
                         queue.inProgress = false;
                         queue.next();
                     });
@@ -157,10 +180,16 @@ define([
         };
 
         queue.next = function () {
-            if (queue.queue.length === 0) { return; }
+            if (queue.queue.length === 0) {
+                queue.to = window.setTimeout(function () {
+                    File.$container.fadeOut();
+                }, 3000);
+                return;
+            }
             if (queue.inProgress) { return; }
+            File.$container.show();
             var file = queue.queue.shift();
-            upload(file.blob, file.metadata, file.id);
+            upload(file);
         };
         queue.push = function (obj) {
             var id = uid();
@@ -195,7 +224,7 @@ define([
             queue.next();
         };
 
-        var handleFile = File.handleFile = function (file) {
+        var handleFile = File.handleFile = function (file, e) {
             console.log(file);
             var reader = new FileReader();
             reader.onloadend = function () {
@@ -204,7 +233,8 @@ define([
                     metadata: {
                         name: file.name,
                         type: file.type,
-                    }
+                    },
+                    dropEvent: e
                 });
             };
             reader.readAsArrayBuffer(file);
@@ -241,16 +271,18 @@ define([
                 $hoverArea.removeClass('hovering');
 
                 Array.prototype.slice.call(dropped).forEach(function (d) {
-                    todo(d);
+                    todo(d, e);
                 });
             });
         };
 
-        File.createUploader = function ($area, $hover, $body) {
+        var createUploader = function ($area, $hover, $body) {
             createAreaHandlers($area, null, handleFile);
             createTableContainer($body);
         };
 
+        createUploader(config.dropArea, config.hoverArea, config.body);
+
         return File;
     };
 

www/common/cryptpad-common.js

@@ -117,7 +117,7 @@ define([
     common.createCodemirror = CodeMirror.create;
 
     // Files
-    common.createFileManager = function () { return Files.create(common); };
+    common.createFileManager = function (config) { return Files.create(common, config); };
 
     // History
     common.getHistory = function (config) { return History.create(common, config); };
@@ -594,7 +594,7 @@ define([
                             common.alert(Messages.pinLimitNotPinned, null, true);
                             return;
                         }
-                        else { throw new Error("Cannot push this pad to CryptDrive", e); }
+                        else { return void cb(e); }
                     }
                     getStore().addPad(id, common.initialPath);
                 });
@@ -637,7 +637,7 @@ define([
         common.setPadTitle(title, href, function (err) {
             if (err) {
                 console.log("unable to set pad title");
-                console.log(err);
+                console.error(err);
                 return;
             }
             callback(null, title);

www/common/diffMarked.js

@@ -1,8 +1,11 @@
 define([
     'jquery',
     '/bower_components/marked/marked.min.js',
-    '/bower_components/diff-dom/diffDOM.js'
-],function ($, Marked) {
+    '/common/cryptpad-common.js',
+    '/common/media-tag.js',
+    '/bower_components/diff-dom/diffDOM.js',
+    '/bower_components/tweetnacl/nacl-fast.min.js',
+],function ($, Marked, Cryptpad, MediaTag) {
     var DiffMd = {};
 
     var DiffDOM = window.diffDOM;
@@ -33,6 +36,20 @@ define([
         var cls = (isCheckedTaskItem || isUncheckedTaskItem) ? ' class="todo-list-item"' : '';
         return '<li'+ cls + '>' + text + '</li>\n';
     };
+    renderer.image = function (href, title, text) {
+        if (href.slice(0,6) === '/file/') {
+            var parsed = Cryptpad.parsePadUrl(href);
+            var hexFileName = Cryptpad.base64ToHex(parsed.hashData.channel);
+            var mt = '<media-tag src="/blob/' + hexFileName.slice(0,2) + '/' + hexFileName + '" data-crypto-key="cryptpad:' + parsed.hashData.key + '"></media-tag>';
+            return mt;
+        }
+        var out = '<img src="' + href + '" alt="' + text + '"';
+        if (title) {
+            out += ' title="' + title + '"';
+        }
+        out += this.options.xhtml ? '/>' : '>';
+        return out;
+    };
 
     var forbiddenTags = [
         'SCRIPT',
@@ -61,6 +78,30 @@ define([
         }
     };
 
+    var getSubMediaTag = function (element) {
+        var result = [];
+        console.log(element);
+        if (element.nodeName === "MEDIA-TAG") {
+            result.push(element);
+            return result;
+        }
+        if (element.childNodes) {
+            element.childNodes.forEach(function (el) {
+                result = result.concat(getSubMediaTag(el, result));
+            });
+        }
+        console.log(result);
+        return result;
+    };
+    var mediaTag = function (info) {
+        if (info.diff.action === 'addElement') {
+            return getSubMediaTag(info.diff.element);
+            //MediaTag.CryptoFilter.setAllowedMediaTypes(allowedMediaTypes);
+            //MediaTag($mt[0]);
+        }
+        return;
+    };
+
     var slice = function (coll) {
         return Array.prototype.slice.call(coll);
     };
@@ -82,9 +123,20 @@ define([
         return Dom;
     };
 
+    //var toTransform = [];
     var DD = new DiffDOM({
         preDiffApply: function (info) {
             if (unsafeTag(info)) { return true; }
+            //var mt = mediaTag(info);
+            //console.log(mt);
+            //if (mt) { toTransform = toTransform.concat(mt); }
+        },
+        postDiffApply: function () {
+            /*while (toTransform.length) {
+                var el = toTransform.pop();
+                console.log(el);
+                MediaTag(el);
+            }*/
         }
     });
 
@@ -119,6 +171,29 @@ define([
             throw new Error(patch);
         } else {
             DD.apply($content[0], patch);
+            var $mts = $content.find('media-tag:not(:has(*))');
+            $mts.each(function (i, el) {
+                console.log(el);
+                var allowedMediaTypes = [
+                    'image/png',
+                    'image/jpeg',
+                    'image/jpg',
+                    'image/gif',
+                    'audio/mp3',
+                    'audio/ogg',
+                    'audio/wav',
+                    'audio/webm',
+                    'video/mp4',
+                    'video/ogg',
+                    'video/webm',
+                    'application/pdf',
+                    'application/dash+xml',
+                    'download'
+                ];
+
+                MediaTag.CryptoFilter.setAllowedMediaTypes(allowedMediaTypes);
+                MediaTag(el);
+            });
         }
     };