Docker/documize
Docker/documize
1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-19 21:29:42 +02:00
Code Releases Activity

document sidebar framework, files, activity

Browse source
This commit is contained in:
Harvey Kandola 2017-03-07 14:39:06 +00:00
parent 6d481c335a
commit 91cf0d15ae
34 changed files with 633 additions and 1054 deletions
Download patch file Download diff file Expand all files Collapse all files

0
app/app/components/document/edit-tools.js → app/app/components/document/content-linker.js
View file

68
app/app/components/document/document-activity.js
View file

@ -1,68 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
export default Ember.Component.extend({
sortedItems: [],
didReceiveAttrs() {
let editors = this.get('activity.editors');
let viewers = this.get('activity.viewers');
let pages = this.get('pages');
let sorted = [];
if (is.null(editors)) {
editors = [];
}
if (is.null(viewers)) {
viewers = [];
}
viewers.forEach((item) => {
Ember.set(item, 'changeLabel', "viewed");
Ember.set(item, "viewed", true);
sorted.pushObject({ date: item.created, item: item });
});
editors.forEach(function (item) {
Ember.set(item, "added", item.action === "add-page");
Ember.set(item, "changed", item.action === "update-page");
Ember.set(item, "deleted", item.action === "remove-page");
let page = pages.findBy('id', item.pageId);
let title = "";
if (item.deleted || is.undefined(page)) {
title = "removed section";
} else {
if (item.added) {
title = "added " + page.get('title');
}
if (item.changed) {
title = "changed " + page.get('title');
}
}
Ember.set(item, 'changeLabel', title);
let exists = sorted.findBy('item.pageId', item.pageId);
if (is.undefined(exists)) {
sorted.pushObject({ date: item.created, item: item });
}
});
this.set('sortedItems', _.sortBy(sorted, 'date').reverse());
}
});

76
app/app/components/document/sidebar-view-activity.js Normal file
View file

@ -0,0 +1,76 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
export default Ember.Component.extend({
documentService: Ember.inject.service('document'),
appMeta: Ember.inject.service(),
sortedItems: [],
didReceiveAttrs() {
this._super(...arguments);
this.get('documentService').getMeta(this.get('document.id')).then((activity) => {
this.set('activity', activity);
let editors = this.get('activity.editors');
let viewers = this.get('activity.viewers');
let pages = this.get('pages');
let sorted = [];
if (is.null(editors)) {
editors = [];
}
if (is.null(viewers)) {
viewers = [];
}
viewers.forEach((item) => {
Ember.set(item, 'changeLabel', "viewed");
Ember.set(item, "viewed", true);
sorted.pushObject({ date: item.created, item: item });
});
editors.forEach(function (item) {
Ember.set(item, "added", item.action === "add-page");
Ember.set(item, "changed", item.action === "update-page");
Ember.set(item, "deleted", item.action === "remove-page");
let page = pages.findBy('id', item.pageId);
let title = "";
if (item.deleted || is.undefined(page)) {
title = "removed section";
} else {
if (item.added) {
title = "added " + page.get('title');
}
if (item.changed) {
title = "changed " + page.get('title');
}
}
Ember.set(item, 'changeLabel', title);
let exists = sorted.findBy('item.pageId', item.pageId);
if (is.undefined(exists)) {
sorted.pushObject({ date: item.created, item: item });
}
});
this.set('sortedItems', _.sortBy(sorted, 'date').reverse());
});
}
});

41
app/app/components/document/document-files.js → app/app/components/document/sidebar-view-attachments.js
View file

