ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Rework js controllers fixes #3

Browse Source
This commit is contained in:
Julius Haertl
2016-08-15 12:28:51 +02:00
parent e221d70efb
commit 9d4ba71a3b
11 changed files with 57 additions and 415 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
js/controller/AppController.js
View File

@@ -1,19 +1,6 @@
app.controller('AppController', function ($scope, $location, $http, $route, $log, $rootScope, $stateParams) {
$rootScope.sidebar = {
show: false
};
$scope.sidebar = $rootScope.sidebar;
$scope.search = function (value) {
if (value === '') {
$location.search('search', null);
} else {
$location.search('search', value);
}
$scope.searchText = value;
};
$rootScope.searchText = $location.search().search;
});

165
js/controller/ArchiveController.js
View File

@@ -1,165 +0,0 @@
app.controller('ArchiveController', function ($rootScope, $scope, $stateParams, StatusService, BoardService, StackService, CardService, LabelService, $state, $transitions) {
$scope.sidebar = $rootScope.sidebar;
$scope.id = $stateParams.boardId;
$scope.status={},
$scope.newLabel={};
$scope.status.boardtab = $stateParams.detailTab;
$scope.state = $state.current;
console.log($scope.state);
$scope.stackservice = StackService;
$scope.boardservice = BoardService;
$scope.cardservice = CardService;
$scope.statusservice = StatusService.getInstance();
$scope.labelservice = LabelService;
$scope.foo = function(state) {
console.log(state);
}
// fetch data
StackService.clear();
$scope.statusservice.retainWaiting();
$scope.statusservice.retainWaiting();
BoardService.fetchOne($scope.id).then(function(data) {
$scope.statusservice.releaseWaiting();
}, function(error) {
$scope.statusservice.setError('Error occured', error);
});
console.log($scope);
StackService.fetchArchived($scope.id).then(function(data) {
console.log(data);
$scope.statusservice.releaseWaiting();
}, function(error) {
$scope.statusservice.setError('Error occured', error);
});
BoardService.searchUsers();
$scope.cardDelete = function(card) {
CardService.delete(card.id);
StackService.deleteCard(card);
}
// TODO: move to filter?
// Lighten Color of the board for background usage
$scope.rgblight = function (hex) {
var result = /^([A-Fa-f\d]{2})([A-Fa-f\d]{2})([A-Fa-f\d]{2})$/i.exec(hex);
var color = result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
if(result !== null) {
var rgba = "rgba(" + color.r + "," + color.g + "," + color.b + ",0.7)";
return rgba;
} else {
return "#"+hex;
}
};
// TODO: move to filter?
// RGB2HLS by Garry Tan
// http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c
$scope.textColor = function (hex) {
var result = /^([A-Fa-f\d]{2})([A-Fa-f\d]{2})([A-Fa-f\d]{2})$/i.exec(hex);
var color = result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
if(result !== null) {
r = color.r/255;
g = color.g/255;
b = color.b/255;
var max = Math.max(r, g, b), min = Math.min(r, g, b);
var h, s, l = (max + min) / 2;
if(max == min){
h = s = 0; // achromatic
}else{
var d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch(max){
case r: h = (g - b) / d + (g < b ? 6 : 0); break;
case g: h = (b - r) / d + 2; break;
case b: h = (r - g) / d + 4; break;
}
h /= 6;
}
// TODO: Maybe just darken/lighten the color
if(l<0.5) {
return "#ffffff";
} else {
return "#000000";
}
//var rgba = "rgba(" + color.r + "," + color.g + "," + color.b + ",0.7)";
//return rgba;
} else {
return "#aa0000";
}
};
// settings for card sorting
$scope.sortOptions = {
itemMoved: function (event) {
// TODO: Implement reodering here
event.source.itemScope.modelValue.status = event.dest.sortableScope.$parent.column;
var order = event.dest.index;
var card = event.source.itemScope.c;
var newStack = event.dest.sortableScope.$parent.s.id;
card.stackId = newStack;
CardService.update(card);
CardService.reorder(card, order).then(function(data) {
StackService.data[newStack].addCard(card);
});
},
orderChanged: function (event) {
// TODO: Implement ordering here
var order = event.dest.index;
var card = event.source.itemScope.c;
CardService.reorder(card, order);
},
scrollableContainer: '#board',
containerPositioning: 'relative',
containment: '#board',
// auto scroll on drag
dragMove: function (itemPosition, containment, eventObj) {
if (eventObj) {
var container = $("#board");
var offset = container.offset();
targetX = eventObj.pageX - (offset.left || container.scrollLeft());
targetY = eventObj.pageY - (offset.top || container.scrollTop());
if (targetX < offset.left) {
container.scrollLeft(container.scrollLeft() - 50);
} else if (targetX > container.width()) {
container.scrollLeft(container.scrollLeft() + 50);
}
if (targetY < offset.top) {
container.scrollTop(container.scrollTop() - 50);
} else if (targetY > container.height()) {
container.scrollTop(container.scrollTop() + 50);
}
}
}
};
});

