Commit new state

This commit is contained in:
Julius Haertl
2016-07-02 22:13:32 +02:00
parent dae1a9b3d4
commit 7a9489adf0
31 changed files with 884 additions and 97 deletions

View File

@@ -5,6 +5,7 @@ use OCP\Util;
Util::addStyle('deck', 'font-awesome');
Util::addStyle('deck', 'style');
Util::addStyle('deck', '../js/vendor/ng-sortable/dist/ng-sortable.min');
Util::addStyle('deck', '../js/vendor/angular-ui-select/dist/select.min');
//Util::addStyle('deck', '../js/vendor/ng-sortable/dist/ng-sortable.style.min');
Util::addScript('deck', 'vendor/angular/angular.min');
Util::addScript('deck', 'vendor/angular-route/angular-route.min');
@@ -12,6 +13,8 @@ Util::addScript('deck', 'vendor/angular-sanitize/angular-sanitize.min');
Util::addScript('deck', 'vendor/angular-animate/angular-animate.min');
Util::addScript('deck', 'vendor/angular-ui-router/release/angular-ui-router.min');
Util::addScript('deck', 'vendor/ng-sortable/dist/ng-sortable.min');
Util::addScript('deck', 'vendor/angular-ui-select/dist/select.min');
Util::addScript('deck', 'vendor/showdown/dist/showdown.min');
Util::addScript('deck', 'public/app');
?>
@@ -33,15 +36,15 @@ Util::addScript('deck', 'public/app');
<script type="text/ng-template" id="/boardlist.sidebarView.html">
<?php print_unescaped($this->inc('part.empty')); ?>
</script>
<script type="text/ng-template" id="/board.sidebarView.html">
<?php print_unescaped($this->inc('part.board.sidebarView')); ?>
</script>
<script type="text/ng-template" id="/board.mainView.html">
<?php print_unescaped($this->inc('part.board.mainView')); ?>
</script>
<script type="text/ng-template" id="/board.html">
<?php print_unescaped($this->inc('part.board')); ?>
</script>
<script type="text/ng-template" id="/board.sidebarView.html">
<?php print_unescaped($this->inc('part.empty')); ?>
</script>
<script type="text/ng-template" id="/card.sidebarView.html">
<?php print_unescaped($this->inc('part.card')); ?>
</script>

View File

@@ -4,26 +4,30 @@
<h2>{{ statusservice.title }}</h2>
<p>{{ statusservice.text }}</p></div>
</div>
<div id="board" class="scroll-container" >
<h1>
{{ boardservice.data[id].title }}
</h1>
<div id="board-header">
<h1>
{{ boardservice.data[id].title }}
<div id="board-actions">
<div><i class="fa fa-filter"> </i> Filter</div>
<div class="filter">by label <i class="fa fa-caret-down"> </i>
<ul class="filter-select bubble">
<li ng-repeat="label in boardservice.data[id].labels"><span style="background-color:#{{ label.color }};"> </span> {{ label.title }}</li>
</ul>
</div>
<div class="filter">by creator <i class="fa fa-caret-down"> </i></div>
<div class="filter">by members <i class="fa fa-caret-down"> </i></div>
<div class="filter"><span class="filter-button" ng-click="status.filter.label=!status.filter.label">by label <i class="fa fa-caret-down"> </i></span></div>
<ul class="filter-select bubble" ng-if="status.filter.label">
<li ng-repeat="label in boardservice.data[id].labels"><span style="background-color:#{{ label.color }};"> </span> {{ label.title }}</li>
</ul>
<div class="filter"><span class="filter-button" ng-click="status.filter.assignee=!status.filter.assignee">by assignee<i class="fa fa-caret-down"> </i></span></div>
<ul class="filter-select bubble" ng-if="status.filter.assignee">
<li ng-repeat="label in boardservice.data[id].labels"><span style="background-color:#{{ label.color }};"> </span> {{ label.title }}</li>
</ul>
<div class="board-action-button"><a class="fa fa-share-alt" ui-sref="board.detail({ id: id })"> </a></div>
<div class="board-action-button"><a class="fa fa-users" ui-sref="board.detail({ id: id })"> </a></div>
<div class="board-action-button"><a class="fa fa-ellipsis-h" ui-sref="board.detail({ id: id })"> </a></div>
</div>
</h1>
</div>
<div id="board" class="scroll-container" >
<div><i class="fa fa-share-alt"> </i></div>
<div><i class="fa fa-users"> </i></div>
<div><i class="fa fa-ellipsis-h"> </i></div>
</div>
<div id="innerBoard" data-ng-model="stacks">
@@ -44,7 +48,8 @@
<div class="card-upper">
<h3>{{ c.title }}</h3>
<ul class="labels">
<li ng-repeat="label in c.labels" style="background-color: #{{ label.color }};"><span>{{ label.title }}</span></li>
<li ng-repeat="label in c.labels" style="background-color: #{{ label.color }};"><span>{{ label.title }}</span>
</li>
</ul>
</div>

