navigation merged into left sidebar

domain/category/endpoint.go

@@ -279,7 +279,7 @@ func (h *Handler) Delete(w http.ResponseWriter, r *http.Request) {
 }
 
 /*
-	7. link/unlink document to category
 	6. add category view permission !!!
+	7. link/unlink document to category
 	8. filter space documents by category -- URL param? nested route?
 */

gui/app/components/document/tab-heading.js

@@ -77,7 +77,7 @@ export default Ember.Component.extend(TooltipMixin, {
 		let permissions = this.get('permissions');
 
 		return permissions.get('documentDelete') || permissions.get('documentCopy') ||
-			permissions.get('documentMove') || permissions.get('documentTemplate');;
+			permissions.get('documentMove') || permissions.get('documentTemplate');
 	}),
 
 	didRender() {

gui/app/components/layout/zone-navigation.js

@@ -1,172 +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 netUtil from '../../utils/net';
-import constants from '../../utils/constants';
-import TooltipMixin from '../../mixins/tooltip';
-
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(TooltipMixin, {
-	folderService: service('folder'),
-	appMeta: service(),
-	session: service(),
-	store: service(),
-	folder: null,
-	view: {
-		folder: false,
-		search: false,
-		settings: false,
-		profile: false
-	},
-	pinned: service(),
-	pins: [],
-	enableLogout: true,
-
-	init() {
-		this._super(...arguments);
-
-		if (this.get("session.authenticated") && this.get("session.user.id") !== '0') {
-			this.get("session.accounts").forEach((account) => {
-				// TODO: do not mutate account.active here
-				account.active = account.orgId === this.get("appMeta.orgId");
-			});
-		}
-
-		this.set('pins', this.get('pinned').get('pins'));
-
-		if (this.get('appMeta.authProvider') === constants.AuthProvider.Keycloak) {
-			let config = this.get('appMeta.authConfig');
-			config = JSON.parse(config);
-			this.set('enableLogout', !config.disableLogout);
-		}
-	},
-
-	didReceiveAttrs() {
-		if (this.get('folder') === null) {
-			this.set("folder", this.get('folderService.currentFolder'));
-		}
-
-		let route = this.get('router.currentRouteName');
-		this.set('view.folder', (is.startWith(route, 'folder')) ? true : false);
-		this.set('view.settings', (is.startWith(route, 'customize')) ? true : false);
-		this.set('view.profile', (route === 'profile') ? true : false);
-		this.set('view.search', (route === 'search') ? true : false);
-	},
-
-	didInsertElement() {
-		this._super(...arguments);
-
-		// Size the pinned items zone
-		if (this.get("session.authenticated")) {
-			this.eventBus.subscribe('resized', this, 'sizePinnedZone');
-			this.eventBus.subscribe('pinChange', this, 'setupPins');
-			this.sizePinnedZone();
-			this.setupPins();
-
-			let self = this;
-
-			var sortable = Sortable.create(document.getElementById('pinned-zone'), {
-				animation: 150,
-				onEnd: function () {
-					self.get('pinned').updateSequence(this.toArray()).then((pins) => {
-						self.set('pins', pins);
-					});
-				}
-			});
-
-			this.set('sortable', sortable);
-		}
-	},
-
-	didRender() {
-		if (this.get('session.isAdmin')) {
-			this.addTooltip(document.getElementById("workspace-settings"));
-		}
-		if (this.get("session.authenticated") && this.get('enableLogout')) {
-			this.addTooltip(document.getElementById("workspace-logout"));
-		} else {
-			this.addTooltip(document.getElementById("workspace-login"));
-		}
-		if (this.get("session.authenticated")) {
-			this.addTooltip(document.getElementById("user-profile-button"));
-		}
-		if (this.get('session.hasAccounts')) {
-			this.addTooltip(document.getElementById("accounts-button"));
-		}
-
-		this.addTooltip(document.getElementById("home-button"));
-		this.addTooltip(document.getElementById("search-button"));
-	},
-
-	setupPins() {
-		if (this.get('isDestroyed') || this.get('isDestroying')) {
-			return;
-		}
-
-		this.get('pinned').getUserPins().then((pins) => {
-			if (this.get('isDestroyed') || this.get('isDestroying')) {
-				return;
-			}
-
-			this.set('pins', pins);
-
-			pins.forEach((pin) => {
-				this.addTooltip(document.getElementById(`pin-${pin.id}`));
-			});
-		});
-	},
-
-	// set height for pinned zone so ti scrolls on spill
-	sizePinnedZone() {
-		let topofBottomZone = parseInt($('#bottom-zone').css("top").replace("px", ""));
-		let heightOfTopZone = parseInt($('#top-zone').css("height").replace("px", ""));
-		let size = topofBottomZone - heightOfTopZone - 40;
-		$('#pinned-zone').css('height', size + "px");
-	},
-
-	willDestroyElement() {
-		let sortable = this.get('sortable');
-
-		if (!_.isUndefined(sortable)) {
-			sortable.destroy();
-		}
-
-		this.eventBus.unsubscribe('resized');
-		this.eventBus.unsubscribe('pinChange');
-
-		this.destroyTooltips();
-	},
-
-	actions: {
-		switchAccount(domain) {
-			window.location.href = netUtil.getAppUrl(domain);
-		},
-
-		jumpToPin(pin) {
-			let folderId = pin.get('folderId');
-			let documentId = pin.get('documentId');
-
-			if (_.isEmpty(documentId)) {
-				// jump to space
-				let folder = this.get('store').peekRecord('folder', folderId);
-				this.get('router').transitionTo('folder', folderId, folder.get('slug'));
-			} else {
-				// jump to doc
-				let folder = this.get('store').peekRecord('folder', folderId);
-				this.get('router').transitionTo('document', folderId, folder.get('slug'), documentId, 'document');
-			}
-		}
-	}
-});

gui/app/components/layout/zone-sidebar.js

@@ -10,6 +10,74 @@
 // https://documize.com
 
 import Ember from 'ember';
+import constants from '../../utils/constants';
+
+const {
+	computed,
+	inject: { service }
+} = Ember;
 
 export default Ember.Component.extend({
+	folderService: service('folder'),
+	appMeta: service(),
+	session: service(),
+	store: service(),
+	pinned: service(),
+	enableLogout: true,
+	pins: [],
+	hasPins: computed.notEmpty('pins'),
+
+	init() {
+		this._super(...arguments);
+
+		if (this.get('appMeta.authProvider') === constants.AuthProvider.Keycloak) {
+			let config = this.get('appMeta.authConfig');
+			config = JSON.parse(config);
+			this.set('enableLogout', !config.disableLogout);
+		}
+	},
+
+	didInsertElement() {
+		this._super(...arguments);
+
+		if (this.get("session.authenticated")) {
+			this.eventBus.subscribe('pinChange', this, 'setupPins');
+			this.setupPins();
+		}
+	},
+
+	setupPins() {
+		if (this.get('isDestroyed') || this.get('isDestroying')) {
+			return;
+		}
+
+		this.get('pinned').getUserPins().then((pins) => {
+			if (this.get('isDestroyed') || this.get('isDestroying')) {
+				return;
+			}
+
+			this.set('pins', pins);
+		});
+	},
+
+	willDestroyElement() {
+		this.eventBus.unsubscribe('pinChange');
+	},
+
+	actions: {
+		jumpToPin(pin) {
+			let folderId = pin.get('folderId');
+			let documentId = pin.get('documentId');
+
+			if (_.isEmpty(documentId)) {
+				// jump to space
+				let folder = this.get('store').peekRecord('folder', folderId);
+				this.get('router').transitionTo('folder', folderId, folder.get('slug'));
+			} else {
+				// jump to doc
+				let folder = this.get('store').peekRecord('folder', folderId);
+				this.get('router').transitionTo('document', folderId, folder.get('slug'), documentId, 'document');
+			}
+		}
+	}
 });

gui/app/pods/customize/template.hbs

@@ -1,4 +1,3 @@
-{{layout/zone-navigation}}
 {{#layout/zone-container}}
 	{{#layout/zone-sidebar}}
 		<div class="sidebar-common">

gui/app/pods/document/template.hbs

@@ -1,2 +1 @@
-{{layout/zone-navigation}}
 {{outlet}}

gui/app/pods/folder/template.hbs

@@ -1,2 +1 @@
-{{layout/zone-navigation}}
 {{outlet}}

gui/app/pods/folders/template.hbs

@@ -1,4 +1,3 @@
-{{layout/zone-navigation}}
 {{#layout/zone-container}}
 	{{#layout/zone-sidebar}}
 		{{folder/sidebar-zone folders=model noFolder=true onAddSpace=(action 'onAddSpace')}}

gui/app/pods/profile/template.hbs

@@ -1,4 +1,3 @@
-{{layout/zone-navigation}}
 {{#layout/zone-container}}
 	{{#layout/zone-sidebar}}
 		<div class="sidebar-common">

gui/app/pods/search/template.hbs

@@ -1,5 +1,3 @@
-{{layout/zone-navigation}}
-
 {{#layout/zone-container}}
 	{{#layout/zone-sidebar}}
 		<div class="sidebar-common">

gui/app/styles/app.scss

@@ -13,8 +13,8 @@
 @import "mixins.scss";
 @import "base.scss";
 @import "widget/widget.scss";
-@import "view/layout-right-nav.scss";
+@import "view/layout-navigation.scss";
-@import "view/layout-left-sidebar.scss";
+@import "view/layout-sidebar.scss";
 @import "view/page-search.scss";
 @import "view/page-profile.scss";
 @import "view/page-customize.scss";

gui/app/styles/view/layout-sidebar.scss

@@ -31,7 +31,7 @@ $sidebar-width: 400px;
     margin-right: auto;
     margin-left: auto;
     padding-left: 30px;
-    padding-right: 30px;
+    padding-right: 0;
     max-width: 1200px;
 }
 
@@ -39,7 +39,7 @@ $sidebar-width: 400px;
     width: 100%;
     position: relative;
     // position: absolute;
-	padding: 30px;
+	padding: 30px 0 30px 30px;
     margin: 0 auto;
     margin-top: 30px;
 
@@ -158,3 +158,30 @@ $sidebar-width: 400px;
         }
     }
 }
+
+.navigation {
+	margin: 15px 0 0 0;
+	text-align: center;
+
+	.round-button-mono {
+		> .material-icons {
+			color: $color-gray;
+			@include ease-in();
+		}
+
+		&:hover {
+			> .material-icons {
+				color: $color-link;
+			}
+		}
+	}
+
+	.profile-link {
+		color: $color-primary;
+		text-align: center;
+		font-size: 1rem;
+		font-style: normal;
+		font-family: $font-regular;
+		vertical-align: top;
+	}
+}

gui/app/templates/components/layout/zone-navigation.hbs

@@ -1,75 +0,0 @@
-<div id="zone-navigation" class="zone-navigation">
-	<ul id="top-zone" class="top-zone">
-        {{#if session.hasAccounts}}
-			<li id="accounts-button" data-tooltip="Switch team" data-tooltip-position="right center">
-				<div id="accounts-button" class="round-button-mono button-white">
-	                <i class="material-icons">apps</i>
-	            </div>
-			</li>
-        {{/if}}
-		<li id="home-button" class="{{if view.folder 'selected'}}" data-tooltip="Home" data-tooltip-position="right center">
-            {{#link-to 'folders' tagName="div" class="round-button-mono button-white"}}
-                <i class="material-icons">home</i>
-            {{/link-to}}
-		</li>
-		<li id="search-button" class="{{if view.search 'selected'}}" data-tooltip="Search" data-tooltip-position="right center">
-            {{#link-to 'search' tagName="div" class="round-button-mono button-white"}}
-                <i class="material-icons icon-tool">search</i>
-            {{/link-to}}
-		</li>
-    </ul>
-
-	<ul id="pinned-zone" class="pinned-zone">
-		{{#each pins as |pin|}}
-			<li {{action 'jumpToPin' pin}} data-id={{pin.id}} id="pin-{{pin.id}}" data-tooltip="{{pin.pin}}" data-tooltip-position="right middle" class="pin"><span class="key">{{pin.pin}}</span></li>
-		{{/each}}
-	</ul>
-
-    <ul id="bottom-zone" class="bottom-zone">
-		{{#if session.session.content.authenticated.user.admin}}
-			<li id="workspace-settings" class="{{if view.settings 'selected'}}" data-tooltip="Settings" data-tooltip-position="right center">
-	            {{#link-to 'customize.general'}}
-					<div class="round-button-mono button-white">
-		                <i class="material-icons icon-tool">tune</i>
-					</div>
-	            {{/link-to}}
-			</li>
-		{{/if}}
-        {{#if session.authenticated}}
-			<li id="user-profile-button" class="{{if view.profile 'selected'}}" data-tooltip="Profile" data-tooltip-position="right center">
-				{{#link-to 'profile'}}
-					<div class="round-button-mono button-white">
-						<i class="material-icons profile-link">{{session.user.initials}}</i>
-					</div>
-	            {{/link-to}}
-			</li>
-			{{#if enableLogout}}
-				<li id="workspace-logout" data-tooltip="Logout" data-tooltip-position="right center">
-					{{#link-to 'auth.logout'}}
-						<div class="round-button-mono button-white">
-							<i class="material-icons icon-tool">exit_to_app</i>
-						</div>
-					{{/link-to}}
-				</li>
-			{{/if}}
-        {{else}}
-			<li id="workspace-login" data-tooltip="Login" data-tooltip-position="right center">
-                {{#link-to 'auth.login'}}
-					<div class="round-button-mono button-white">
-						<i class="material-icons">lock_open</i>
-					</div>
-				{{/link-to}}
-	        </li>
-        {{/if}}
-    </ul>
-
-    {{#if session.hasAccounts}}
-        {{#dropdown-menu target="accounts-button" position="bottom right" open="click" }}
-            <ul class="menu">
-                {{#each session.accounts as |account|}}
-                    <li class="item" {{action 'switchAccount' account.domain }}>{{account.title}}</li>
-                {{/each}}
-            </ul>
-        {{/dropdown-menu}}
-    {{/if}}
-</div>

gui/app/templates/components/layout/zone-sidebar.hbs

@@ -1,3 +1,51 @@
 <div id="sidebar-wrapper">
+	<div class="navigation">
+		{{#link-to 'folders' tagName="div" class="round-button-mono button-white"}}
+			<i class="material-icons">home</i>
+		{{/link-to}}
+		<div class="button-gap" />
+		{{#link-to 'search' tagName="div" class="round-button-mono button-white"}}
+			<i class="material-icons icon-tool">search</i>
+		{{/link-to}}
+		{{#if session.authenticated}}
+			{{#if hasPins}}
+				<div class="button-gap" />
+				<div class="round-button-mono button-white" id="user-pins-button">
+					<i class="material-icons">favorite</i>
+				</div>
+			{{/if}}
+			<div class="button-gap" />
+			<div class="round-button-mono button-white" id="profile-button">
+				<i class="material-icons profile-link">{{session.user.initials}}</i>
+			</div>
+			{{#dropdown-menu target="profile-button" position="bottom left" open="click"}}
+				<ul class="menu">
+					{{#link-to 'profile' tagName="li" class="item"}}Profile{{/link-to}}
+					{{#if session.isAdmin}}
+						{{#link-to 'customize.general' tagName="li" class="item"}}Settings{{/link-to}}
+					{{/if}}
+					{{#if enableLogout}}
+						<li class="divider"></li>
+						{{#link-to 'auth.logout' tagName="li" class="item"}}Logout{{/link-to}}
+					{{/if}}
+				</ul>
+			{{/dropdown-menu}}
+			{{#if hasPins}}
+				{{#dropdown-menu target="user-pins-button" position="bottom left" open="click"}}
+					<ul class="menu">
+						{{#each pins as |pin|}}
+							<li {{action 'jumpToPin' pin}} data-id={{pin.id}} id="pin-{{pin.id}}" class="item">{{pin.pin}}</li>
+						{{/each}}
+					</ul>
+				{{/dropdown-menu}}
+			{{/if}}
+		{{else}}
+			{{#link-to 'auth.login'}}
+				<div class="round-button-mono button-white">
+					<i class="material-icons">lock_open</i>
+				</div>
+			{{/link-to}}
+		{{/if}}
+	</div>
 	{{yield}}
 </div>

gui/app/utils/model.js

@@ -202,7 +202,6 @@ export default {
 	AttachmentModel,
 	DocumentModel,
 	FolderModel,
-	FolderPermissionModel,
 	OrganizationModel,
 	PageModel,
 	PageMetaModel,