From 0c2883d3421fcfd33a12234cb70a8d86dd973539 Mon Sep 17 00:00:00 2001 From: EnesAlili Date: Sun, 16 Oct 2016 19:26:20 +0100 Subject: [PATCH 1/2] improved share folder onboarding --- app/app/components/onboard/share-folder.js | 20 +++++++------- app/app/styles/view/document/content.scss | 2 +- app/app/styles/view/document/wysiwyg.scss | 25 +++++++++++------- app/app/styles/view/page-auth.scss | 2 +- app/app/styles/view/page-documents.scss | 16 ++++++----- app/app/styles/view/page-onboard.scss | 15 +++++++---- .../components/document/document-view.hbs | 15 ++++++----- .../components/folder/documents-list.hbs | 20 +++++++------- .../components/onboard/share-folder.hbs | 18 ++++++++----- app/public/assets/img/no-documents.png | Bin 0 -> 5157 bytes 10 files changed, 77 insertions(+), 56 deletions(-) create mode 100644 app/public/assets/img/no-documents.png diff --git a/app/app/components/onboard/share-folder.js b/app/app/components/onboard/share-folder.js index 0429b897e..b9f4fa19c 100644 --- a/app/app/components/onboard/share-folder.js +++ b/app/app/components/onboard/share-folder.js @@ -1,11 +1,11 @@ // Copyright 2016 Documize Inc. . All rights reserved. // -// This software (Documize Community Edition) is licensed under +// This software (Documize Community Edition) is licensed under // GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html // // You can operate outside the AGPL restrictions by purchasing // Documize Enterprise Edition and obtaining a commercial license -// by contacting . +// by contacting . // // https://documize.com @@ -29,9 +29,9 @@ export default Ember.Component.extend({ // Stage 1 - person name keypress handler $("#stage-1-firstname, #stage-1-lastname").keyup(function() { if (!$("#stage-1-firstname").val() || !$("#stage-1-lastname").val()) { - $(".name-status").attr("src", "assets/img/onboard/person-red.png"); + $(".name-status").attr("src", "/assets/img/onboard/person-red.png"); } else { - $(".name-status").attr("src", "assets/img/onboard/person-green.png"); + $(".name-status").attr("src", "/assets/img/onboard/person-green.png"); } }); @@ -40,14 +40,14 @@ export default Ember.Component.extend({ if (!$("#stage-1-firstname").val()) { $("#stage-1-firstname").focus(); $("#stage-1-firstname").addClass("error"); - $(".name-status").attr("src", "assets/img/onboard/person-red.png"); + $(".name-status").attr("src", "/assets/img/onboard/person-red.png"); return; } if (!$("#stage-1-lastname").val()) { $("#stage-1-lastname").focus(); $("#stage-1-lastname").addClass("error"); - $(".name-status").attr("src", "assets/img/onboard/person-red.png"); + $(".name-status").attr("src", "/assets/img/onboard/person-red.png"); return; } @@ -67,9 +67,9 @@ export default Ember.Component.extend({ $("#stage-2-password-confirm").keyup(function() { if ($("#stage-2-password").val().length < 6 || $("#stage-2-password").val().length > 50 || ($("#stage-2-password").val() !== $("#stage-2-password-confirm").val())) { - $(".password-status").attr("src", "assets/img/onboard/lock-red.png"); + $(".password-status").attr("src", "/assets/img/onboard/lock-red.png"); } else { - $(".password-status").attr("src", "assets/img/onboard/lock-green.png"); + $(".password-status").attr("src", "/assets/img/onboard/lock-green.png"); } }); }); @@ -91,7 +91,7 @@ export default Ember.Component.extend({ if ($("#stage-2-password-confirm").val() !== $("#stage-2-password").val()) { $(".mismatch").show(); - $(".password-status").attr("src", "assets/img/onboard/lock-red.png"); + $(".password-status").attr("src", "/assets/img/onboard/lock-red.png"); return; } @@ -121,4 +121,4 @@ export default Ember.Component.extend({ }); }); }, -}); \ No newline at end of file +}); diff --git a/app/app/styles/view/document/content.scss b/app/app/styles/view/document/content.scss index 6d3d74813..dc64b7d43 100644 --- a/app/app/styles/view/document/content.scss +++ b/app/app/styles/view/document/content.scss @@ -112,7 +112,7 @@ .no-sections { text-align: center; - opacity: 0.4; + opacity: 0.5; > .box { padding: 35px; diff --git a/app/app/styles/view/document/wysiwyg.scss b/app/app/styles/view/document/wysiwyg.scss index 2baebd3aa..a50ad0153 100644 --- a/app/app/styles/view/document/wysiwyg.scss +++ b/app/app/styles/view/document/wysiwyg.scss @@ -6,7 +6,6 @@ table { - margin: 10px 20px 0 20px !important; // width: auto !important; @include border(1px); @@ -43,37 +42,45 @@ font-family: "open_sanssemibold"; } + h1.doc-name { + font-size: 2em; + font-family: open_sansregular; + } + h1 { font-size: 1.6em; - font-family: open_sansregular; + font-family: open_sanslight; color:$color-off-black; margin: 30px 0 20px 0; } h2 { - font-size: 2rem; + font-size: 1.5em; margin: 30px 0 20px 0; - font-family: open_sansregular; + font-family: open_sanslight; } h3 { - font-size: 1.6rem; + font-size: 1.4rem; margin: 30px 0 20px 0; + font-family: open_sanslight; } h4 { - font-size: 1.6rem; + font-size: 1.3rem; margin: 30px 0 20px 0; + font-family: open_sanslight; } h5, h6, h7, h8, h9 { - font-size: 1.4rem; + font-size: 1.2rem; margin: 30px 0 20px 0; + font-family: open_sanslight; } h2, h3, h4, h5, h6, h7, h8, h9 @@ -118,7 +125,7 @@ } td, th { - border: 1px solid #dddddd; + border: 1px solid #f3f5f8; padding: 5px 7px !important; } td:empty, @@ -134,7 +141,7 @@ border-width: 2px; } th { - background: #efefef; + background: #f7f6f6; } } } diff --git a/app/app/styles/view/page-auth.scss b/app/app/styles/view/page-auth.scss index a0112460b..0d6d9cfab 100644 --- a/app/app/styles/view/page-auth.scss +++ b/app/app/styles/view/page-auth.scss @@ -14,7 +14,7 @@ margin: 0 auto; > img { - height: 40px; + height: 60px; margin: 40px 0; } } diff --git a/app/app/styles/view/page-documents.scss b/app/app/styles/view/page-documents.scss index 175cd9402..183b8534d 100644 --- a/app/app/styles/view/page-documents.scss +++ b/app/app/styles/view/page-documents.scss @@ -174,20 +174,24 @@ } .no-documents { - margin-top: 50px; + margin-top: 150px; text-align: center; - opacity: 0.4; + opacity: 0.5; + background-image: url("/assets/img/no-documents.png"); + background-repeat: no-repeat; + background-position: center; > .box { - padding: 35px; - width: 300px; - display: inline-block; - margin: 0 20px; + max-width: 400px; + margin: 0 auto; + border: 1px dashed #b3adad; + padding: 20px; > .message { font-size: 14px; color: $color-off-black; margin-top: 20px; + line-height: 50px; } > .regular-button { diff --git a/app/app/styles/view/page-onboard.scss b/app/app/styles/view/page-onboard.scss index 27e2fb9ea..4aa30cd71 100644 --- a/app/app/styles/view/page-onboard.scss +++ b/app/app/styles/view/page-onboard.scss @@ -2,7 +2,7 @@ { width: 100%; text-align: left; - color: $color-primary; + color: $color-off-black; letter-spacing: 1px; .stage-1 @@ -145,17 +145,18 @@ .sidebar { - padding: 50px 50px 0 50px; + margin-left: -15px; + padding: 100px 50px 50px 50px; overflow: auto; .logo { - height: 100px; + height: 62px; margin-bottom: 15px; margin-top: 20px; } - h1 + h2 { font-size: 2rem;; color: $color-primary; @@ -165,6 +166,7 @@ p { font-size: 1.3rem; + color: $color-primary; } p.note @@ -179,8 +181,11 @@ height: 400px; width: 500px; margin-top: 200px; - background-color: #eaeaea; + background-color: #f6f9fc; position: relative; + border-radius: 10px; + background-color: #fff; + box-shadow: 0 6px 20px 0 rgba(30,71,101,.1); } input[type='email'], input[type='text'], input[type='password'] { diff --git a/app/app/templates/components/document/document-view.hbs b/app/app/templates/components/document/document-view.hbs index 3298ed502..9365454ce 100644 --- a/app/app/templates/components/document/document-view.hbs +++ b/app/app/templates/components/document/document-view.hbs @@ -1,7 +1,7 @@
- +
-

