1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-02 20:15:26 +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

@ -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" />
{{#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" />
{{/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>
{{/if}}
{{#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}}
{{ui/ui-toolbar-icon icon=constants.Icon.Export2 color=constants.Color.Gray tooltip="Move to another space" onClick=(action "onShowMoveDocuments")}}
{{/if}}
{{#if permissions.documentDelete}}
{{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,134 +1,120 @@
<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
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
<div class="menu">
<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
{{#if hasTemplates}}
<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
{{/if}}
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
</div>
{{/attach-popover}}
</button>
{{#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>
{{#if hasTemplates}}
<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
{{/if}}
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
</div>
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">Blank Canvas</div>
<div class="modal-body">
<form onsubmit={{action "onAddEmptyDoc"}}>
<div class="form-group">
<label for="empty-doc-name">Document Name</label>
{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
</div>
</form>
{{/attach-popover}}
{{/ui/ui-toolbar}}
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">Blank Canvas</div>
<div class="modal-body">
<form onsubmit={{action "onAddEmptyDoc"}}>
<div class="form-group">
<label for="empty-doc-name">Document Name</label>
{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-success" onclick={{action "onAddEmptyDoc"}}>Add</button>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-success" onclick={{action "onAddEmptyDoc"}}>Add</button>
</div>
</div>
<div id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">From Template</div>
<div class="modal-body">
<form onsubmit={{action "onAddTemplateDoc"}}>
<div class="form-group">
<label for="template-doc-name">Document Name</label>
{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
</div>
<div class="widget-list-picker">
<ul class="options">
{{#each templates as |item|}}
<li class="option {{if item.selected "selected"}}" {{action "onSelectTemplate" item}}>
<div class="text text-truncate">
{{item.title}}<br>{{item.description}}
</div>
{{#if item.selected}}
<i class="material-icons">check</i>
{{/if}}
</li>
{{/each}}
</ul>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-success" onclick={{action "onAddTemplateDoc"}}>Add</button>
</div>
</div>
</div>
</div>
<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">Import Files</div>
<div class="modal-body">
<div class="import-zone">
<button id="import-document-button" type="button" class="btn btn-outline-secondary btn-lg btn-block">
<br>
Click to select files or drag-drop files
<br><br>
.doc, .docx, .md, .markdown
<br><br>
</button>
<div class="import-status">
{{#each importStatus as |status|}}
<p>{{status}}</p>
{{/each}}
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{{/if}}
</div>
</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 id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">From Template</div>
<div class="modal-body">
<form onsubmit={{action "onAddTemplateDoc"}}>
<div class="form-group">
<label for="template-doc-name">Document Name</label>
{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
</div>
<div class="widget-list-picker">
<ul class="options">
{{#each templates as |item|}}
<li class="option {{if item.selected "selected"}}" {{action "onSelectTemplate" item}}>
<div class="text text-truncate">
{{item.title}}<br>{{item.description}}
</div>
{{#if item.selected}}
<i class="material-icons">check</i>
{{/if}}
</li>
{{/each}}
</ul>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-success" onclick={{action "onAddTemplateDoc"}}>Add</button>
</div>
</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>
</div>
<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">Import Files</div>
<div class="modal-body">
<div class="import-zone">
<button id="import-document-button" type="button" class="btn btn-outline-secondary btn-lg btn-block">
<br>
Click to select files or drag-drop files
<br><br>
.doc, .docx, .md, .markdown
<br><br>
</button>
<div class="import-status">
{{#each importStatus as |status|}}
<p>{{status}}</p>
{{/each}}
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{{/if}}
<div id="space-export-modal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">