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

Provide view density switcher for spaces & space view

Browse source 
Closes #218
This commit is contained in:
McMatts 2019-03-13 15:17:15 +00:00
parent b89a297c70
commit 9a41e82aa3
5 changed files with 105 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

11
gui/app/components/folder/documents-list.js
View file

@ -20,6 +20,7 @@ export default Component.extend({
showMoveDialog: false, showMoveDialog: false,
selectedDocuments: A([]), selectedDocuments: A([]),
selectedCaption: 'document', selectedCaption: 'document',
viewDensity: "1",
showAdd: computed('permissions.documentAdd', 'documents', function() { showAdd: computed('permissions.documentAdd', 'documents', function() {
return this.get('documents.length') === 0 && this.get('permissions.documentAdd'); return this.get('documents.length') === 0 && this.get('permissions.documentAdd');
@ -48,6 +49,11 @@ export default Component.extend({
if (!_.isNull(sortOrder) && !_.isUndefined(sortOrder)) { if (!_.isNull(sortOrder) && !_.isUndefined(sortOrder)) {
this.send('onSetSort', sortOrder); this.send('onSetSort', sortOrder);
} }
let viewDensity = this.get('localStorage').getSessionItem('space.density');
if (!_.isNull(viewDensity) && !_.isUndefined(viewDensity)) {
this.set('viewDensity', viewDensity);
}
}, },
actions: { actions: {
@ -85,6 +91,11 @@ export default Component.extend({
this.get('onFiltered')(this.get('documents')); this.get('onFiltered')(this.get('documents'));
}, },
onSwitchView(v) {
this.set('viewDensity', v);
this.get('localStorage').storeSessionItem('space.density', v);
},
onShowDeleteDocuments() { onShowDeleteDocuments() {
this.set('showDeleteDialog', true); this.set('showDeleteDialog', true);
}, },

19
gui/app/components/spaces/space-list.js
View file

@ -9,8 +9,27 @@
// //
// https://documize.com // https://documize.com
import { inject as service } from '@ember/service';
import AuthMixin from '../../mixins/auth'; import AuthMixin from '../../mixins/auth';
import Component from '@ember/component'; import Component from '@ember/component';
export default Component.extend(AuthMixin, { export default Component.extend(AuthMixin, {
localStorage: service(),
viewDensity: "1",
didReceiveAttrs() {
this._super(...arguments);
let viewDensity = this.get('localStorage').getSessionItem('spaces.density');
if (!_.isNull(viewDensity) && !_.isUndefined(viewDensity)) {
this.set('viewDensity', viewDensity);
}
},
actions: {
onSwitchView(v) {
this.set('viewDensity', v);
this.get('localStorage').storeSessionItem('spaces.density', v);
}
}
}); });

33
gui/app/templates/components/folder/documents-list.hbs
View file

@ -1,6 +1,15 @@
<div class="view-space"> <div class="view-space">
<div class="text-right"> <div class="text-right">
{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
{{ui/ui-toolbar-icon icon=constants.Icon.Blocks color=constants.Color.Gray tooltip="Complete"
selected=(eq viewDensity "1") onClick=(action "onSwitchView" "1")}}
{{ui/ui-toolbar-icon icon=constants.Icon.All color=constants.Color.Gray tooltip="Comfort"
selected=(eq viewDensity "2") onClick=(action "onSwitchView" "2")}}
{{ui/ui-toolbar-label label="—" color=constants.Color.Gray tooltip="Compact"
selected=(eq viewDensity "3") onClick=(action "onSwitchView" "3")}}
{{/ui/ui-toolbar}}
{{#ui/ui-button {{#ui/ui-button
light=false light=false
outline=true outline=true
@ -59,19 +68,23 @@
<li class="document {{if document.selected "selected"}}" id="document-{{document.id}}"> <li class="document {{if document.selected "selected"}}" id="document-{{document.id}}">
{{#link-to "document.index" space.id space.slug document.id document.slug class="info"}} {{#link-to "document.index" space.id space.slug document.id document.slug class="info"}}
<div class="name">{{ document.name }}</div> <div class="name">{{ document.name }}</div>
<div class="desc">{{ document.excerpt }}</div> {{#if (not-eq viewDensity "3")}}
<div class="desc">{{ document.excerpt }}</div>
{{/if}}
{{/link-to}} {{/link-to}}
<div class="meta"> {{#if (eq viewDensity "1")}}
<div class="lifecycle"> <div class="meta">
<div class="{{if (eq document.lifecycle constants.Lifecycle.Draft) "draft"}} <div class="lifecycle">
{{if (eq document.lifecycle constants.Lifecycle.Live) "live"}} <div class="{{if (eq document.lifecycle constants.Lifecycle.Draft) "draft"}}
{{if (eq document.lifecycle constants.Lifecycle.Archived) "archived"}}"> {{if (eq document.lifecycle constants.Lifecycle.Live) "live"}}
{{document.lifecycleLabel}} {{if (eq document.lifecycle constants.Lifecycle.Archived) "archived"}}">
{{document.lifecycleLabel}}
</div>
</div> </div>
{{folder/document-categories categories=document.category}}
{{folder/document-tags documentTags=document.tags}}
</div> </div>
{{folder/document-categories categories=document.category}} {{/if}}
{{folder/document-tags documentTags=document.tags}}
</div>
{{#if hasDocumentActions}} {{#if hasDocumentActions}}
<div class="checkbox" {{action "selectDocument" document.id}}> <div class="checkbox" {{action "selectDocument" document.id}}>

2
gui/app/templates/components/layout/logo-heading.hbs
View file

@ -18,4 +18,4 @@
{{layout/page-desc desc=desc}} {{layout/page-desc desc=desc}}
</div> </div>
</div> </div>
{{ui/ui-spacer size=300}} {{ui/ui-spacer size=200}}

81
gui/app/templates/components/spaces/space-list.hbs
View file

@ -1,4 +1,18 @@
<div class="view-spaces"> <div class="view-spaces">
<div class="text-right">
{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
{{ui/ui-toolbar-icon icon=constants.Icon.Blocks color=constants.Color.Gray tooltip="Complete"
selected=(eq viewDensity "1") onClick=(action "onSwitchView" "1")}}
{{ui/ui-toolbar-icon icon=constants.Icon.All color=constants.Color.Gray tooltip="Comfort"
selected=(eq viewDensity "2") onClick=(action "onSwitchView" "2")}}
{{ui/ui-toolbar-label label="—" color=constants.Color.Gray tooltip="Compact"
selected=(eq viewDensity "3") onClick=(action "onSwitchView" "3")}}
{{/ui/ui-toolbar}}
</div>
{{ui/ui-spacer size=200}}
<ul class="list"> <ul class="list">
{{#each spaces as |space|}} {{#each spaces as |space|}}
{{#link-to "folder.index" space.id space.slug}} {{#link-to "folder.index" space.id space.slug}}
@ -12,40 +26,47 @@
{{/if}} {{/if}}
{{space.name}} {{space.name}}
</div> </div>
<div class="desc">{{space.desc}}&nbsp;</div> {{#if (not-eq viewDensity "3")}}
<div class="meta"> <div class="desc">{{space.desc}}&nbsp;</div>
{{!-- {{#if (eq space.spaceType constants.SpaceType.Public)}} {{/if}}
<i class={{concat "dicon " constants.Icon.World}}> {{#if (eq viewDensity "1")}}
{{#attach-tooltip showDelay=1000}}Public space{{/attach-tooltip}} <div class="meta">
</i> {{!-- {{#if (eq space.spaceType constants.SpaceType.Public)}}
{{/if}} <i class={{concat "dicon " constants.Icon.World}}>
{{#if (eq space.spaceType constants.SpaceType.Protected)}} {{#attach-tooltip showDelay=1000}}Public space{{/attach-tooltip}}
<i class={{concat "dicon " constants.Icon.People}}> </i>
{{#attach-tooltip showDelay=1000}}Protected space{{/attach-tooltip}} {{/if}}
</i> {{#if (eq space.spaceType constants.SpaceType.Protected)}}
{{/if}} <i class={{concat "dicon " constants.Icon.People}}>
{{#if (eq space.spaceType constants.SpaceType.Private)}} {{#attach-tooltip showDelay=1000}}Protected space{{/attach-tooltip}}
<i class={{concat "dicon " constants.Icon.Person}}> </i>
{{#attach-tooltip showDelay=1000}}Personal space{{/attach-tooltip}} {{/if}}
</i> {{#if (eq space.spaceType constants.SpaceType.Private)}}
{{/if}} --}} <i class={{concat "dicon " constants.Icon.Person}}>
{{#if space.labelId}} {{#attach-tooltip showDelay=1000}}Personal space{{/attach-tooltip}}
{{spaces/space-label labels=labels labelId=space.labelId}} </i>
{{/if}} {{/if}} --}}
</div> {{#if space.labelId}}
{{spaces/space-label labels=labels labelId=space.labelId}}
{{/if}}
</div>
{{/if}}
</div> </div>
<div class="stats"> {{#if (eq viewDensity "1")}}
<div class="stat"> <div class="stats">
<div class="number">{{space.countContent}}</div> <div class="stat">
<div class="label">items</div> <div class="number">{{space.countContent}}</div>
<div class="label">items</div>
</div>
<div class="stat">
<div class="number">{{space.countCategory}}</div>
<div class="label">categories</div>
</div>
</div> </div>
<div class="stat"> {{/if}}
<div class="number">{{space.countCategory}}</div>
<div class="label">categories</div>
</div>
</div>
</li> </li>
{{/link-to}} {{/link-to}}
{{/each}} {{/each}}
</ul> </ul>
</div> </div>