View File

@@ -1,6 +1,4 @@
<?php print_unescaped($this->inc('part.board.mainView')); ?>
<route-loading-indicator></route-loading-indicator>
<div id="app-sidebar" class="details-view scroll-container" ng-class="{ 'details-visible': sidebar.show }" ui-view="sidebarView" ng-controller="CardController">
<div id="app-sidebar" class="details-view scroll-container" ng-class="{ 'details-visible': sidebar.show }" ui-view="sidebarView">
</div>

View File

@@ -0,0 +1,79 @@
<div id="board-status" ng-if="statusservice.active">
<div id="emptycontent">
<div class="icon-{{ statusservice.icon }}"></div>
<h2>{{ statusservice.title }}</h2>
<p>{{ statusservice.text }}</p></div>
</div>
<div id="sidebar-header">
<a class="icon-close" ui-sref="board" ng-click="sidebar.show=!sidebar.show"> &nbsp;</a>
<h2>{{ boardservice.getCurrent().title }}</h2>
</div>
<ul class="tabHeaders">
<li class="tabHeader" ng-class="{'selected': (status.boardtab==0 || !status.boardtab)}" ng-click="status.boardtab=0"><a>Sharing</a></li>
<li class="tabHeader" ng-class="{'selected': (status.boardtab==1)}" ng-click="status.boardtab=1"><a>Labels</a></li>
<li class="tabHeader" ng-class="{'selected': (status.boardtab==2)}" ng-click="status.boardtab=2"><a>Settings</a></li>
</ul>
<div class="tabsContainer">
<div id="commentsTabView" class="tab commentsTabView" ng-if="status.boardtab==0 || !status.boardtab">
<input class="shareWithField ui-autocomplete-input" type="text" placeholder="Mit Benutzern, Gruppen oder entfernten Benutzern teilen…" autocomplete="off">
<ul id="shareWithList" class="shareWithList">
<li data-share-id="57" data-share-type="0" data-share-with="directmenu">
<a href="#" class="unshare"><span class="icon-loading-small"></span><span class="icon icon-delete"><br /></span><span class="hidden-visually">Freigabe aufheben</span></a>
<div class="avatar " data-username="directmenu" style="height: 32px; width: 32px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 32px; font-size: 17.6px; background-color: rgb(195, 222, 124);">D</div>
<span class="has-tooltip username" title="" data-original-title="directmenu" aria-describedby="tooltip777914">directmenu</span>
<span class="shareOption">
<input id="canShare-view17-directmenu" type="checkbox" name="share" class="permissions checkbox" checked="checked" data-permissions="16">
<label for="canShare-view17-directmenu">kann teilen</label>
</span>
<span class="shareOption"><input id="canEdit-view17-directmenu" type="checkbox" name="edit" class="permissions checkbox" checked="checked">
<label for="canEdit-view17-directmenu">kann bearbeiten</label>
</span>
</li>
</ul>
</div>
<div id="board-detail-labels" class="tab commentsTabView" ng-if="status.boardtab==1">
<ul class="labels">
<li ng-repeat="label in boardservice.getCurrent().labels">
<span class="label-title" style="background-color:#{{label.color}}; color:{{ textColor(label.color) }};" ng-if="!label.edit">
{{ label.title }}
</span>
<span class="label-title" style="background-color:#{{label.color}}; color:{{ textColor(label.color) }}; width:188px;" ng-if="label.edit">
<input type="text" placeholder="" ng-model="label.title" class="input-inline" style="background-color:#{{label.color}}; color:{{ textColor(label.color) }};" />
</span>
<div class="colorselect" ng-if="label.edit">
<div class="color" ng-repeat="c in defaultColors" style="background-color:#{{ c }};" ng-click="label.color=c" ng-class="{'selected': (c == label.color) }"><br /></div>
</div>
<a class="fa fa-save" ng-click="labelUpdate(label)" ng-if="label.edit"> </a>
<a class="fa fa-edit" ng-click="label.edit=true" ng-if="!label.edit"> </a>
<a class="fa fa-remove" ng-click="labelDelete(label)"> </a>
</li>
<li ng-if="status.createLabel">
<form ng-submit="labelCreate(newLabel)">
<span class="label-title" style="background-color:#{{newLabel.color}}; color:{{ textColor(newLabel.color) }}; width:188px;">
<input type="text" class="input-inline" ng-model="newLabel.title" style="color:{{ textColor(newLabel.color) }};" autofocus-on-insert />
</span>
<div class="colorselect">
<div class="color" ng-repeat="c in defaultColors" style="background-color:#{{ c }};" ng-click="newLabel.color=c" ng-class="{'selected': (c == newLabel.color) }"><br /></div>
</div>
<a class="fa fa-save" ng-click="labelCreate(newLabel)"> </a>
</form>
</li>
<li ng-if="!status.createLabel">
<a ng-click="status.createLabel=true"><span class="fa fa-plus"> </span> Create a new Label</a>
</li>
</ul>
</div>
<div id="commentsTabView" class="tab commentsTabView" ng-if="status.boardtab==2">
<p><input type="checkbox" class="checkbox" id="allowInvite" /> <label for="allowInvite">Allow members to invite other users</label></p>
<p><input type="checkbox" class="checkbox" id="allowInvite" /> <label for="allowInvite">Allow members to make board public</label></p>
<p><input type="checkbox" class="checkbox" id="allowInvite" /> <label for="allowInvite">Allow members to change labels</label></p>
<p><input type="checkbox" class="checkbox" id="allowInvite" /> <label for="allowInvite">Allow members to create new stacks</label></p>
</div>
</div>