{{document.name}}

+

{{document.name}}

{{#if document.template}} @@ -64,11 +64,12 @@ {{#if noSections}}
-
- add -
section
-
-
Add a new section to this document
+
Click the +
+ add +
section
+
+ to add a new section to this document
{{/if}} diff --git a/app/app/templates/components/folder/documents-list.hbs b/app/app/templates/components/folder/documents-list.hbs index 37e797c84..fdd7d6acc 100644 --- a/app/app/templates/components/folder/documents-list.hbs +++ b/app/app/templates/components/folder/documents-list.hbs @@ -22,18 +22,16 @@ {{#if emptyState}}
-
- add -
space
+

This space is empty

+
Click the +
+ add +
button to add a new document
or +
+ file_upload +
+ to import .doc .docx, .txt .md files
-
Create a new space for
all your content
-
-
-
- add -
content
-
-
Start with a content template or
import .doc .docx, .txt .md files
{{/if}} diff --git a/app/app/templates/components/onboard/share-folder.hbs b/app/app/templates/components/onboard/share-folder.hbs index eae84fb6d..ace49dbec 100644 --- a/app/app/templates/components/onboard/share-folder.hbs +++ b/app/app/templates/components/onboard/share-folder.hbs @@ -1,11 +1,10 @@
- diff --git a/app/public/assets/img/no-documents.png b/app/public/assets/img/no-documents.png new file mode 100644 index 0000000000000000000000000000000000000000..3b05a83cf4edf83fa78fdb7e6b205fde05116787 GIT binary patch literal 5157 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 IQP=4I0o>k0x&QzG literal 0 HcmV?d00001 From 10ecf0fbb0d439d45dcfba09e74db263b12ad3e2 Mon Sep 17 00:00:00 2001 From: Harvey Kandola Date: Sun, 16 Oct 2016 17:27:52 -0700 Subject: [PATCH 2/2] fixed bug with unnecessary document import init --- app/app/components/dropdown-dialog.js | 4 + app/app/components/folder/folder-toolbar.js | 115 ++++++++++++-------- 2 files changed, 72 insertions(+), 47 deletions(-) diff --git a/app/app/components/dropdown-dialog.js b/app/app/components/dropdown-dialog.js index 1974c8a3c..12ccd8c02 100644 --- a/app/app/components/dropdown-dialog.js +++ b/app/app/components/dropdown-dialog.js @@ -47,6 +47,10 @@ export default Ember.Component.extend({ // TODO: refactor to eliminate self let self = this; + if (is.null(self.get('target'))) { + return; + } + let drop = this.get('tether').createDrop({ target: document.getElementById(self.get('target')), content: self.$(".dropdown-dialog")[0], diff --git a/app/app/components/folder/folder-toolbar.js b/app/app/components/folder/folder-toolbar.js index d8a06bc56..466087cf2 100644 --- a/app/app/components/folder/folder-toolbar.js +++ b/app/app/components/folder/folder-toolbar.js @@ -44,7 +44,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.set('movedFolderOptions', targets); }, - didRender() { + didRender() { if (this.get('hasSelectedDocuments')) { this.addTooltip(document.getElementById("move-documents-button")); this.addTooltip(document.getElementById("delete-documents-button")); @@ -57,52 +57,14 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.addTooltip(document.getElementById("import-document-button")); } } - - if (this.get('folderService').get('canEditCurrentFolder')) { - let self = this; - let folderId = this.get('folder.id'); - let url = this.get('appMeta.endpoint'); - let importUrl = `${url}/import/folder/${folderId}`; - - let dzone = new Dropzone("#import-document-button > i", { - headers: { - 'Authorization': 'Bearer ' + self.get('session.session.content.authenticated.token') - }, - url: importUrl, - method: "post", - paramName: 'attachment', - acceptedFiles: ".doc,.docx,.txt,.md,.markdown", - clickable: true, - maxFilesize: 10, - parallelUploads: 3, - uploadMultiple: false, - addRemoveLinks: false, - autoProcessQueue: true, - - init: function () { - this.on("success", function (document) { - self.send('onDocumentImported', document.name, document); - }); - - this.on("error", function (x) { - console.log("Conversion failed for ", x.name, " obj ", x); // TODO proper error handling - }); - - this.on("queuecomplete", function () {}); - - this.on("addedfile", function (file) { - self.send('onDocumentImporting', file.name); - self.audit.record('converted-document'); - }); - } - }); - - dzone.on("complete", function (file) { - dzone.removeFile(file); - }); - - this.set('drop', dzone); - } + }, + + didUpdate() { + this.setupImport(); + }, + + didInsertElement() { + // this.setupImport(); }, willDestroyElement() { @@ -114,6 +76,65 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.destroyTooltips(); }, + setupImport() { + // guard against unecessary file upload component init + if (this.get('hasSelectedDocuments') || !this.get('folderService').get('canEditCurrentFolder')) { + return; + } + + // already done init? + if (is.not.null(this.get('drop'))) { + if (is.not.null(this.get('drop'))) { + this.get('drop').destroy(); + this.set('drop', null); + } + } + + let self = this; + let folderId = this.get('folder.id'); + let url = this.get('appMeta.endpoint'); + let importUrl = `${url}/import/folder/${folderId}`; + + let dzone = new Dropzone("#import-document-button > i", { + headers: { + 'Authorization': 'Bearer ' + self.get('session.session.content.authenticated.token') + }, + url: importUrl, + method: "post", + paramName: 'attachment', + acceptedFiles: ".doc,.docx,.txt,.md,.markdown", + clickable: true, + maxFilesize: 10, + parallelUploads: 3, + uploadMultiple: false, + addRemoveLinks: false, + autoProcessQueue: true, + + init: function () { + this.on("success", function (document) { + self.send('onDocumentImported', document.name, document); + }); + + this.on("error", function (x) { + console.log("Conversion failed for ", x.name, " obj ", x); // TODO proper error handling + }); + + this.on("queuecomplete", function () {}); + + this.on("addedfile", function (file) { + self.send('onDocumentImporting', file.name); + self.audit.record('converted-document'); + }); + } + }); + + dzone.on("complete", function (file) { + dzone.removeFile(file); + }); + + this.set('drop', dzone); + }, + actions: { onDocumentImporting(filename) { this.send("showNotification", `Importing ${filename}`);