You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mc...@apache.org on 2015/05/05 02:53:17 UTC
incubator-nifi git commit: NIFI-588: - Hiding secondary actions as
the screen size gets smaller.
Repository: incubator-nifi
Updated Branches:
refs/heads/develop e98c074fc -> 37e5548ac
NIFI-588:
- Hiding secondary actions as the screen size gets smaller.
Project: http://git-wip-us.apache.org/repos/asf/incubator-nifi/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-nifi/commit/37e5548a
Tree: http://git-wip-us.apache.org/repos/asf/incubator-nifi/tree/37e5548a
Diff: http://git-wip-us.apache.org/repos/asf/incubator-nifi/diff/37e5548a
Branch: refs/heads/develop
Commit: 37e5548ac19ee1580663f66682020c04272798c2
Parents: e98c074
Author: Matt Gilman <ma...@gmail.com>
Authored: Mon May 4 16:46:44 2015 -0400
Committer: Matt Gilman <ma...@gmail.com>
Committed: Mon May 4 16:46:44 2015 -0400
----------------------------------------------------------------------
.../webapp/js/nf/canvas/nf-canvas-header.js | 17 +++++++++
.../webapp/js/nf/canvas/nf-canvas-toolbar.js | 36 ++++++++++----------
.../src/main/webapp/js/nf/canvas/nf-canvas.js | 4 +--
.../webapp/js/nf/canvas/nf-toolbar-action.js | 11 ++++--
4 files changed, 46 insertions(+), 22 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-nifi/blob/37e5548a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-header.js
----------------------------------------------------------------------
diff --git a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-header.js b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-header.js
index ff5d2f2..5cc1eff 100644
--- a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-header.js
+++ b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-header.js
@@ -19,6 +19,8 @@
nf.CanvasHeader = (function () {
+ var MIN_TOOLBAR_WIDTH = 640;
+
var config = {
urls: {
helpDocument: '../nifi-docs/documentation',
@@ -308,6 +310,21 @@ nf.CanvasHeader = (function () {
}
}
});
+
+ var toolbar = $('#toolbar');
+ var groupButton = $('#action-group');
+ $(window).on('resize', function() {
+ if (toolbar.width() < MIN_TOOLBAR_WIDTH && groupButton.is(':visible')) {
+ toolbar.find('.secondary').hide();
+ } else if (toolbar.width() > MIN_TOOLBAR_WIDTH && groupButton.is(':hidden')) {
+ toolbar.find('.secondary').show();
+ }
+ });
+
+ // set up the initial visibility
+ if (toolbar.width() < MIN_TOOLBAR_WIDTH) {
+ toolbar.find('.secondary').hide();
+ }
},
/**
http://git-wip-us.apache.org/repos/asf/incubator-nifi/blob/37e5548a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbar.js
----------------------------------------------------------------------
diff --git a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbar.js b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbar.js
index 8347f37..cecf7d5 100644
--- a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbar.js
+++ b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbar.js
@@ -48,24 +48,24 @@ nf.CanvasToolbar = (function () {
actions['template'] = new nf.ToolbarAction(globalControls, 'template', 'action-template', 'template', 'template-hover', 'template-disable', 'Create Template');
border.clone().appendTo(globalControls);
separator.clone().appendTo(globalControls);
- border.clone().appendTo(globalControls);
- actions['copy'] = new nf.ToolbarAction(globalControls, 'copy', 'action-copy', 'copy', 'copy-hover', 'copy-disable', 'Copy');
- border.clone().appendTo(globalControls);
- actions['paste'] = new nf.ToolbarAction(globalControls, 'paste', 'action-paste', 'paste', 'paste-hover', 'paste-disable', 'Paste');
- border.clone().appendTo(globalControls);
- separator.clone().appendTo(globalControls);
- border.clone().appendTo(globalControls);
- actions['group'] = new nf.ToolbarAction(globalControls, 'group', 'action-group', 'group', 'group-hover', 'group-disable', 'Group');
- border.appendTo(globalControls);
- separator.clone().appendTo(globalControls);
- border.clone().appendTo(globalControls);
- actions['fill'] = new nf.ToolbarAction(globalControls, 'fillColor', 'action-fill', 'fill', 'fill-hover', 'fill-disable', 'Change Color');
- border.clone().appendTo(globalControls);
- separator.clone().appendTo(globalControls);
- border.clone().appendTo(globalControls);
- actions['delete'] = new nf.ToolbarAction(globalControls, 'delete', 'action-delete', 'delete', 'delete-hover', 'delete-disable', 'Delete');
- border.appendTo(globalControls);
- separator.appendTo(globalControls);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ actions['copy'] = new nf.ToolbarAction(globalControls, 'copy', 'action-copy', 'copy', 'copy-hover', 'copy-disable', 'Copy', true);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ actions['paste'] = new nf.ToolbarAction(globalControls, 'paste', 'action-paste', 'paste', 'paste-hover', 'paste-disable', 'Paste', true);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ separator.clone().addClass('secondary').appendTo(globalControls);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ actions['group'] = new nf.ToolbarAction(globalControls, 'group', 'action-group', 'group', 'group-hover', 'group-disable', 'Group', true);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ separator.clone().addClass('secondary').appendTo(globalControls);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ actions['fill'] = new nf.ToolbarAction(globalControls, 'fillColor', 'action-fill', 'fill', 'fill-hover', 'fill-disable', 'Change Color', true);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ separator.clone().addClass('secondary').appendTo(globalControls);
+ border.clone().addClass('secondary').appendTo(globalControls);
+ actions['delete'] = new nf.ToolbarAction(globalControls, 'delete', 'action-delete', 'delete', 'delete-hover', 'delete-disable', 'Delete', true);
+ border.addClass('secondary').appendTo(globalControls);
+ separator.addClass('secondary').appendTo(globalControls);
// set up initial states for selection-less items
if (nf.Common.isDFM()) {
http://git-wip-us.apache.org/repos/asf/incubator-nifi/blob/37e5548a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js
----------------------------------------------------------------------
diff --git a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js
index 38894d8..ca45a3d 100644
--- a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js
+++ b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas.js
@@ -1090,9 +1090,9 @@ nf.Canvas = (function () {
initCanvas();
nf.Canvas.View.init();
nf.ContextMenu.init();
- nf.CanvasHeader.init();
- nf.CanvasToolbox.init();
nf.CanvasToolbar.init();
+ nf.CanvasToolbox.init();
+ nf.CanvasHeader.init();
nf.GraphControl.init();
nf.Search.init();
nf.Settings.init();
http://git-wip-us.apache.org/repos/asf/incubator-nifi/blob/37e5548a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-toolbar-action.js
----------------------------------------------------------------------
diff --git a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-toolbar-action.js b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-toolbar-action.js
index c3adfd6..a7b5f20 100644
--- a/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-toolbar-action.js
+++ b/nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-toolbar-action.js
@@ -27,8 +27,9 @@
* @argument {string} hoverCls The css class for the hover state of the element
* @argument {string} disableCls The css class for the disabled state of the element
* @argument {string} title The title (tooltip) of the element
+ * @argument {boolean} secondary If secondary icon will be hidden as the screen gets smallers
*/
-nf.ToolbarAction = function (container, action, id, cls, hoverCls, disableCls, title) {
+nf.ToolbarAction = function (container, action, id, cls, hoverCls, disableCls, title, secondary) {
this.container = container;
this.action = action;
this.id = id;
@@ -36,6 +37,7 @@ nf.ToolbarAction = function (container, action, id, cls, hoverCls, disableCls, t
this.hoverCls = hoverCls;
this.disableCls = disableCls;
this.title = title;
+ this.secondary = secondary;
this.initAction();
};
@@ -46,6 +48,7 @@ nf.ToolbarAction.prototype.cls = null;
nf.ToolbarAction.prototype.hoverCls = null;
nf.ToolbarAction.prototype.disableCls = null;
nf.ToolbarAction.prototype.title = null;
+nf.ToolbarAction.prototype.secondary = null;
/**
* Initializes the toolbar action by dynamically creating an element,
@@ -53,9 +56,13 @@ nf.ToolbarAction.prototype.title = null;
*/
nf.ToolbarAction.prototype.initAction = function () {
var self = this;
+ var cls = 'toolbar-icon';
+ if (this.secondary === true) {
+ cls += ' secondary';
+ }
// create the default button
- $('<div/>').addClass('toolbar-icon').attr('id', this.id).attr('title', this.title).mouseover(function () {
+ $('<div/>').addClass(cls).attr('id', this.id).attr('title', this.title).mouseover(function () {
if (!$(this).hasClass(self.disableCls)) {
$(this).removeClass(self.cls).addClass(self.hoverCls);
}