From 05dc35b6d67e558b4101bc5742251b2a2f9a71dc Mon Sep 17 00:00:00 2001 From: John Cardinal Date: Wed, 17 Apr 2019 18:57:46 +0000 Subject: [PATCH] --- ayanova/devdocs/todo.txt | 17 +++ ayanova/src/App.vue | 152 +++++++++----------- ayanova/src/views/inventory-widget-edit.vue | 2 +- 3 files changed, 84 insertions(+), 87 deletions(-) diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt index 0ad9c4c4..ef1c3d08 100644 --- a/ayanova/devdocs/todo.txt +++ b/ayanova/devdocs/todo.txt @@ -31,6 +31,7 @@ All platforms and browsers - IMPLEMENTED / NOT TESTED: Login, doesn't have any ui if failed login, maybe a red frowny face icon? :) - IMPLEMENTED / NOT TESTED: need clear buttons on pw and login - IMPLEMENTED / NOT TESTED: Numeric input fields don't give numeric keyboard + - Navigation guard: navigate away with unsaved changes should warn and prevent but have option to continue anyway - Save on broken rules in Widget edit form it's not clear that save does nothing if there are broken rules. Button should be deactivated or there should be a message if you click on it or something. - Red outline and inactive seems ideal - Save button placement, not sure I like having to scroll down the page to save on small format screens where there is potentially going to be a *lot* of scrolling needed which hides the info box etc @@ -70,6 +71,22 @@ All platforms and browsers - Move help menu item in shell into menu as bottom item instead - TODO: CODE THIS FOR THIS MENU ISSUE - Just added ability to send info to store that is picked up by nav menu + - REQUIREMENTS + - Global Help link on *every* page + - will change on each page + - Global Logout link on every page + - Unchanging + - Probably more global page items + - Menu supports dividers + - Menu has a context section and a global section + - One set of menu items only not two separate ones internally + - Context items are at the top, then a divider, then the global ones at the bottom + - Caller sets if it's contextual or not to adapt colour of app bar, but otherwise it's the same exact menu all the time + - Caller should be able to set items colour so (for example) Save can be redded out when not savable + - Caller should be able to set the ENABLED property so it can handle different states + - Maybe a change item event that takes a key and updates it rather than refreshing the whole menu basis on state change? + - I.E. so that can change save button enabled and colour when state of form broken rules changes? + iPad diff --git a/ayanova/src/App.vue b/ayanova/src/App.vue index ead24250..204d3e55 100644 --- a/ayanova/src/App.vue +++ b/ayanova/src/App.vue @@ -56,35 +56,23 @@ --> - - - - - {{ "fa-" + item.icon }} - - - {{ item.title }} - - - - - - - - {{ "fa-" + item.icon }} - - - {{ item.title }} - - + + + + @@ -122,75 +110,67 @@ export default { isMain: true, icon: "", title: "", - contextMenuItems: [], - mainMenuItems: [] - }, - items: [ - { header: "Today" }, - { - avatar: "https://cdn.vuetifyjs.com/images/lists/1.jpg", - title: "Brunch this weekend?", - subtitle: - "Ali Connors — I'll be in your neighborhood doing errands this weekend. Do you want to hang out?" - }, - { divider: true, inset: true }, - { - avatar: "https://cdn.vuetifyjs.com/images/lists/2.jpg", - title: 'Summer BBQ 4', - subtitle: - "to Alex, Scott, Jennifer — Wish I could come, but I'm out of town this weekend." - }, - { divider: true, inset: true }, - { - avatar: "https://cdn.vuetifyjs.com/images/lists/3.jpg", - title: "Oui oui", - subtitle: - "Sandra Adams — Do you have Paris recommendations? Have you ever been?" - } - ] + menuItems: [] + } }; }, created() { + ////////////////////////////////// + // MENU DISPLAY EVENT HANDLER //subscribe to menu changes + // var that = this; this.$gzevent.$on("menu-change", function(ctx) { that.appBar.isMain = ctx.isMain; that.appBar.icon = ctx.icon; that.appBar.title = ctx.title; - if (!ctx.isMain) { - //context menu so handle accordingly - that.appBar.contextMenuItems = ctx.contextMenuItems - ? ctx.contextMenuItems - : []; - } else { - //main menu, put in the standard items that always show - that.appBar.mainMenuItems = [ - { - title: this.$gzlocale.get("Logout"), - icon: "sign-out-alt", - key: "app:logout" - } - ]; - //If other items specified add them above the standard ones - var hasSpecialHelpLink = false; - if (ctx.mainMenuItems) { - that.appBar.mainMenuItems = ctx.mainMenuItems.concat( - that.appBar.mainMenuItems - ); - } + that.appBar.menuItems = []; - //Now see if there is a help item already that is contextual or if not then add a generic link to the start of docs - TODO: check here if there is already an item that has a key that starts with "app:help:" instead of using the specialHelpLInk - if (!hasSpecialHelpLink) { - that.appBar.mainMenuItems.push({ - title: this.$gzlocale.get("MenuHelp"), - icon: "question-circle", - key: "app:help:index.html" - }); - } + //CONTEXT TOP PORTION + //populate the context portion of the menu so handle accordingly + if (ctx.menuItems) { + that.appBar.menuItems = ctx.menuItems; + //DIVIDER + //Insert the devider between context and global items + that.appBar.menuItems.push({ divider: true, inset: true }); } - }); + //GLOBAL BOTTOM PORTION + + //Global sub-heading + //Likely won't want this but here anyway to see + that.appBar.menuItems.push({ header: "GLOBAL" }); + + //global menu items + + //Logout + that.appBar.menuItems.push({ + title: this.$gzlocale.get("Logout"), + icon: "sign-out-alt", + key: "app:logout" + }); + + //Help + //There may already be a context help so double check that first if not then add a generic link to the start of docs + var helpItem = that.$_.find(that.appBar.menuItems, function(o) { + if (!o.key) { + return false; + } + return o.key.startsWith("app:help:"); + }); + + if (!helpItem) { + that.appBar.menuItems.push({ + title: this.$gzlocale.get("MenuHelp"), + icon: "question-circle", + key: "app:help:index.html" + }); + } + }); //END OF EVENT + + ////////////////////////////////// + //CLICK EVENT HANDLER + // this.$gzevent.$on("menu-click", function(key) { if (key.startsWith("app:")) { if (key.startsWith("app:help:")) { diff --git a/ayanova/src/views/inventory-widget-edit.vue b/ayanova/src/views/inventory-widget-edit.vue index 5f63d586..97d5ae35 100644 --- a/ayanova/src/views/inventory-widget-edit.vue +++ b/ayanova/src/views/inventory-widget-edit.vue @@ -179,7 +179,7 @@ export default { isMain: false, icon: "fa-splotch", title: this.$gzlocale.get("Widget"), - contextMenuItems: [ + menuItems: [ { title: this.$gzlocale.get("Duplicate"), icon: "clone",