Added draft save indicator and fixed notification positions

This commit is contained in:
Dan Brown 2016-09-02 19:26:12 +01:00
parent 3f81eba13b
commit 781f0e7887
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
4 changed files with 21 additions and 4 deletions

View File

@ -357,8 +357,6 @@ module.exports = function (ngApp, events) {
/** /**
* Save a draft update into the system via an AJAX request. * Save a draft update into the system via an AJAX request.
* @param title
* @param html
*/ */
function saveDraft() { function saveDraft() {
var data = { var data = {
@ -373,9 +371,17 @@ module.exports = function (ngApp, events) {
var updateTime = moment.utc(moment.unix(responseData.data.timestamp)).toDate(); var updateTime = moment.utc(moment.unix(responseData.data.timestamp)).toDate();
$scope.draftText = responseData.data.message + moment(updateTime).format('HH:mm'); $scope.draftText = responseData.data.message + moment(updateTime).format('HH:mm');
if (!$scope.isNewPageDraft) $scope.isUpdateDraft = true; if (!$scope.isNewPageDraft) $scope.isUpdateDraft = true;
showDraftSaveNotification();
}); });
} }
function showDraftSaveNotification() {
$scope.draftUpdated = true;
$timeout(() => {
$scope.draftUpdated = false;
}, 2000)
}
$scope.forceDraftSave = function() { $scope.forceDraftSave = function() {
saveDraft(); saveDraft();
}; };

View File

@ -20,6 +20,16 @@
} }
} }
.draft-notification {
pointer-events: none;
transform: scale(0);
transition: transform ease-in-out 120ms;
transform-origin: 50% 50%;
&.visible {
transform: scale(1);
}
}
.page-style.editor { .page-style.editor {
padding: 0 !important; padding: 0 !important;
} }

View File

@ -72,7 +72,7 @@ body.dragging, body.dragging * {
border-radius: 3px; border-radius: 3px;
box-shadow: $bs-med; box-shadow: $bs-med;
z-index: 999999; z-index: 999999;
display: table; display: block;
cursor: pointer; cursor: pointer;
max-width: 480px; max-width: 480px;
i, span { i, span {

View File

@ -13,8 +13,9 @@
</div> </div>
<div class="col-sm-4 faded text-center"> <div class="col-sm-4 faded text-center">
<div dropdown class="dropdown-container"> <div dropdown class="dropdown-container draft-display">
<a dropdown-toggle class="text-primary text-button"><span class="faded-text" ng-bind="draftText"></span>&nbsp; <i class="zmdi zmdi-more-vert"></i></a> <a dropdown-toggle class="text-primary text-button"><span class="faded-text" ng-bind="draftText"></span>&nbsp; <i class="zmdi zmdi-more-vert"></i></a>
<i class="zmdi zmdi-check-circle text-pos draft-notification" ng-class="{visible: draftUpdated}"></i>
<ul> <ul>
<li> <li>
<a ng-click="forceDraftSave()" class="text-pos"><i class="zmdi zmdi-save"></i>Save Draft</a> <a ng-click="forceDraftSave()" class="text-pos"><i class="zmdi zmdi-save"></i>Save Draft</a>