Dan Brown

Added draft save indicator and fixed notification positions

...@@ -357,8 +357,6 @@ module.exports = function (ngApp, events) { ...@@ -357,8 +357,6 @@ module.exports = function (ngApp, events) {
357 357
358 /** 358 /**
359 * Save a draft update into the system via an AJAX request. 359 * Save a draft update into the system via an AJAX request.
360 - * @param title
361 - * @param html
362 */ 360 */
363 function saveDraft() { 361 function saveDraft() {
364 var data = { 362 var data = {
...@@ -373,9 +371,17 @@ module.exports = function (ngApp, events) { ...@@ -373,9 +371,17 @@ module.exports = function (ngApp, events) {
373 var updateTime = moment.utc(moment.unix(responseData.data.timestamp)).toDate(); 371 var updateTime = moment.utc(moment.unix(responseData.data.timestamp)).toDate();
374 $scope.draftText = responseData.data.message + moment(updateTime).format('HH:mm'); 372 $scope.draftText = responseData.data.message + moment(updateTime).format('HH:mm');
375 if (!$scope.isNewPageDraft) $scope.isUpdateDraft = true; 373 if (!$scope.isNewPageDraft) $scope.isUpdateDraft = true;
374 + showDraftSaveNotification();
376 }); 375 });
377 } 376 }
378 377
378 + function showDraftSaveNotification() {
379 + $scope.draftUpdated = true;
380 + $timeout(() => {
381 + $scope.draftUpdated = false;
382 + }, 2000)
383 + }
384 +
379 $scope.forceDraftSave = function() { 385 $scope.forceDraftSave = function() {
380 saveDraft(); 386 saveDraft();
381 }; 387 };
......
...@@ -20,6 +20,16 @@ ...@@ -20,6 +20,16 @@
20 } 20 }
21 } 21 }
22 22
23 +.draft-notification {
24 + pointer-events: none;
25 + transform: scale(0);
26 + transition: transform ease-in-out 120ms;
27 + transform-origin: 50% 50%;
28 + &.visible {
29 + transform: scale(1);
30 + }
31 +}
32 +
23 .page-style.editor { 33 .page-style.editor {
24 padding: 0 !important; 34 padding: 0 !important;
25 } 35 }
......
...@@ -72,7 +72,7 @@ body.dragging, body.dragging * { ...@@ -72,7 +72,7 @@ body.dragging, body.dragging * {
72 border-radius: 3px; 72 border-radius: 3px;
73 box-shadow: $bs-med; 73 box-shadow: $bs-med;
74 z-index: 999999; 74 z-index: 999999;
75 - display: table; 75 + display: block;
76 cursor: pointer; 76 cursor: pointer;
77 max-width: 480px; 77 max-width: 480px;
78 i, span { 78 i, span {
......
...@@ -13,8 +13,9 @@ ...@@ -13,8 +13,9 @@
13 </div> 13 </div>
14 <div class="col-sm-4 faded text-center"> 14 <div class="col-sm-4 faded text-center">
15 15
16 - <div dropdown class="dropdown-container"> 16 + <div dropdown class="dropdown-container draft-display">
17 <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> 17 <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>
18 + <i class="zmdi zmdi-check-circle text-pos draft-notification" ng-class="{visible: draftUpdated}"></i>
18 <ul> 19 <ul>
19 <li> 20 <li>
20 <a ng-click="forceDraftSave()" class="text-pos"><i class="zmdi zmdi-save"></i>Save Draft</a> 21 <a ng-click="forceDraftSave()" class="text-pos"><i class="zmdi zmdi-save"></i>Save Draft</a>
......