summaryrefslogtreecommitdiffstatsabout
diff options
context:
space:
mode:
authorelijahe2013-11-19 15:35:58 (EST)
committer Silenio Quarti2013-11-21 10:39:28 (EST)
commit0388876db29c23ba9d53cec68db4788a02015ab5 (patch)
tree3f7a471fc4424e339a0b36f6ec408fae179cfcb9
parentc5ddfb2d7a227a5669297aaacc965e22afcd8f76 (diff)
downloadorg.eclipse.orion.client-0388876db29c23ba9d53cec68db4788a02015ab5.zip
org.eclipse.orion.client-0388876db29c23ba9d53cec68db4788a02015ab5.tar.gz
org.eclipse.orion.client-0388876db29c23ba9d53cec68db4788a02015ab5.tar.bz2
Bug 394861 - outliner should provide filtering
- Added up/down key outline navigation support when filter has focus and when table rows are hidden. - Added support for pressing Enter on an outline item. - Made the filter input box position fixed. --Signed-off-by: Elijah El-Haddad <elijahe@ca.ibm.com>
-rw-r--r--bundles/org.eclipse.orion.client.ui/web/edit/common.css10
-rw-r--r--bundles/org.eclipse.orion.client.ui/web/orion/explorers/explorerNavHandler.js50
-rw-r--r--bundles/org.eclipse.orion.client.ui/web/orion/outliner.js69
3 files changed, 99 insertions, 30 deletions
diff --git a/bundles/org.eclipse.orion.client.ui/web/edit/common.css b/bundles/org.eclipse.orion.client.ui/web/edit/common.css
index 286fef7..e98d632 100644
--- a/bundles/org.eclipse.orion.client.ui/web/edit/common.css
+++ b/bundles/org.eclipse.orion.client.ui/web/edit/common.css
@@ -18,7 +18,15 @@
border: 1px solid lightgrey;
margin-left: 0;
text-align: left;
- width: 99%;
+ position: fixed;
+ top: 75px;
+ left: 2px;
+ width: 250px;
+}
+
+.outlineFilterCell {
+ min-height: 25px;
+ height: 25px;
}
.outlineRowHidden {
diff --git a/bundles/org.eclipse.orion.client.ui/web/orion/explorers/explorerNavHandler.js b/bundles/org.eclipse.orion.client.ui/web/orion/explorers/explorerNavHandler.js
index 832e3c5..fe51fb4 100644
--- a/bundles/org.eclipse.orion.client.ui/web/orion/explorers/explorerNavHandler.js
+++ b/bundles/org.eclipse.orion.client.ui/web/orion/explorers/explorerNavHandler.js
@@ -485,24 +485,41 @@ exports.ExplorerNavHandler = (function() {
return value && value.rowDomNode ? value.rowDomNode : lib.node(modelId);
},
- iterate: function(forward, forceExpand, selecting) {
+ iterate: function(forward, forceExpand, selecting, visibleOnly) {
+ var currentItem = null;
+
if(this.topIterationNodes.length === 0){
return;
}
- if(this._modelIterator.iterate(forward, forceExpand)){
- this.cursorOn(null, false, forward);
- if(selecting){
- var previousModelInSelection = this._inSelection(this._modelIterator.prevCursor());
- var currentModelInselection = this._inSelection(this._modelIterator.cursor());
- if(previousModelInSelection >= 0 && currentModelInselection >= 0) {
- this.setSelection(this._modelIterator.prevCursor(), true);
- } else {
- this.setSelection(this.currentModel(), true);
+
+ currentItem = this._modelIterator.iterate(forward, forceExpand);
+ if(currentItem){
+ this._setCursorOnItem(forward, selecting);
+ }
+
+ if (visibleOnly && currentItem) {
+ while (currentItem && currentItem.isHidden) {
+ currentItem = this._modelIterator.iterate(forward, forceExpand);
+ if(currentItem){
+ this._setCursorOnItem(forward, selecting);
}
}
}
},
+ _setCursorOnItem: function(forward, selecting) {
+ this.cursorOn(null, false, forward);
+ if(selecting){
+ var previousModelInSelection = this._inSelection(this._modelIterator.prevCursor());
+ var currentModelInselection = this._inSelection(this._modelIterator.cursor());
+ if(previousModelInSelection >= 0 && currentModelInselection >= 0) {
+ this.setSelection(this._modelIterator.prevCursor(), true);
+ } else {
+ this.setSelection(this.currentModel(), true);
+ }
+ }
+ },
+
_checkRow: function(model, toggle) {
if(this.explorer.renderer._useCheckboxSelection){
var tableRow = this.getRowDiv(model);
@@ -580,7 +597,7 @@ exports.ExplorerNavHandler = (function() {
//Up arrow key iterates the current row backward. If control key is on, browser's scroll up behavior takes over.
//If shift key is on, it toggles the check box and iterates backward.
onUpArrow: function(e) {
- this.iterate(false, false, e.shiftKey);
+ this.iterate(false, false, e.shiftKey, true);
if(!this._ctrlKeyOn(e) && !e.shiftKey){
this.setSelection(this.currentModel(), false, true);
}
@@ -591,7 +608,7 @@ exports.ExplorerNavHandler = (function() {
//Down arrow key iterates the current row forward. If control key is on, browser's scroll down behavior takes over.
//If shift key is on, it toggles the check box and iterates forward.
onDownArrow: function(e) {
- this.iterate(true, false, e.shiftKey);
+ this.iterate(true, false, e.shiftKey, true);
if(!this._ctrlKeyOn(e) && !e.shiftKey){
this.setSelection(this.currentModel(), false, true);
}
@@ -702,6 +719,15 @@ exports.ExplorerNavHandler = (function() {
}
}
}
+ if(this.explorer.renderer.performRowAction){
+ var curModel = this._modelIterator.cursor();
+ if(!curModel){
+ return;
+ }
+ this.explorer.renderer.performRowAction(e, curModel);
+ e.preventDefault();
+ return false;
+ }
}
};
return ExplorerNavHandler;
diff --git a/bundles/org.eclipse.orion.client.ui/web/orion/outliner.js b/bundles/org.eclipse.orion.client.ui/web/orion/outliner.js
index 62edaef..9329569 100644
--- a/bundles/org.eclipse.orion.client.ui/web/orion/outliner.js
+++ b/bundles/org.eclipse.orion.client.ui/web/orion/outliner.js
@@ -53,6 +53,7 @@ define([
} else if (item.line || item.column || item.start) {
var href = new URITemplate("#{,resource,params*}").expand({resource: this.title, params: item}); //$NON-NLS-0$
this._createLink(item.label, href, elementNode);
+ item.outlineLink = href;
} else if (item.label) {
elementNode.appendChild(document.createTextNode(item.label)); //$NON-NLS-0$
}
@@ -61,27 +62,22 @@ define([
OutlineRenderer.prototype._createLink = function(text, href, parentNode) {
var link = document.createElement("a"); //$NON-NLS-0$
parentNode.appendChild(link);
- // if there is no selection service, we rely on normal link following
- if (!this.selectionService) {
- link.href = href;
- } else {
- link.style.cursor = "pointer"; //$NON-NLS-0$
- }
+
link.classList.add("navlinkonpage"); //$NON-NLS-0$
link.appendChild(document.createTextNode(text));
+
// if a selection service has been specified, we will use it for link selection.
// Otherwise we assume following the href in the anchor tag is enough.
if (this.selectionService) {
- var selectionService = this.selectionService;
- var url = href;
+ link.style.cursor = "pointer"; //$NON-NLS-0$
link.addEventListener("click", function(event) { //$NON-NLS-0$
- if (mUIUtils.openInNewWindow(event)) {
- mUIUtils.followLink(url, event);
- } else {
- selectionService.setSelections(url);
- }
- }, false);
+ this._followLink(event, href);
+ }.bind(this), false);
+ } else {
+ // if there is no selection service, we rely on normal link following
+ link.href = href;
}
+
return link;
};
@@ -91,6 +87,8 @@ define([
if (0 === col_no) {
th = document.createElement("th"); //$NON-NLS-0$
+ th.classList.add("outlineFilterCell");
+
input = document.createElement("input"); //$NON-NLS-0$
input.className = "outlineFilter"; //$NON-NLS-0$
input.placeholder = messages["Filter"]; //$NON-NLS-0$
@@ -98,12 +96,47 @@ define([
input.addEventListener("input", function (e) { //$NON-NLS-0$
this.explorer.filterChanged(input.value);
}.bind(this));
+
+ input.addEventListener("keydown", function (e) { //$NON-NLS-0$
+ var navHandler = null;
+ var firstNode = null;
+ if (e.keyCode === lib.KEY.DOWN) {
+ input.blur();
+ navHandler = this.explorer.getNavHandler();
+ navHandler.focus();
+ if (navHandler.getTopLevelNodes()) {
+ firstNode = navHandler.getTopLevelNodes()[0];
+ navHandler.cursorOn(firstNode, false, true);
+ if (firstNode.isHidden) {
+ navHandler.iterate(true, false, false, true);
+ }
+ }
+ }
+ }.bind(this), false);
+
th.appendChild(input);
}
return th;
};
+ //This is an optional function for explorerNavHandler. It performs an action when Enter is pressed on a table row.
+ //The explorerNavHandler hooked up by the explorer will check if this function exists and call it on Enter key press.
+ OutlineRenderer.prototype.performRowAction = function(event, item) {
+ this._followLink(event, item.outlineLink);
+ };
+
+ OutlineRenderer.prototype._followLink = function(event, url) {
+ var selectionService = this.selectionService;
+ if (selectionService) {
+ if (mUIUtils.openInNewWindow(event)) {
+ mUIUtils.followLink(url, event);
+ } else {
+ selectionService.setSelections(url);
+ }
+ }
+ };
+
function OutlineExplorer(serviceRegistry, selection, title) {
/* we intentionally do not do this:
@@ -119,7 +152,7 @@ define([
OutlineExplorer.prototype.filterChanged = function (filter) {
- var navDict = this.getNavDict();
+ var navHandler = this.getNavHandler();
var itemMap = this.model.getIdItemMap();
var item;
@@ -128,10 +161,12 @@ define([
item = itemMap[id];
if (-1 === item.label.indexOf(filter)) {
//hide
- navDict.getValue(id).rowDomNode.classList.add("outlineRowHidden"); //$NON-NLS-0$
+ navHandler.getRowDiv(item).classList.add("outlineRowHidden"); //$NON-NLS-0$
+ item.isHidden = true;
} else {
//label matches filter, show row
- navDict.getValue(id).rowDomNode.classList.remove("outlineRowHidden"); //$NON-NLS-0$
+ navHandler.getRowDiv(item).classList.remove("outlineRowHidden"); //$NON-NLS-0$
+ item.isHidden = false;
}
}
}