Merge pull request #73 from standardnotes/preview-action

preview action, click outside panel handle
This commit is contained in:
Mo Bitar
2017-02-14 10:01:26 -06:00
committed by GitHub
14 changed files with 133 additions and 35 deletions

View File

@@ -231,10 +231,6 @@ angular.module('app.frontend')
}
}
this.clickedMenu = function() {
this.showMenu = !this.showMenu;
}
this.deleteNote = function() {
if(confirm("Are you sure you want to delete this note?")) {
this.remove()(this.note);

View File

@@ -37,6 +37,7 @@ class Item {
updateFromJSON(json) {
_.merge(this, json);
if(this.created_at) {
this.created_at = new Date(this.created_at);
this.updated_at = new Date(this.updated_at);

View File

@@ -79,6 +79,7 @@ class Extension extends Item {
super.mapContentToLocalProperties(contentObject)
this.name = contentObject.name;
this.url = contentObject.url;
this.supported_types = contentObject.supported_types;
this.actions = contentObject.actions.map(function(action){
return new Action(action);
})
@@ -99,7 +100,8 @@ class Extension extends Item {
var params = {
name: this.name,
url: this.url,
actions: this.actions
actions: this.actions,
supported_types: this.supported_types
};
_.merge(params, super.structureParams());

View File

@@ -102,7 +102,6 @@ class DBManager {
this.openDatabase((db) => {
var request = db.transaction("items", "readwrite").objectStore("items").delete(item.uuid);
request.onsuccess = function(event) {
console.log("Successfully deleted item", item.uuid);
if(callback) {
callback(true);
}

View File

@@ -0,0 +1,27 @@
angular
.module('app.frontend')
.directive('clickOutside', ['$document', function($document) {
return {
restrict: 'A',
replace: false,
link : function($scope, $element, attrs) {
var didApplyClickOutside = false;
$element.bind('click', function(e) {
didApplyClickOutside = false;
if (attrs.isOpen) {
e.stopPropagation();
}
});
$document.bind('click', function() {
if(!didApplyClickOutside) {
$scope.$apply(attrs.clickOutside);
didApplyClickOutside = true;
}
})
}
}
}]);

View File

@@ -11,6 +11,8 @@ class ContextualExtensionsMenu {
controller($scope, modelManager, extensionManager) {
'ngInject';
$scope.renderData = {};
$scope.extensions = _.map(extensionManager.extensionsInContextOfItem($scope.item), function(ext){
return _.cloneDeep(ext);
});
@@ -27,12 +29,30 @@ class ContextualExtensionsMenu {
}
$scope.executeAction = function(action, extension) {
if(action.verb == "nested") {
action.showNestedActions = !action.showNestedActions;
return;
}
action.running = true;
extensionManager.executeAction(action, extension, $scope.item, function(response){
action.running = false;
$scope.handleActionResponse(action, response);
})
}
$scope.handleActionResponse = function(action, response) {
switch (action.verb) {
case "render": {
var item = response.item;
if(item.content_type == "Note") {
$scope.renderData.title = item.title;
$scope.renderData.text = item.text;
$scope.renderData.showRenderModal = true;
}
}
}
}
$scope.accessTypeForExtension = function(extension) {
return extensionManager.extensionUsesEncryptedData(extension) ? "encrypted" : "decrypted";
}

View File

@@ -28,7 +28,7 @@ class ExtensionManager {
extensionsInContextOfItem(item) {
return this.extensions.filter(function(ext){
return ext.actionsWithContextForItem(item).length > 0;
return _.includes(ext.supported_types, item.content_type) || ext.actionsWithContextForItem(item).length > 0;
})
}
@@ -152,9 +152,29 @@ class ExtensionManager {
case "get": {
this.Restangular.oneUrl(action.url, action.url).get().then(function(response){
action.error = false;
var items = response.items;
this.modelManager.mapResponseItemsToLocalModels(items);
customCallback(items);
var items = response.items || [response.item];
EncryptionHelper.decryptMultipleItems(items, localStorage.getItem("mk"));
items = this.modelManager.mapResponseItemsToLocalModels(items);
for(var item of items) {
item.setDirty(true);
}
this.syncManager.sync(null);
customCallback({items: items});
}.bind(this))
.catch(function(response){
action.error = true;
customCallback(null);
})
break;
}
case "render": {
this.Restangular.oneUrl(action.url, action.url).get().then(function(response){
action.error = false;
EncryptionHelper.decryptItem(response.item, localStorage.getItem("mk"));
var item = this.modelManager.createItem(response.item);
customCallback({item: item});
}.bind(this))
.catch(function(response){
action.error = true;

View File

@@ -64,10 +64,10 @@ class ModelManager {
json_obj = _.omit(json_obj, omitFields || [])
var item = this.findItem(json_obj["uuid"]);
if(json_obj["deleted"] == true || !_.includes(this.acceptableContentTypes, json_obj["content_type"])) {
if(item) {
this.removeItemLocally(item)
}
continue;
if(item) {
this.removeItemLocally(item)
}
continue;
}
_.omit(json_obj, omitFields);

View File

@@ -1,4 +1,33 @@
.extension-render-modal {
position: fixed;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 10000;
width: 100vw;
height: 100vh;
background-color: rgba(gray, 0.3);
.content {
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
background-color: white;
width: 700px;
height: 500px;
margin: auto;
padding: 25px;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
overflow-y: scroll;
}
}
.dropdown-menu.contextual-menu {
overflow-y: scroll;
max-height: 85vh;
.extension {
&:not(:first-child) {

View File

@@ -177,15 +177,6 @@
right: 0;
}
.full-screen-button {
cursor: pointer;
position: absolute;
top: 25px;
right: 20px;
z-index: 100;
}
ol {
list-style-type: decimal;
list-style-position: inside;
@@ -196,8 +187,6 @@ ol {
-webkit-padding-start: 0px;
}
.nav-tabs {
a {
color: black;

View File

@@ -150,6 +150,11 @@
}
}
h2 {
margin-bottom: 0px;
margin-top: 0px;
}
.footer-bar {
position: relative;
width: 100%;
@@ -194,10 +199,6 @@
display: block;
}
h2 {
margin-bottom: 0px;
margin-top: 0px;
}
h3 {
font-size: 14px !important;

View File

@@ -10,5 +10,19 @@
%li.action{"ng-repeat" => "action in extension.actionsWithContextForItem(item)", "ng-click" => "executeAction(action, extension)"}
.name {{action.label}}
.desc {{action.desc}}
%div{"ng-if" => "action.showNestedActions"}
%ul.mt-10
%li.action.white-bg{"ng-repeat" => "subaction in action.subactions", "ng-click" => "executeAction(subaction, extension); $event.stopPropagation()", "style" => "margin-top: -1px;"}
.name {{subaction.label}}
.desc {{subaction.desc}}
%span{"ng-if" => "subaction.running"}
.spinner{"style" => "margin-top: 3px;"}
%span{"ng-if" => "action.running"}
.spinner{"style" => "margin-top: 3px;"}
.extension-render-modal{"ng-if" => "renderData.showRenderModal", "ng-click" => "renderData.showRenderModal = false"}
.content
%h2 {{renderData.title}}
%p.normal{"style" => "white-space: pre-wrap; font-family: monospace; font-size: 16px;"} {{renderData.text}}

View File

@@ -11,8 +11,8 @@
"ng-model" => "ctrl.tagsString", "placeholder" => "#tags", "ng-blur" => "ctrl.updateTagsFromTagsString($event, ctrl.tagsString)"}
.section-menu
%ul.nav.nav-pills
%li.dropdown
%a.dropdown-toggle{"ng-click" => "ctrl.clickedMenu(); ctrl.showExtensions = false"}
%li.dropdown{"click-outside" => "ctrl.showMenu = false;", "is-open" => "ctrl.showMenu"}
%a.dropdown-toggle{"ng-click" => "ctrl.showMenu = !ctrl.showMenu; ctrl.showExtensions = false;"}
File
%span.caret
%span.sr-only
@@ -27,8 +27,8 @@
%li{"ng-click" => "ctrl.deleteNote()"}
.text Delete
%li.sep
%li.dropdown{"ng-if" => "ctrl.hasAvailableExtensions()"}
%a.dropdown-toggle{"ng-click" => "ctrl.showExtensions = !ctrl.showExtensions; ctrl.showMenu = false"}
%li.dropdown{"ng-if" => "ctrl.hasAvailableExtensions()", "click-outside" => "ctrl.showExtensions = false;", "is-open" => "ctrl.showExtensions"}
%a.dropdown-toggle{"ng-click" => "ctrl.showExtensions = !ctrl.showExtensions; ctrl.showMenu = false;"}
Extensions
%span.caret
%span.sr-only

View File

@@ -1,10 +1,10 @@
.footer-bar
.pull-left
.footer-bar-link
.footer-bar-link{"click-outside" => "ctrl.showAccountMenu = false;", "is-open" => "ctrl.showAccountMenu"}
%a{"ng-click" => "ctrl.accountMenuPressed()", "ng-class" => "{red: ctrl.error}"} Account
%account-menu{"ng-if" => "ctrl.showAccountMenu"}
.footer-bar-link
.footer-bar-link{"click-outside" => "ctrl.showExtensionsMenu = false;", "is-open" => "ctrl.showExtensionsMenu"}
%a{"ng-click" => "ctrl.toggleExtensions()"} Extensions
%global-extensions-menu{"ng-if" => "ctrl.showExtensionsMenu"}