View File

@@ -4,6 +4,7 @@
<h2>{{ statusservice.title }}</h2>
<p>{{ statusservice.text }}</p></div>
</div>
{{card=cardservice.getCurrent();""}}
<div id="card-header">
<a class="icon-close" ui-sref="board" ng-click="sidebar.show=!sidebar.show"> &nbsp;</a>
<h2>
@@ -18,26 +19,40 @@
<div id="card-dates">
Modified: <span>{{ cardservice.getCurrent().lastModified*1000|date:'medium' }}</span>
Created: <span>{{ cardservice.getCurrent().createdAt*1000|date:'medium' }}</span>
by <span>{{ cardservice.getCurrent().owner }}</span>
</div>
<ul class="labels">
<li style="background-color:#aa0000;">important</li>
<li style="background-color:#00aa00;">action-needed</li>
<li style="background-color:#00a;">action-needed</li>
</ul>
<ui-select multiple tagging tagging-label="(custom 'new' label)" ng-model="card.labels" theme="bootstrap" style="width:100%;" title="Choose a label" placeholder="Add a label"
on-select="labelAssign($item, $model)" on-remove="labelRemove($item, $model)">
<ui-select-match placeholder="Select labels..."><span class="select-label" style="background-color:#{{$item.color}}">{{$item.title}}</span></ui-select-match>
<ui-select-choices repeat="label in boardservice.getCurrent().labels | filter:$select.search">
<span style="background-color:#{{label.color}}">{{label.title}}</span>
</ui-select-choices>
</ui-select>
<br style="clear:both;"/>
<br style="clear:both;"/>
<div id="assigned-users">
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(213, 231, 116);">D</div>
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(213, 120, 220);">E</div>
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(120, 120, 220);">C</div>
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(120, 220, 220);">K</div>
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(220, 220, 220);">+</div>
<ui-select multiple tagging tagging-label="(custom 'new' label)" ng-model="card.assignees" theme="bootstrap" style="width:100%;" title="Choose a label">
<ui-select-match placeholder="Select labels..."><span style="background-color:#{{$item.color}}">{{$item.title}}</span></ui-select-match>
<ui-select-choices repeat="label in boardservice.getCurrent().labels | filter:$select.search">
<div class="avatardiv" style="height: 30px; width: 30px; color: rgb(255, 255, 255); font-weight: normal; text-align: center; line-height: 30px; font-size: 17px; background-color: rgb(213, 231, 116);">D</div>
</ui-select-choices>
</ui-select>
</div>
<div id="card-description">
<textarea ng-model="cardservice.getCurrent().description">{{ cardservice.getCurrent().description }}</textarea>
<div class="saved">Saved</div>
</div>
<h3>Description</h3>
<textarea ng-if="status.description" placeholder="Enter your description here ..." ng-blur="updateCard(cardservice.getCurrent())" ng-model="cardservice.getCurrent().description" autofocus-on-insert> </textarea>
<div class="container" ng-click="editDescription()" ng-show="!status.description" ng-animate><div ng-bind-html="cardservice.getCurrent().description | markdown"></div><div class="placeholder" ng-if="!cardservice.getCurrent().description">Add a card description ...</div></div>
</div>
</div>
<ul class="tabHeaders"> <li class="tabHeader selected" data-tabid="commentsTabView" data-tabindex="0"> <a href="#">Kommentare</a> </li> <li class="tabHeader" data-tabid="shareTabView" data-tabindex="1"> <a href="#">Anhänge</a> </li> <li class="tabHeader" data-tabid="versionsTabView" data-tabindex="2"> <a href="#">Beschreibung</a> </li> </ul>
<!--
<div id="card-attachments">
<h3>Attachments</h3>