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

Fix save indicator for description (fixes #354)

Browse Source 
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2017-12-16 10:47:30 +01:00
parent 1d5ed11a8c
commit 253e60f88a
3 changed files with 49 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
css/style.scss
View File

@@ -733,25 +733,33 @@ input.input-inline {
} }
} }
#card-description { .card-description {
height: 100%; &.section-header {
display: flex; .save-indicator {
flex-direction: column; margin-bottom: 5px;
margin-top: 5px;
> div { }
}
&.section-content {
height: 100%; height: 100%;
} display: flex;
flex-direction: column;
textarea { > div {
width: 100%; height: 100%;
height: 200px; }
border: none;
margin: 0;
padding: 0;
}
.container { textarea {
background-color: $color-main-background; width: 100%;
height: 200px;
border: none;
margin: 0;
padding: 0;
}
.container {
background-color: $color-main-background;
}
} }
} }
} }

40
js/controller/CardController.js
View File

@@ -62,24 +62,25 @@ app.controller('CardController', function ($scope, $rootScope, $routeParams, $lo
}; };
$scope.cardEditDescriptionChanged = function ($event) { $scope.cardEditDescriptionChanged = function ($event) {
$scope.status.lastEdit = Date.now(); $scope.status.lastEdit = Date.now();
$('#card-description').find('.save-indicator.unsaved').show(); var header = $('.section-header.card-description');
$('#card-description').find('.save-indicator.saved').hide(); header.find('.save-indicator.unsaved').show();
header.find('.save-indicator.saved').hide();
}; };
$interval(function() {
$scope.cardEditDescriptionAutosave = function() { $scope.cardEditDescriptionAutosave = function() {
var currentTime = Date.now(); var currentTime = Date.now();
var timeSinceEdit = currentTime-$scope.status.lastEdit; var timeSinceEdit = currentTime-$scope.status.lastEdit;
if (timeSinceEdit > 1000 && $scope.status.lastEdit > $scope.status.lastSave) { if (timeSinceEdit > 1000 && $scope.status.lastEdit > $scope.status.lastSave) {
$scope.status.lastSave = currentTime; $scope.status.lastSave = currentTime;
$('#card-description').find('.save-indicator.unsaved').fadeIn(500); var header = $('.section-content.card-description');
CardService.update(CardService.getCurrent()).then(function (data) { header.find('.save-indicator.unsaved').fadeIn(500);
$('#card-description').find('.save-indicator.unsaved').hide(); CardService.update(CardService.getCurrent()).then(function (data) {
$('#card-description').find('.save-indicator.saved').fadeIn(250).fadeOut(1000); header.find('.save-indicator.unsaved').hide();
}); header.find('.save-indicator.saved').fadeIn(250).fadeOut(1000);
} });
}; }
};
$interval( function(){ $scope.cardEditDescriptionAutosave(); }, 500); }, 500);
// handle rename to update information on the board as well // handle rename to update information on the board as well
$scope.cardRename = function (card) { $scope.cardRename = function (card) {
@@ -91,8 +92,9 @@ app.controller('CardController', function ($scope, $rootScope, $routeParams, $lo
$scope.cardUpdate = function (card) { $scope.cardUpdate = function (card) {
CardService.update(CardService.getCurrent()).then(function (data) { CardService.update(CardService.getCurrent()).then(function (data) {
$scope.status.cardEditDescription = false; $scope.status.cardEditDescription = false;
$('#card-description').find('.save-indicator.unsaved').hide(); var header = $('.section-content.card-description');
$('#card-description').find('.save-indicator.saved').fadeIn(500).fadeOut(1000); header.find('.save-indicator.unsaved').hide();
header.find('.save-indicator.saved').fadeIn(500).fadeOut(1000);
}); });
StackService.updateCard(card); StackService.updateCard(card);
}; };

8
templates/part.card.php
View File

@@ -84,17 +84,17 @@
<button class="icon icon-delete button-inline" title="<?php p($l->t('Remove due date')); ?>" ng-if="cardservice.getCurrent().duedate" ng-click="resetDuedate()"><span class="hidden-visually"><?php p($l->t('Remove due date')); ?></span></button> <button class="icon icon-delete button-inline" title="<?php p($l->t('Remove due date')); ?>" ng-if="cardservice.getCurrent().duedate" ng-click="resetDuedate()"><span class="hidden-visually"><?php p($l->t('Remove due date')); ?></span></button>
</div> </div>
<div class="section-header"> <div class="section-header card-description">
<h4> <h4>
<div> <div>
<?php p($l->t('Description')); ?> <?php p($l->t('Description')); ?>
<a href="https://github.com/nextcloud/deck/wiki/Markdown-Help" target="_blank" class="icon icon-help" title="<?php p($l->t('Formatting help')); ?>"><span class="hidden-visually"><?php p($l->t('Formatting help')); ?></span></a> <a href="https://github.com/nextcloud/deck/wiki/Markdown-Help" target="_blank" class="icon icon-help" title="<?php p($l->t('Formatting help')); ?>"><span class="hidden-visually"><?php p($l->t('Formatting help')); ?></span></a>
</div> </div>
<span class="save-indicator saved"><?php p($l->t('Saved')); ?></span>
<span class="save-indicator unsaved"><?php p($l->t('Unsaved changes')); ?></span>
</h4> </h4>
<span class="save-indicator saved"><?php p($l->t('Saved')); ?></span>
<span class="save-indicator unsaved"><?php p($l->t('Unsaved changes')); ?></span>
</div> </div>
<div id="card-description"> <div class="section-content card-description">
<textarea elastic ng-if="status.cardEditDescription" <textarea elastic ng-if="status.cardEditDescription"
placeholder="<?php p($l->t('Add a card description…')); ?>" placeholder="<?php p($l->t('Add a card description…')); ?>"
ng-blur="cardUpdate(cardservice.getCurrent())" ng-blur="cardUpdate(cardservice.getCurrent())"