1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-23 23:29:42 +02:00

Update Space view to use new layout

This commit is contained in:
McMatts 2018-12-17 13:39:13 +00:00
parent 0cc83c13c8
commit d5b5e015d1
18 changed files with 474 additions and 330 deletions

View file

@ -36,7 +36,7 @@ import (
"github.com/documize/community/model/doc"
"github.com/documize/community/model/page"
pm "github.com/documize/community/model/permission"
"github.com/documize/community/model/template"
// "github.com/documize/community/model/template"
"github.com/documize/community/model/workflow"
uuid "github.com/nu7hatch/gouuid"
)
@ -66,23 +66,23 @@ func (h *Handler) SavedList(w http.ResponseWriter, r *http.Request) {
return
}
templates := []template.Template{}
// templates := []template.Template{}
for _, d := range documents {
var t = template.Template{}
t.ID = d.RefID
t.Title = d.Name
t.Description = d.Excerpt
t.Author = ""
t.Dated = d.Created
t.Type = template.TypePrivate
// for _, d := range documents {
// var t = template.Template{}
// t.ID = d.RefID
// t.Title = d.Name
// t.Description = d.Excerpt
// t.Author = ""
// t.Dated = d.Created
// t.Type = template.TypePrivate
if d.SpaceID == spaceID {
templates = append(templates, t)
}
}
// if d.SpaceID == spaceID {
// templates = append(templates, t)
// }
// }
response.WriteJSON(w, templates)
response.WriteJSON(w, documents)
}
// SaveAs saves existing document as a template.

View file

