ensure global brooklyn auto-refresh is respected by get/fetch methods, allowing them to run once but subsequently be noop; also code comments on desired refactorings; both from code review with @sjcorbett. also fix bug where effector click sometimes didn't work (two clicks in a row), and fix bug where "No applications" didn't always display when the tree was emptied (child nodes still present); and put in a placeholder which can be used for showing a Not Available message after a fade.
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/6e47ea24 Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/6e47ea24 Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/6e47ea24 Branch: refs/heads/0.6.0 Commit: 6e47ea24fe404d35e6f9e16f646ff986a578821f Parents: c895f77 Author: Alex Heneveld <[email protected]> Authored: Fri Sep 20 16:34:11 2013 +0100 Committer: Alex Heneveld <[email protected]> Committed: Fri Sep 20 16:57:58 2013 +0100 ---------------------------------------------------------------------- .../src/main/webapp/assets/css/brooklyn.css | 11 +++++ .../webapp/assets/js/model/effector-summary.js | 1 + usage/jsgui/src/main/webapp/assets/js/router.js | 4 ++ .../webapp/assets/js/view/application-tree.js | 7 ++- .../webapp/assets/js/view/entity-effectors.js | 7 ++- .../src/main/webapp/assets/js/view/viewutils.js | 45 +++++++++++++++--- .../src/main/webapp/assets/tpl/labs/page.html | 50 ++++++++++++++++++++ 7 files changed, 115 insertions(+), 10 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/css/brooklyn.css ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/css/brooklyn.css b/usage/jsgui/src/main/webapp/assets/css/brooklyn.css index f2cf895..6bccdfa 100644 --- a/usage/jsgui/src/main/webapp/assets/css/brooklyn.css +++ b/usage/jsgui/src/main/webapp/assets/css/brooklyn.css @@ -225,3 +225,14 @@ textarea { /*APP PAGE*/ /* END KROME STYLES */ + +.view_not_available { + /* + // nothing yet; idea is to put CSS here which will show a 'Not Available' message. + // but it is hard to position it without assuming or introducing position-absolute on the parent. + // probably need to mess with the hierarchy, or make such an assumption. + // also there is the issue the (currently) the parent view has had opacity set to 0.2. + // used in viewutils.js fade/cancelFade methods (and should be only those!) + content: 'Not Available'; + */ +} http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/js/model/effector-summary.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/model/effector-summary.js b/usage/jsgui/src/main/webapp/assets/js/model/effector-summary.js index b74a7cd..e3bf8c9 100644 --- a/usage/jsgui/src/main/webapp/assets/js/model/effector-summary.js +++ b/usage/jsgui/src/main/webapp/assets/js/model/effector-summary.js @@ -5,6 +5,7 @@ define([ var EffectorSummary = {} EffectorSummary.Model = Backbone.Model.extend({ + idAttribute: 'name', defaults:function () { return { name:"", http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/js/router.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/router.js b/usage/jsgui/src/main/webapp/assets/js/router.js index a0fe75d..f4fb9fd 100644 --- a/usage/jsgui/src/main/webapp/assets/js/router.js +++ b/usage/jsgui/src/main/webapp/assets/js/router.js @@ -6,6 +6,10 @@ define([ HomeView, ExplorerView, CatalogView, ApidocView, ScriptGroovyView, HelpHtml, LabsHtml) { + // TODO this initialising - customising the View prototype - should be moved, + // and perhaps expanded to include other methods from viewutils + // see discussion at https://github.com/brooklyncentral/brooklyn/pull/939 + // add close method to all views for clean-up // (NB we have to update the prototype _here_ before any views are instantiated; // see "close" called below in "showView") http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js b/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js index 99eebcd..db64c01 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/application-tree.js @@ -68,7 +68,10 @@ define([ removeNode: function(id) { $('#'+id, this.$el).parent().remove() - if (this.collection.isEmpty()) + // collection seems sometimes to have children nodes; + // not sure why, but that's okay for now + if (this.collection.getApplications().length==0) +// if (this.collection.isEmpty() || $('lozenge-app-tree-wrapper').length==0) this.renderFull(); }, @@ -167,7 +170,7 @@ define([ this.$el.empty() // Display tree and highlight the selected entity. - if (this.collection.isEmpty()) { + if (this.collection.getApplications().length==0) { that.$el.append(_.template(TreeEmptyHtml)) } else { _.each(this.collection.getApplications(), http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/js/view/entity-effectors.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/entity-effectors.js b/usage/jsgui/src/main/webapp/assets/js/view/entity-effectors.js index 8a68c29..40a0586 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/entity-effectors.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/entity-effectors.js @@ -48,7 +48,9 @@ define([ $tableBody.append(that.effectorRow({ name:effector.get("name"), description:effector.get("description"), - cid:effector.cid + // cid is mapped to id (here) which is mapped to name (in Effector.Summary), + // so it is consistent across resets + cid:effector.id })) }) } @@ -57,9 +59,10 @@ define([ showEffectorModal:function (eventName) { // get the model that we need to show, create its view and show it var cid = $(eventName.currentTarget).attr("id") + var effectorModel = this._effectors.get(cid); this._modal = new EffectorInvokeView({ el:"#effector-modal", - model:this._effectors.get(cid), + model:effectorModel, entity:this.model }) this._modal.render().$el.modal('show') http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/js/view/viewutils.js ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/js/view/viewutils.js b/usage/jsgui/src/main/webapp/assets/js/view/viewutils.js index 6e009a2..fb04172 100644 --- a/usage/jsgui/src/main/webapp/assets/js/view/viewutils.js +++ b/usage/jsgui/src/main/webapp/assets/js/view/viewutils.js @@ -1,6 +1,6 @@ define([ - "underscore", "jquery" -], function (_, $) { + "underscore", "jquery", "brooklyn" +], function (_, $, BrooklynConfig) { var ViewUtils = { myDataTable:function($table, extra) { @@ -230,23 +230,48 @@ define([ // in case the server response time is low, fade out while it refreshes // (since we can't show updated details until we've retrieved app + entity details) try { - $el.fadeTo(1000, 0.3); + $el.fadeTo(1000, 0.3) +// .queue( +// function() { +// // does nothing yet -- see comment in brooklyn.css on .view_not_available +// $el.append('<div class="view_not_available"></div>') +// }); + // above works to insert the div, though we don't have styling on it + // but curiously it also causes the parent to go to opacity 0 !?! } catch (e) { // ignore - normal during tests } }, cancelFadeOnceLoaded: function($el) { try { +// $el.children('.view_not_available').remove(); $el.stop(true, false).fadeTo(200, 1); } catch (e) { // ignore - normal during tests } }, + + + + // TODO the get and fetch methods below should possibly be on a BrooklynView prototype + // see also notes in router.js + // (perhaps as part of that introduce a callWithFixedDelay method which does the tracking, + // so we can cleanly unregister, and perhaps an onServerFailure method, and with that we + // could perhaps get rid of, or at least dramatically simplify, the get/fetch) + /* variant of $.get with automatic failure handling and recovery; * options should be omitted except by getRepeatedlyWithDelay */ get: function(view, url, success, options) { if (view.viewIsClosed) return ; - if (options['enablement'] && !options['enablement']()) { + + if (!options) options = {} + if (!options.count) options.count = 1 + else options.count++; +// log("getting, count "+options.count+", delay "+period+": "+url) + + var disabled = (options['enablement'] && !options['enablement']()) + || !BrooklynConfig.refresh + if (options.count > 1 && disabled) { // not enabled, just requeue if (options['period']) setTimeout(function() { ViewUtils.get(view, url, success, options)}, options['period']) @@ -353,13 +378,21 @@ define([ * error (optional function to invoke on error, before requeueing); */ fetchRepeatedlyWithDelay: function(view, model, options) { + if (view.viewIsClosed) return; + if (!options) options = {} + if (!options.count) options.count = 1 + else options.count++; + var period = options['period'] || 3000 var originalPeriod = options['originalPeriod'] || period -// log("fetching "+model.url+" with delay "+period) +// log("fetching, count "+options.count+", delay "+period+": "+model.url) + var fetcher = function() { if (view.viewIsClosed) return; - if (options['enablement'] && !options['enablement']()) { + var disabled = (options['enablement'] && !options['enablement']()) + || !BrooklynConfig.refresh + if (options.count > 1 && disabled) { // not enabled, just requeue ViewUtils.fetchRepeatedlyWithDelay(view, model, options); return; http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/6e47ea24/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html ---------------------------------------------------------------------- diff --git a/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html b/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html index 4dfb3b1..e339851 100644 --- a/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html +++ b/usage/jsgui/src/main/webapp/assets/tpl/labs/page.html @@ -85,5 +85,55 @@ $(document).ready(function() { <img src="/assets/img/glyphicons-halflings.png"/> +<br/><br/> +<div><b>Debug Config</b></div><br/> + +<script> +var updateGlobalRefreshDisplay = function() { + require(["brooklyn"], function(b) { + $('#globalRefresh').html(''+b.refresh) + }) +} + +var toggleGlobalRefresh = function() { + require(["brooklyn"], function(b) { + b.toggleRefresh(); + updateGlobalRefreshDisplay(); + }) +} + +$(document).ready(function() { + updateGlobalRefreshDisplay() +}) +</script> + +Brooklyn Global Auto Refresh is: <b><span id="globalRefresh">?</span> +<span onclick="javascript:toggleGlobalRefresh()"><i>[change]</i></span></b> +<br/><span><i>(this setting controls whether things do auto refresh; +disabling globally can be helpful when testing)</i></span> + + + +<br/><br/> +<div><b>Debug Config</b></div><br/> + +<script> +var fadeHello = function() { + require(["view/viewutils"], function(v) { + log('fading') + v.fadeToIndicateInitialLoad($('#hello')) + }) +} +var showHello = function() { + require(["view/viewutils"], function(v) { + log('unfading') + v.cancelFadeOnceLoaded($('#hello')) + }) +} +</script> +<div id="hello">I'm a region which fades.</div> +<div><span onclick="javascript:fadeHello()">fade</span> <span onclick="javascript:showHello()">show</span></div> + + </div> </div>
