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}} -
- {{#dropdown-dialog target="add-space-button" position="bottom left" button="Add" color="flat-green" onAction=(action 'addFolder') focusOn="new-folder-name"}} -