@ -14,17 +14,24 @@ import NotifierMixin from '../../mixins/notifier';
import TooltipMixin from '../../mixins/tooltip';
export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
documentService: Ember.inject.service('document'),
appMeta: Ember.inject.service(),
drop: null,
emptyState: Ember.computed.empty('files'),
deleteAttachment: {
id: "",
name: "",
},
emptyState: Ember.computed('files', function () {
return this.get('files.length') === 0;
}),
init() {
this._super(...arguments);
this.getAttachments();
},
didInsertElement() {
this._super(...arguments);
if (!this.get('isEditor')) {
return;
}
@ -54,7 +61,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
});
this.on("queuecomplete", function () {
self.attrs.onUpload();
self.getAttachments();
});
this.on("addedfile", function ( /*file*/ ) {
@ -71,15 +78,22 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
},
willDestroyElement() {
let drop = this.get('drop');
this._super(...arguments);
let drop = this.get('drop');
if (is.not.null(drop)) {
drop.destroy();
}
},
getAttachments() {
this.get('documentService').getAttachments(this.get('document.id')).then((files) => {
this.set('files', files);
});
},
actions: {
confirmDeleteAttachment(id, name) {
onConfirmDelete(id, name) {
this.set('deleteAttachment', {
id: id,
name: name
@ -103,7 +117,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
this.set('drop', drop);
},
cancel() {
onCancel() {
let drop = this.get('drop');
drop.close();
@ -113,16 +127,19 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
});
},
deleteAttachment() {
onDelete() {
let attachment = this.get('deleteAttachment');
let drop = this.get('drop');
drop.close();
this.attrs.onDelete(this.get('deleteAttachment').id, attachment.name);
this.showNotification(`Deleted ${name}`);
this.set('deleteAttachment', {
id: "",
name: ""
this.get('documentService').deleteAttachment(this.get('document.id'), attachment.id).then(() => {
this.getAttachments();
this.set('deleteAttachment', {
id: "",
name: ""
});
});
return true;

151
app/app/components/document/document-toolbar.js → app/app/components/document/sidebar-zone.js
View file

@ -10,114 +10,83 @@
// https://documize.com
import Ember from 'ember';
import NotifierMixin from '../../mixins/notifier';
import TooltipMixin from '../../mixins/tooltip';
import NotifierMixin from '../../mixins/notifier';
export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
documentService: Ember.inject.service('document'),
sectionService: Ember.inject.service('section'),
appMeta: Ember.inject.service(),
userService: Ember.inject.service('user'),
localStorage: Ember.inject.service(),
pinned: Ember.inject.service(),
drop: null,
users: [],
menuOpen: false,
saveTemplate: {
name: "",
description: ""
},
pinState : {
isPinned: false,
pinId: '',
newName: '',
},
didReceiveAttrs() {
this.set('saveTemplate.name', this.get('document.name'));
this.set('saveTemplate.description', this.get('document.excerpt'));
let doc = this.get('document');
this.set('layoutLabel', doc.get('layout') === 'doc' ? 'Wiki style' : 'Document style');
this.set('pinState.pinId', this.get('pinned').isDocumentPinned(doc.get('id')));
this.set('pinState.isPinned', this.get('pinState.pinId') !== '');
this.set('pinState.newName', doc.get('name').substring(0,3).toUpperCase());
saveTemplate: {
name: "",
description: ""
},
currentTab: '',
didRender() {
if (this.session.isEditor) {
this.addTooltip(document.getElementById("add-document-tab"));
init() {
this._super(...arguments);
if (is.empty(this.get('currentTab'))) {
this.set('currentTab', 'attachments');
}
},
willDestroyElement() {
this.destroyTooltips();
didReceiveAttrs() {
this._super(...arguments);
this.set('saveTemplate.name', this.get('document.name'));
this.set('saveTemplate.description', this.get('document.excerpt'));
this.set('pinState.pinId', this.get('pinned').isDocumentPinned(this.get('document.id')));
this.set('pinState.isPinned', this.get('pinState.pinId') !== '');
this.set('pinState.newName', this.get('document.name').substring(0,3).toUpperCase());
},
actions: {
didRender() {
this._super(...arguments);
},
didInsertElement() {
this._super(...arguments);
},
willDestroyElement() {
this._super(...arguments);
},
actions: {
onChangeTab(tab) {
this.set('currentTab', tab);
},
onTagChange(tags) {
let doc = this.get('document');
doc.set('tags', tags);
this.get('documentService').save(doc);
},
onMenuOpen() {
this.set('menuOpen', !this.get('menuOpen'));
},
deleteDocument() {
onDeleteDocument() {
this.attrs.onDocumentDelete();
},
printDocument() {
onPrintDocument() {
window.print();
},
changeLayout() {
let doc = this.get('document');
let layout = doc.get('layout') === 'doc' ? 'wiki' : 'doc';
doc.set('layout', layout);
this.attrs.onSaveMeta(doc);
this.set('layoutLabel', doc.get('layout') === 'doc' ? 'Wiki style' : 'Document style');
},
saveTemplate() {
var name = this.get('saveTemplate.name');
var excerpt = this.get('saveTemplate.description');
if (is.empty(name)) {
$("#new-template-name").addClass("error").focus();
return false;
}
if (is.empty(excerpt)) {
$("#new-template-desc").addClass("error").focus();
return false;
}
this.showNotification('Template saved');
this.attrs.onSaveTemplate(name, excerpt);
return true;
},
saveMeta() {
let doc = this.get('document');
if (is.empty(doc.get('name'))) {
$("#meta-name").addClass("error").focus();
return false;
}
if (is.empty(doc.get('excerpt'))) {
$("#meta-excerpt").addClass("error").focus();
return false;
}
doc.set('excerpt', doc.get('excerpt').substring(0, 250));
this.attrs.onSaveMeta(doc);
return true;
},
unpin() {
onUnpin() {
this.audit.record('unpinned-document');
this.get('pinned').unpinItem(this.get('pinState.pinId')).then(() => {
@ -127,7 +96,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
});
},
pin() {
onPin() {
let pin = {
pin: this.get('pinState.newName'),
documentId: this.get('document.id'),
@ -147,7 +116,27 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
this.eventBus.publish('pinChange');
});
return true;
},
onSaveTemplate() {
var name = this.get('saveTemplate.name');
var excerpt = this.get('saveTemplate.description');
if (is.empty(name)) {
$("#new-template-name").addClass("error").focus();
return false;
}
if (is.empty(excerpt)) {
$("#new-template-desc").addClass("error").focus();
return false;
}
this.showNotification('Template saved');
this.attrs.onSaveTemplate(name, excerpt);
return true;
}
}
}
});

16
app/app/components/layout/zone-document-sidebar.js
View file

@ -1,16 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
import NotifierMixin from '../../mixins/notifier';
export default Ember.Component.extend(NotifierMixin, {
});

16
app/app/pods/document/activity/controller.js
View file

@ -1,16 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
import NotifierMixin from '../../../mixins/notifier';
export default Ember.Controller.extend(NotifierMixin, {
});

33
app/app/pods/document/activity/route.js
View file

@ -1,33 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
export default Ember.Route.extend(AuthenticatedRouteMixin, {
documentService: Ember.inject.service('document'),
model() {
this.audit.record("viewed-document-activity");
return Ember.RSVP.hash({
folders: this.modelFor('document').folders,
folder: this.modelFor('document').folder,
document: this.modelFor('document').document,
isEditor: this.modelFor('document').isEditor,
pages: this.modelFor('document').allPages,
tabs: this.modelFor('document').tabs,
activity: this.get('documentService').getMeta(this.modelFor('document').document.get('id')).then((activity) => {
return activity;
})
});
}
});

1
app/app/pods/document/activity/template.hbs
View file

@ -1 +0,0 @@
{{document/document-activity document=model.document pages=model.pages activity=model.activity}}

40
app/app/pods/document/files/controller.js
View file

@ -1,40 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
import NotifierMixin from '../../../mixins/notifier';
export default Ember.Controller.extend(NotifierMixin, {
documentService: Ember.inject.service('document'),
getAttachments() {
let self = this;
this.get('documentService').getAttachments(this.get('model.document.id')).then(function (files) {
self.set('model.files', files);
});
},
actions: {
onUpload() {
this.getAttachments();
},
onDelete(id, name) {
let self = this;
this.showNotification(`Deleted ${name}`);
this.get('documentService').deleteAttachment(this.get('model.document.id'), id).then(function () {
self.getAttachments();
});
},
}
});

31
app/app/pods/document/files/route.js
View file

@ -1,31 +0,0 @@
// Copyright 2016 Documize Inc. <legal@documize.com>. 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 <sales@documize.com>.
//
// https://documize.com
import Ember from 'ember';
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
export default Ember.Route.extend(AuthenticatedRouteMixin, {
documentService: Ember.inject.service('document'),
model() {
this.audit.record("viewed-document-attachments");
return Ember.RSVP.hash({
folders: this.modelFor('document').folders,
folder: this.modelFor('document').folder,
document: this.modelFor('document').document,
isEditor: this.modelFor('document').isEditor,
pages: this.modelFor('document').allPages,
tabs: this.modelFor('document').tabs,
files: this.get('documentService').getAttachments(this.modelFor('document').document.get('id'))
});
}
});

1
app/app/pods/document/files/template.hbs
View file

@ -1 +0,0 @@
{{document/document-files document=model.document files=model.files isEditor=model.isEditor onUpload=(action 'onUpload') onDelete=(action 'onDelete')}}

31
app/app/pods/document/index/controller.js
View file

@ -25,12 +25,6 @@ export default Ember.Controller.extend(NotifierMixin, {
this.set('toggled', !this.get('toggled'));
},
onTagChange(tags) {
let doc = this.get('model.document');
doc.set('tags', tags);
this.get('documentService').save(doc);
},
onSaveDocument(doc) {
this.get('documentService').save(doc);
this.showNotification('Saved');
@ -169,6 +163,18 @@ export default Ember.Controller.extend(NotifierMixin, {
});
},
onDocumentDelete() {
this.get('documentService').deleteDocument(this.get('model.document.id')).then(() => {
this.audit.record("deleted-page");
this.send("showNotification", "Deleted");
this.transitionToRoute('folder', this.get('model.folder.id'), this.get('model.folder.slug'));
});
},
onSaveTemplate(name, desc) {
this.get('templateService').saveAsTemplate(this.get('model.document.id'), name, desc).then(function () {});
},
// to test
onPageSequenceChange(changes) {
this.get('documentService').changePageSequence(this.get('model.document.id'), changes).then(() => {
@ -206,17 +212,6 @@ export default Ember.Controller.extend(NotifierMixin, {
this.set('model.pages', pages);
this.get('target.router').refresh();
});
},
}
}
});
/*
onDocumentDelete() {
this.get('documentService').deleteDocument(this.get('model.document.id')).then(() => {
this.audit.record("deleted-page");
this.send("showNotification", "Deleted");
this.transitionToRoute('folder', this.get('model.folder.id'), this.get('model.folder.slug'));
});
}
*/

40
app/app/pods/document/index/template.hbs
View file

@ -1,43 +1,9 @@
<div id="wrapper" class={{if toggled 'toggled'}}>
<div id="sidebar-wrapper">
<div class="document-sidebar-common">
{{#if model.document.template}}
<div class="is-template">TEMPLATE</div>
{{/if}}
{{document/tag-editor documentTags=model.document.tags isEditor=model.isEditor onChange=(action 'onTagChange')}}
{{#layout/zone-document-sidebar}}
{{/layout/zone-document-sidebar}}
</div>
<div class="document-sidebar-toolbar">
<div class="round-button-mono">
<i class="material-icons color-gray">more_horiz</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">view_headline</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">attach_file</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">timeline</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">person</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">chat_bubble</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons color-gray">share</i>
</div>
</div>
{{document/sidebar-zone folders=model.folders folder=model.folder document=model.document
pages=model.pages sections=model.section links=model.links isEditor=model.isEditor
onDocumentDelete=(action 'onDocumentDelete') onSaveTemplate=(action 'onSaveTemplate')}}
</div>
<div id="page-content-wrapper">

9
app/app/router.js
View file

@ -32,18 +32,9 @@ export default Router.map(function () {
this.route('document', {
path: 's/:folder_id/:folder_slug/d/:document_id/:document_slug'
}, function () {
this.route('files', {
path: 'files'
});
this.route('activity', {
path: 'activity'
});
this.route('section', {
path: 'section/:page_id'
});
this.route('history', {
path: 'history'
});
this.route('block', {
path: 'block/:block_id'
});

6
app/app/styles/view/common.scss
View file

@ -3,15 +3,13 @@
> .empty-state {
margin: 30px 0;
font-size: 2rem;
font-size: 1.2rem;
color: $color-gray;
font-family: 'open_sanslight';
}
> .normal-state {
margin: 10px;
font-size: 2rem;
font-size: 1.2rem;
color: $color-gray;
font-family: 'open_sanslight';
}
}

139
app/app/styles/view/document/activity.scss
View file

@ -1,139 +0,0 @@
.document-activity {
> .metrics {
list-style-type: none;
margin: 0 0 30px;
padding: 0;
width: 100%;
text-align: center;
> .metric {
padding: 0 30px;
display: inline-block;
text-align: center;
.label {
padding: 0 0 10px;
font-family: $font-regular;
font-size: 0.9rem;
color: $color-gray;
}
.number {
font-family: $font-light;
font-size: 2rem;
color: $color-off-black;
}
}
}
> .items {
list-style-type: none;
margin: 0;
padding: 0;
white-space: nowrap;
> .item {
padding: 20px 0;
width: 100%;
border-bottom: 1px solid $color-border;
&:last-of-type {
border-bottom: none !important;
}
> .avatar-box {
display: inline-block;
margin: 3px 10px 0 0;
width: 5%;
}
> .name {
display: inline-block;
font-size: 1rem;
font-family: $font-light;
color: $color-off-black;
width: 25%;
}
> .detail {
display: inline-block;
font-size: 1rem;
font-family: $font-regular;
color: $color-off-black;
width: 45%;
.viewed {
color: $color-goldy;
}
.added {
color: $color-green;
}
.changed {
color: $color-blue;
}
.deleted {
color: $color-red;
}
}
> .date {
display: inline-block;
font-family: $font-light;
font-size: 1rem;
float: right;
width: 15%;
padding-top: 10px;
}
}
}
}
.meta-editors {
position: relative;
> .items {
list-style-type: none;
margin: 0;
padding: 0;
white-space: nowrap;
> .item {
margin: 15px 0;
overflow-x: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 90%;
.avatar-box {
display: inline-block;
margin: 3px 10px 0 0;
vertical-align: top;
}
.detail {
display: inline-block;
.name {
font-size: 1rem;
color: $color-off-black;
}
.changed {
font-size: 0.9rem;
}
.deleted {
font-size: 0.9rem;
color: $color-red;
}
.date {
font-size: 0.8rem;
}
}
}
}
}

7
app/app/styles/view/document/all.scss
View file

@ -1,11 +1,10 @@
@import "activity.scss";
@import "content-linker.scss";
@import "files.scss";
@import "history.scss";
@import "inline-editor.scss";
@import "layout.scss";
@import "section-editor.scss";
@import "sidebar.scss";
@import "toolbar.scss";
@import "sidebar-view-attachments.scss";
@import "sidebar-view-activity.scss";
@import "sidebar-zone.scss";
@import "view.scss";
@import "wysiwyg.scss";

82
app/app/styles/view/document/files.scss
View file

@ -1,82 +0,0 @@
.document-files {
margin: 0;
> .upload-document-files {
width: 50%;
padding: 20px;
margin: 0 auto;
text-align: center;
color: $color-gray;
border: 2px dotted $color-gray;
cursor: pointer;
font-size: 1rem;
line-height: 1.7rem;
@include border-radius(10px);
@include ease-in();
&:hover {
border-color: $color-link;
color: $color-link;
}
> .dz-preview,
.dz-processing {
display: none !important;
}
}
> .list {
margin: 0 0 50px;
padding: 7px 0;
> .item {
color: $color-off-black;
margin-top: 10px;
padding: 0;
list-style-type: none;
border-bottom: 1px solid $color-border;
padding-bottom: 10px;
&:last-of-type {
border-bottom: none !important;
}
> .icon {
margin-right: 10px;
}
> a {
color: $color-gray;
&:hover {
color: $color-link;
}
> .file {
font-size: 1rem;
}
}
> .action {
float: right;
margin-top: -2px;
margin-right: 5px;
@extend .cursor-pointer;
@extend .transition-all;
display: none;
color: $color-gray;
}
&:hover {
.action {
display: inline-block;
}
}
}
}
}
.delete-attachment-dialog,
.delete-page-dialog {
display: none;
}

52
app/app/styles/view/document/sidebar-view-activity.scss Normal file
View file

@ -0,0 +1,52 @@
.document-sidebar-view-activity {
> .items {
list-style-type: none;
margin: 0;
padding: 0;
white-space: nowrap;
> .item {
margin: 0;
padding: 10px 0;
width: 100%;
> .avatar-box {
display: inline-block;
margin: 0 10px 0 0;
}
> .name {
display: inline-block;
font-size: 0.9rem;
color: $color-gray;
width: 200px;
@extend .truncate;
}
> .detail {
display: block;
font-size: 0.9rem;
color: $color-off-black;
margin-left: 50px;
width: 200px;
@extend .truncate;
.viewed {
color: $color-goldy;
}
.added {
color: $color-green;
}
.changed {
color: $color-blue;
}
.deleted {
color: $color-red;
}
}
}
}
}

144
app/app/styles/view/document/sidebar-view-attachments.scss Normal file
View file

@ -0,0 +1,144 @@
.document-sidebar-view-attachments {
margin: 0;
> .upload-document-files {
width: 100%;
padding: 20px;
margin-bottom: 20px;
text-align: center;
color: $color-gray;
border: 1px solid $color-stroke;
cursor: pointer;
font-size: 0.9rem;
line-height: 1.7rem;
@include ease-in();
&:hover {
border-color: $color-link;
color: $color-link;
}
> .dz-preview,
.dz-processing {
display: none !important;
}
}
> .list {
margin: 0 0 50px;
padding: 7px 0;
> .item {
color: $color-off-black;
margin: 0;
padding: 10px 0;
font-size: 0.9rem;
list-style-type: none;
&:last-of-type {
border-bottom: none !important;
}
> .icon {
margin-right: 10px;
}
> a {
@extend .truncate;
width: 200px;
color: $color-gray;
&:hover {
color: $color-link;
}
> .file {
@extend .truncate;
display: inline-block;
font-size: 0.9rem;
width: 200px;
}
}
> .action {
float: right;
margin-top: -2px;
margin-right: 5px;
@extend .cursor-pointer;
@extend .transition-all;
display: none;
color: $color-gray;
}
&:hover {
.action {
display: inline-block;
}
}
}
}
}
.delete-attachment-dialog,
.delete-page-dialog {
display: none;
}
// .document-structure {
// > .toc-controls {
// margin: 0;
// color: $color-gray;
// > .round-button-mono {
// color: $color-green;
// border-color: $color-green;
// > .material-icons {
// color: $color-green;
// }
// }
// > .disabled {
// @extend .cursor-not-allowed;
// color: $color-stroke;
// border-color: $color-stroke;
// > .material-icons {
// color: $color-stroke;
// }
// }
// }
// .entries {
// padding: 0;
// list-style: none;
// font-size: 13px;
// overflow-x: hidden;
// list-style-type: none;
// margin: 20px 0 0;
// font-family: $font-semibold;
// .item {
// padding: 4px 0;
// text-overflow: ellipsis;
// word-wrap: break-word;
// white-space: nowrap;
// overflow: hidden;
// > .link {
// color: $color-gray;
// &:hover {
// color: $color-link;
// }
// }
// > .selected {
// color: $color-link;
// font-weight: bold;
// }
// }
// }
// }

65
app/app/styles/view/document/sidebar-zone.scss Normal file
View file

@ -0,0 +1,65 @@
.document-sidebar-common {
display: inline-block;
width: 340px;
padding: 40px 20px 40px 20px;
> .pinner {
cursor: pointer;
> .material-icons {
color: $color-primary;
}
}
> .template-header {
color: $color-goldy;
font-size: 1.5em;
margin-bottom: 20px;
}
}
.document-sidebar-toolbar {
display: inline-block;
width: 60px;
background-color: $color-toolbar;
text-align: center;
position: fixed;
right: 0;
top: 0;
height: 100%;
padding: 50px 0 0 0;
> .selected {
background-color: $color-off-black !important;
> .material-icons {
color: $color-white !important;
}
}
> .round-button-mono {
> .material-icons {
color: $color-gray;
}
}
}
.document-sidebar-wrapper {
padding: 40px 20px 40px 20px;
margin-right: 60px;
.document-sidebar-panel {
width: 300px;
// top: 0;
// bottom: 0;
// position: fixed;
// overflow-y: scroll;
// overflow-x: hidden;
> .title {
color: $color-primary;
font-size: 1.1rem;
margin-bottom: 30px;
}
}
}

142
app/app/styles/view/document/sidebar.scss
View file

@ -1,142 +0,0 @@
.document-sidebar-common {
display: inline-block;
width: 340px;
padding: 40px 20px;
}
.document-sidebar-toolbar {
display: inline-block;
width: 60px;
background-color: $color-toolbar;
text-align: center;
position: fixed;
right: 0;
top: 0;
height: 100%;
padding: 50px 0 0 0;
}
// .xxxx {
// .is-template {
// color: $color-goldy;
// font-weight: bold;
// font-size: 1.5em;
// margin-bottom: 30px;
// padding-bottom: 5px;
// border-bottom: 1px dotted $color-goldy;
// }
// @extend .no-select;
// .stuck-toc {
// position: fixed;
// top: 20px;
// -webkit-animation: fadein 1s;
// -moz-animation: fadein 1s;
// -ms-animation: fadein 1s;
// -o-animation: fadein 1s;
// animation: fadein 1s;
// }
// .section-tool {
// position: absolute;
// top: 130px;
// right: -18px;
// z-index: 999;
// }
// .scroll-tool {
// position: absolute;
// top: 130px;
// right: -18px;
// z-index: 999;
// -webkit-animation: fadein 1s;
// -moz-animation: fadein 1s;
// -ms-animation: fadein 1s;
// -o-animation: fadein 1s;
// animation: fadein 1s;
// }
// .stuck-tool {
// position: fixed !important;
// top: 130px !important;
// right: 0;
// left: 0;
// -webkit-animation: fadein 1s;
// -moz-animation: fadein 1s;
// -ms-animation: fadein 1s;
// -o-animation: fadein 1s;
// animation: fadein 1s;
// }
// .close-action {
// float: right;
// > .round-button-mono {
// color: $color-stroke;
// border-color: $color-stroke;
// > .material-icons {
// color: $color-stroke;
// }
// }
// }
// .document-structure {
// > .toc-controls {
// margin: 0;
// color: $color-gray;
// > .round-button-mono {
// color: $color-green;
// border-color: $color-green;
// > .material-icons {
// color: $color-green;
// }
// }
// > .disabled {
// @extend .cursor-not-allowed;
// color: $color-stroke;
// border-color: $color-stroke;
// > .material-icons {
// color: $color-stroke;
// }
// }
// }
// .entries {
// padding: 0;
// list-style: none;
// font-size: 13px;
// overflow-x: hidden;
// list-style-type: none;
// margin: 20px 0 0;
// font-family: $font-semibold;
// .item {
// padding: 4px 0;
// text-overflow: ellipsis;
// word-wrap: break-word;
// white-space: nowrap;
// overflow: hidden;
// > .link {
// color: $color-gray;
// &:hover {
// color: $color-link;
// }
// }
// > .selected {
// color: $color-link;
// font-weight: bold;
// }
// }
// }
// }
// }

114
app/app/styles/view/document/toolbar.scss
View file

@ -1,114 +0,0 @@
.document-toolbar {
position: relative;
margin: -30px 0 40px;
height: 60px;
padding: 5px 30px 0;
background-color: $color-sidebar;
@include border-radius-bottom-right(5px);
@include border-radius-bottom-left(5px);
@extend .no-select;
> .tabs {
width: 70%;
height: 50px;
margin-top: 15px;
display: inline-block;
> .tab {
list-style-type: none;
display: inline-block;
margin: 0 20px 0 0;
padding: 0;
color: $color-gray;
font-family: $font-semibold;
cursor: pointer;
&:hover {
color: $color-link;
}
> a {
color: $color-gray;
@include ease-in();
&:hover {
color: $color-link;
}
}
> .active {
color: $color-link;
> .add-tab {
> i {
color: $color-link;
}
}
}
.add-tab {
display: inline-block;
vertical-align: text-top;
@include ease-in();
> i {
font-size: 1.5rem;
color: $color-gray;
&:hover {
color: $color-link;
}
}
}
}
}
> .options {
width: 30%;
height: 50px;
margin-top: 15px;
display: inline-block;
text-align: right;
float: right;
> .option {
list-style-type: none;
display: inline-block;
margin: 0 0 0 20px;
padding: 0;
color: $color-gray;
cursor: pointer;
@include ease-in();
&:hover {
color: $color-link;
}
> .pinned {
color: $color-primary;
}
}
> a {
display: inline-block;
> .option {
list-style-type: none;
display: inline-block;
margin: 0 0 0 20px;
padding: 0;
color: $color-gray;
cursor: pointer;
@include ease-in();
&:hover {
color: $color-link;
}
> .pinned {
color: $color-primary;
}
}
}
}
}

2
app/app/styles/widget/widget-avatar.scss
View file

@ -3,7 +3,7 @@
background-color: $color-gray;
@include border-radius(20px);
@include ease-in();
padding: 7px 0 0 0;
padding: 10px 0 0 0;
letter-spacing: 1px;
text-align: center;
height: 35px;

0
app/app/templates/components/document/edit-tools.hbs → app/app/templates/components/document/content-linker.hbs
View file

41
app/app/templates/components/document/document-activity.hbs
View file

@ -1,41 +0,0 @@
<div class="document-activity">
<ul class="metrics">
<li class="metric">
<div class="label">created</div>
<div class="number">{{time-ago document.created}}</div>
</li>
<li class="metric">
<div class="label">viewers</div>
<div class="number">{{activity.viewers.length}}</div>
</li>
<li class="metric">
<div class="label">actions</div>
<div class="number">{{activity.editors.length}}</div>
</li>
</ul>
<ul class="items">
{{#each sortedItems as |e|}}
<li class="item">
<div class="avatar-box">
<div class="avatar">{{user-initials e.item.firstname e.item.lastname}}</div>
</div>
<div class="name">{{e.item.firstname}} {{e.item.lastname}}</div>
<div class="detail">
{{#if e.item.deleted}}
<div class="deleted">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.changed}}
<div class="changed">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.added}}
<div class="added">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.viewed}}
<div class="viewed">{{e.item.changeLabel}}</div>
{{/if}}
</div>
<div class="date">{{time-ago e.date}}</div>
</li>
{{/each}}
</ul>
</div>

44
app/app/templates/components/document/document-files.hbs
View file

@ -1,44 +0,0 @@
<div class="document-files">
<ul class="list">
{{#each files key="id" as |a index|}}
<li class="item">
<img class="icon" src="/assets/img/attachments/{{document/file-icon a.extension}}" />
<a href="{{ appMeta.endpoint }}/public/attachments/{{ appMeta.orgId }}/{{ a.id }}">
<span class="file">{{ a.filename }}</span>
</a>
{{#if isEditor}}
<div class="action round-button-mono">
<i class="material-icons color-gray delete-attachment-{{a.id}}" title="Delete" {{action 'confirmDeleteAttachment' a.id a.filename}}>delete</i>
</div>
{{/if}}
</li>
{{/each}}
</ul>
{{#if emptyState}}
<div class="explainer">
<div class="empty-state">
There are no files
</div>
</div>
{{/if}}
<div id="upload-document-files" class="upload-document-files">
Drag-drop files or click to select files
</div>
</div>
<div class="dropdown-dialog delete-attachment-dialog">
<div class="content">
<p>Are you sure you want to delete <span class="bold">{{deleteAttachment.name}}?</span></p>
</div>
<div class="actions">
<div class="flat-button" {{action 'cancel'}}>
cancel
</div>
<div class="flat-button flat-red" {{action 'deleteAttachment'}}>
delete
</div>
</div>
<div class="clearfix"></div>
</div>

116
app/app/templates/components/document/document-toolbar.hbs
View file

@ -1,116 +0,0 @@
<div class="document-toolbar hidden-xs hidden-sm">
<ul class="tabs">
<li class="tab">
{{#link-to 'document.index'}}Content{{/link-to}}
</li>
<li class="tab">
{{#link-to 'document.files'}}Files{{/link-to}}
</li>
{{#if session.authenticated}}
<li class="tab">
{{#link-to 'document.activity'}}Activity{{/link-to}}
</li>
{{/if}}
{{#each tabs as |tab|}}
<li class="tab">
{{#link-to 'document.section' tab.id (query-params mode='view')}}{{tab.title}}{{/link-to}}
</li>
{{/each}}
{{#if isEditor}}
<li class="tab">
{{#link-to 'document.wizard'}}
<div id="add-document-tab" class="add-tab" data-tooltip="Tab" data-tooltip-position="bottom center">
<i class="material-icons">add</i>
</div>
{{/link-to}}
</li>
{{/if}}
</ul>
<ul class="options">
{{#if session.authenticated}}
{{#if pinState.isPinned}}
<li class="option" {{action 'unpin'}}><i class="material-icons pinned">star</i></li>
{{else}}
<li class="option" id="pin-document-button"><i class="material-icons">star_border</i></li>
{{/if}}
{{/if}}
{{#if session.authenticated}}
{{#link-to 'document.history'}}
<li class="option"><i class="material-icons">history</i></li>
{{/link-to}}
{{/if}}
{{#if isEditor}}
<li class="option" id="save-template-button"><i class="material-icons">content_copy</i></li>
<li class="option" id="set-meta-button"><i class="material-icons">settings</i></li>
{{/if}}
<li class="option" id="document-toolbar-menu"><i class="material-icons">more_horiz</i></li>
</ul>
{{#dropdown-menu target="document-toolbar-menu" position="bottom right" open="click" onOpenCallback=(action 'onMenuOpen') onCloseCallback=(action 'onMenuOpen')}}
<ul class="menu">
{{#if isEditor}}
<li class="item" {{action 'changeLayout'}} >{{layoutLabel}}</li>
<li class="divider"></li>
{{/if}}
<li class="item" id="print-document-button" {{action 'printDocument'}}>Print</li>
{{#if isEditor}}
<li class="divider"></li>
<li class="item danger" id="delete-document-button">Delete</li>
{{/if}}
</ul>
{{/dropdown-menu}}
{{#if menuOpen}}
{{#dropdown-dialog target="delete-document-button" position="bottom right" button="Delete" color="flat-red" onAction=(action 'deleteDocument')}}
<p>Are you sure you want to delete this document?</p>
<p>There is no undo!</p>
{{/dropdown-dialog}}
{{/if}}
{{#if session.authenticated}}
{{#unless pinState.isPinned}}
{{#dropdown-dialog target="pin-document-button" position="bottom right" button="Pin" color="flat-green" onAction=(action 'pin') focusOn="pin-document-name" }}
<div class="input-control">
<label>Pin Document</label>
<div class="tip">A 3 or 4 character name</div>
{{input type='text' id="pin-document-name" value=pinState.newName}}
</div>
{{/dropdown-dialog}}
{{/unless}}
{{/if}}
{{#if isEditor}}
{{#dropdown-dialog target="save-template-button" position="bottom right" button="Save as Template" color="flat-green" onAction=(action 'saveTemplate') focusOn="new-template-name" }}
<div class="input-control">
<label>Name</label>
<div class="tip">Short name for this type of document</div>
{{input type='text' id="new-template-name" value=saveTemplate.name}}
</div>
<div class="input-control">
<label>Excerpt</label>
<div class="tip">Explain use case for this template</div>
{{textarea value=saveTemplate.description rows="3" id="new-template-desc"}}
</div>
{{/dropdown-dialog}}
{{#dropdown-dialog target="set-meta-button" position="bottom right" button="Save" color="flat-green" onAction=(action 'saveMeta') focusOn="meta-name" }}
<div class="input-control">
<label>Name</label>
<div class="tip">Short title for this document</div>
{{focus-input type='text' id="meta-name" value=document.name}}
</div>
<div class="input-control">
<label>Excerpt</label>
<div class="tip">Provide short summary of the document (max. 250)</div>
{{textarea value=document.excerpt rows="5" id="meta-excerpt"}}
</div>
{{/dropdown-dialog}}
{{/if}}
</div>
<div class="clearfix" />

29
app/app/templates/components/document/sidebar-view-activity.hbs Normal file
View file

@ -0,0 +1,29 @@
<div class="document-sidebar-panel">
<div class="title">Activity</div>
<div class="document-sidebar-view-activity">
<ul class="items">
{{#each sortedItems as |e|}}
<li class="item">
<div class="avatar-box">
<div class="avatar">{{user-initials e.item.firstname e.item.lastname}}</div>
</div>
<div class="name">{{e.item.firstname}} {{e.item.lastname}}, {{time-ago e.date}}</div>
<div class="detail">
{{#if e.item.deleted}}
<div class="deleted">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.changed}}
<div class="changed">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.added}}
<div class="added">{{e.item.changeLabel}}</div>
{{/if}}
{{#if e.item.viewed}}
<div class="viewed">{{e.item.changeLabel}}</div>
{{/if}}
</div>
</li>
{{/each}}
</ul>
</div>
</div>

47
app/app/templates/components/document/sidebar-view-attachments.hbs Normal file
View file

@ -0,0 +1,47 @@
<div class="document-sidebar-panel">
<div class="title">Attachments</div>
<div class="document-sidebar-view-attachments">
<div id="upload-document-files" class="upload-document-files">
Drag-drop files or click to select files
</div>
<ul class="list">
{{#each files key="id" as |a index|}}
<li class="item">
<img class="icon" src="/assets/img/attachments/{{document/file-icon a.extension}}" />
<a href="{{ appMeta.endpoint }}/public/attachments/{{ appMeta.orgId }}/{{ a.id }}">
<span class="file">{{ a.filename }}</span>
</a>
{{#if isEditor}}
<div class="action round-button-mono">
<i class="material-icons color-gray delete-attachment-{{a.id}}" title="Delete" {{action 'onConfirmDelete' a.id a.filename}}>delete</i>
</div>
{{/if}}
</li>
{{/each}}
</ul>
{{#if emptyState}}
<div class="explainer">
<div class="empty-state">
There are no attachments
</div>
</div>
{{/if}}
</div>
<div class="dropdown-dialog delete-attachment-dialog">
<div class="content">
<p>Are you sure you want to delete <span class="bold">{{deleteAttachment.name}}?</span></p>
</div>
<div class="actions">
<div class="flat-button" {{action 'onCancel'}}>
cancel
</div>
<div class="flat-button flat-red" {{action 'onDelete'}}>
delete
</div>
</div>
<div class="clearfix"></div>
</div>
</div>

98
app/app/templates/components/document/sidebar-zone.hbs Normal file
View file

@ -0,0 +1,98 @@
<div class="document-sidebar-toolbar">
<div class="round-button-mono" id="sidebar-zone-more-button">
<i class="material-icons color-gray">more_horiz</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono {{if (is-equal currentTab 'index') 'selected'}}" {{action 'onChangeTab' 'index'}}>
<i class="material-icons">view_headline</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono {{if (is-equal currentTab 'attachments') 'selected'}}" {{action 'onChangeTab' 'attachments'}}>
<i class="material-icons">attach_file</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono {{if (is-equal currentTab 'activity') 'selected'}}" {{action 'onChangeTab' 'activity'}}>
<i class="material-icons">timeline</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons">person</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons">chat_bubble</i>
</div>
<div class="margin-top-20"></div>
<div class="round-button-mono">
<i class="material-icons">share</i>
</div>
</div>
<div class="document-sidebar-common">
{{#if document.template}}
<div class="template-header">Template</div>
{{/if}}
{{document/tag-editor documentTags=document.tags isEditor=isEditor onChange=(action 'onTagChange')}}
</div>
<div class="document-sidebar-wrapper">
{{#if (is-equal currentTab 'attachments')}}
{{document/sidebar-view-attachments document=document isEditor=isEditor}}
{{/if}}
{{#if (is-equal currentTab 'activity')}}
{{document/sidebar-view-activity document=document pages=pages isEditor=isEditor}}
{{/if}}
</div>
{{#dropdown-menu target="sidebar-zone-more-button" position="bottom right" open="click" onOpenCallback=(action 'onMenuOpen') onCloseCallback=(action 'onMenuOpen')}}
<ul class="menu">
{{#if session.authenticated}}
{{#if pinState.isPinned}}
<li class="item" {{action 'onUnpin'}}>Unpin</li>
{{else}}
<li class="item" id="pin-document-button">Pin</li>
{{/if}}
{{/if}}
<li class="item" id="print-document-button" {{action 'onPrintDocument'}}>Print</li>
{{#if isEditor}}
<li class="divider"></li>
<li class="item" id="save-template-button">Template</li>
<li class="divider"></li>
<li class="item danger" id="delete-document-button">Delete</li>
{{/if}}
</ul>
{{/dropdown-menu}}
{{#if menuOpen}}
{{#dropdown-dialog target="delete-document-button" position="bottom right" button="Delete" color="flat-red" onAction=(action 'onDeleteDocument')}}
<p>Are you sure you want to delete this document?</p>
<p>There is no undo, so be careful.</p>
{{/dropdown-dialog}}
{{#unless pinState.isPinned}}
{{#dropdown-dialog target="pin-document-button" position="bottom right" button="Pin" color="flat-green" onAction=(action 'onPin') focusOn="pin-document-name" }}
<div class="input-control">
<label>Pin Document</label>
<div class="tip">A 3 or 4 character name</div>
{{input type='text' id="pin-document-name" value=pinState.newName}}
</div>
{{/dropdown-dialog}}
{{/unless}}
{{#dropdown-dialog target="save-template-button" position="bottom right" button="Save as Template" color="flat-green" onAction=(action 'onSaveTemplate') focusOn="new-template-name" }}
<div class="input-control">
<label>Name</label>
<div class="tip">Short name for this type of document</div>
{{input type='text' id="new-template-name" value=saveTemplate.name}}
</div>
<div class="input-control">
<label>Excerpt</label>
<div class="tip">Explain use case for this template</div>
{{textarea value=saveTemplate.description rows="3" id="new-template-desc"}}
</div>
{{/dropdown-dialog}}
{{/if}}

3
app/app/templates/components/layout/zone-document-sidebar.hbs
View file

@ -1,3 +0,0 @@
<p>
sidebar
</p>

2
app/app/templates/components/section/base-editor-inline.hbs
View file

@ -6,7 +6,7 @@
{{/if}}
{{#if contentLinkerButton}}
{{document/edit-tools tagName="span" document=document folder=folder page=page onInsertLink=(action 'onInsertLink')}}
{{document/content-linker tagName="span" document=document folder=folder page=page onInsertLink=(action 'onInsertLink')}}
<div class="round-button-mono" id={{contentLinkerButtonId}} data-tooltip="Reference link" data-tooltip-position="top center">
<i class="material-icons color-blue">link</i>
</div>