Version 2.3

Orange-OpenSource · Dec 14, 2016 · b11466e · b11466e
2 parents d23b3b9 + 7306573
commit b11466e
Show file tree

Hide file tree

Showing 14 changed files with 123 additions and 84 deletions.
diff --git a/app.js b/app.js
@@ -32,7 +32,7 @@ var javascript = require('./routes/javascript');
 
 var app = express();
 
-global.DROP_IT_VERSION=2.2;
+global.DROP_IT_VERSION=parseFloat(require("./package.json").version);
 
 // view engine setup
 app.set('views', path.join(__dirname, 'views'));
@@ -47,7 +47,7 @@ app.use(express.static(path.join(__dirname, path.join('node_modules', 'tether',
 app.use(express.static(path.join(__dirname, path.join('node_modules', 'boosted', 'dist'))));
 app.use(express.static(path.join(__dirname, path.join('node_modules', 'jquery', 'dist','cdn'))));
 app.use(express.static(path.join(__dirname, path.join('node_modules', 'jquery-file-download', 'src','Scripts'))));
-app.use(express.static(path.join(__dirname, path.join('node_modules', 'zeroclipboard', 'dist'))));
+app.use(express.static(path.join(__dirname, path.join('node_modules', 'clipboard', 'dist'))));
 
 var receiveUriPath = '/receive';
 app.use('/', send);
@@ -75,6 +75,8 @@ if (app.get('env') === 'development') {
         console.error(err);
         res.status(err.status || 500);
         res.render('error', {
+            dumbContent : "",
+            isLocal : typeof process.env.OPENSHIFT_NODEJS_IP === "undefined",
             jdropitVersion: global.DROP_IT_VERSION,
             message: err.message,
             sub_message: err.sub_message,
@@ -90,7 +92,9 @@ if (app.get('env') === 'development') {
 app.use(function(err, req, res, next) {
     res.status(err.status || 500);
     res.render('error', {
+        dumbContent : "",
         isLocal : typeof process.env.OPENSHIFT_NODEJS_IP === "undefined",
+        jdropitVersion : global.DROP_IT_VERSION,
         message: err.message,
         sub_message: err.sub_message,
         stack: err.stack

diff --git a/client/jdropit-send.js b/client/jdropit-send.js
@@ -84,34 +84,7 @@ SenderHandler.prototype = {
 
 
         this.socket.on('server_receiver_ready', function (receiverId) {
-            $('#copyLinkContainer').hide();
-            $('#transfertMessage').html("Transfer in progress...");
-
-            //init container
-            var transferContainer = $('#transferContainer');
-            transferContainer.show();
-
-            var rowReceiverTemplate = $("#rowReceiverTemplate");
-            var newRow = rowReceiverTemplate.clone();
-            newRow.removeAttr("id");
-            newRow.show();
-            var linkRemove = newRow.find(".icon-delete");
-            linkRemove.on("click", function (e) {
-                e.preventDefault();
-                newRow.hide();
-            });
-            linkRemove.tooltip();
-
-            var pbContainer = newRow.children(".col-xs-7");
-            var transferProgressBar = pbContainer.find("progress");
-            var displayProgressBar = pbContainer.find(".text-xs-center");
-            displayProgressBar.attr("id", "progress-"+receiverId);
-            transferProgressBar.attr("aria-describedby", "progress-"+receiverId);
-            transferContainer.append(newRow);
-            that.receiverInfos[receiverId] = new ReceiverInfo(pbContainer, transferProgressBar, displayProgressBar, linkRemove);
-
-            that.startUpload(receiverId);
-
+            that.receiverIsReady(receiverId);
         });
 
 
@@ -138,6 +111,18 @@ SenderHandler.prototype = {
         });
     },
 
+    setNavigationStep: function(step) {
+        $(".o-stepbar > ol > li").each(function (idx) {
+            if(step > idx) {
+                $(this).removeClass("current");
+                $(this).addClass("done");
+            }
+            else if(step == idx){
+                $(this).addClass("current");
+            }
+        });
+    },
+
     fileIsReady: function (fileToTransfert) {
         var sizeDisplay = fileToTransfert.size > (1024 * 1024) ? Math.round(fileToTransfert.size / 1024 / 1024) + " Mo" :
             fileToTransfert.size > 1024 ? Math.round(fileToTransfert.size / 1024) + " Ko" : fileToTransfert.size + " o";
@@ -153,6 +138,38 @@ SenderHandler.prototype = {
         $('#copyLinkContainer').show(500);
         $('#warning-window').show(500);
         $('#selectFileContainer').hide(500);
+        this.setNavigationStep(1);
+    },
+
+    receiverIsReady: function(receiverId) {
+        $('#copyLinkContainer').hide();
+        this.setNavigationStep(2);
+        $('#transfertMessage').html("Transfer in progress...");
+
+        //init container
+        var transferContainer = $('#transferContainer');
+        transferContainer.show();
+
+        var rowReceiverTemplate = $("#rowReceiverTemplate");
+        var newRow = rowReceiverTemplate.clone();
+        newRow.removeAttr("id");
+        newRow.show();
+        var linkRemove = newRow.find(".icon-delete");
+        linkRemove.on("click", function (e) {
+            e.preventDefault();
+            newRow.hide();
+        });
+        linkRemove.tooltip();
+
+        var pbContainer = newRow.children(".col-xs-8");
+        var transferProgressBar = pbContainer.find("progress");
+        var displayProgressBar = pbContainer.find(".text-xs-center");
+        displayProgressBar.attr("id", "progress-"+receiverId);
+        transferProgressBar.attr("aria-describedby", "progress-"+receiverId);
+        transferContainer.append(newRow);
+        this.receiverInfos[receiverId] = new ReceiverInfo(pbContainer, transferProgressBar, displayProgressBar, linkRemove);
+
+        this.startUpload(receiverId);
     },
 
     startUpload: function (receiverId) {
@@ -213,18 +230,13 @@ function sendFile(isLocal) {
     var senderHandler = new SenderHandler(isLocal);
 
     $("#clipboardcopyok").hide();
-    //____ Handling of copy to clipboard with zeroClipboard
-    var clip = new ZeroClipboard(document.getElementById("copy-button"));
-    clip.on("ready", function () {
-        clip.on("copy", function (event) {
-            var clipboard = event.clipboardData;
-            clipboard.setData("text/plain", 'http://' + senderHandler.receiverUrl);
-        });
-        clip.on("aftercopy", function () {
-            $("#clipboardcopyok").show(300);
-        });
-    });
 
+    var clipboard = new Clipboard('#copy-button');
+    clipboard.on('success', function(e) {
+        console.info('Copied to clipboard:', e.text);
+        $("#clipboardcopyok").show(300);
+        e.clearSelection();
+    });
 
     var dropZone = $('#drop-zone');
     //----- Handling drag and drop zone style

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "Just-Drop-It",
-  "version": "1.0.0",
+  "version": "2.3.0",
   "description": "Simply beam files between two browsers",
   "keywords": [
     "Transfer",
@@ -30,7 +30,7 @@
     "uglify-js" : "~2.4.23",
     "boosted" : "~4.0.0-alpha.4",
     "tether" : "~1.1.1",
-    "zeroclipboard" :  "~2.2.0",
+    "clipboard" :  "~1.5.16",
     "jquery" : "1.11.2",
     "jquery-file-download" : "1.4.5"
 

diff --git a/public/css/justdropit.css b/public/css/justdropit.css
@@ -111,7 +111,7 @@ header {
 }
 
 main {
-    padding: 1.5rem 0px 1.1rem;
+    padding: 2rem 0px 1.1rem;
 }
 
 main em {
@@ -211,6 +211,8 @@ input[type='file'] {
 	display: inline;
 }
 
+/*to add margin between rows*/
+.top-buffer { margin-top:30px; }
 
 
 

diff --git a/routes/admin.js b/routes/admin.js
@@ -41,6 +41,7 @@ router.get('/', function(req, res) {
     res.render('admin', {title : "Just drop it Admin",
         isLocal : typeof process.env.OPENSHIFT_NODEJS_IP === "undefined",
         jdropitVersion : global.DROP_IT_VERSION,
+        dumbContent : "",
         senders : senders});
 });
 

diff --git a/routes/receive.js b/routes/receive.js
@@ -40,9 +40,10 @@ router.get(router.servePagePath + ':id', function (req, res, next) {
         debug('receive - rendering receive for uri %s', uri);
         res.render('receive', {
             isLocal: typeof process.env.OPENSHIFT_NODEJS_IP === "undefined",
+            jdropitVersion: global.DROP_IT_VERSION,
+            dumbContent : "",
             fileName: sender.fileName,
             fileSize: sender.fileSize,
-            jdropitVersion: global.DROP_IT_VERSION,
             senderId: sender.senderId
         });
     }, function () {

diff --git a/routes/send.js b/routes/send.js
@@ -29,12 +29,21 @@ var fs    = require("fs");
 
 debug.log = console.log.bind(console);
 
+var dumbQuotes = ["Let us ease your file transfers",
+    "Making the world a better place",
+    "Make file transfers, not war",
+    "When file transfer becomes pleasure",
+    "File transfer is not a fatality",
+    "Helping humanity thrive"];
+
 /* GET home page. */
 router.get('/', function(req, res) {
     debug('serving send');
     res.render('send', {
         isLocal : typeof process.env.OPENSHIFT_NODEJS_IP === "undefined",
-        jdropitVersion : global.DROP_IT_VERSION});
+        jdropitVersion : global.DROP_IT_VERSION,
+        dumbContent : dumbQuotes[Math.floor(Math.random() * dumbQuotes.length)]
+    });
 });
 
 /* GET home page. */

diff --git a/server.js b/server.js
@@ -50,8 +50,8 @@ var port = process.env.OPENSHIFT_NODEJS_PORT || 8080;
 require("./ioserver")(app, server);
 //  Start the app on the specific interface (and port).
 server.listen(port, ipAddress, function () {
-    var mDate = new Date(Date.now());
-    debug('%s: Node server started on %s:%d ...', mDate, ipAddress == null ? "*" : ipAddress, port);
+    debug('%s: JustDropIt(%s) started on %s:%d ...',
+        new Date(Date.now()), global.DROP_IT_VERSION, ipAddress == null ? "*" : ipAddress, port);
 });
 
 

diff --git a/url-generator.js b/url-generator.js
@@ -66,9 +66,9 @@ UriGenerator.prototype.generateUrl = function () {
         error("url generation not ready: file are not all loaded");
         return null;
     } else {
-        return this.adv[Math.floor(Math.random() * this.adv.length) + 1] + '-' +
-            this.adj[Math.floor(Math.random() * this.adj.length) + 1] + '-' +
-            this.noun[Math.floor(Math.random() * this.noun.length) + 1];
+        return this.adv[Math.floor(Math.random() * this.adv.length)] + '-' +
+            this.adj[Math.floor(Math.random() * this.adj.length)] + '-' +
+            this.noun[Math.floor(Math.random() * this.noun.length)];
     }
 };
 

diff --git a/views/header.jade b/views/header.jade
@@ -28,14 +28,11 @@ header(role="banner")
             div.row
                 div.col-xs-12
                     h1 Just drop it
-                        small &laquo;Let us ease your file transfer&raquo;
-
+                        small= dumbContent
 
 script.
     function enableNotifications() {
-        if (jdNotif.isAlreadyGranted()) {
-            jdNotif.notify("Great!", "Notifications are enabled");
-        } else if(jdNotif.isNotificationAvailable()){
+        if(jdNotif.isNotificationAvailable() && !jdNotif.isAlreadyGranted()){
             var container = $(".notification-header").first();
             var dismiss = container.find(".dismiss-notification").first();
             container.show();

diff --git a/views/layout.jade b/views/layout.jade
@@ -73,12 +73,13 @@ html
     body
         include ./header
         main
+            div.alert.alert-warning#warning-window(style="display: none;")
+                                span.icon-Warningimportant(aria-hidden="true")
+                                span.sr-only Warning:
+                                span
+                                    | &nbsp; Don't close this window!
             div.container
-                div.alert.alert-warning#warning-window(style="display: none;")
-                    span.icon-Warningimportant(aria-hidden="true")
-                    span.sr-only Warning:
-                    span
-                        | &nbsp; Don't close this window!
+
                 include ./user_messages
                 block content
         include ./footer

diff --git a/views/receive.jade b/views/receive.jade
@@ -47,7 +47,7 @@ block content
     div.row#completeContainer(style="display: none;")
         div.col-xs-12
             h2 Thank you!
-            p Your friend knows you received the file. You can close this page now.
+            p Your friend knows you've received the file. You can close this page now.
     div.row#errorContainer(style="display: none;")
         div.col-xs-12
             h2 Error

diff --git a/views/send.jade b/views/send.jade
@@ -26,13 +26,13 @@ block extra_scripts
         script(src="/js/HackTimer.js")
         script(src="/js/HackTimerWorker.js")
         script(src="/js/socket.io-stream.js")
-        script(src="/ZeroClipboard.js")
+        script(src="/clipboard.js")
         script(src="/js/jdropit-send.js")
     else
         script(src="/js/HackTimer.silent.min.js")
         script(src="/js/HackTimerWorker.min.js")
         script(src="/js/socket.io-stream.min.js")
-        script(src="/ZeroClipboard.min.js")
+        script(src="/clipboard.min.js")
         script(src="/js/jdropit-send.min.js")
     script.
 
@@ -41,37 +41,49 @@ block extra_scripts
             sendFile(#{isLocal});
             enableNotifications();
         }
+
 block content
-    div.row#selectFileContainer
+    div.row
         div.col-xs-12
-            h2 Select your file
+            nav.o-stepbar
+                    ol
+                        li.stepbar-item.current
+                            a.stepbar-link(title="Select your file")
+                                span.step-number 1
+                                span.step-title Select your file
+                        li.stepbar-item
+                            a.stepbar-link(title="Share it with your friends")
+                                span.step-number 2
+                                span.step-title Share it with your friends
+                        li.stepbar-item
+                            a.stepbar-link(title="Transfer")
+                                span.step-number 3
+                                span.step-title Transfer
+
+    div.row.top-buffer#selectFileContainer
         div.col-xs-12
             p.lead Either drop a file below:
             div.upload-drop-zone#drop-zone Just drag and drop a file here
-            form.form-inline#myform(action="")
+            form.form-inline.float-xs-right#myform(action="")
                 label.lead(for="file") Or select it with the file explorer:&nbsp;
                 input#file(type="file")
-    div.row#copyLinkContainer(style="display: none;")
+    div.row.top-buffer#copyLinkContainer(style="display: none;")
         div.col-xs-12
-            h2 Ready to transfer!
             p.lead Tell your friend to go to this url:
-            div.text-muted
-                p#generatedurl
-            button.btn.btn-orange#copy-button(title="Click to copy url to clipboard") Copy to clipoard
-            span.text-success.icon-checkbox-tick#clipboardcopyok(aria-hidden="true")
+            p.text-muted.text-xs-center.lead#generatedurl
+            span.text-success.pull-xs-right.icon-checkbox-tick#clipboardcopyok(aria-hidden="true")
+            button.btn.btn-orange.pull-xs-right#copy-button(title="Click to copy url to clipboard",data-clipboard-target="#generatedurl") Copy to clipboard
     div#transferContainer(style="display: none;")
-        div.row
+        div.row.top-buffer
             div.col-xs-12
-                em The transfer will start as soon as your friends open the link.
-
-                p.text-muted#generatedurlreminder
+                p.lead Each transfer will start as soon as your friends open the link.
+                p.text-muted.text-xs-center.lead#generatedurlreminder
                 p &nbsp;
                     span#filename
         div#rowReceiverTemplate.row(style="display: none;")
-            div.col-xs-1
-            div.col-xs-1.text-right
+            div.col-xs-1.offset-xs-1.text-right
                 span.icon-Adult.big-icon
-            div.col-xs-7
+            div.col-xs-8
                 div.text-xs-center#progressDisplay 0%
                 progress.progress(value="0" max="100" style="min-width: 2em;" aria-describedby="progressDisplay" aria-valuenow="0")
             div.col-xs-1