21
js/controller/BoardController.js
View File

@@ -57,6 +57,12 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
$scope.filterData('order', $scope.searchText);
}
};
$scope.checkCanEdit = function() {
if($scope.archived) {
return false;
}
return true;
}
// filter cards here, as ng-sortable will not work nicely with html-inline filters
$scope.filterData = function (order, text) {
@@ -154,24 +160,19 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
LabelService.update(label);
}
$scope.addAcl = function(sharee) {
$scope.aclAdd = function(sharee) {
sharee.boardId = $scope.id;
BoardService.addAcl(sharee);
$scope.status.addSharee = null;
}
$scope.deleteAcl = function(acl) {
$scope.aclDelete = function(acl) {
BoardService.deleteAcl(acl.id);
}
$scope.updateAcl = function(acl) {
$scope.aclUpdate = function(acl) {
BoardService.updateAcl(acl);
}
$scope.checkCanEdit = function() {
if($scope.archived) {
return false;
}
return true;
}
// settings for card sorting
$scope.sortOptions = {
@@ -188,7 +189,7 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
});
},
orderChanged: function (event) {
// TODO: Implement ordering here (set new order of all cards in stack)
// TODO: Implement reordering here (set new order of all cards in stack)
// then maybe also call $scope.filterData('order')?
var order = event.dest.index;
var card = event.source.itemScope.c;

9
js/controller/CardController.js
View File

@@ -20,20 +20,19 @@ app.controller('CardController', function ($scope, $rootScope, $routeParams, $lo
});
// handle rename to update information on the board as well
$scope.renameCard = function(card) {
$scope.cardRename = function(card) {
CardService.rename(card).then(function(data) {
StackService.updateCard(card);
$scope.status.renameCard = false;
});
};
$scope.updateCard = function(card) {
$scope.cardUpdate = function(card) {
CardService.update(CardService.getCurrent());
$scope.status.description = false;
}
$scope.editDescription = function() {
$scope.status.description = true;
$scope.cardEditDescription = function() {
$scope.status.cardEditDescription = true;
}
$scope.labelAssign = function(element, model) {

6
js/controller/ListController.js
View File

@@ -13,7 +13,7 @@ app.controller('ListController', function ($scope, $location, BoardService) {
$scope.newBoard.color = color;
};
$scope.createBoard = function () {
$scope.boardCreate = function () {
BoardService.create($scope.newBoard)
.then(function (response) {
$scope.newBoard = {};
@@ -22,11 +22,11 @@ app.controller('ListController', function ($scope, $location, BoardService) {
$scope.status.createBoard = 'Unable to insert board: ' + error.message;
});
};
$scope.updateBoard = function(board) {
$scope.boardUpdate = function(board) {
BoardService.update(board);
board.status.edit = false;
};
$scope.deleteBoard = function(board) {
$scope.boardDelete = function(board) {
// TODO: Ask for confirmation
//if (confirm('Are you sure you want to delete this?')) {
BoardService.delete(board.id);

215
js/public/app.js
View File

@@ -111,191 +111,12 @@ app.run(["$document", "$rootScope", "$transitions", function ($document, $rootSc
}]);
app.controller('AppController', ["$scope", "$location", "$http", "$route", "$log", "$rootScope", "$stateParams", function ($scope, $location, $http, $route, $log, $rootScope, $stateParams) {
$rootScope.sidebar = {
show: false
};
$scope.sidebar = $rootScope.sidebar;
$scope.search = function (value) {
if (value === '') {
$location.search('search', null);
} else {
$location.search('search', value);
}
$scope.searchText = value;
};
$rootScope.searchText = $location.search().search;
}]);
app.controller('ArchiveController', ["$rootScope", "$scope", "$stateParams", "StatusService", "BoardService", "StackService", "CardService", "LabelService", "$state", "$transitions", function ($rootScope, $scope, $stateParams, StatusService, BoardService, StackService, CardService, LabelService, $state, $transitions) {
$scope.sidebar = $rootScope.sidebar;
$scope.id = $stateParams.boardId;
$scope.status={},
$scope.newLabel={};
$scope.status.boardtab = $stateParams.detailTab;
$scope.state = $state.current;
console.log($scope.state);
$scope.stackservice = StackService;
$scope.boardservice = BoardService;
$scope.cardservice = CardService;
$scope.statusservice = StatusService.getInstance();
$scope.labelservice = LabelService;
$scope.foo = function(state) {
console.log(state);
}
// fetch data
StackService.clear();
$scope.statusservice.retainWaiting();
$scope.statusservice.retainWaiting();
BoardService.fetchOne($scope.id).then(function(data) {
$scope.statusservice.releaseWaiting();
}, function(error) {
$scope.statusservice.setError('Error occured', error);
});
console.log($scope);
StackService.fetchArchived($scope.id).then(function(data) {
console.log(data);
$scope.statusservice.releaseWaiting();
}, function(error) {
$scope.statusservice.setError('Error occured', error);
});
BoardService.searchUsers();
$scope.cardDelete = function(card) {
CardService.delete(card.id);
StackService.deleteCard(card);
}
// TODO: move to filter?
// Lighten Color of the board for background usage
$scope.rgblight = function (hex) {
var result = /^([A-Fa-f\d]{2})([A-Fa-f\d]{2})([A-Fa-f\d]{2})$/i.exec(hex);
var color = result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
if(result !== null) {
var rgba = "rgba(" + color.r + "," + color.g + "," + color.b + ",0.7)";
return rgba;
} else {
return "#"+hex;
}
};
// TODO: move to filter?
// RGB2HLS by Garry Tan
// http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c
$scope.textColor = function (hex) {
var result = /^([A-Fa-f\d]{2})([A-Fa-f\d]{2})([A-Fa-f\d]{2})$/i.exec(hex);
var color = result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
if(result !== null) {
r = color.r/255;
g = color.g/255;
b = color.b/255;
var max = Math.max(r, g, b), min = Math.min(r, g, b);
var h, s, l = (max + min) / 2;
if(max == min){
h = s = 0; // achromatic
}else{
var d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch(max){
case r: h = (g - b) / d + (g < b ? 6 : 0); break;
case g: h = (b - r) / d + 2; break;
case b: h = (r - g) / d + 4; break;
}
h /= 6;
}
// TODO: Maybe just darken/lighten the color
if(l<0.5) {
return "#ffffff";
} else {
return "#000000";
}
//var rgba = "rgba(" + color.r + "," + color.g + "," + color.b + ",0.7)";
//return rgba;
} else {
return "#aa0000";
}
};
// settings for card sorting
$scope.sortOptions = {
itemMoved: function (event) {
// TODO: Implement reodering here
event.source.itemScope.modelValue.status = event.dest.sortableScope.$parent.column;
var order = event.dest.index;
var card = event.source.itemScope.c;
var newStack = event.dest.sortableScope.$parent.s.id;
card.stackId = newStack;
CardService.update(card);
CardService.reorder(card, order).then(function(data) {
StackService.data[newStack].addCard(card);
});
},
orderChanged: function (event) {
// TODO: Implement ordering here
var order = event.dest.index;
var card = event.source.itemScope.c;
CardService.reorder(card, order);
},
scrollableContainer: '#board',
containerPositioning: 'relative',
containment: '#board',
// auto scroll on drag
dragMove: function (itemPosition, containment, eventObj) {
if (eventObj) {
var container = $("#board");
var offset = container.offset();
targetX = eventObj.pageX - (offset.left || container.scrollLeft());
targetY = eventObj.pageY - (offset.top || container.scrollTop());
if (targetX < offset.left) {
container.scrollLeft(container.scrollLeft() - 50);
} else if (targetX > container.width()) {
container.scrollLeft(container.scrollLeft() + 50);
}
if (targetY < offset.top) {
container.scrollTop(container.scrollTop() - 50);
} else if (targetY > container.height()) {
container.scrollTop(container.scrollTop() + 50);
}
}
}
};
}]);
app.controller('BoardController', ["$rootScope", "$scope", "$stateParams", "StatusService", "BoardService", "StackService", "CardService", "LabelService", "$state", "$transitions", "$filter", function ($rootScope, $scope, $stateParams, StatusService, BoardService, StackService, CardService, LabelService, $state, $transitions, $filter) {
$scope.sidebar = $rootScope.sidebar;
@@ -355,6 +176,12 @@ app.controller('BoardController', ["$rootScope", "$scope", "$stateParams", "Stat
$scope.filterData('order', $scope.searchText);
}
};
$scope.checkCanEdit = function() {
if($scope.archived) {
return false;
}
return true;
}
// filter cards here, as ng-sortable will not work nicely with html-inline filters
$scope.filterData = function (order, text) {
@@ -452,24 +279,19 @@ app.controller('BoardController', ["$rootScope", "$scope", "$stateParams", "Stat
LabelService.update(label);
}
$scope.addAcl = function(sharee) {
$scope.aclAdd = function(sharee) {
sharee.boardId = $scope.id;
BoardService.addAcl(sharee);
$scope.status.addSharee = null;
}
$scope.deleteAcl = function(acl) {
$scope.aclDelete = function(acl) {
BoardService.deleteAcl(acl.id);
}
$scope.updateAcl = function(acl) {
$scope.aclUpdate = function(acl) {
BoardService.updateAcl(acl);
}
$scope.checkCanEdit = function() {
if($scope.archived) {
return false;
}
return true;
}
// settings for card sorting
$scope.sortOptions = {
@@ -486,7 +308,7 @@ app.controller('BoardController', ["$rootScope", "$scope", "$stateParams", "Stat
});
},
orderChanged: function (event) {
// TODO: Implement ordering here (set new order of all cards in stack)
// TODO: Implement reordering here (set new order of all cards in stack)
// then maybe also call $scope.filterData('order')?
var order = event.dest.index;
var card = event.source.itemScope.c;
@@ -541,20 +363,19 @@ app.controller('CardController', ["$scope", "$rootScope", "$routeParams", "$loca
});
// handle rename to update information on the board as well
$scope.renameCard = function(card) {
$scope.cardRename = function(card) {
CardService.rename(card).then(function(data) {
StackService.updateCard(card);
$scope.status.renameCard = false;
});
};
$scope.updateCard = function(card) {
$scope.cardUpdate = function(card) {
CardService.update(CardService.getCurrent());
$scope.status.description = false;
}
$scope.editDescription = function() {
$scope.status.description = true;
$scope.cardEditDescription = function() {
$scope.status.cardEditDescription = true;
}
$scope.labelAssign = function(element, model) {
@@ -584,7 +405,7 @@ app.controller('ListController', ["$scope", "$location", "BoardService", functio
$scope.newBoard.color = color;
};
$scope.createBoard = function () {
$scope.boardCreate = function () {
BoardService.create($scope.newBoard)
.then(function (response) {
$scope.newBoard = {};
@@ -593,11 +414,11 @@ app.controller('ListController', ["$scope", "$location", "BoardService", functio
$scope.status.createBoard = 'Unable to insert board: ' + error.message;
});
};
$scope.updateBoard = function(board) {
$scope.boardUpdate = function(board) {
BoardService.update(board);
board.status.edit = false;
};
$scope.deleteBoard = function(board) {
$scope.boardDelete = function(board) {
// TODO: Ask for confirmation
//if (confirm('Are you sure you want to delete this?')) {
BoardService.delete(board.id);

10
templates/part.board.sidebarView.php
View File

@@ -17,7 +17,7 @@
<div class="tabsContainer">
<div id="commentsTabView" class="tab commentsTabView" ng-if="status.boardtab==0 || !status.boardtab">
<ui-select ng-model="status.addSharee" theme="bootstrap" style="width:100%;" title="Choose a user to assign" placeholder="Assign users ..." on-select="addAcl(status.addSharee)">
<ui-select ng-model="status.addSharee" theme="bootstrap" style="width:100%;" title="Choose a user to assign" placeholder="Assign users ..." on-select="aclAdd(status.addSharee)">
<ui-select-match placeholder="<?php p($l->t('Select users...')); ?>">
<span><i class="fa fa-{{$item.type}}"></i> {{ $item.participant }}</span>
</ui-select-match>
@@ -46,18 +46,18 @@
<span class="has-tooltip username">
{{ acl.participant }}</span>
<span class="shareOption">
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-share" ng-model="acl.permissionInvite" ng-change="updateAcl(acl)" />
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-share" ng-model="acl.permissionInvite" ng-change="aclUpdate(acl)" />
<label for="checkbox-permission-{{ acl.id }}-share"><?php p($l->t('Share')); ?></label>
</span>
<span class="shareOption">
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-edit" ng-model="acl.permissionWrite" ng-change="updateAcl(acl)" />
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-edit" ng-model="acl.permissionWrite" ng-change="aclUpdate(acl)" />
<label for="checkbox-permission-{{ acl.id }}-edit"><?php p($l->t('Edit')); ?></label>
</span>
<span class="shareOption">
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-manage" ng-model="acl.permissionManage" ng-change="updateAcl(acl)" />
<input type="checkbox" class="permissions checkbox" id="checkbox-permission-{{ acl.id }}-manage" ng-model="acl.permissionManage" ng-change="aclUpdate(acl)" />
<label for="checkbox-permission-{{ acl.id }}-manage"><?php p($l->t('Manage')); ?></label>
</span>
<a class="unshare" ng-click="deleteAcl(acl)"><span class="icon-loading-small hidden"></span><span class="icon icon-delete"></span><span class="hidden-visually"><?php p($l->t('Discard share')); ?></span></a>
<a class="unshare" ng-click="aclDelete(acl)"><span class="icon-loading-small hidden"></span><span class="icon icon-delete"></span><span class="hidden-visually"><?php p($l->t('Discard share')); ?></span></a>
</li>
</ul>

2
templates/part.boardlist.php
View File

@@ -33,7 +33,7 @@
<?php p($l->t('Create new board')); ?>
</a>
<form ng-show="status.addBoard" ng-disabled="isAddingList"
class="ng-pristine ng-valid" ng-submit="createBoard()">
class="ng-pristine ng-valid" ng-submit="boardCreate()">
<input id="newTitle" class="edit ng-valid ng-empty"
type="text" placeholder="<?php p($l->t('New board title')); ?>"
autofocus-on-insert ng-model="newBoard.title">

16
templates/part.card.php
View File

@@ -8,14 +8,14 @@
<div id="card-header">
<a class="icon-close" ui-sref="board" ng-click="sidebar.show=!sidebar.show">&nbsp;</a>
<h2>
<form ng-submit="renameCard(cardservice.getCurrent())">
<form ng-submit="cardRename(cardservice.getCurrent())">
<!-- TODO: change to textarea elastic //-->
<input class="input-inline" type="text" ng-if="status.renameCard"
<input class="input-inline" type="text" ng-if="status.cardRename"
ng-model="cardservice.getCurrent().title"
ng-blur="renameCard(cardservice.getCurrent())"
ng-blur="cardRename(cardservice.getCurrent())"
autofocus-on-insert required>
</form>
<div ng-click="status.renameCard=true" ng-show="!status.renameCard">{{
<div ng-click="status.cardRename=true" ng-show="!status.cardRename">{{
cardservice.getCurrent().title }}
</div>
</h2>
@@ -66,13 +66,13 @@
<div id="card-description">
<h3>Description</h3>
<textarea elastic ng-if="status.description"
<textarea elastic ng-if="status.cardEditDescription"
placeholder="Enter your description here ..."
ng-blur="updateCard(cardservice.getCurrent())"
ng-blur="cardUpdate(cardservice.getCurrent())"
ng-model="cardservice.getCurrent().description"
autofocus-on-insert> </textarea>
<div class="container" ng-click="editDescription()"
ng-show="!status.description" ng-animate>
<div class="container" ng-click="cardEditDescription()"
ng-show="!status.cardEditDescription" ng-animate>
<div ng-bind-html="cardservice.getCurrent().description | markdown"
id="markdown"></div>
<div class="placeholder"

9
templates/part.navigation.php
View File

@@ -19,7 +19,7 @@
<ul>
<li><button class="icon-share svg" title="share"></button></li>
<li><button class="icon-rename svg" title="rename" ng-click="b.status.edit=true"></button></li>
<li><button class="icon-delete svg" title="delete" ng-click="deleteBoard(b)"></button></li>
<li><button class="icon-delete svg" title="delete" ng-click="boardDelete(b)"></button></li>
</ul>
</div>
<div class="app-navigation-entry-deleted" ng-show="false">
@@ -28,7 +28,7 @@
</div>
<div class="app-navigation-entry-edit" ng-show="b.status.edit">
<form ng-disabled="isAddingList" class="ng-pristine ng-valid" ng-submit="updateBoard(b)">
<form ng-disabled="isAddingList" class="ng-pristine ng-valid" ng-submit="boardUpdate(b)">
<input id="newTitle" class="edit ng-valid ng-empty" type="text" autofocus-on-insert ng-model="b.title">
<input type="submit" value="" class="action icon-checkmark svg">
<div class="colorselect">
@@ -44,12 +44,11 @@
<?php p($l->t('Create a new board')); ?>
</a>
<div class="app-navigation-entry-edit" ng-if="status.addBoard">
<form ng-disabled="isAddingList" class="ng-pristine ng-valid" ng-submit="createBoard()">
<form ng-disabled="isAddingList" class="ng-pristine ng-valid" ng-submit="boardCreate()">
<input id="newTitle" class="edit ng-valid ng-empty" type="text" placeholder="<?php p($l->t('Board title')); ?>" autofocus-on-insert ng-model="newBoard.title">
<input type="submit" value="" class="action icon-checkmark svg">
<div class="colorselect">
<div class="color" ng-repeat="c in colors" style="background-color:#{{ c }};" ng-click="selectColor(c)" n:w
g-class="{'selected': (c == newBoard.color) }"><br /></div>
<div class="color" ng-repeat="c in colors" style="background-color:#{{ c }};" ng-click="selectColor(c)" ng-class="{'selected': (c == newBoard.color) }"><br /></div>
</div>
</form>
</div>

6
templates/part.settings.php
View File

@@ -4,8 +4,8 @@
data-apps-slide-toggle="#app-settings-content"
></button>
</div>
<div id="app-settings-content">
<?php p($l->t('We will provide some options here!')); ?>
<!--<div id="app-settings-content">
<?php p($l->t('There will be some options here!')); ?>
<br />
</div>
</div>//-->
</div>