Provide icon rendering framework

gui/app/pods/auth/login/template.hbs

@@ -26,7 +26,7 @@
 						{{input type="password" value=password id="authPassword" class="form-control" autocomplete="current-password"}}
 					{{/if}}
 				</div>
-				<button type="submit" class="btn btn-success font-weight-bold text-uppercase mt-4">Sign in</button>
+				<button type="submit" class="btn btn-success bold-700 text-uppercase mt-4">Sign in</button>
 				<div class="{{unless invalidCredentials "invisible"}} color-red-600 mt-3">Invalid credentials</div>
 				{{#if isAuthProviderDocumize}}
 					{{#link-to "auth.forgot"}}Forgot your password?{{/link-to}}

gui/app/pods/folders/controller.js

@@ -27,6 +27,12 @@ export default Controller.extend(AuthMixin, Modals, {
 	hasClone: notEmpty('clonedSpace.id'),
 	clonedSpace: null,
 
+	selectedView: 'all',
+	selectedSpaces: null,
+	publicSpaces: null,
+	protectedSpaces: null,
+	personalSpaces: null,
+
 	actions: {
 		onShowModal() {
 			this.modalOpen('#add-space-modal', {'show': true}, '#new-space-name');
@@ -65,6 +71,25 @@ export default Controller.extend(AuthMixin, Modals, {
 				this.get('folderService').setCurrentFolder(sp);
 				this.transitionToRoute('folder', sp.get('id'), sp.get('slug'));
 			});
+		},
+
+		onSelect(view) {
+			this.set('selectedView', view);
+
+			switch(view) {
+				case 'all':
+					this.set('selectedSpaces', this.get('model'));
+					break;
+				case 'public':
+					this.set('selectedSpaces', this.get('publicSpaces'));
+					break;
+				case 'protected':
+					this.set('selectedSpaces', this.get('protectedSpaces'));
+					break;
+				case 'personal':
+					this.set('selectedSpaces', this.get('personalSpaces'));
+					break;
+			}
 		}
 	}
 });

gui/app/pods/folders/route.js

@@ -29,7 +29,33 @@ export default Route.extend(AuthenticatedRouteMixin, {
 		return this.get('folderService').getAll();
 	},
 
+	setupController(controller, model) {
+		this._super(controller, model);
+		controller.set('selectedSpaces', model);
+
+		let constants = this.get('constants');
+		let publicSpaces = [];
+		let protectedSpaces = [];
+		let personalSpaces = [];
+
+		_.each(model, space => {
+			if (space.get('spaceType') === constants.SpaceType.Public) {
+				publicSpaces.pushObject(space);
+			}
+			if (space.get('spaceType') === constants.SpaceType.Private) {
+				personalSpaces.pushObject(space);
+			}
+			if (space.get('spaceType') === constants.SpaceType.Protected) {
+				protectedSpaces.pushObject(space);
+			}
+		});
+
+		controller.set('publicSpaces', publicSpaces);
+		controller.set('protectedSpaces', protectedSpaces);
+		controller.set('personalSpaces', personalSpaces);
+	},
+
 	activate() {
 		this.get('browser').setTitle('Spaces');
-	}	
+	}
 });

gui/app/pods/folders/template.hbs

@@ -1,4 +1,33 @@
 {{#layout/master-sidebar selectedItem="spaces"}}
+
+	{{#unless session.isMobile}}
+		{{ui/ui-spacer size=300}}
+	{{/unless}}
+
+	<div class="section">
+		<div class="title">filter</div>
+		<div class="list">
+			<div class="item {{if (eq selectedView "all") "selected"}}" {{action 'onSelect' 'all'}}>
+				<i class={{concat "dicon " constants.Icon.All}} />
+				<div class="name">All ({{model.length}})</div>
+			</div>
+			<div class="item {{if (eq selectedView "public") "selected"}}" {{action 'onSelect' 'public'}}>
+				<i class={{concat "dicon " constants.Icon.World}} />
+				<div class="name">Public ({{publicSpaces.length}})</div>
+			</div>
+			{{#if session.authenticated}}
+				<div class="item {{if (eq selectedView "protected") "selected"}}" {{action 'onSelect' 'protected'}}>
+					<i class={{concat "dicon " constants.Icon.People}} />
+					<div class="name">Protected ({{protectedSpaces.length}})</div>
+				</div>
+				<div class="item {{if (eq selectedView "personal") "selected"}}" {{action 'onSelect' 'personal'}}>
+					<i class={{concat "dicon " constants.Icon.Person}} />
+					<div class="name">Personal ({{personalSpaces.length}})</div>
+				</div>
+			{{/if}}
+		</div>
+	</div>
+
 {{/layout/master-sidebar}}
 
 {{#layout/master-content}}
@@ -7,7 +36,7 @@
 			{{layout/page-heading title=appMeta.title}}
 			{{layout/page-desc desc=appMeta.message}}
 		</div>
-		<div class="grid-cell-2">
+		<div class="grid-cell-2 grid-cell-right">
 			{{#if (or session.isEditor session.isAdmin)}}
 				{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
 					{{#if session.isEditor}}
@@ -21,8 +50,9 @@
 		</div>
 	</div>
 
+	{{ui/ui-spacer size=400}}
 
-	{{spaces/space-list spaces=model}}
+	{{spaces/space-list spaces=selectedSpaces}}
 
 	<div class="modal" tabindex="-1" role="dialog" id="add-space-modal">
 		<div class="modal-dialog" role="document">