From 71b2e30fbcd77ae09f23bb92442c097204b6ff45 Mon Sep 17 00:00:00 2001 From: Harvey Kandola Date: Fri, 7 Oct 2016 10:19:46 -0700 Subject: [PATCH] start new document in sidebar --- app/app/components/folder/folders-list.js | 19 ++- app/app/components/folder/start-document.js | 48 +++--- app/app/styles/view/page-documents.scss | 88 +++++++++-- .../components/folder/folders-list.hbs | 138 ++++++++++-------- .../components/folder/start-document.hbs | 25 ++-- app/public/assets/img/template-blank.png | Bin 0 -> 1168 bytes app/public/assets/img/template-blank@2x.png | Bin 0 -> 1402 bytes app/public/assets/img/template-saved.png | Bin 0 -> 1238 bytes app/public/assets/img/template-saved@2x.png | Bin 0 -> 1433 bytes 9 files changed, 206 insertions(+), 112 deletions(-) create mode 100644 app/public/assets/img/template-blank.png create mode 100644 app/public/assets/img/template-blank@2x.png create mode 100644 app/public/assets/img/template-saved.png create mode 100644 app/public/assets/img/template-saved@2x.png diff --git a/app/app/components/folder/folders-list.js b/app/app/components/folder/folders-list.js index bfc46f2d..b1e7a682 100644 --- a/app/app/components/folder/folders-list.js +++ b/app/app/components/folder/folders-list.js @@ -26,6 +26,8 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { hasPrivateFolders: false, newFolder: "", showScrollTool: false, + showingDocument: false, + showingList: true, init() { this._super(...arguments); @@ -35,9 +37,14 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { let emptyTemplate = { id: "0", title: "Empty document", - selected: true + description: "An empty canvas for your masterpiece", + img: "template-blank", }; + saved.forEach(function(t) { + t.img = "template-saved"; + }); + saved.unshiftObject(emptyTemplate); _this.set('savedTemplates', saved); }); @@ -134,6 +141,16 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { return true; }, + showDocument() { + this.set('showingDocument', true); + this.set('showingList', false); + }, + + showList() { + this.set('showingDocument', false); + this.set('showingList', true); + }, + onEditTemplate(template) { this.navigateToDocument(template); }, diff --git a/app/app/components/folder/start-document.js b/app/app/components/folder/start-document.js index fe709bad..b6d4227c 100644 --- a/app/app/components/folder/start-document.js +++ b/app/app/components/folder/start-document.js @@ -14,42 +14,17 @@ import NotifierMixin from '../../mixins/notifier'; export default Ember.Component.extend(NotifierMixin, { localStorage: Ember.inject.service(), - tagName: 'span', - selectedTemplate: { - id: "0" - }, canEditTemplate: "", - didReceiveAttrs() { - this.send('setTemplate', this.get('savedTemplates')[0]); - }, - actions: { - setTemplate(chosen) { - if (is.undefined(chosen)) { - return; - } - - this.set('selectedTemplate', chosen); - this.set('canEditTemplate', chosen.id !== "0" ? "Edit" : ""); - - let templates = this.get('savedTemplates'); - - templates.forEach(template => { - Ember.set(template, 'selected', template.id === chosen.id); - }); - }, - - editTemplate() { - let template = this.get('selectedTemplate'); + editTemplate(template) { this.audit.record('edited-saved-template'); this.attrs.onEditTemplate(template); return true; }, - startDocument() { - let template = this.get('selectedTemplate'); + startDocument(template) { this.audit.record('used-saved-template'); this.attrs.onDocumentTemplate(template.id, template.title, "private"); @@ -57,3 +32,22 @@ export default Ember.Component.extend(NotifierMixin, { } } }); + +/* +setTemplate(chosen) { + if (is.undefined(chosen)) { + return; + } + + this.set('selectedTemplate', chosen); + this.set('canEditTemplate', chosen.id !== "0" ? "Edit" : ""); + + let templates = this.get('savedTemplates'); + + templates.forEach(template => { + Ember.set(template, 'selected', template.id === chosen.id); + }); +}, + + +*/ diff --git a/app/app/styles/view/page-documents.scss b/app/app/styles/view/page-documents.scss index e725095d..175cd940 100644 --- a/app/app/styles/view/page-documents.scss +++ b/app/app/styles/view/page-documents.scss @@ -1,6 +1,4 @@ -.folders-list { - margin-top: 30px; - +.space-tools { .doc-tool { position: absolute; top: 150px; @@ -14,10 +12,10 @@ right: -18px; z-index: 888; -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */ - -moz-animation: fadein 1s; /* Firefox < 16 */ - -ms-animation: fadein 1s; /* Internet Explorer */ - -o-animation: fadein 1s; /* Opera < 12.1 */ - animation: fadein 1s; + -moz-animation: fadein 1s; /* Firefox < 16 */ + -ms-animation: fadein 1s; /* Internet Explorer */ + -o-animation: fadein 1s; /* Opera < 12.1 */ + animation: fadein 1s; } .stuck-space-tool { @@ -26,14 +24,16 @@ right: 0; left: 0; -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */ - -moz-animation: fadein 1s; /* Firefox < 16 */ - -ms-animation: fadein 1s; /* Internet Explorer */ - -o-animation: fadein 1s; /* Opera < 12.1 */ - animation: fadein 1s; + -moz-animation: fadein 1s; /* Firefox < 16 */ + -ms-animation: fadein 1s; /* Internet Explorer */ + -o-animation: fadein 1s; /* Opera < 12.1 */ + animation: fadein 1s; } +} +.folders-list { > .section { - margin: 0 0 40px 0; + margin: 30px 0 10px 0; > .heading { font-size: 0.9rem; @@ -195,3 +195,67 @@ } } } + +.templates-list { + margin: 0; + + > .list { + margin: 0; + padding: 0; + + > .item { + list-style: none; + cursor: pointer; + padding: 10px 5px; + margin: 5px 0; + @include ease-in(); + + &:hover { + @include ease-in(); + + > .details { + > .title { + color: $color-primary; + } + + > .desc { + color: $color-primary; + } + } + } + + .icon { + text-align: center; + display: inline-block; + width: 50px; + + > .img { + float: left; + text-align: center; + display: inline-block; + height: 40px; + width: 40px; + } + } + + > .details { + vertical-align: top; + display: inline-block; + width: 80%; + + > .title { + font-size: 1rem; + font-weight: bold; + color: $color-off-black; + letter-spacing: 0.5px; + } + + > .desc { + color: $color-gray; + font-size: 0.9rem; + margin-top: 5px; + } + } + } + } +} diff --git a/app/app/templates/components/folder/folders-list.hbs b/app/app/templates/components/folder/folders-list.hbs index a0cbc629..373c2fe4 100644 --- a/app/app/templates/components/folder/folders-list.hbs +++ b/app/app/templates/components/folder/folders-list.hbs @@ -1,24 +1,9 @@ -{{#if session.isEditor}} -
- add -
Space
-
- {{#dropdown-dialog target="add-space-button" position="bottom left" button="Add" color="flat-green" onAction=(action 'addFolder') focusOn="new-folder-name"}} -
-
- -
A repository for related documentation
- {{input type='text' id="new-folder-name" class="mousetrap" value=newFolder}} -
+
+ {{#if showingDocument}} +
+ close
- {{/dropdown-dialog}} -{{/if}} -
- {{#if folderService.canEditCurrentFolder}} -
- add -
{{folder/start-document savedTemplates=savedTemplates folder=folder @@ -32,51 +17,82 @@
{{/if}} -
-
EVERYONE
- {{#unless hasPublicFolders}} -
No global spaces
- {{/unless}} -
    - {{#each publicFolders as |folder|}} - {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} -
  • {{ folder.name }}
    • - {{/link-to}} - {{/each}} -
-
- - {{#if session.authenticated}} -
-
TEAM
- {{#unless hasProtectedFolders}} -
No protected spaces
- {{/unless}} -
    - {{#each protectedFolders as |folder|}} - {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} -
  • {{ folder.name }}
    • - {{/link-to}} - {{/each}} -
-
- -
-
PERSONAL
- {{#unless hasPrivateFolders}} -
No private spaces
- {{/unless}} -
    - {{#each privateFolders as |folder|}} - {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} -
  • {{ folder.name }}
    • - {{/link-to}} - {{/each}} -
-
+ {{#if showingList}} + {{#if folderService.canEditCurrentFolder}} +
+ add +
+ {{/if}} {{/if}}
+
+ {{#if showingList}} + + {{#if session.isEditor}} +
+ add +
Space
+
+ {{#dropdown-dialog target="add-space-button" position="bottom left" button="Add" color="flat-green" onAction=(action 'addFolder') focusOn="new-folder-name"}} +
+
+ +
A repository for related documentation
+ {{input type='text' id="new-folder-name" class="mousetrap" value=newFolder}} +
+
+ {{/dropdown-dialog}} + {{/if}} + +
+
EVERYONE
+ {{#unless hasPublicFolders}} +
No global spaces
+ {{/unless}} +
    + {{#each publicFolders as |folder|}} + {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} +
  • {{ folder.name }}
    • + {{/link-to}} + {{/each}} +
+
+ + {{#if session.authenticated}} +
+
TEAM
+ {{#unless hasProtectedFolders}} +
No protected spaces
+ {{/unless}} +
    + {{#each protectedFolders as |folder|}} + {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} +
  • {{ folder.name }}
    • + {{/link-to}} + {{/each}} +
+
+ +
+
PERSONAL
+ {{#unless hasPrivateFolders}} +
No private spaces
+ {{/unless}} +
    + {{#each privateFolders as |folder|}} + {{#link-to 'folders.folder' folder.id folder.slug class="link" activeClass='selected' }} +
  • {{ folder.name }}
    • + {{/link-to}} + {{/each}} +
+
+ {{/if}} + {{/if}} +
+ + + diff --git a/app/app/templates/components/folder/start-document.hbs b/app/app/templates/components/folder/start-document.hbs index 5e141b20..1cae3c15 100644 --- a/app/app/templates/components/folder/start-document.hbs +++ b/app/app/templates/components/folder/start-document.hbs @@ -1,14 +1,17 @@ -{{#dropdown-dialog target="start-document-button" position="bottom left" button="Start" color="flat-green" onAction=(action 'startDocument') button2=canEditTemplate color2="flat-blue" onAction2=(action 'editTemplate')}} -