Init share app, client refactoring

This commit is contained in:
jendib
2013-08-15 00:43:06 +02:00
parent ecb2afd628
commit ed85909d00
53 changed files with 377 additions and 133 deletions
@@ -0,0 +1,7 @@
<div>
<ul class="inline">
<li ng-repeat="tag in tags"><span class="label label-info" ng-style="{ 'background': tag.color }">{{ tag.name }} <span class="icon-remove icon-white" ng-click="deleteTag(tag)"></span></span></li>
</ul>
<input class="span12" type="text" id="{{ ref }}" placeholder="Type a tag" ng-model="input"
autocomplete="off" typeahead="tag.name for tag in allTags | filter: $viewValue" typeahead-on-select="addTag()" />
</div>
@@ -0,0 +1,17 @@
<h1>
{{ app.document_count }} <small>document{{ app.document_count > 1 ? 's' : '' }} in the database</small>
</h1>
<blockquote class="pull-right">
<p>There seems to be a kind of order in the universe, but human life itself is almost pure chaos.</p>
<small>Katherine Anne Porter</small>
</blockquote>
<div class="clearfix"></div>
<div class="muted">
<ul class="inline">
<li><strong>Version:</strong> {{ app.current_version }}</li>
<li><strong>Memory:</strong> {{ app.free_memory / 1000000 | number: 0 }}/{{ app.total_memory / 1000000 | number: 0 }} MB</li>
</ul>
</div>
@@ -0,0 +1,46 @@
<form class="form-horizontal" name="documentForm">
<div class="control-group" ng-class="{ error: !documentForm.title.$valid }">
<label class="control-label" for="inputTitle">Title</label>
<div class="controls">
<input required ng-maxlength="100" class="input-block-level" type="text" id="inputTitle"
placeholder="Title" name="title" ng-model="document.title" autocomplete="off"
typeahead="document for document in getTitleTypeahead($viewValue) | filter: $viewValue"
typeahead-wait-ms="200" />
</div>
</div>
<div class="control-group" ng-class="{ error: !documentForm.description.$valid }">
<label class="control-label" for="inputDescription">Description</label>
<div class="controls">
<textarea ng-maxlength="4000" class="input-block-level" rows="5" id="inputDescription" name="description" ng-model="document.description"></textarea>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputCreateDate">Creation date</label>
<div class="controls">
<input type="text" id="inputCreateDate" ng-readonly="true" datepicker-popup="yyyy-MM-dd" ng-model="document.create_date" starting-day="1" show-weeks="false" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputFiles">New files</label>
<div class="controls">
<file class="input-block-level" id="inputFiles" multiple="multiple" ng-model="newFiles" accept="image/png,image/jpg,image/jpeg,image/gif" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputTags">Tags</label>
<div class="controls">
<select-tag tags="document.tags" class="input-block-level" ref="inputTags" />
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary" ng-disabled="!documentForm.$valid" ng-click="edit()">{{ isEdit() ? 'Edit' : 'Add' }}</button>
<button type="submit" class="btn" ng-click="cancel()">Cancel</button>
</div>
</form>
<div class="row-fluid" ng-show="fileIsUploading">
<h4>Uploading files...</h4>
<div class="span6"><progress percent="fileProgress" class="progress-info active"></progress></div>
</div>
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{ alert.msg }}</alert>
@@ -0,0 +1,73 @@
<div class="container-fluid">
<div class="row-fluid">
<div class="span4 well">
<p class="text-center">
<button class="btn btn-primary" type="button" ng-click="addDocument()"><span class="icon-plus icon-white"></span> Add a document</button>
</p>
<p class="input-prepend input-append text-center input-block-level">
<span class="add-on"><span class="icon-search"></span></span>
<input type="text" placeholder="Search" ng-model="search.query" />
<button class="btn" ng-click="isAdvancedSearchCollapsed = !isAdvancedSearchCollapsed">More <span class="caret"></span></button>
</p>
<div collapse="isAdvancedSearchCollapsed">
<div class="well well-small">
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="inputCreateDateMin">Creation date</label>
<div class="controls">
<input class="span5" ng-readonly="true" ng-change="loadDocuments()" type="text" id="inputCreateDateMin" datepicker-popup="yyyy-MM-dd" ng-model="search.createDateMin" starting-day="1" show-weeks="false" />
to
<input class="span5" ng-readonly="true" ng-change="loadDocuments()" type="text" id="inputCreateDateMax" datepicker-popup="yyyy-MM-dd" ng-model="search.createDateMax" starting-day="1" show-weeks="false" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputTags">Tags</label>
<div class="controls">
<select-tag tags="search.tags" class="input-block-level" ref="inputTags" />
</div>
</div>
<div class="form-actions">
<button ng-click="initSearch()" class="btn btn-warning" type="submit">Reset search</button>
</div>
</form>
</div>
</div>
<table class="table table-striped table-hover table-documents">
<thead>
<tr>
<th class="span6" ng-click="sortDocuments(1)"><span class="icon-chevron-{{ sortColumn == 1 ? (asc ? 'down' : 'up') : '' }}"></span> Title</th>
<th class="span3" ng-click="sortDocuments(3)"><span class="icon-chevron-{{ sortColumn == 3 ? (asc ? 'down' : 'up') : '' }}"></span> Creation date</th>
<th class="span3 hidden-phone">Tags</th>
</tr>
</thead>
<tbody>
<tr ng-click="viewDocument(document.id)" ng-repeat="document in documents">
<td>{{ document.title }}</td>
<td>{{ document.create_date | date: 'yyyy-MM-dd' }}</td>
<td class="hidden-phone cell-tags">
<div class="tags">
<span class="label label-info" ng-repeat="tag in document.tags" ng-style="{ 'background': tag.color }"><span class="shorten">{{ tag.name | shorten }}</span><span class="full">{{ tag.name }}</span></span>
</div>
</td>
</tr>
</tbody>
</table>
<div class="text-center">
<pagination num-pages="numPages" max-size="5" current-page="currentPage"></pagination>
</div>
<div class="text-right">
{{ totalDocuments }} document{{ totalDocuments > 1 ? 's' : '' }} found
</div>
</div>
<div class="span8 well">
<div ui-view="document"></div>
</div>
</div>
</div>
@@ -0,0 +1,13 @@
<div class="modal-header">
<h3>Share document</h3>
</div>
<div class="modal-body">
<p>
<label for="share-result">Name the sharing if you want to share multiple times the same document.</label>
<input type="text" id="share-result" ng-model="name" />
</p>
</div>
<div class="modal-footer">
<button ng-click="close(name)" class="btn btn-primary"><span class="icon-share icon-white"></span> Share</button>
<button ng-click="close(null)" class="btn">Cancel</button>
</div>
@@ -0,0 +1,40 @@
<div class="text-right">
<div class="btn-group">
<button class="btn btn-danger" ng-click="deleteDocument(document)"><span class="icon-trash icon-white"></span> Delete</button>
<button class="btn btn-primary" ng-click="editDocument(document.id)"><span class="icon-pencil icon-white"></span> Edit</button>
</div>
</div>
<div class="page-header">
<h1>{{ document.title }} <small>{{ document.create_date | date: 'yyyy-MM-dd' }}</small></h1>
<p>
<button class="btn btn-small btn-inverse" ng-click="share()"><span class="icon-share icon-white"></span> Share</button>
<button class="btn btn-small" ng-repeat="share in document.shares" ng-click="showShare(share)"><span class="icon-ok"></span> {{ share.name ? share.name : 'shared' }}</button>
</p>
<ul class="inline">
<li ng-repeat="tag in document.tags"><span class="label label-info" ng-style="{ 'background': tag.color }">{{ tag.name }}</span></li>
</ul>
</div>
<p ng-bind-html="document.description | newline"></p>
<ul class="thumbnails thumbnails-file" ui-sortable="fileSortableOptions" ng-model="files" ng-show="files.length > 0">
<li class="span2 text-center thumbnail-container" ng-repeat="file in files">
<div class="thumbnail">
<a ng-click="openFile(file)">
<img class="thumbnail-file" ng-src="api/file/{{ file.id }}/data?thumbnail=true" tooltip="{{ file.mimetype }}" tooltip-placement="top" />
</a>
<div class="caption">
<div class="pull-left">
<div class="btn handle"><span class="icon-resize-horizontal"></span></div>
</div>
<p class="pull-right">
<button class="btn btn-danger" ng-click="deleteFile(file)"><span class="icon-trash icon-white"></span></button>
</p>
<div class="clearfix"></div>
</div>
</div>
</li>
</ul>
<div ui-view="file"></div>
@@ -0,0 +1,21 @@
<div class="text-center">
<div class="btn-group pull-left">
<button type="button" class="btn" ng-click="closeFile()"><span class="icon-remove"></span></button>
</div>
<div class="btn-group">
<button type="button" class="btn" ng-click="previousFile()">Previous</button>
<button type="button" class="btn" ng-click="nextFile()">Next</button>
</div>
<div class="btn-group pull-right">
<button type="button" class="btn" ng-click="openFile()"><span class="icon-share"></span></button>
</div>
</div>
<img ng-show="file.mimetype == 'image/png' || file.mimetype == 'image/jpeg' || file.mimetype == 'image/gif'" ng-src="api/file/{{ id }}/data" />
<div class="text-center" ng-show="file.mimetype == 'application/pdf'">
<img ng-src="api/file/{{ id }}/data?thumbnail=true" />
</div>
@@ -0,0 +1,26 @@
<div class="row-fluid">
<div class="span4 offset4">
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="inputUsername">Username</label>
<div class="controls">
<input type="text" id="inputUsername" placeholder="Username" ng-model="user.username" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input type="password" id="inputPassword" placeholder="Password" ng-model="user.password" />
</div>
</div>
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox" ng-model="user.remember" /> Remember me
</label>
<button type="submit" class="btn btn-primary" ng-click="login()"><span class="icon-ok icon-white"></span> Sign in</button>
</div>
</div>
</form>
</div>
</div>
@@ -0,0 +1,5 @@
<div class="row-fluid">
<div class="span12">
<h4 class="text-center">Loading...</h4>
</div>
</div>
@@ -0,0 +1,28 @@
<h1>User <small>account</small></h1>
<form class="form-horizontal" name="editUserForm" novalidate>
<div class="control-group" ng-class="{ error: !editUserForm.password.$valid, success: editUserForm.password.$valid }">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input name="password" type="password" id="inputPassword" required
ng-minlength="8" ng-maxlength="50" placeholder="Password" ng-model="user.password" />
<span class="help-inline" ng-show="editUserForm.password.$error.required">Required</span>
<span class="help-inline" ng-show="editUserForm.password.$error.minlength">Too short</span>
<span class="help-inline" ng-show="editUserForm.password.$error.maxlength">Too long</span>
</div>
</div>
<div class="control-group" ng-class="{ error: !editUserForm.passwordconfirm.$valid, success: editUserForm.passwordconfirm.$valid }">
<label class="control-label" for="inputPasswordConfirm">Password (confirm)</label>
<div class="controls">
<input name="passwordconfirm" type="password" id="inputPasswordConfirm" required
ui-validate="'$value == user.password'" ui-validate-watch="'user.password'"
placeholder="Password (confirm)" ng-model="user.passwordconfirm" />
<span class="help-inline" ng-show="editUserForm.passwordconfirm.$error.validator">Password and password confirmation must match</span>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary" ng-click="editUser()" ng-disabled="!editUserForm.$valid">
<span class="icon-pencil icon-white"></span> Edit
</button>
</div>
</form>
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{ alert.msg }}</alert>
@@ -0,0 +1 @@
<h1>Settings</h1>
@@ -0,0 +1,19 @@
<div class="container-fluid">
<div class="row-fluid">
<div class="span4 well">
<ul class="nav nav-list">
<li class="nav-header">Personal settings</li>
<li ng-class="{active: $uiRoute}" ui-route="/settings/account"><a href="#/settings/account">User account</a></li>
<li ng-class="{active: $uiRoute}" ui-route="/settings/session"><a href="#/settings/session">Opened sessions</a></li>
<li class="nav-header" ng-show="isAdmin">General settings</li>
<li ng-show="isAdmin" ng-class="{active: $uiRoute}" ui-route="/settings/user.*"><a href="#/settings/user">Users</a></li>
<li ng-show="isAdmin" ng-class="{active: $uiRoute}" ui-route="/settings/log"><a href="#/settings/log">Server logs</a></li>
</ul>
</div>
<div class="span8 well">
<div ui-view="settings"></div>
</div>
</div>
</div>
@@ -0,0 +1,18 @@
<h1>Server <small>logs</small></h1>
<table class="table table-striped table-hover table-logs">
<thead>
<tr>
<th>Date</th>
<th>Tag</th>
<th>Message</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="log in logs"
ng-class="{ info: log.level == 'INFO' || log.level == 'DEBUG', warn: log.level == 'WARN', error: log.level == 'ERROR' || log.level == 'FATAL' }">
<td>{{ log.date | date: 'yyyy-MM-dd HH:mm' }}</td>
<td>{{ log.tag }}</td>
<td class="cell-message">{{ log.message }}</td>
</tr>
</tbody>
</table>
@@ -0,0 +1,20 @@
<h1>Opened <small>sessions</small></h1>
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Created date</th>
<th>Last connection date</th>
<th>Current</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="session in sessions | orderBy: '-current'" ng-class="{ 'info': session.current, 'warning': !session.current }">
<td>{{ session.create_date | date: 'yyyy-MM-dd HH:mm' }}</td>
<td>{{ session.last_connection_date | date: 'yyyy-MM-dd HH:mm' }}</td>
<td><span ng-show="session.current" class="icon-ok"></span></td>
</tr>
</tbody>
</table>
<div class="form-actions">
<button type="submit" class="btn btn-warning" ng-click="deleteSession()">Clear all other sessions</button>
</div>
@@ -0,0 +1,62 @@
<h2 ng-show="isEdit()">Edit
<small>"{{ user.username }}"</small>
</h2>
<h2 ng-show="!isEdit()">Add
<small>user</small>
</h2>
<form class="form-horizontal" name="editUserForm" novalidate>
<div class="control-group" ng-class="{ error: !editUserForm.username.$valid, success: editUserForm.username.$valid }">
<label class="control-label" for="inputUsername">Username</label>
<div class="controls">
<input name="username" type="text" id="inputUsername" required ng-disabled="isEdit()"
ng-minlength="3" ng-maxlength="50" placeholder="Username" ng-model="user.username"/>
<span class="help-inline" ng-show="editUserForm.username.$error.required">Required</span>
<span class="help-inline" ng-show="editUserForm.username.$error.minlength">Too short</span>
<span class="help-inline" ng-show="editUserForm.username.$error.maxlength">Too long</span>
</div>
</div>
<div class="control-group" ng-class="{ error: !editUserForm.email.$valid, success: editUserForm.email.$valid }">
<label class="control-label" for="inputEmail">E-mail</label>
<div class="controls">
<input name="email" type="email" id="inputEmail" required
ng-minlength="3" ng-maxlength="50" placeholder="E-mail" ng-model="user.email"/>
<span class="help-inline" ng-show="editUserForm.email.$error.required">Required</span>
<span class="help-inline" ng-show="editUserForm.email.$error.email">Must be a valid e-mail</span>
<span class="help-inline" ng-show="editUserForm.email.$error.minlength">Too short</span>
<span class="help-inline" ng-show="editUserForm.email.$error.maxlength">Too long</span>
</div>
</div>
<div class="control-group" ng-class="{ error: !editUserForm.password.$valid, success: editUserForm.password.$valid }">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input name="password" type="password" id="inputPassword" ng-required="!isEdit()"
ng-minlength="8" ng-maxlength="50" placeholder="Password" ng-model="user.password"/>
<span class="help-inline" ng-show="editUserForm.password.$error.required">Required</span>
<span class="help-inline" ng-show="editUserForm.password.$error.minlength">Too short</span>
<span class="help-inline" ng-show="editUserForm.password.$error.maxlength">Too long</span>
</div>
</div>
<div class="control-group"
ng-class="{ error: !editUserForm.passwordconfirm.$valid, success: editUserForm.passwordconfirm.$valid }">
<label class="control-label" for="inputPasswordConfirm">Password (confirm)</label>
<div class="controls">
<input name="passwordconfirm" type="password" id="inputPasswordConfirm" ng-required="!isEdit()"
ui-validate="'$value == user.password'" ui-validate-watch="'user.password'"
placeholder="Password (confirm)" ng-model="user.passwordconfirm"/>
<span class="help-inline" ng-show="editUserForm.passwordconfirm.$error.validator">Password and password confirmation must match</span>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary" ng-click="edit()" ng-disabled="!editUserForm.$valid">
<span class="icon-pencil icon-white"></span> {{ isEdit() ? 'Edit' : 'Add' }}
</button>
<button type="button" class="btn btn-danger" ng-click="remove()" ng-show="isEdit()">
<span class="icon-trash icon-white"></span> Delete
</button>
</div>
</form>
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{ alert.msg }}</alert>
@@ -0,0 +1,26 @@
<h1>Users <small>management</small> <a class="btn btn-primary" href="#/settings/user/add">Add</a></h1>
<div class="container-fluid">
<div class="row-fluid">
<div class="span4 well">
<table class="table table-striped table-hover table-users">
<thead>
<tr>
<th>Username</th>
<th>Create date</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="user in users | orderBy: 'username'" ng-click="editUser(user)">
<td>{{ user.username }}</td>
<td>{{ user.create_date | date: 'yyyy-MM-dd' }}</td>
</tr>
</tbody>
</table>
</div>
<div class="span8">
<div ui-view="user"></div>
</div>
</div>
</div>
@@ -0,0 +1,35 @@
<div class="container-fluid">
<div class="row-fluid">
<div class="span4 well text-center">
<div class="input-prepend input-append input-block-level">
<span colorpicker class="btn" data-color="#3a87ad" ng-model="tag.color" ng-style="{ 'background': tag.color }">&nbsp;</span>
<input type="text" placeholder="Tag name" ng-model="tag.name" ui-keyup="{'enter':'addTag()'}">
<button type="submit" class="btn btn-primary" ng-click="addTag()">Add</button>
</div>
<div class="input-prepend input-block-level">
<span class="add-on"><span class="icon-search"></span></span>
<input type="text" placeholder="Search" ng-model="search.name">
</div>
<table class="table table-striped table-hover table-tags">
<tbody>
<tr ng-repeat="tag in tags | filter:search">
<td><inline-edit value="tag.name" on-edit="updateTag(tag)" /></td>
<td class="span1"><span colorpicker class="btn" on-hide="updateTag(tag)" data-color="" ng-model="tag.color" ng-style="{ 'background': tag.color }">&nbsp;</span></td>
<td class="span1"><button class="btn btn-danger pull-right" ng-click="deleteTag(tag)"><span class="icon-trash icon-white"></span></button></td>
</tr>
</tbody>
</table>
</div>
<div class="span8 well">
<h1>{{ tags.length }} <small>tag{{ tags.length > 1 ? 's' : '' }}</small></h1>
<dl class="dl-horizontal" ng-repeat="stat in stats | orderBy: '-count'">
<dt>{{ stat.name }} <span class="badge badge-info" ng-style="{ 'background': stat.color }">{{ stat.count }}</span></dt>
<dd><progress percent="stat.count / getStatCount() * 100" class="progress-info"></progress></dd>
</dl>
</div>
</div>
</div>