@ -12,6 +12,8 @@
import Component from '@ember/component';
export default Component.extend({
classNames: ['hashtags'],
init() {
this._super(...arguments);
let tagz = [];
@ -20,7 +22,7 @@ export default Component.extend({
let tags = this.get('documentTags').split('#');
_.each(tags, function(tag) {
if (tag.length > 0) {
tagz.pushObject("#" + tag);
tagz.pushObject(tag);
}
});
}

View file

@ -17,6 +17,7 @@ import AuthMixin from '../../mixins/auth';
import Component from '@ember/component';
export default Component.extend(AuthMixin, {
classNames: ["section"],
router: service(),
documentService: service('document'),
folderService: service('folder'),
@ -26,6 +27,7 @@ export default Component.extend(AuthMixin, {
spaceSettings: computed('permissions', function() {
return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
}),
selectedFilter: '',
init() {
this._super(...arguments);
@ -81,8 +83,6 @@ export default Component.extend(AuthMixin, {
});
this.set('categoryFilter', id);
this.set('spaceSelected', false);
this.set('uncategorizedSelected', false);
break;
case 'uncategorized':
@ -94,19 +94,29 @@ export default Component.extend(AuthMixin, {
});
this.set('categoryFilter', '');
this.set('spaceSelected', false);
this.set('uncategorizedSelected', true);
break;
case 'space':
allowed = _.pluck(categoryMembers, 'documentId');
docs.forEach((d) => {
filtered.pushObject(d);
});
this.set('categoryFilter', '');
this.set('spaceSelected', true);
this.set('uncategorizedSelected', false);
break;
case 'template':
filtered.pushObjects(this.get('templates'));
this.set('categoryFilter', '');
break;
case 'draft':
filtered = this.get('documentsDraft');
this.set('categoryFilter', '');
break;
case 'live':
filtered = this.get('documentsLive');
this.set('categoryFilter', '');
break;
}
@ -114,6 +124,7 @@ export default Component.extend(AuthMixin, {
cat.set('selected', cat.get('id') === id);
});
this.set('selectedFilter', filter);
this.set('categories', categories);
this.get('onFiltered')(filtered);
}

View file

@ -19,6 +19,7 @@ import Notifier from '../../mixins/notifier';
import Component from '@ember/component';
export default Component.extend(ModalMixin, AuthMixin, Notifier, {
classNames: ["display-inline-block"],
spaceService: service('folder'),
localStorage: service(),
templateService: service('template'),

View file

@ -209,7 +209,10 @@ let constants = EmberObject.extend({
Attachment: 'dicon-attachment',
BarChart: 'dicon-chart-bar-2',
Bookmark: 'dicon-bookmark',
ButtonAction: 'button-2',
BookmarkAdd: 'dicon-bookmark-add',
BookmarkDelete: 'dicon-bookmark-delete',
ButtonAction: 'dicon-button-2',
Category: 'dicon-flag',
Checkbox: 'dicon-shape-rectangle',
CheckboxChecked: 'dicon-i-check',
Database: 'dicon-database',

View file

@ -10,21 +10,73 @@
// https://documize.com
import { computed } from '@ember/object';
import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import stringUtil from '../utils/string';
// import { belongsTo, hasMany } from 'ember-data/relationships';
import Model from 'ember-data/model';
export default Model.extend({
author: attr('string'),
dated: attr(),
description: attr('string'),
title: attr('string'),
type: attr('number', { defaultValue: 0 }),
name: attr('string'),
excerpt: attr('string'),
job: attr('string'),
location: attr('string'),
orgId: attr('string'),
spaceId: attr('string'),
userId: attr('string'),
tags: attr('string'),
template: attr('boolean'),
protection: attr('number', { defaultValue: 0 }),
approval: attr('number', { defaultValue: 0 }),
lifecycle: attr('number', { defaultValue: 1 }),
versioned: attr('boolean'),
versionId: attr('string'),
versionOrder: attr('number', { defaultValue: 0 }),
groupId: attr('string'),
slug: computed('title', function () {
return stringUtil.makeSlug(this.get('title'));
// client-side property
selected: attr('boolean', { defaultValue: false }),
slug: computed('name', function () {
return stringUtil.makeSlug(this.get('name'));
}),
created: attr(),
revised: attr()
revised: attr(),
isDraft: computed('lifecycle', function () {
let constants = this.get('constants');
return this.get('lifecycle') == constants.Lifecycle.Draft;
}),
isLive: computed('lifecycle', function () {
let constants = this.get('constants');
return this.get('lifecycle') == constants.Lifecycle.Live;
}),
lifecycleLabel: computed('lifecycle', function () {
let constants = this.get('constants');
switch (this.get('lifecycle')) {
case constants.Lifecycle.Draft:
return constants.Lifecycle.DraftLabel;
case constants.Lifecycle.Live:
return constants.Lifecycle.LiveLabel;
case constants.Lifecycle.Archived:
return constants.Lifecycle.ArchivedLabel;
}
return '';
}),
});
// export default Model.extend({
// author: attr('string'),
// dated: attr(),
// description: attr('string'),
// title: attr('string'),
// type: attr('number', { defaultValue: 0 }),
// slug: computed('title', function () {
// return stringUtil.makeSlug(this.get('title'));
// }),
// created: attr(),
// revised: attr()
// });

View file

@ -32,6 +32,8 @@ export default Route.extend(AuthenticatedRouteMixin, {
model() {
this.get('browser').setTitle(this.modelFor('folder').folder.get('name'));
let constants = this.get('constants');
let folders = this.modelFor('folder').folders;
folders.forEach(f => {
f.set('selected', false);
@ -47,6 +49,8 @@ export default Route.extend(AuthenticatedRouteMixin, {
permissions: this.modelFor('folder').permissions,
folders: folders,
documents: documents,
documentsDraft: _.filter(documents, function(d) { return d.get('lifecycle') === constants.Lifecycle.Draft; }),
documentsLive: _.filter(documents, function(d) { return d.get('lifecycle') === constants.Lifecycle.Live; }),
templates: this.modelFor('folder').templates,
showStartDocument: false,
rootDocCount: 0,

View file

@ -1,13 +1,28 @@
{{#layout/top-bar}}
<li class="item">
{{#link-to "folder.index" model.folder.id model.folder.slug class="link selected"}}
{{model.folder.name}}
{{/link-to}}
</li>
{{/layout/top-bar}}
{{#layout/master-sidebar selectedItem="spaces"}}
{{folder/space-sidebar
spaces=model.folders
space=model.folder
templates=model.templates
permissions=model.permissions
documents=model.documents
documentsDraft=model.documentsDraft
documentsLive=model.documentsLive
categories=model.categories
categorySummary=model.categorySummary
categoryMembers=model.categoryMembers
rootDocCount=model.rootDocCount
categoryFilter=category
onFiltered=(action "onFiltered")
onRefresh=(action "onRefresh")}}
{{/layout/master-sidebar}}
{{#layout/middle-zone}}
{{#layout/middle-zone-content}}
{{#layout/master-content}}
<div class="grid-container-6-4">
<div class="grid-cell-1">
{{layout/page-heading title=model.folder.name}}
{{layout/page-desc desc="some space desc"}}
</div>
<div class="grid-cell-2 grid-cell-right">
{{toolbar/for-space
spaces=model.folders
space=model.folder
@ -17,6 +32,10 @@
categories=model.categories
documents=filteredDocs
onRefresh=(action "onRefresh")}}
</div>
</div>
{{ui/ui-spacer size=400}}
{{folder/documents-list
documents=filteredDocs
@ -27,28 +46,4 @@
onExportDocument=(action "onExportDocument")
onDeleteDocument=(action "onDeleteDocument")
onMoveDocument=(action "onMoveDocument")}}
{{/layout/middle-zone-content}}
{{#layout/middle-zone-sidebar scrollable=true}}
<div id="sidebar" class="sidebar">
{{folder/space-view
spaces=model.folders
space=model.folder
templates=model.templates
permissions=model.permissions
documents=model.documents
categories=model.categories
categorySummary=model.categorySummary
categoryMembers=model.categoryMembers
rootDocCount=model.rootDocCount
categoryFilter=category
onFiltered=(action "onFiltered")
onRefresh=(action "onRefresh")}}
</div>
{{/layout/middle-zone-sidebar}}
{{/layout/middle-zone}}
{{#layout/bottom-bar}}
{{/layout/bottom-bar}}
{{/layout/master-content}}

View file

@ -41,7 +41,7 @@ export default Service.extend({
});
templates = response.map((template) => {
let data = this.get('store').normalize('template', template);
let data = this.get('store').normalize('document', template);
return this.get('store').push(data);
});

View file

@ -90,3 +90,25 @@ $display-break-5: 1800px;
}
}
}
.grid-container-5-5 {
@extend %grid-base;
@media (min-width: $display-break-2) {
grid-template-columns: 5fr 5fr;
grid-template-rows: 1fr;
.grid-cell-1 {
grid-column-start: 1;
grid-row-start: 1;
padding: 0;
}
.grid-cell-2 {
grid-column-start: 2;
grid-row-start: 1;
padding: 0;
justify-self: self-end;
}
}
}

View file

@ -5,21 +5,19 @@
display: block;
height: auto;
width: 100%;
// z-index: 777;
.master-content {
display: block;
height: auto;
width: 100%;
padding: 10px;
// z-index: 666;
}
}
.master-sidebar-container {
display: block;
height: auto;
width: 100%;
z-index: 1041;
// z-index: 1041; // reequired if we want to show modals from inside sidebar
.master-navbar {
display: block;

View file

@ -13,6 +13,24 @@
color: map-get($gray-shades, 700);
}
> .text {
margin: 10px 0;
font-size: 1rem;
font-weight: 500;
color: $color-black-light-3;
}
> .label {
display: inline-block;
margin: 10px 0 13px 0;
padding: 0.3rem 0.7rem;
font-size: 1.1rem;
font-weight: 500;
background-color: map-get($gray-shades, 600);
color: map-get($gray-shades, 100);
@include border-radius(3px);
}
> .list {
margin: 10px 0;

View file

@ -1,24 +1,15 @@
.view-space {
> .filter-caption {
margin: 10px 0;
color: map-get($gray-shades, 600);
font-size: 1.1rem;
font-weight: 500;
text-align: center;
}
> .documents {
margin: 60px 0;
margin: 0;
padding: 0;
> .document {
@include card();
@include ease-in();
list-style-type: none;
overflow: hidden;
position: relative;
margin: 0 0 30px 0;
margin: 0 0 2rem 0;
padding: 15px 20px;
width: 100%;
position: relative;
&:hover {
> .checkbox {
@ -26,55 +17,110 @@
}
}
> a {
@include ease-in();
display: block;
position: relative;
padding: 15px 20px;
> .title {
color: $color-black;
font-size: 1.3rem;
margin-bottom: 5px;
}
> .snippet {
color: map-get($gray-shades, 600);
font-size: 1rem;
line-height: 24px;
}
&:hover {
color: map-get($gray-shades, 600);
}
}
> .checkbox {
position: absolute;
display: none;
top: 10px;
right: 20px;
right: 10px;
cursor: pointer;
> .material-icons {
width: 10px;
margin: 0;
padding: 0;
color: map-get($gray-shades, 900);
> .dicon {
color: map-get($yellow-shades, 700);
cursor: pointer;
font-weight: 600;
font-size: 20px;
}
}
> .actions {
position: absolute;
display: none;
bottom: 2px;
right: 12px;
bottom: 10px;
right: 10px;
cursor: pointer;
}
> .info {
padding: 0;
align-self: self-start;
justify-self: self-start;
> .name {
font-size: 1.3rem;
font-weight: 700;
color: map-get($gray-shades, 800);
}
> .desc {
font-size: 1.1rem;
font-weight: 400;
margin-top: 0.4rem;
color: $color-black-light-3;
}
}
> .meta {
padding: 25px 0 0 0;
> .lifecycle {
display: inline-block;
text-transform: uppercase;
font-size: 0.9rem;
font-weight: 500;
text-align: center;
@include border-radius(5px);
background-color: map-get($gray-shades, 300);
padding: 0.25rem 1rem;
> .draft {
color: map-get($yellow-shades, 600);
}
> .live {
color: map-get($green-shades, 600);
}
> .archived {
color: map-get($red-shades, 600);
}
}
> .dicon {
color: map-get($gray-shades, 600);
font-size: 20px;
}
.hashtags {
display: inline-block;
padding: 0 10px 0 10px;
> .hashtag {
padding: 0 10px 0 10px;
> .dicon {
color: map-get($gray-shades, 500);
font-size: 20px;
vertical-align: bottom;
}
> .name {
display: inline-block;
color: map-get($gray-shades, 800);
font-size: 1rem;
}
&:hover {
> .dicon, > .name {
color: map-get($gray-shades, 600);
}
}
}
}
}
}
> .selected {
background-color: $theme-100 !important;
background-color: map-get($yellow-shades, 200);
> .checkbox {
display: block;
@ -83,19 +129,9 @@
> .actions {
display: block;
}
}
}
.hashtags {
> .hashtag {
display: inline-block;
margin: 5px 10px 0 5px;
color: map-get($gray-shades, 600);
font-size: 0.875rem;
font-style: italic;
&:hover {
color: $color-link;
background-color: map-get($yellow-shades, 200);
}
}
}

View file

@ -1,5 +1,6 @@
<div class="hashtags">
{{#each tagz as |tg|}}
{{#link-to "search" (query-params filter=tg) class="hashtag"}}{{tg}}{{/link-to}}
{{/each}}
</div>
{{#each tagz as |tg|}}
{{#link-to "search" (query-params filter=tg) class="hashtag"}}
<i class="dicon {{constants.Icon.Tag}}" />
<div class="name">{{tg}}</div>
{{/link-to}}
{{/each}}

View file

@ -2,44 +2,41 @@
<ul class="documents">
{{#each documents key="id" as |document|}}
<li class="document {{if document.selected "selected"}}" id="document-{{document.id}}">
{{#link-to "document.index" space.id space.slug document.id document.slug}}
<div class="title">{{ document.name }}</div>
<div class="snippet">{{ document.excerpt }}</div>
{{folder/document-tags documentTags=document.tags}}
{{#if (not-eq document.lifecycle constants.Lifecycle.Live)}}
<button type="button" class="mt-3 btn btn-warning text-uppercase bold-700">{{document.lifecycleLabel}}</button>
{{/if}}
{{#link-to "document.index" space.id space.slug document.id document.slug class="info"}}
<div class="name">{{ document.name }}</div>
<div class="desc">{{ document.excerpt }}</div>
{{/link-to}}
<div class="meta">
<div class="lifecycle">
<div class="{{if (eq document.lifecycle constants.Lifecycle.Draft) 'draft'}}
{{if (eq document.lifecycle constants.Lifecycle.Live) 'live'}}
{{if (eq document.lifecycle constants.Lifecycle.Archived) 'archived'}}">
{{document.lifecycleLabel}}
</div>
</div>
{{folder/document-tags documentTags=document.tags}}
</div>
{{#if hasDocumentActions}}
<div class="checkbox" {{action "selectDocument" document.id}}>
{{#if document.selected}}
<i class="material-icons">check_box</i>
<i class="dicon {{constants.Icon.CheckboxChecked}}"/>
{{else}}
<i class="material-icons">check_box_outline_blank</i>
<i class="dicon {{constants.Icon.Checkbox}}"/>
{{/if}}
</div>
{{#if document.selected}}
<div class="actions">
<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action "onExport"}}>
<i class="material-icons">import_export</i>
{{#attach-tooltip showDelay=1000}}Export as HTML{{/attach-tooltip}}
</div>
<div class="button-icon-gap" />
{{#ui/ui-toolbar dark=false light=true raised=true large=false bordered=true}}
{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray tooltip="Export content" onClick=(action "onExport")}}
{{#if permissions.documentMove}}
<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action "onShowMoveDocuments"}}>
<i class="material-icons">compare_arrows</i>
{{#attach-tooltip showDelay=1000}}Move{{/attach-tooltip}}
</div>
<div class="button-icon-gap" />
{{ui/ui-toolbar-icon icon=constants.Icon.Export2 color=constants.Color.Gray tooltip="Move to another space" onClick=(action "onShowMoveDocuments")}}
{{/if}}
{{#if permissions.documentDelete}}
<div class="delete-documents-button button-icon-red button-icon-small align-middle" {{action "onShowDeleteDocuments"}}>
{{#attach-tooltip showDelay=1000}}Delete{{/attach-tooltip}}
<i class="material-icons">delete</i>
</div>
{{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Red tooltip="Delete" onClick=(action "onShowDeleteDocuments")}}
{{/if}}
{{/ui/ui-toolbar}}
</div>
{{/if}}
{{/if}}

View file

@ -0,0 +1,53 @@
{{ui/ui-spacer size=300}}
<div class="title">label</div>
<div class="label">Unclassified</div>
{{ui/ui-spacer size=200}}
<div class="title">filter</div>
<div class="list">
<div class="item {{if (eq selectedFilter "space") "selected"}}" {{action "onDocumentFilter" "space" space.id}}>
<i class={{concat "dicon " constants.Icon.Filter}} />
<div class="name">All ({{documents.length}})</div>
</div>
{{#if hasCategories}}
{{#if (gt rootDocCount 0)}}
<div class="item {{if (eq selectedFilter "uncategorized") "selected"}}" {{action "onDocumentFilter" "uncategorized" space.id}}>
<i class={{concat "dicon " constants.Icon.Filter}} />
<div class="name">Uncategorized ({{rootDocCount}})</div>
</div>
{{/if}}
{{/if}}
{{#if permissions.documentTemplate}}
<div class="item {{if (eq selectedFilter "template") "selected"}}" {{action "onDocumentFilter" "template" space.id}}>
<i class={{concat "dicon " constants.Icon.Filter}} />
<div class="name">Templates ({{templates.length}})</div>
</div>
{{/if}}
{{#if permissions.documentLifecycle}}
<div class="item {{if (eq selectedFilter "draft") "selected"}}" {{action "onDocumentFilter" "draft" space.id}}>
<i class={{concat "dicon " constants.Icon.Filter}} />
<div class="name">Drafts ({{documentsDraft.length}})</div>
</div>
<div class="item {{if (eq selectedFilter "live") "selected"}}" {{action "onDocumentFilter" "live" space.id}}>
<i class={{concat "dicon " constants.Icon.Filter}} />
<div class="name">Live ({{documentsLive.length}})</div>
</div>
{{/if}}
</div>
{{ui/ui-spacer size=200}}
<div class="title">category</div>
<div class="list">
{{#if categories}}
{{#each categories as |cat|}}
<div class="item {{if cat.selected "selected"}}" {{action "onDocumentFilter" "category" cat.id}}>
<i class={{concat "dicon " constants.Icon.Category}} />
<div class="name">{{cat.category}} ({{cat.docCount}})</div>
</div>
{{/each}}
{{else}}
{{/if}}
</div>

View file

@ -1,35 +0,0 @@
<div class="view-space">
<div class="filter-caption mt-4">{{documents.length}} documents</div>
<ul class="tabnav-control tabnav-control-centered w-75">
<li class="tab tab-vertical {{if spaceSelected "selected"}}" {{action "onDocumentFilter" "space" space.id}}>All ({{documents.length}})</li>
{{#if hasCategories}}
{{#if (gt rootDocCount 0)}}
<li class="tab tab-vertical text-truncate {{if uncategorizedSelected "selected"}}" {{action "onDocumentFilter" "uncategorized" space.id}}>Uncategorized ({{rootDocCount}})</li>
{{/if}}
{{/if}}
</ul>
</div>
<div class="view-space">
<div class="filter-caption mt-5">
{{categories.length}}
{{#if (gt categories.length 1) }}
categories
{{else if (eq categories.length 0) }}
categories
{{else}}
category
{{/if}}
</div>
<ul class="tabnav-control tabnav-control-centered w-75">
{{#each categories as |cat|}}
<li class="tab tab-vertical text-truncate {{if cat.selected "selected"}}" {{action "onDocumentFilter" "category" cat.id}}>{{cat.category}} ({{cat.docCount}})</li>
{{/each}}
</ul>
{{#if spaceSettings}}
<div class="text-center {{if (gt categories.length 0) "mt-4"}}">
{{#link-to "folder.settings" space.id space.slug (query-params tab="categories") class="btn btn-secondary bold-700"}}{{categoryLinkName}}{{/link-to}}
</div>
{{/if}}
</div>

View file

@ -1,10 +1,30 @@
<div class="row justify-content-between no-gutters">
{{#ui/ui-toolbar dark=false light=false raised=false large=true bordered=false}}
{{#if hasDocuments}}
{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray
tooltip="Export as HTML" onClick=(action "onShowExport")}}
{{/if}}
{{#if pinState.isPinned}}
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkDelete color=constants.Color.Gray
tooltip="Remove view from bookmarks" onClick=(action "onUnpin")}}
{{else if session.authenticated}}
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkAdd color=constants.Color.Gray
tooltip="Bookmark this view" onClick=(action "onPin")}}
{{/if}}
<div class="col-6">
{{#if permissions.documentAdd}}
<div class="btn-group" role="group">
<button id="btnGroupDocument" type="button" class="btn btn-success bold-700 dropdown-toggle">
+ CONTENT
{{#if (or permissions.spaceOwner permissions.spaceManage)}}
{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Gray
tooltip="Space settings" link="folder.settings" }}
{{!-- {{#link-to "folder.settings" space.id space.slug class="button-icon-gray align-middle"}}
<i class="material-icons">settings</i>
{{#attach-tooltip showDelay=1000}}Settings, permissions, templates{{/attach-tooltip}}
{{/link-to}} --}}
{{/if}}
{{/ui/ui-toolbar}}
{{#if permissions.documentAdd}}
{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green}}
{{ui/ui-toolbar-label label="CONTENT" color=constants.Color.Green}}
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
<div class="menu">
<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
@ -14,8 +34,8 @@
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
</div>
{{/attach-popover}}
</button>
</div>
{{/ui/ui-toolbar}}
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
@ -94,41 +114,7 @@
</div>
</div>
</div>
{{/if}}
</div>
<div class="col-6 text-right">
{{#if hasDocuments}}
<div id="space-export-button" class="button-icon-danger align-middle" {{action "onShowExport"}}>
<i class="material-icons">import_export</i>
{{#attach-tooltip showDelay=1000}}Export as HTML{{/attach-tooltip}}
</div>
{{/if}}
{{#if pinState.isPinned}}
<div class="button-icon-gap" />
<div id="space-pin-button" class="button-icon-gold align-middle" {{action "onUnpin"}}>
<i class="material-icons">star</i>
{{#attach-tooltip showDelay=1000}}Remove bookmark{{/attach-tooltip}}
</div>
{{else if session.authenticated}}
<div class="button-icon-gap" />
<div id="space-pin-button" class="button-icon-gray align-middle" {{action "onPin"}}>
<i class="material-icons">star</i>
{{#attach-tooltip showDelay=1000}}Bookmark{{/attach-tooltip}}
</div>
{{/if}}
{{#if (or permissions.spaceOwner permissions.spaceManage)}}
<div class="button-icon-gap" />
{{#link-to "folder.settings" space.id space.slug class="button-icon-gray align-middle"}}
<i class="material-icons">settings</i>
{{#attach-tooltip showDelay=1000}}Settings, permissions, templates{{/attach-tooltip}}
{{/link-to}}
{{/if}}
</div>
</div>
{{/if}}
<div id="space-export-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">