diff --git a/gui/app/components/folder/sidebar-folders-list.js b/gui/app/components/folder/sidebar-folders-list.js deleted file mode 100644 index b206932a..00000000 --- a/gui/app/components/folder/sidebar-folders-list.js +++ /dev/null @@ -1,105 +0,0 @@ -// Copyright 2016 Documize Inc. . All rights reserved. -// -// 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 . -// -// https://documize.com - -import { schedule } from '@ember/runloop'; - -import Component from '@ember/component'; -import constants from '../../utils/constants'; -import TooltipMixin from '../../mixins/tooltip'; -import NotifierMixin from '../../mixins/notifier'; -import AuthMixin from '../../mixins/auth'; - -export default Component.extend(TooltipMixin, NotifierMixin, AuthMixin, { - publicFolders: [], - protectedFolders: [], - privateFolders: [], - hasPublicFolders: false, - hasProtectedFolders: false, - hasPrivateFolders: false, - newFolder: '', - copyTemplate: true, - copyPermission: true, - copyDocument: false, - clonedSpace: { id: "" }, - showSpace: false, - showClone: false, - - didReceiveAttrs() { - let folders = this.get('folders'); - let publicFolders = []; - let protectedFolders = []; - let privateFolders = []; - - _.each(folders, folder => { - if (folder.get('folderType') === constants.FolderType.Public) { - publicFolders.pushObject(folder); - } - if (folder.get('folderType') === constants.FolderType.Private) { - privateFolders.pushObject(folder); - } - if (folder.get('folderType') === constants.FolderType.Protected) { - protectedFolders.pushObject(folder); - } - }); - - this.set('publicFolders', publicFolders); - this.set('protectedFolders', protectedFolders); - this.set('privateFolders', privateFolders); - this.set('hasPublicFolders', this.get('publicFolders.length') > 0); - this.set('hasPrivateFolders', this.get('privateFolders.length') > 0); - this.set('hasProtectedFolders', this.get('protectedFolders.length') > 0); - }, - - actions: { - onToggleCloneOptions() { - this.set('showClone', !this.get('showClone')); - }, - - onToggleNewSpace() { - let val = !this.get('showSpace'); - this.set('showSpace', val); - - if (val) { - schedule('afterRender', () => { - $("#new-folder-name").focus(); - }); - } - }, - - onCloneSpaceSelect(sp) { - this.set('clonedSpace', sp) - }, - - onAdd() { - let folderName = this.get('newFolder'); - let clonedId = this.get('clonedSpace.id'); - - if (is.empty(folderName)) { - $("#new-folder-name").addClass("error").focus(); - return false; - } - - let payload = { - name: folderName, - CloneID: clonedId, - copyTemplate: this.get('copyTemplate'), - copyPermission: this.get('copyPermission'), - copyDocument: this.get('copyDocument'), - } - - this.attrs.onAddSpace(payload); - this.set('showSpace', false); - this.set('newFolder', ''); - - return true; - } - } -}); diff --git a/gui/app/components/folder/sidebar-zone.js b/gui/app/components/folder/sidebar-zone.js deleted file mode 100644 index 8012f47a..00000000 --- a/gui/app/components/folder/sidebar-zone.js +++ /dev/null @@ -1,38 +0,0 @@ -// Copyright 2016 Documize Inc. . All rights reserved. -// -// 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 . -// -// https://documize.com - -import Component from '@ember/component'; -import TooltipMixin from '../../mixins/tooltip'; -import NotifierMixin from '../../mixins/notifier'; -import AuthMixin from '../../mixins/auth'; - -export default Component.extend(TooltipMixin, NotifierMixin, AuthMixin, { - tab: '', - - init() { - this._super(...arguments); - - if (is.empty(this.get('tab')) || is.undefined(this.get('tab'))) { - this.set('tab', 'index'); - } - }, - - actions: { - onAddSpace(m) { - this.attrs.onAddSpace(m); - return true; - }, - - onChangeTab(tab) { - this.set('tab', tab); - }, - } -}); diff --git a/gui/app/components/toolbar/for-space.js b/gui/app/components/toolbar/for-space.js new file mode 100644 index 00000000..33403da0 --- /dev/null +++ b/gui/app/components/toolbar/for-space.js @@ -0,0 +1,70 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// 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 . +// +// https://documize.com + +import Component from '@ember/component'; +import { schedule } from '@ember/runloop'; +import { notEmpty } from '@ember/object/computed'; +import NotifierMixin from '../../mixins/notifier'; +import AuthMixin from '../../mixins/auth'; + +export default Component.extend(NotifierMixin, AuthMixin, { + spaceName: '', + copyTemplate: true, + copyPermission: true, + copyDocument: false, + clonedSpace: { id: '' }, + hasClone: notEmpty('clonedSpace.id'), + + didInsertElement() { + this._super(...arguments); + + $('#add-space-modal').on('show.bs.modal', function(event) { // eslint-disable-line no-unused-vars + schedule('afterRender', () => { + $("#new-space-name").focus(); + }); + }); + }, + + actions: { + onCloneSpaceSelect(sp) { + this.set('clonedSpace', sp) + }, + + onAddSpace(e) { + e.preventDefault(); + + let spaceName = this.get('spaceName'); + let clonedId = this.get('clonedSpace.id'); + + if (is.empty(spaceName)) { + $("#new-space-name").addClass("is-invalid").focus(); + return false; + } + + let payload = { + name: spaceName, + CloneID: clonedId, + copyTemplate: this.get('copyTemplate'), + copyPermission: this.get('copyPermission'), + copyDocument: this.get('copyDocument'), + } + + this.set('spaceName', ''); + this.set('clonedSpace.id', ''); + $("#new-space-name").removeClass("is-invalid"); + + $('#add-space-modal').modal('hide'); + $('#add-space-modal').modal('dispose'); + + this.attrs.onAddSpace(payload); + } + } +}); diff --git a/gui/app/components/toolbar/t-actions.js b/gui/app/components/toolbar/t-actions.js new file mode 100644 index 00000000..ba2f566b --- /dev/null +++ b/gui/app/components/toolbar/t-actions.js @@ -0,0 +1,16 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// 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 . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ + classNames: ['col', 'col-sm-4'] +}); diff --git a/gui/app/components/toolbar/t-links.js b/gui/app/components/toolbar/t-links.js new file mode 100644 index 00000000..90d1dbad --- /dev/null +++ b/gui/app/components/toolbar/t-links.js @@ -0,0 +1,16 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// 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 . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ + classNames: ['col', 'col-sm-8'] +}); diff --git a/gui/app/components/toolbar/t-toolbar.js b/gui/app/components/toolbar/t-toolbar.js new file mode 100644 index 00000000..e790b207 --- /dev/null +++ b/gui/app/components/toolbar/t-toolbar.js @@ -0,0 +1,15 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// 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 . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ +}); diff --git a/gui/app/pods/folder/index/template.hbs b/gui/app/pods/folder/index/template.hbs index 88b71434..86c4efd0 100644 --- a/gui/app/pods/folder/index/template.hbs +++ b/gui/app/pods/folder/index/template.hbs @@ -1,26 +1,17 @@ -{{#layout/zone-container}} +{{layout/nav-bar}} - {{#layout/zone-sidebar}} - {{folder/sidebar-zone - folders=model.folders - folder=model.folder - permissions=model.permissions - tab=tab - onAddSpace=(action 'onAddSpace')}} - {{/layout/zone-sidebar}} +
+ {{toolbar/for-space spaces=model.folders space=model.folder permissions=model.permissions}} - {{#layout/zone-content}} - {{folder/space-view - folders=model.folders - folder=model.folder - templates=model.templates - permissions=model.permissions - documents=model.documents - categories=model.categories - categorySummary=model.categorySummary - categoryMembers=model.categoryMembers - rootDocCount=model.rootDocCount - onRefresh=(action 'onRefresh')}} - {{/layout/zone-content}} - -{{/layout/zone-container}} \ No newline at end of file + {{folder/space-view + folders=model.folders + folder=model.folder + templates=model.templates + permissions=model.permissions + documents=model.documents + categories=model.categories + categorySummary=model.categorySummary + categoryMembers=model.categoryMembers + rootDocCount=model.rootDocCount + onRefresh=(action 'onRefresh')}} +
\ No newline at end of file diff --git a/gui/app/styles/color.scss b/gui/app/styles/color.scss index 2a7b1692..04931e6f 100644 --- a/gui/app/styles/color.scss +++ b/gui/app/styles/color.scss @@ -9,39 +9,49 @@ // // https://documize.com -// Theme colors + +// theme $color-primary: #290F3F; //#351056; $color-primary-light: #F7F2FF; $color-link: #1b701e; -// Theme-neutral colors +// black/white/gray $color-black: #000000; $color-off-black: #111111; -$color-dark: #434343; -$color-gray: #8b9096; - $color-white: #ffffff; $color-off-white: #f5f5f5; +$color-dark: #434343; +$color-gray: #8b9096; +$color-border: #d3d3d3; + +// colors $color-red: #b1251b; $color-green: #1b701e; $color-blue: #2667af; $color-goldy: #cc9933; +// widgets +$color-checkbox: #2667af; + + + + + + + $color-table-border: #e1e1e1; $color-table-header: #f5f5f5; $color-toolbar: #eeeeee; $color-wysiwyg: #3c3c3c; $color-card: #F9F9F9; -$color-border: #f3f5f8; $color-input: #5a5a5a; $color-stroke: #e1e1e1; $color-tooltip: #a1a1a1; $color-toast: #4c4c4c; $color-symbol-box: #dce5e8; $color-symbol-icon: #a4b8be; -$color-checkbox: #0092d3; // gray sidebar -- DEAD $color-sidebar: #f5f5f5; diff --git a/gui/app/styles/mixins.scss b/gui/app/styles/mixins.scss index 676c4eb8..93ee3f29 100644 --- a/gui/app/styles/mixins.scss +++ b/gui/app/styles/mixins.scss @@ -18,6 +18,18 @@ border-radius: $radius; } +@mixin border-radius-left($radius) +{ + border-top-left-radius: $radius; + border-bottom-left-radius: $radius; +} + +@mixin border-radius-right($radius) +{ + border-top-right-radius: $radius; + border-bottom-right-radius: $radius; +} + @mixin ease-in() { -webkit-transition: all 0.30s ease-in-out; diff --git a/gui/app/styles/view/folder/document.scss b/gui/app/styles/view/folder/document.scss index 96ca634e..86e008f3 100644 --- a/gui/app/styles/view/folder/document.scss +++ b/gui/app/styles/view/folder/document.scss @@ -1,121 +1,3 @@ -.space-heading { - margin: 0 0 55px 0; - - .space-name { - font-size: 2rem; - margin: 0 0 10px 0; - font-weight: normal; - // color: $color-primary; - } - - .space-summary { - font-size: 1.2rem; - color: $color-gray; - margin: 0 0 45px; - } -} - -.edit-space-heading { - margin: 0 0 10px 0; - - .edit-space-name { - > input { - font-size: 2rem; - font-weight: normal; - margin: 0 0 40px 0; - color: $color-wysiwyg; - } - } -} - -.documents-list { - margin-bottom: 50px; - - > .caption { - text-transform: uppercase; - color: $color-gray; - font-weight: bold; - font-size: 1.0rem; - margin: 0 0 10px 0; - } - - .document-item { - margin: 0 0 25px 0; - padding: 25px 15px; - position: relative; - transition: 0.3s; - @include content-container(); - - &:hover { - > .link { - > .title { - color: $color-link; - } - - > .snippet { - color: $color-gray; - } - } - - > .checkbox { - display: block; - } - } - - > .checkbox { - position: absolute; - display: none; - top: 10px; - right: 20px; - cursor: pointer; - - > .material-icons { - width: 10px; - margin: 0; - padding: 0; - color: $color-checkbox; - } - } - - .link { - text-decoration: none; - color: $color-off-black; - cursor: pointer; - - &:hover { - text-decoration: none; - color: $color-link; - - > .title { - color: $color-link; - } - - > .snippet { - color: $color-link; - } - } - - > .title { - font-size: 18px; - margin-bottom: 10px; - } - - > .snippet { - color: $color-gray; - font-size: 14px; - line-height: 24px; - } - } - } - - .selected-card { - background-color: $color-selected-item !important; - - > .checkbox { - display: block; - } - } -} .move-document-options { height: 200px; @@ -140,38 +22,3 @@ color: $color-link; } } - -.space-filter { - display: inline-block; - margin: 0 30px 30px 0; - - > .caption { - text-transform: uppercase; - color: $color-gray; - font-weight: bold; - font-size: 1.0rem; - margin: 0 0 10px 0; - } - - > .regular-button { - margin-bottom: 10px; - } -} - -.category-filter { - display: inline-block; - margin: 0 0 30px 0; - - > .regular-button { - margin-right: 10px; - margin-bottom: 10px; - } - - > .caption { - text-transform: uppercase; - color: $color-gray; - font-weight: bold; - font-size: 1.0rem; - margin: 0 0 10px 0; - } -} diff --git a/gui/app/styles/view/space.scss b/gui/app/styles/view/space.scss new file mode 100644 index 00000000..067b02c6 --- /dev/null +++ b/gui/app/styles/view/space.scss @@ -0,0 +1,109 @@ +.view-space { + > .heading { + height: 10px; + + > .view-heading { + font-size: 1.5rem; + font-weight: bold; + color: $color-dark; + } + } + + > .filter-caption { + color: $color-gray; + font-size: 1.0rem; + margin: 0 0 10px 0; + } + + > .documents { + margin: 60px 0; + padding: 0; + + > .document { + @include card(); + @include ease-in(); + list-style-type: none; + overflow: hidden; + position: relative; + margin: 0 0 30px 0; + width: 100%; + // height: 150px; + + &:hover { + > .checkbox { + display: block; + } + } + + > a { + @include ease-in(); + display: block; + position: relative; + padding: 15px 20px; + + > .title { + color: $color-black; + font-size: 1.3rem; + margin-bottom: 5px; + } + + > .snippet { + color: $color-gray; + font-size: 1rem; + line-height: 24px; + } + + &:hover { + color: $color-gray; + + > .title { + color: $color-link; + } + + > .snippet { + color: $color-link; + } + } + } + + > .checkbox { + position: absolute; + display: none; + top: 10px; + right: 20px; + cursor: pointer; + + > .material-icons { + width: 10px; + margin: 0; + padding: 0; + color: $color-checkbox; + } + } + } + + > .selected { + background-color: $color-primary-light !important; + + > .checkbox { + display: block; + } + } + } + + .hashtags { + > .hashtag { + display: inline-block; + margin: 5px 10px 0 5px; + color: $color-gray; + font-size: 0.875rem; + font-style: italic; + + &:hover { + color: $color-link; + } + } + } +} + + diff --git a/gui/app/styles/view/toolbar.scss b/gui/app/styles/view/toolbar.scss index 2c6dac9e..240dacd6 100644 --- a/gui/app/styles/view/toolbar.scss +++ b/gui/app/styles/view/toolbar.scss @@ -11,6 +11,7 @@ display: inline-block; margin-right: 30px; cursor: pointer; + @include ease-in(); &:hover { color: $color-link; diff --git a/gui/app/styles/view/views.scss b/gui/app/styles/view/views.scss index 51a5cd46..b88287f5 100644 --- a/gui/app/styles/view/views.scss +++ b/gui/app/styles/view/views.scss @@ -1 +1,2 @@ @import "spaces.scss"; +@import "space.scss"; diff --git a/gui/app/styles/widget/widget-button.scss b/gui/app/styles/widget/widget-button.scss index ae0169a3..0d7bb633 100644 --- a/gui/app/styles/widget/widget-button.scss +++ b/gui/app/styles/widget/widget-button.scss @@ -313,6 +313,11 @@ } } + +// +// Bootstrap 4 compatible +// + .button-gap { width: 5px; margin: 0; diff --git a/gui/app/styles/widget/widget-input.scss b/gui/app/styles/widget/widget-input.scss index 5c0cc93d..c3b3da7c 100644 --- a/gui/app/styles/widget/widget-input.scss +++ b/gui/app/styles/widget/widget-input.scss @@ -256,3 +256,9 @@ .checkbox-gray { color: $color-gray !important; } + + + +// +// Bootstrap 4 compatible +// diff --git a/gui/app/styles/widget/widget-tabnav.scss b/gui/app/styles/widget/widget-tabnav.scss new file mode 100644 index 00000000..1ea3eba1 --- /dev/null +++ b/gui/app/styles/widget/widget-tabnav.scss @@ -0,0 +1,35 @@ +.tabnav-control { + padding: 0; + margin: 0; + + > .tab { + @include ease-in(); + display: inline-block; + margin: 0; + padding: 5px 15px; + background-color: $color-white; + color: $color-primary; + font-weight: bold; + font-size: 1.1rem; + text-align: center; + cursor: pointer; + border: 1px solid $color-border; + margin: -1px 0 0 -5px; // handles border overlap when tabs wrap onto 2nd line + + &:first-of-type { + @include border-radius-left(3px); + } + + &:last-of-type { + @include border-radius-right(3px); + } + + &:hover { + background-color: $color-primary-light; + } + } + + > .selected { + background-color: $color-primary-light; + } +} diff --git a/gui/app/styles/widget/widget.scss b/gui/app/styles/widget/widget.scss index ae8287ca..fa024ba0 100644 --- a/gui/app/styles/widget/widget.scss +++ b/gui/app/styles/widget/widget.scss @@ -76,4 +76,5 @@ @import "widget-symbol"; @import "widget-tab"; @import "widget-table"; +@import "widget-tabnav"; @import "widget-tooltip"; diff --git a/gui/app/templates/components/folder/document-tags.hbs b/gui/app/templates/components/folder/document-tags.hbs index b7c9c0ad..c0aadf23 100644 --- a/gui/app/templates/components/folder/document-tags.hbs +++ b/gui/app/templates/components/folder/document-tags.hbs @@ -1,9 +1,5 @@ -
+
{{#each tagz as |tg|}} - {{#link-to "search" (query-params filter=tg)}} -
- {{tg}} -
- {{/link-to}} + {{#link-to "search" (query-params filter=tg) class="hashtag"}}{{tg}}{{/link-to}} {{/each}} -
+
\ No newline at end of file diff --git a/gui/app/templates/components/folder/documents-list.hbs b/gui/app/templates/components/folder/documents-list.hbs index 5f64dfde..9f3f7f9a 100644 --- a/gui/app/templates/components/folder/documents-list.hbs +++ b/gui/app/templates/components/folder/documents-list.hbs @@ -1,28 +1,25 @@ -{{#if (gt documents.length 0)}} -
-
Documents
+
+
    {{#each documents key="id" as |document|}} -
    -
    - {{#link-to 'document.index' folder.id folder.slug document.id document.slug class="link"}} -
    {{ document.name }}
    -
    {{ document.excerpt }}
    -
    {{folder/document-tags documentTags=document.tags}}
    - {{/link-to}} - {{#if session.authenticated}} -
    - {{#if document.selected}} - check_box - {{else}} - check_box_outline_blank - {{/if}} -
    - {{/if}} -
    -
    +
  • + {{#link-to 'document.index' folder.id folder.slug document.id document.slug}} +
    {{ document.name }}
    +
    {{ document.excerpt }}
    + {{folder/document-tags documentTags=document.tags}} + {{/link-to}} + {{#if session.authenticated}} +
    + {{#if document.selected}} + check_box + {{else}} + check_box_outline_blank + {{/if}} +
    + {{/if}} +
  • {{/each}} -
-{{/if}} + +
{{#if showAdd}} {{empty-state icon="direct" message="You can create new documents via the green + button"}} diff --git a/gui/app/templates/components/folder/sidebar-folders-list.hbs b/gui/app/templates/components/folder/sidebar-folders-list.hbs deleted file mode 100644 index 1ca4f955..00000000 --- a/gui/app/templates/components/folder/sidebar-folders-list.hbs +++ /dev/null @@ -1,84 +0,0 @@ -