Author: jsdelfino
Date: Tue Apr 15 13:56:56 2008
New Revision: 648408
URL: http://svn.apache.org/viewvc?rev=648408&view=rev
Log:
Added a utility method to suggest available options on input fields in the
admin app. Added corresponding CSS entries to admin.css. Next step to improve
usability is to add calls to it in the various admin pages to allow people to
select contribution uris, namespaces, composite names without having to type
them.
Modified:
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/admin.css
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/utils.js
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/workspace.html
Modified:
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/admin.css
URL:
http://svn.apache.org/viewvc/incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/admin.css?rev=648408&r1=648407&r2=648408&view=diff
==============================================================================
---
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/admin.css
(original)
+++
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/admin.css
Tue Apr 15 13:56:56 2008
@@ -71,3 +71,29 @@
text-align: right
}
+.suggest {
+ background-color: #e5ecf9; color: #598edd;
+ border-top: 1px; border-bottom: 1px; border-left: 1px; border-right:
1px;
+ border-style: solid; border-top-color: #a2bae7; border-bottom-color:
#d1d3d4;
+ border-left-color: #d1d3d4; border-right-color: #d1d3d4;
+ position: absolute;
+ overflow: auto; overflow-x: hidden;
+ cursor: default;
+ padding: 0px; margin: 0px;
+}
+
+suggestTable {
+ border: 0px; border-collapse: separate;
+ padding-left: 5px; padding-right: 5px; padding-top: 2px; padding-bottom:
2px;
+ margin: 0px;
+}
+
+.suggestItem {
+ padding-left: 2px; padding-top: 0px; padding-bottom: 0px;
padding-right: 2px; white-space: nowrap; vertical-align: text-top;
+ background-color: #e5ecf9; color: #598edd;
+}
+
+.suggestHilighted {
+ padding-left: 2px; padding-top: 0px; padding-bottom: 0px;
padding-right: 2px; white-space: nowrap; vertical-align: text-top;
+ background-color: #598edd; color: #e5ecf9;
+}
Modified:
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/utils.js
URL:
http://svn.apache.org/viewvc/incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/utils.js?rev=648408&r1=648407&r2=648408&view=diff
==============================================================================
---
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/utils.js
(original)
+++
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/utils.js
Tue Apr 15 13:56:56 2008
@@ -17,6 +17,122 @@
* under the License.
*/
+/**
+ * Autocomplete / suggest support for input fields
+ *
+ * To use it declare a 'suggest' function as follows:
+ * function suggestItems() {
+ * return new Array('abc', 'def', 'ghi');
+ * }
+ *
+ * then hook it to an input field as follows:
+ * suggest(document.yourForm.yourInputField, suggestItems);
+ */
+function selectSuggestion(node, value) {
+ for (;;) {
+ node = node.parentNode;
+ if (node.tagName.toLowerCase() == 'div') {
+ break;
+ }
+ }
+ node.selectSuggestion(value);
+}
+
+function hilightSuggestion(node, over) {
+ if (over) {
+ node.className = 'suggestHilighted';
+ } else {
+ node.className = 'suggestItem';
+ }
+}
+
+function suggest(input, suggestFunction) {
+
+ input.suggest = suggestFunction;
+
+ input.selectSuggestion = function(value) {
+ this.hideSuggestDiv();
+ this.value = value;
+ }
+
+ input.hideSuggestDiv = function() {
+ if (this.suggestDiv != null) {
+ this.suggestDiv.style.visibility = 'hidden';
+ }
+ }
+
+ input.showSuggestDiv = function() {
+ if (this.suggestDiv == null) {
+ this.suggestDiv = document.createElement('div');
+ this.suggestDiv.input = this;
+ this.suggestDiv.className = 'suggest';
+ input.parentNode.insertBefore(this.suggestDiv, input);
+ this.suggestDiv.style.visibility = 'hidden';
+ this.suggestDiv.style.zIndex = '99';
+
+ this.suggestDiv.selectSuggestion = function(value) {
+ this.input.selectSuggestion(value);
+ }
+ }
+
+ var values = this.suggest();
+ var items = "";
+ for (var i = 0; i < values.length; i++) {
+ if (values[i].indexOf(this.value) == -1) {
+ continue;
+ }
+ if (items.length == 0) {
+ items += '<table class=suggestTable>';
+ }
+ items += '<tr><td class="suggestItem" ' +
+ 'onmouseover="hilightSuggestion(this, true)"
onmouseout="hilightSuggestion(this, false)" ' +
+ 'onclick="selectSuggestion(this, \'' + values[i] + '\')">' +
values[i] + '</td></tr>';
+ }
+ if (items.length != 0) {
+ items += '</table>';
+ }
+ this.suggestDiv.innerHTML = items;
+
+ if (items.length != 0) {
+ var node = input;
+ var left = 0;
+ var top = 0;
+ for (;;) {
+ left += node.offsetLeft;
+ top += node.offsetTop;
+ node = node.offsetParent;
+ if (node.tagName.toLowerCase() == 'body') {
+ break;
+ }
+ }
+ this.suggestDiv.style.left = left;
+ this.suggestDiv.style.top = top + input.offsetHeight;
+ this.suggestDiv.style.visibility = 'visible';
+ } else {
+ this.suggestDiv.style.visibility = 'hidden';
+ }
+ }
+
+ input.onkeydown = function(event) {
+ this.showSuggestDiv();
+ };
+
+ input.onkeyup = function(event) {
+ this.showSuggestDiv();
+ };
+
+ input.onmousedown = function(event) {
+ this.showSuggestDiv();
+ };
+
+ input.onblur = function(event) {
+ setTimeout(function() { input.hideSuggestDiv(); }, 50);
+ };
+}
+
+/**
+ * A Toolbar class
+ */
function Tool(name, href) {
this.name = name;
this.href = href;
@@ -31,8 +147,10 @@
}
}
+/**
+ * Initialize the toolbar
+ */
function toolbar() {
-
var toolbar = '<table width="100%" cellpadding="0" cellspacing="0"
class=tbar><tr>' +
'<td class=ltbar><table border="0" cellspacing="0"
cellpadding="0"><tr>';
@@ -48,6 +166,9 @@
document.getElementById('toolbar').innerHTML = toolbar;
}
+/**
+ * Utility function returning an array from an array or an object.
+ */
function array(obj) {
if (obj.length == undefined) {
var a = new Array();
@@ -59,6 +180,9 @@
}
}
+/**
+ * Populate the default toolbar
+ */
var tools = new Array();
tools[0] = new Tool("Contributions", "/ui/workspace");
tools[1] = new Tool("Composites", "/ui/composite");
Modified:
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/workspace.html
URL:
http://svn.apache.org/viewvc/incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/workspace.html?rev=648408&r1=648407&r2=648408&view=diff
==============================================================================
---
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/workspace.html
(original)
+++
incubator/tuscany/java/sca/modules/workspace-admin/src/main/resources/workspace.html
Tue Apr 15 13:56:56 2008
@@ -112,11 +112,16 @@
document.newContributionForm.contributionID.value = "";
document.newContributionForm.contributionLocation.value = "";
getContributions();
- }
+ }
+
+ //function suggestContributionIDs() {
+ // return new Array('abc', 'def', 'ghi');
+ //}
function init() {
toolbar();
getContributions();
+ //suggest(document.newContributionForm.contributionID,
suggestContributionIDs);
}
</script>
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
