From a48169de185b6e63b31c3b480adcede97cbc75fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julius=20H=C3=A4rtl?= Date: Thu, 7 Dec 2017 19:53:27 +0100 Subject: [PATCH] Rework parameter handling, highlight active card and allow switching tabs in the board sidebar MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Julius Härtl --- css/style.scss | 17 +++++++++++- js/app/Config.js | 3 +++ js/controller/BoardController.js | 36 +++++++++++++------------ templates/part.board.headerControls.php | 6 ++--- templates/part.board.mainView.php | 14 +++++----- templates/part.board.sidebarView.php | 9 +++---- 6 files changed, 52 insertions(+), 33 deletions(-) diff --git a/css/style.scss b/css/style.scss index 4c621d881..a1c8284df 100644 --- a/css/style.scss +++ b/css/style.scss @@ -134,6 +134,22 @@ input.input-inline { min-height: 96px; } } + + .card { + opacity: 1; + } + + &.card-selected { + + .card { + opacity: 0.7; + + &.current { + opacity: 1.0; + box-shadow: 0px 0px 7px 0px $color-darkgrey; + } + } + } } #innerBoard { @@ -326,7 +342,6 @@ input.input-inline { margin: 10px 10px 20px 10px; white-space: normal; position: relative; - opacity: 1.0; box-shadow: 0 0 3px $color-darkgrey; border-radius: 3px; diff --git a/js/app/Config.js b/js/app/Config.js index a0afc3c5d..78178e727 100644 --- a/js/app/Config.js +++ b/js/app/Config.js @@ -58,6 +58,9 @@ app.config(function ($provide, $routeProvider, $interpolateProvider, $httpProvid .state('board.detail', { url: '/detail/', reloadOnSearch: false, + params: { + tab: {value: 0, dynamic: true}, + }, views: { 'sidebarView': { templateUrl: '/board.sidebarView.html' diff --git a/js/controller/BoardController.js b/js/controller/BoardController.js index 8927b012f..66f351a91 100644 --- a/js/controller/BoardController.js +++ b/js/controller/BoardController.js @@ -30,7 +30,6 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St addCard: [], }; $scope.newLabel = {}; - $scope.status.boardtab = $stateParams.detailTab; $scope.OC = OC; $scope.stackservice = StackService; @@ -39,21 +38,28 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St $scope.statusservice = StatusService.getInstance(); $scope.labelservice = LabelService; $scope.defaultColors = ['31CC7C', '317CCC', 'FF7A66', 'F1DB50', '7C31CC', 'CC317C', '3A3B3D', 'CACBCD']; + $scope.board = BoardService.getCurrent(); + + // workaround for $stateParams changes not being propagated + $scope.$watch(function() { + return $state.params; + }, function (params) { + $scope.params = params; + console.log(params); + }, true); + $scope.params = $state; + $scope.search = function (searchText) { $scope.searchText = searchText; $scope.refreshData(); }; - $scope.board = BoardService.getCurrent(); - StackService.clear(); //FIXME: Is this still needed? - $scope.$watch(function () { return BoardService.getCurrent().title; }, function () { $scope.setPageTitle(); }); - $scope.setPageTitle = function () { if (BoardService.getCurrent()) { document.title = BoardService.getCurrent().title + " | Deck - " + oc_defaults.name; @@ -61,35 +67,31 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St document.title = "Deck - " + oc_defaults.name; } }; + $scope.statusservice.retainWaiting(); $scope.statusservice.retainWaiting(); - // FIXME: ugly solution for archive - $scope.$state = $stateParams; - $scope.filter = $stateParams.filter; - $scope.$watch('$state.filter', function (name) { - $scope.filter = name; - }); + // handle filter parameter for switching between archived/unarchived cards $scope.switchFilter = function (filter) { - $state.go('.', {filter: filter}, {notify: false}); - $scope.filter = filter; + $state.go('.', {filter: filter}); }; - $scope.$watch('filter', function (name) { - if (name === "archive") { + $scope.$watch(function() { + return $scope.params.filter; + }, function (filter) { + if (filter === "archive") { $scope.loadArchived(); } else { $scope.loadDefault(); } }); - $scope.stacksData = StackService; $scope.stacks = []; $scope.$watch('stacksData', function (value) { $scope.refreshData(); }, true); $scope.refreshData = function () { - if ($scope.filter === "archive") { + if ($scope.params.filter === "archive") { $scope.filterData('-lastModified', $scope.searchText); } else { $scope.filterData('order', $scope.searchText); diff --git a/templates/part.board.headerControls.php b/templates/part.board.headerControls.php index be234b948..bc568cf90 100644 --- a/templates/part.board.headerControls.php +++ b/templates/part.board.headerControls.php @@ -11,15 +11,15 @@ - + t('Show archived cards')); ?> - + t('Hide archived cards')); ?> - + t('Board details')); ?> diff --git a/templates/part.board.mainView.php b/templates/part.board.mainView.php index 158d1011d..06edb8590 100644 --- a/templates/part.board.mainView.php +++ b/templates/part.board.mainView.php @@ -30,8 +30,8 @@ -
- +
+ {{ cardOpen }}
@@ -49,13 +49,13 @@ ng-if="!s.status.editStack" ng-click="stackservice.delete(s.id)"> -