summaryrefslogtreecommitdiffstatsabout
diff options
context:
space:
mode:
authorAnton McConville2012-03-19 15:11:04 (EDT)
committer Anton McConville2012-03-19 15:52:05 (EDT)
commit5f3a69a7ef4ad6a0c75b283ea28c5eaf08b4ee3e (patch)
tree7eade4fa02b6bcd0b5860bfe4ac0afd1a4cb454e
parent955925a54c5482d839a49121650572523b01b391 (diff)
downloadorg.eclipse.orion.client-5f3a69a7ef4ad6a0c75b283ea28c5eaf08b4ee3e.zip
org.eclipse.orion.client-5f3a69a7ef4ad6a0c75b283ea28c5eaf08b4ee3e.tar.gz
org.eclipse.orion.client-5f3a69a7ef4ad6a0c75b283ea28c5eaf08b4ee3e.tar.bz2
369348
-rw-r--r--bundles/org.eclipse.orion.client.core/web/css/ide.css37
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginEntry.js (renamed from bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginEntry.js)13
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginList.js (renamed from bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginList.js)6
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/ServiceCarousel.js (renamed from bundles/org.eclipse.orion.client.core/web/orion/widgets/ServiceCarousel.js)9
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/ColorPicker.js64
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/InputBuilder.js115
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/Select.js53
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SettingsContainer.js323
-rw-r--r--bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SplitSelectionLayout.js114
-rw-r--r--bundles/org.eclipse.orion.client.core/web/settings/settings.css10
-rw-r--r--bundles/org.eclipse.orion.client.core/web/settings/settings.html58
-rw-r--r--bundles/org.eclipse.orion.client.core/web/settings/settings.js409
12 files changed, 776 insertions, 435 deletions
diff --git a/bundles/org.eclipse.orion.client.core/web/css/ide.css b/bundles/org.eclipse.orion.client.core/web/css/ide.css
index eaf2899..163beb0 100644
--- a/bundles/org.eclipse.orion.client.core/web/css/ide.css
+++ b/bundles/org.eclipse.orion.client.core/web/css/ide.css
@@ -847,3 +847,40 @@ a:hover {
#test-tree {
margin: 8px;
}
+
+
+
+.uploadContainer{
+ padding:20px;
+ font-weight:bold;
+}
+
+.dottedOutline{
+ border: #DDD 4px dashed;
+ border-radius: 2px;
+ padding:50px;
+ height:300px;
+ width: 300px;
+}
+
+.floatingSection{
+ color: #DDD;
+}
+
+.uploadInstruction{
+ font-size: 18pt;
+ color: #CCC;
+ padding: 0 0 100px;
+ text-align:center;
+}
+
+.tipInstruction{
+ font-size: 12pt;
+ color: #CCC;
+ padding: 0 0 100px;
+ text-align:center;
+}
+
+.uploadBrowser{
+ left:50px;
+}
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginEntry.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginEntry.js
index 71716bc..29d06a8 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginEntry.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginEntry.js
@@ -16,16 +16,16 @@
PluginList widget, but each plugin entry element should fit into any HTML list
or table */
-define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/TooltipDialog', 'orion/widgets/ServiceCarousel'], function(require, dojo, dijit, mUtil, mCommands) {
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/TooltipDialog', 'orion/widgets/plugin/ServiceCarousel'], function(require, dojo, dijit, mUtil, mCommands) {
- var iconSource = "data:image/png;base64,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";
+ dojo.declare("orion.widgets.plugin.PluginEntry", [dijit._Widget, dijit._Templated], {
- dojo.declare("orion.widgets.PluginEntry", [dijit._Widget, dijit._Templated], {
+ iconSource: "data:image/png;base64,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",
templateString: '<list style="overflow:hidden;">' +
'<div class="plugin-list-item">' +
'<div data-dojo-attach-point="pluginContainer">' +
- '<img class="plugin-icon" src ="' + iconSource + '"></img>' +
+ '<div class="plugin-icon"></div>' +
'<div class="stretch" data-dojo-attach-point="detailsView">' +
'<span data-dojo-attach-point="pluginTitle" class="plugin-title"></span>' +
'<div></div>' +
@@ -37,6 +37,7 @@ define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/Toolt
'</div>'+
'<div class="plugin-service-item" data-dojo-attach-point="serviceContainer"></div>' +
'</list>',
+
services: null,
serviceDescriptions: null,
@@ -104,8 +105,8 @@ define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/Toolt
this.pluginLink.href = location;
this.commandSpan.id = name;
this.commandService.renderCommands("pluginCommand", this.commandSpan, location, this, "tool");
- this.carousel = new orion.widgets.ServiceCarousel({serviceData:this.serviceDescriptions}, this.serviceContainer );
+ this.carousel = new orion.widgets.plugin.ServiceCarousel({serviceData:this.serviceDescriptions}, this.serviceContainer );
this.carousel.startup();
}
});
-});
+});
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginList.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginList.js
index b8be88f..cf285fd 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/widgets/PluginList.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/PluginList.js
@@ -15,9 +15,9 @@
provides JavaScript functions for user management of Orion plugins. It is designed
to contain PluginEntry widgets */
-define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/TooltipDialog', 'orion/widgets/PluginEntry'], function(require, dojo, dijit, mUtil, mCommands) {
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/TooltipDialog', 'orion/widgets/plugin/PluginEntry'], function(require, dojo, dijit, mUtil, mCommands) {
- dojo.declare("orion.widgets.PluginList", [dijit._Widget, dijit._Templated], {
+ dojo.declare("orion.widgets.plugin.PluginList", [dijit._Widget, dijit._Templated], {
templateString: '<div>' +
'<div class="pluginwrapper">' +
@@ -105,7 +105,7 @@ define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/Toolt
this.pluginTitle.innerHTML = "Plugins [" + pluginList.length +"]";
for( var p = 0; p < pluginList.length; p++ ){
- var pluginEntry = new orion.widgets.PluginEntry( {plugin:pluginList[p], commandService:this.commandService} );
+ var pluginEntry = new orion.widgets.plugin.PluginEntry( {plugin:pluginList[p], commandService:this.commandService} );
list.appendChild( pluginEntry.domNode );
pluginEntry.startup();
}
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/ServiceCarousel.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/ServiceCarousel.js
index 25df374..74fc117 100644
--- a/bundles/org.eclipse.orion.client.core/web/orion/widgets/ServiceCarousel.js
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/plugin/ServiceCarousel.js
@@ -13,7 +13,7 @@
define(['require', 'dojo', 'dijit', 'orion/util', 'dijit/TooltipDialog', 'dojo/fx'], function(require, dojo, dijit, mUtil) {
- dojo.declare("orion.widgets.ServiceCarousel", [dijit._Widget, dijit._Templated], {
+ dojo.declare("orion.widgets.plugin.ServiceCarousel", [dijit._Widget, dijit._Templated], {
serviceState: false,
pointer: 0,
@@ -166,20 +166,19 @@ define(['require', 'dojo', 'dijit', 'orion/util', 'dijit/TooltipDialog', 'dojo/f
var value = data.items[itemCount].value;
- var row = dojo.create("td", null, row);
+ var cell = dojo.create("td", null, row);
if( typeof value === 'object' ){
var debugData = { title:data.service, item:data.items[itemCount].item, value: value };
- dojo.create("span", { 'class':'objectLink', 'title':'click here, then check javascript console to drill down', 'onclick': dojo.hitch( this, 'consoleOutput', debugData ), 'innerHTML':'JavaScript Object' }, row );
+ dojo.create("span", { 'class':'objectLink', 'title':'click here, then check javascript console to drill down', 'onclick': dojo.hitch( this, 'consoleOutput', debugData ), 'innerHTML':'JavaScript Object' }, cell );
}else{
row.innerHTML = value;
}
}
- dojo.create( "div", { "innerHTML":data.service, "class":"listTitle" }, entry );
-
+ dojo.create( "div", { "innerHTML":data.service, "class":"listTitle" }, entry );
},
addData: function(services){
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/ColorPicker.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/ColorPicker.js
new file mode 100644
index 0000000..e443a57
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/ColorPicker.js
@@ -0,0 +1,64 @@
+/*******************************************************************************
+ * @license
+ * Copyright (c) 2012 IBM Corporation and others.
+ * All rights reserved. This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License v1.0
+ * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
+ * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
+ *
+ * Contributors: Anton McConville - IBM Corporation - initial API and implementation
+ ******************************************************************************/
+/*global dojo dijit widgets orion window console define localStorage*/
+/*jslint browser:true*/
+
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/form/DropDownButton', 'dijit/ColorPalette'], function(require, dojo, dijit, mUtil, mCommands) {
+
+ dojo.declare("orion.widgets.settings.ColorPicker", dijit.form.DropDownButton, {
+
+
+ setStorageItem: function(){
+ // to be overridden with a choice of function to store the picked color
+ console.log( 'ColorPicker setStorageIem' );
+ },
+
+ postCreate: function(){
+
+ this.inherited( arguments );
+
+ this.dropDown = new dijit.ColorPalette({
+
+ category: this.category,
+ item: this.item,
+ element: this.name,
+ identifier: this.name,
+ setStorageItem: dojo.hitch( this, 'setStorageItem' ),
+ colornode: this,
+
+ onChange: function(color) {
+
+ var category = this.category;
+ var subCategory = this.item;
+ var element = this.element;
+ var ui = this.ui;
+
+ this.setStorageItem(category, subCategory, element, color, ui);
+ this.colornode.set('label', "");
+
+ dojo.style(this.colornode.domNode.firstChild, "background", color);
+ }
+ });
+
+ dojo.style(this.domNode.firstChild, "border", "1px solid #AAA");
+ dojo.style(this.domNode.firstChild, "padding", "2px");
+ dojo.style(this.domNode.firstChild, "padding-right", "3px");
+ dojo.style(this.domNode.firstChild, "background", this.setting);
+ dojo.style(this.domNode.firstChild, "height", "12px");
+ dojo.style(this.domNode.firstChild, "width", "12px");
+
+ var elements = dojo.query('.dijitArrowButtonInner', this.domNode);
+ dojo.removeClass(elements[0], 'dijitArrowButtonInner');
+ }
+
+ });
+});
+
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/InputBuilder.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/InputBuilder.js
new file mode 100644
index 0000000..6e1a36d
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/InputBuilder.js
@@ -0,0 +1,115 @@
+/*******************************************************************************
+ * @license
+ * Copyright (c) 2012 IBM Corporation and others.
+ * All rights reserved. This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License v1.0
+ * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
+ * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
+ *
+ * Contributors: Anton McConville - IBM Corporation - initial API and implementation
+ ******************************************************************************/
+/*global dojo dijit widgets orion window console define localStorage*/
+/*jslint browser:true*/
+
+/* This InputBuilder widget is a dojo border container with a left and right side. The left is for choosing a
+ category, the right shows the resulting HTML for that category. */
+
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', "orion/widgets/settings/Select", "orion/widgets/settings/ColorPicker"], function(require, dojo, dijit, mUtil, mCommands) {
+
+ dojo.declare("orion.widgets.settings.InputBuilder", null, {
+
+ setStorageItem: function(category, subCategory, element, value, ui) {
+
+ var subcategories = JSON.parse(localStorage.getItem(category));
+
+ for (var sub = 0; sub < subcategories.length; sub++) {
+ if (subcategories[sub].label === subCategory) {
+ for (var item = 0; item < subcategories[sub].data.length; item++) {
+ if (subcategories[sub].data[item].label === element) {
+ subcategories[sub].data[item].value = value;
+ subcategories[sub].data[item].ui = ui;
+ localStorage.setItem(category, JSON.stringify(subcategories));
+ break;
+ }
+ }
+ }
+ }
+ },
+
+ getStorageItem: function(category, subCategory, element) {
+
+ var subcategories = JSON.parse(localStorage.getItem(category));
+
+ var value;
+
+ for (var sub = 0; sub < subcategories.length; sub++) {
+ if (subcategories[sub].label === subCategory) {
+ for (var item = 0; item < subcategories[sub].data.length; item++) {
+ if (subcategories[sub].data[item].label === element) {
+ value = subcategories[sub].data[item].value;
+ break;
+ }
+ }
+ }
+ }
+
+ return value;
+ },
+
+ processInputType: function(category, label, item, node, ui) {
+
+ var setting = this.getStorageItem(category, label, item.label);
+
+ var picker = dojo.create("div", null, node);
+
+ switch (item.input) {
+
+ case "combo":
+
+ var options = [];
+
+ for (var count = 0; count < item.values.length; count++) {
+
+ var comboLabel = item.values[count].label;
+
+ var set = {
+ value: comboLabel,
+ innerHTML: comboLabel
+ };
+
+ if (comboLabel === setting) {
+ set.selected = 'selected';
+ }
+
+ options.push(set);
+ }
+
+ new orion.widgets.settings.Select({
+ category:category,
+ item:label,
+ element:item.label,
+ ui:ui,
+ options:options,
+ setStorageItem: dojo.hitch( this, 'setStorageItem' )
+ }, picker );
+
+ break;
+
+ case "color":
+
+ new orion.widgets.settings.ColorPicker({
+ label: " ",
+ name: item.label,
+ category:category,
+ item:label,
+ setting: setting,
+ setStorageItem: dojo.hitch( this, 'setStorageItem' )
+ }, picker);
+
+ break;
+ }
+ }
+
+ });
+});
+
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/Select.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/Select.js
new file mode 100644
index 0000000..dbf87d8
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/Select.js
@@ -0,0 +1,53 @@
+/*******************************************************************************
+ * @license
+ * Copyright (c) 2012 IBM Corporation and others.
+ * All rights reserved. This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License v1.0
+ * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
+ * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
+ *
+ * Contributors: Anton McConville - IBM Corporation - initial API and implementation
+ ******************************************************************************/
+/*global dojo dijit widgets orion window console define localStorage*/
+/*jslint browser:true*/
+
+/* This SettingsContainer widget is a dojo border container with a left and right side. The left is for choosing a
+ category, the right shows the resulting HTML for that category. */
+
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'dijit/form/Select', 'dijit/ColorPalette'], function(require, dojo, dijit, mUtil, mCommands) {
+
+ dojo.declare("orion.widgets.settings.Select", [dijit._Widget, dijit._Templated], {
+
+ templateString: '<select data-dojo-attach-point="selection" data-dojo-attach-event="onchange:change"></select>',
+
+ // category, item, element, ui - provided on construction
+
+ category: null,
+ item: null,
+ element: null,
+ ui: null,
+
+ setStorageItem: function(){
+ // to be overridden with a choice of function to store the picked color
+ console.log( 'ColorPicker setStorageIem' );
+ },
+
+ change: function(){
+
+ var value = this.selection.value;
+
+ this.setStorageItem( this.category, this.item, this.element, value, this.ui );
+ },
+
+ postCreate: function(){
+ this.inherited( arguments );
+
+ var option = 0;
+
+ for( option = 0; option < this.options.length; option++ ){
+ dojo.create("option", this.options[option], this.selection);
+ }
+ }
+ });
+});
+
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SettingsContainer.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SettingsContainer.js
new file mode 100644
index 0000000..a1e5e51
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SettingsContainer.js
@@ -0,0 +1,323 @@
+/*******************************************************************************
+ * @license
+ * Copyright (c) 2012 IBM Corporation and others.
+ * All rights reserved. This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License v1.0
+ * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
+ * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
+ *
+ * Contributors: Anton McConville - IBM Corporation - initial API and implementation
+ ******************************************************************************/
+/*global dojo dijit widgets orion window console define localStorage*/
+/*jslint browser:true*/
+
+/* This SettingsContainer widget is a dojo border container with a left and right side. The left is for choosing a
+ category, the right shows the resulting HTML for that category. */
+
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'orion/PageUtil', 'dijit/TooltipDialog', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'orion/widgets/plugin/PluginList', 'orion/widgets/settings/SplitSelectionLayout', 'orion/widgets/settings/InputBuilder'], function(require, dojo, dijit, mUtil, mCommands, PageUtil) {
+
+ dojo.declare("orion.widgets.settings.SettingsContainer", [orion.widgets.settings.SplitSelectionLayout], {
+
+ constructor: function() {
+ this.inputBuilder = new orion.widgets.settings.InputBuilder();
+ },
+
+ postCreate: function() {
+ this.itemToIndexMap = {};
+ this.toolbar = dojo.byId( this.pageActions );
+ this.manageDefaultData(this.initialSettings);
+ this.drawUserInterface(this.initialSettings);
+ dojo.subscribe("/dojo/hashchange", this, "processHash");
+ },
+
+ processHash: function() {
+ var pageParams = PageUtil.matchResourceParameters();
+ var category = pageParams.category || "plugins";
+ this.showById(category);
+ this.commandService.processURL(window.location.href);
+ },
+
+ displaySettings: function(id) {
+ var settingsIndex = this.itemToIndexMap[id];
+
+ dojo.empty(this.table);
+
+ var category = this.initialSettings[settingsIndex].category;
+
+ dojo.create("h1", {
+ id: category,
+ innerHTML: category
+ }, this.table);
+
+ var subcategory = this.initialSettings[settingsIndex].subcategory;
+
+ for (var sub = 0; sub < subcategory.length; sub++) {
+
+ var section = dojo.create("section", {
+ id: subcategory[sub].label
+ }, this.table);
+
+ dojo.create("h3", {
+ innerHTML: subcategory[sub].ui
+ }, section);
+
+ var outer = dojo.create("div", null, section);
+
+ for (var item = 0; item < subcategory[sub].items.length; item++) {
+
+ var inner = dojo.create("div", null, outer);
+ var label = dojo.create("label", null, inner);
+ dojo.create("span", {
+ innerHTML: subcategory[sub].items[item].label + ":"
+ }, label);
+ this.inputBuilder.processInputType(category, subcategory[sub].label, subcategory[sub].items[item], label, subcategory[sub].ui);
+ }
+ }
+ },
+
+ addPlugins: function() {
+
+ var item = {
+ id: "plugins",
+ innerHTML: "Plugins",
+ "class": 'navbar-item',
+ onclick: dojo.hitch( this, 'showPlugins', "plugins" )
+ };
+
+ this.addCategory(item, this.initialSettings.length);
+ },
+
+
+/* showPlugins - iterates over the plugin array, reads
+ meta-data and creates a dom entry for each plugin.
+
+ This HTML structure is a special case - the other
+ settings cases should follow more of the JSEditor
+ pattern. */
+
+ showPlugins: function(id) {
+
+ if (this.selectedCategory) {
+ dojo.removeClass(this.selectedCategory, "navbar-item-selected");
+ }
+
+ if (id) {
+ this.selectedCategory = dojo.byId(id);
+ }
+
+ dojo.addClass(this.selectedCategory, "navbar-item-selected");
+
+ dojo.empty(this.table);
+
+ if (this.pluginWidget) {
+ this.pluginWidget.destroyRecursive(true);
+ }
+
+ this.updateToolbar(id);
+
+ var pluginNode = dojo.create( 'div', null, this.table );
+
+ this.pluginWidget = new orion.widgets.plugin.PluginList({
+ settings: this.settingsCore,
+ statusService: this.preferencesStatusService,
+ dialogService: this.preferenceDialogService,
+ commandService: this.commandService,
+ toolbarID: "pageActions"
+ }, pluginNode);
+ },
+
+ showById: function(id) {
+ this.updateToolbar(id);
+ if (id === "plugins") {
+ this.showPlugins(id);
+ } else {
+ this.selectCategory(id);
+ }
+ },
+
+ drawUserInterface: function(settings) {
+
+ this.inherited(arguments);
+
+ this.addPlugins();
+ this.processHash();
+
+ /* Adjusting width of mainNode - the css class is shared
+ so tailoring it for the preference apps */
+
+ dojo.style(this.mainNode, "maxWidth", "700px");
+ dojo.style(this.mainNode, "minWidth", "500px");
+ },
+
+ manageDefaultData: function(settings) {
+
+ // var example = [ { "subcategory":"Font", [ { "label":"Family", "value":"serif" }, {"label":"Size", "value":"10pt"}, {"label":"Line Height", "value":"12pt"} ] ];
+ for (var count = 0; count < settings.length; count++) {
+
+ var category = settings[count].category;
+
+ if (!localStorage.getItem(category)) {
+
+ var subcategories = [];
+
+ var subcategory = settings[count].subcategory;
+
+ for (var sub = 0; sub < subcategory.length; sub++) {
+
+ var elements = [];
+
+ for (var item = 0; item < subcategory[sub].items.length; item++) {
+
+ var element = {};
+ element.label = subcategory[sub].items[item].label;
+ element.value = subcategory[sub].items[item].setting;
+ elements.push(element);
+ }
+
+ subcategories.push({
+ "label": subcategory[sub].label,
+ "data": elements
+ });
+ }
+
+ localStorage.setItem(category, JSON.stringify(subcategories));
+ }
+ }
+ },
+
+
+ /* initialSettings is the structure of the settings information that we're working with for now.
+ It is a json structure that describes the categories a setting falls in and the widgets
+ that need to be used for choosing the setting values. Each choice also points to a callback
+ function. We'll need to think about this some more - because we can't assume those functions
+ are all present on the page that we've loaded - so we'll need to think of a loading mechanism. */
+
+ /* Need to work on an internationalization scheme - placeholder - 'ui' is the user interface name,
+ it should be replaceable. Perhaps plugins will need to ship with a translation file, which
+ will need to be correlated with a selected language - will refer to dojo possibly. 'label' is
+ the key for the storage field */
+
+ initialSettings: [{
+ "category": "JavaScript Editor",
+ "subcategory": [{
+ "ui": "Font",
+ "label": "Font",
+ "items": [{
+ "ui": "Family",
+ "label": "Family",
+ "input": "combo",
+ "values": [{
+ "label": "Sans Serif"
+ },
+ {
+ "label": "Serif"
+ }],
+ "setting": "Serif"
+ },
+ {
+ "ui": "Size",
+ "label": "Size",
+ "input": "combo",
+ "values": [{
+ "label": "8pt"
+ },
+ {
+ "label": "9pt"
+ },
+ {
+ "label": "10pt"
+ },
+ {
+ "label": "11pt"
+ },
+ {
+ "label": "12pt"
+ }],
+ "setting": "10pt"
+ },
+ {
+ "ui": "Color",
+ "label": "Color",
+ "input": "color",
+ "setting": "#000000"
+ },
+ {
+ "ui": "Background",
+ "label": "Background",
+ "input": "color",
+ "setting": "#FFFFFF"
+ }]
+ },
+
+ {
+ "ui": "Strings",
+ "label": "String Types",
+ "items": [{
+ "ui": "Color",
+ "label": "Color",
+ "input": "color",
+ "setting": "blue"
+ },
+ {
+ "ui": "Weight",
+ "label": "Weight",
+ "input": "combo",
+ "values": [{
+ "label": "Normal"
+ },
+ {
+ "label": "Bold"
+ }],
+ "setting": "Normal"
+ }]
+ },
+
+ {
+ "ui": "Comments",
+ "label": "Comment Types",
+ "items": [{
+ "ui": "Color",
+ "label": "Color",
+ "input": "color",
+ "setting": "green"
+ },
+ {
+ "ui": "Weight",
+ "label": "Weight",
+ "input": "combo",
+ "values": [{
+ "label": "Normal"
+ },
+ {
+ "label": "Bold"
+ }],
+ "setting": "Normal"
+ }]
+ },
+
+ {
+ "ui": "Keywords",
+ "label": "Keyword Types",
+ "items": [{
+ "ui": "Color",
+ "label": "Color",
+ "input": "color",
+ "setting": "darkred"
+ },
+ {
+ "label": "Weight",
+ "input": "combo",
+ "values": [{
+ "label": "Normal"
+ },
+ {
+ "label": "Bold"
+ }],
+ "setting": "Bold"
+ }]
+ }]
+ }]
+
+ });
+});
+
diff --git a/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SplitSelectionLayout.js b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SplitSelectionLayout.js
new file mode 100644
index 0000000..1804852
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.core/web/orion/widgets/settings/SplitSelectionLayout.js
@@ -0,0 +1,114 @@
+/*******************************************************************************
+ * @license
+ * Copyright (c) 2012 IBM Corporation and others.
+ * All rights reserved. This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License v1.0
+ * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
+ * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
+ *
+ * Contributors: Anton McConville - IBM Corporation - initial API and implementation
+ ******************************************************************************/
+/*global dojo dijit widgets orion window console define localStorage*/
+/*jslint browser:true*/
+
+/* This SettingsContainer widget is a dojo border container with a left and right side. The left is for choosing a
+ category, the right shows the resulting HTML for that category. */
+
+define(['require', 'dojo', 'dijit', 'orion/util', 'orion/commands', 'orion/PageUtil', 'dijit/TooltipDialog', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'orion/widgets/plugin/PluginList', 'orion/widgets/settings/InputBuilder'], function(require, dojo, dijit, mUtil, mCommands, PageUtil) {
+
+ dojo.declare("orion.widgets.settings.SplitSelectionLayout", [dijit._Widget, dijit._Templated], {
+
+ widgetsInTemplate: true,
+
+ templateString: '<div style="height:100%;">' +
+ '<div data-dojo-type="dijit.layout.BorderContainer" style="height:100%;" data-dojo-props="design:\'heading\', gutters:false, liveSplitters:false">' +
+ '<div class="auxpane" id="categories" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:\'leading\', splitter:false" style="width: 150px;">' +
+ '<div id="categoryNode">' + '<h1 id="content-title">Categories</h1>' +
+ '<ul class="navbar" data-dojo-attach-point="navbar"></ul>' +
+ '</div>' +
+ '</div>' +
+ '<div data-dojo-type="dijit.layout.ContentPane" class="mainpane" data-dojo-props="region:\'center\'" >' +
+ '<div data-dojo-attach-point="mainNode" class="settings">' +
+ '<div data-dojo-attach-point="table" class="displayTable">' +
+ '</div>' +
+ '</div>' +
+ '</div>',
+
+ itemToIndexMap: null,
+
+ constructor: function() {
+ this.toolbar = dojo.byId( this.pageActions );
+ },
+
+ postCreate: function() {
+ this.itemToIndexMap = {};
+ this.manageDefaultData(this.initialSettings);
+ this.drawUserInterface(this.initialSettings);
+ dojo.subscribe("/dojo/hashchange", this, "processHash");
+ },
+
+ // The knowledge that "pageActions" is the toolbar is something only "page glue" code should know.
+ // We don't like widgets, etc. knowing this detail.
+
+ updateToolbar: function(id) {
+ // right now we only have tools for "plugins" category and the widget is handling those.
+ // So our only job here is to empty the toolbar of any previous contributions.
+ // In the future, we might also want to ask each "category" to render its toolbar commands, and the plugin
+ // category would know that the widget would handle this.
+ if (this.toolbar) {
+ dojo.empty(this.toolbar);
+ }
+ },
+
+ displaySettings: function(id) {
+ var settingsIndex = this.itemToIndexMap[id];
+
+ dojo.empty(this.table);
+
+ var category = this.initialSettings[settingsIndex].category;
+
+ dojo.create("h1", {
+ id: category,
+ innerHTML: category
+ }, this.table);
+
+ // Extend here for adding section pages of your choice
+ },
+
+
+ addCategory: function(item, index) {
+ dojo.create("li", item, this.navbar);
+ this.itemToIndexMap[item.id] = index;
+ },
+
+
+ selectCategory: function(id) {
+
+ if (this.selectedCategory) {
+ dojo.removeClass(this.selectedCategory, "navbar-item-selected");
+ }
+
+ this.selectedCategory = dojo.byId(id);
+ dojo.addClass(this.selectedCategory, "navbar-item-selected");
+ this.updateToolbar(id);
+ this.displaySettings(id);
+ },
+
+
+ drawUserInterface: function(settings) {
+
+ for (var count = 0; count < settings.length; count++) {
+ var itemId = settings[count].category.replace(/\s/g, "").toLowerCase();
+ var item = {
+ innerHTML: settings[count].category,
+ id: itemId,
+ "class": 'navbar-item',
+ onclick: dojo.hitch( this, "selectCategory", itemId )
+ };
+
+ this.addCategory(item, count);
+ }
+ }
+ });
+});
+
diff --git a/bundles/org.eclipse.orion.client.core/web/settings/settings.css b/bundles/org.eclipse.orion.client.core/web/settings/settings.css
index f44a924..cfab759 100644
--- a/bundles/org.eclipse.orion.client.core/web/settings/settings.css
+++ b/bundles/org.eclipse.orion.client.core/web/settings/settings.css
@@ -67,7 +67,7 @@ button {
padding: 0;
}
-#navbar {
+.navbar {
margin: 0;
padding: 0;
}
@@ -83,6 +83,9 @@ button {
text-align: right;
padding-right: 20px;
cursor:pointer;
+ margin: 0;
+ width:100%;
+ list-style: none;
}
ul,menu,dir {
@@ -297,6 +300,9 @@ list,grid {
vertical-align: text-top;
width: 48px;
padding-right: 15px;
+ background-image: url("data:image/png;base64,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");
+ background-repeat: no-repeat;
+ background-position:left;
-webkit-user-select: none;
user-select: none;
}
@@ -380,4 +386,4 @@ list>*,grid>* {
.plugin-service-item {
width: 100%;
margin-left: 63px;
-}
+} \ No newline at end of file
diff --git a/bundles/org.eclipse.orion.client.core/web/settings/settings.html b/bundles/org.eclipse.orion.client.core/web/settings/settings.html
index 1d2fc50..59fd3b5 100644
--- a/bundles/org.eclipse.orion.client.core/web/settings/settings.html
+++ b/bundles/org.eclipse.orion.client.core/web/settings/settings.html
@@ -3,48 +3,26 @@
<head>
<meta charset="UTF-8">
<title>Settings</title>
-
- <link rel="stylesheet" type="text/css" href="settings.css" />
-
- <style>
-
- </style>
-
-
- <script type="text/javascript" src="../requirejs/require.js"></script>
+ <link rel="stylesheet" type="text/css" href="settings.css"/>
+ <script src="../requirejs/require.js"></script>
<script type="text/javascript">
-
- require({ baseUrl: '..',
- packages: [{ name: 'dojo', location: 'org.dojotoolkit/dojo', main: 'lib/main-browser', lib: '.' },
- { name: 'dijit', location: 'org.dojotoolkit/dijit', main: 'lib/main',lib: '.' },
- { name: 'dojox', location: 'org.dojotoolkit/dojox', main: 'lib/main', lib: '.' } ],
- paths: { text: 'requirejs/text', i18n: 'requirejs/i18n' }
- });
- require(["./settings"]);
+ /*global require*/
+ require({ baseUrl: '..',
+ packages: [{ name: 'dojo', location: 'org.dojotoolkit/dojo', main: 'lib/main-browser', lib: '.' },
+ { name: 'dijit', location: 'org.dojotoolkit/dijit', main: 'lib/main',lib: '.' },
+ { name: 'dojox', location: 'org.dojotoolkit/dojox', main: 'lib/main', lib: '.' } ],
+ paths: { text: 'requirejs/text', i18n: 'requirejs/i18n' }
+ });
+ require(["./settings"]);
</script>
- <body style="visibility:hidden" class="nihilo">
- <div id="orion.settings" class="orionPage" dojoType="dijit.layout.BorderContainer" design="headline" gutters="false">
- <div class="banner" id="banner" dojoType="dijit.layout.ContentPane" region="top">
- </div>
- <div id="centerPane" dojoType="dijit.layout.BorderContainer" region="center" gutters="false" design="headline" liveSplitters="false" splitter="false">
- <div class="toolbar" id="pageToolbar" dojoType="dijit.layout.ContentPane" splitter="false" region="top">
- </div>
- <div class="auxpane" id="categories" dojoType="dijit.layout.ContentPane" splitter="false" region="leading" style="width: 150px">
- <div id="categoryNode">
- <h1 id="content-title">Categories</h1>
- <ul id="navbar">
- </ul>
- </div>
- </div>
- <div dojoType="dijit.layout.ContentPane" class="mainpane" region="center" >
- <div id="mainNode" class="settings">
- <div id="table" class="displayTable">
- </div>
- </div>
- </div>
- </div>
- <div class="footer" id="footer" dojoType="dijit.layout.ContentPane" region="bottom" splitter="false">
+ </head>
+ <body style="visibility:hidden;" class="nihilo">
+ <div id="orion.settings" class="orionPage" dojotype="dijit.layout.BorderContainer" design="headline" gutters="false">
+ <div class="banner" id="banner" dojotype="dijit.layout.ContentPane" region="top"></div>
+ <div id="centerPane" dojotype="dijit.layout.ContentPane" region="center">
+ <div id="selectionAgent"></div>
</div>
+ <div class="footer" id="footer" dojotype="dijit.layout.ContentPane" region="bottom" splitter="false"></div>
</div>
</body>
-</html> \ No newline at end of file
+</html>
diff --git a/bundles/org.eclipse.orion.client.core/web/settings/settings.js b/bundles/org.eclipse.orion.client.core/web/settings/settings.js
index adbce7f..a93cc95 100644
--- a/bundles/org.eclipse.orion.client.core/web/settings/settings.js
+++ b/bundles/org.eclipse.orion.client.core/web/settings/settings.js
@@ -9,402 +9,53 @@
* Contributors:
* Anton McConville (IBM Corporation) - initial API and implementation
*
- *******************************************************************************/
+ *******************************************************************************/
/*global define dojo dijit orion window widgets localStorage*/
/*jslint browser:true devel:true*/
-define(['require', 'dojo', 'orion/bootstrap', 'orion/status', 'orion/commands', 'orion/operationsClient', 'orion/fileClient', 'orion/PageUtil',
- 'orion/searchClient', 'orion/dialogs', 'orion/globalCommands', 'orion/siteService', 'orion/siteUtils', 'orion/siteTree', 'orion/treetable',
- 'dojo/parser', 'dojo/hash', 'dojo/date/locale', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'orion/widgets/ServiceCarousel', 'orion/widgets/PluginList', 'dijit/form/Button', 'dijit/ColorPalette' ],
- function(require, dojo, mBootstrap, mStatus, mCommands, mOperationsClient, mFileClient, PageUtil, mSearchClient, mDialogs, mGlobalCommands, mSiteService, mSiteUtils, mSiteTree, mTreeTable) {
+define(['require', 'dojo', 'orion/bootstrap', 'orion/status', 'orion/commands', 'orion/operationsClient', 'orion/fileClient', 'orion/searchClient', 'orion/dialogs', 'orion/globalCommands', 'orion/siteService', 'orion/siteUtils', 'orion/siteTree', 'orion/treetable', 'dojo/parser', 'dojo/hash', 'dojo/date/locale', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'orion/widgets/settings/SettingsContainer', 'dijit/form/Button', 'dijit/ColorPalette'], function(require, dojo, mBootstrap, mStatus, mCommands, mOperationsClient, mFileClient, mSearchClient, mDialogs, mGlobalCommands, mSiteService, mSiteUtils, mSiteTree, mTreeTable) {
- var preferencesStatusService;
- var preferencesCorePreferences;
- var preferenceDialogService;
- var settingsCore;
- var selectedCategory;
- var itemToIndexMap = {};
-
- var commandService;
- var pluginWidget = null;
-
- /* initialSettings is the structure of the settings information that we're working with for now.
- It is a json structure that describes the categories a setting falls in and the widgets
- that need to be used for choosing the setting values. Each choice also points to a callback
- function. We'll need to think about this some more - because we can't assume those functions
- are all present on the page that we've loaded - so we'll need to think of a loading mechanism. */
-
- /* Need to work on an internationalization scheme - placeholder - 'ui' is the user interface name,
- it should be replaceable. Perhaps plugins will need to ship with a translation file, which
- will need to be correlated with a selected language - will refer to dojo possibly. 'label' is
- the key for the storage field */
-
- var initialSettings = [{ "category":"JavaScript Editor",
- "subcategory": [{ "ui":"Font", "label":"Font", "items":[ { "ui":"Family", "label":"Family", "input":"combo", "values":[ { "label":"Sans Serif" }, { "label":"Serif" } ], "setting":"Serif" },
- { "ui":"Size", "label":"Size", "input":"combo", "values":[ { "label": "8pt" },{ "label":"9pt" }, { "label":"10pt" },{ "label":"11pt" }, { "label":"12pt" } ], "setting":"10pt" },
- { "ui":"Color", "label":"Color", "input":"color", "setting":"#000000" },
- { "ui":"Background", "label":"Background", "input":"color", "setting":"#FFFFFF" } ] },
-
- { "ui":"Strings", "label":"String Types", "items":[ { "ui":"Color", "label":"Color", "input":"color", "setting":"blue" },
- { "ui":"Weight", "label":"Weight", "input":"combo", "values":[ { "label": "Normal" }, { "label":"Bold" } ], "setting":"Normal" } ] },
-
- { "ui":"Comments", "label":"Comment Types", "items":[{ "ui":"Color", "label":"Color", "input":"color", "setting":"green" },
- { "ui":"Weight", "label":"Weight", "input":"combo", "values":[ { "label": "Normal" }, { "label":"Bold" } ], "setting":"Normal" } ] },
-
- { "ui":"Keywords", "label":"Keyword Types", "items":[{ "ui":"Color", "label":"Color", "input":"color", "setting":"darkred" },
- { "label":"Weight", "input":"combo", "values":[ { "label": "Normal" }, { "label":"Bold" } ], "setting":"Bold" } ] } ] }
- ];
-
- function setStorageItem( category, subCategory, element, value, ui ){
-
- var subcategories = JSON.parse( localStorage.getItem( category ) );
-
- for( var sub = 0; sub < subcategories.length; sub++ ){
- if( subcategories[sub].label === subCategory ){
- for( var item = 0; item < subcategories[sub].data.length; item++ ){
- if( subcategories[sub].data[item].label === element ){
- subcategories[sub].data[item].value = value;
- subcategories[sub].data[item].ui = ui;
- localStorage.setItem( category, JSON.stringify( subcategories ) );
- break;
- }
- }
- }
- }
- }
-
- function getStorageItem( category, subCategory, element ){
-
- var subcategories = JSON.parse( localStorage.getItem( category ) );
-
- var value;
-
- for( var sub = 0; sub < subcategories.length; sub++ ){
- if( subcategories[sub].label === subCategory ){
- for( var item = 0; item < subcategories[sub].data.length; item++ ){
- if( subcategories[sub].data[item].label === element ){
- value = subcategories[sub].data[item].value;
- break;
- }
- }
- }
- }
-
- return value;
- }
-
-
- function comboSelection( event ){
-
- /* These parameters were 'injected' into the
- combo box domNode on creation of the combo box */
-
- var category = event.currentTarget.category;
- var subCategory = event.currentTarget.item;
- var element = event.currentTarget.element;
- var value = event.currentTarget.value;
- var ui = event.currentTarget.ui;
-
- setStorageItem( category, subCategory, element, value, ui );
- }
-
- function colorSelection( color ){
-
- var category = this.category;
- var subCategory = this.item;
- var element = this.element;
- var ui = this.ui;
-
- setStorageItem( category, subCategory, element, color, ui );
-
- this.colornode.set('label', "" );
-
- dojo.style( this.colornode.domNode.firstChild, "background", color );
- }
-
- function processInputType( category, label, item, node, ui ){
-
- var subcategories = JSON.parse( localStorage.getItem( category ) );
-
- var setting = getStorageItem( category, label, item.label );
-
- switch( item.input ){
-
- case "combo":
-
- var select = dojo.create( "select", { onchange: comboSelection }, node );
-
- select.category = category;
- select.item = label;
- select.element = item.label;
-
- for( var count = 0; count < item.values.length; count++ ){
-
- var comboLabel = item.values[count].label;
-
- var set = { value: comboLabel, innerHTML: comboLabel };
-
- if( comboLabel === setting ){
- set.selected = 'selected';
- }
-
- dojo.create( "option", set, select );
- }
-
- break;
-
- case "color":
-
- var c = new dijit.ColorPalette( { onChange: colorSelection } );
-
- c.category = category;
- c.item = label;
- c.element = item.label;
-
- c.identifier = item.label;
-
- var picker = dojo.create( "div", null, node );
-
- var button = new dijit.form.DropDownButton({
- label: " ",
- name: item.label,
- dropDown: c
- }, picker );
-
- dojo.style( button.domNode.firstChild, "border", "1px solid #AAA" );
- dojo.style( button.domNode.firstChild, "padding", "2px" );
- dojo.style( button.domNode.firstChild, "padding-right", "3px" );
- dojo.style( button.domNode.firstChild, "background", setting );
- dojo.style( button.domNode.firstChild, "height", "12px" );
- dojo.style( button.domNode.firstChild, "width", "12px" );
-
- c.colornode = button;
-
- var elements = dojo.query( '.dijitArrowButtonInner', button.domNode );
- dojo.removeClass( elements[0], 'dijitArrowButtonInner' );
-
- break;
- }
- }
-
- // The knowledge that "pageActions" is the toolbar is something only "page glue" code should know.
- // We don't like widgets, etc. knowing this detail.
- function updateToolbar(id) {
- // right now we only have tools for "plugins" category and the widget is handling those.
- // So our only job here is to empty the toolbar of any previous contributions.
- // In the future, we might also want to ask each "category" to render its toolbar commands, and the plugin
- // category would know that the widget would handle this.
- if (dojo.byId("pageActions")) {
- dojo.empty("pageActions");
- }
- }
-
-
- function displaySettings( id ){
- var settingsIndex = itemToIndexMap[id];
-
- var tableNode = dojo.byId( 'table' );
-
- dojo.empty( tableNode );
-
- var category = initialSettings[settingsIndex].category;
-
- dojo.create( "h1", { id: category, innerHTML: category }, tableNode );
-
- var subcategory = initialSettings[settingsIndex].subcategory;
-
- for( var sub = 0; sub < subcategory.length; sub++ ){
-
- var section = dojo.create( "section", { id: subcategory[sub].label }, tableNode );
-
- dojo.create( "h3", { innerHTML: subcategory[sub].ui }, section );
-
- var outer = dojo.create( "div", null, section );
-
- for( var item = 0; item < subcategory[sub].items.length; item++ ){
-
- var inner = dojo.create( "div", null, outer );
- var label = dojo.create( "label", null, inner );
- dojo.create( "span", { innerHTML: subcategory[sub].items[item].label + ":" }, label );
- processInputType( category, subcategory[sub].label, subcategory[sub].items[item], label, subcategory[sub].ui );
- }
- }
-
-
- }
-
- function addCategory( item, index ){
- var navbar = dojo.byId( 'navbar' );
- dojo.create("li", item, navbar );
- itemToIndexMap[item.id] = index;
- }
-
-
-
- /* showPlugins - iterates over the plugin array, reads
- meta-data and creates a dom entry for each plugin.
-
- This HTML structure is a special case - the other
- settings cases should follow more of the JSEditor
- pattern. */
-
- function showPlugins( id ){
-
- if( selectedCategory ){
- dojo.removeClass( selectedCategory, "navbar-item-selected" );
- }
-
- if( id ){
- selectedCategory = dojo.byId(id);
- }
-
- dojo.addClass( selectedCategory, "navbar-item-selected" );
-
- var tableNode = dojo.byId( 'table' );
-
- dojo.empty( tableNode );
-
- if( pluginWidget ){
- pluginWidget.destroyRecursive(true);
- }
-
- updateToolbar(id);
-
- pluginWidget = new orion.widgets.PluginList( { settings: settingsCore, statusService: preferencesStatusService, dialogService:preferenceDialogService, commandService: commandService, toolbarID: "pageActions" }, tableNode );
- }
-
- function addPlugins(){
-
- var item = { id: "plugins",
- innerHTML: "Plugins",
- "class": 'navbar-item'
- };
-
- addCategory( item, initialSettings.length );
- dojo.connect(dojo.byId(item.id), 'onclick', dojo.hitch(null, showPlugins, item.id));
- }
-
- function selectCategory( id ){
-
- if( selectedCategory ){
- dojo.removeClass( selectedCategory, "navbar-item-selected" );
- }
-
- selectedCategory = dojo.byId(id);
- dojo.addClass( selectedCategory, "navbar-item-selected" );
- updateToolbar(id);
- displaySettings(id);
- }
-
- function showById(id) {
- updateToolbar(id);
- if (id === "plugins") {
- showPlugins(id);
- } else {
- selectCategory(id);
- }
- }
-
- function processHash() {
-
- var pageParams = PageUtil.matchResourceParameters();
- var category = pageParams.category || "plugins";
- showById(category);
- commandService.processURL(window.location.href);
- }
-
- function drawUserInterface( settings ) {
-
- for( var count = 0; count < settings.length; count++ ){
- var itemId = settings[count].category.replace(/\s/g, "").toLowerCase();
- var item = { innerHTML: settings[count].category,
- id: itemId,
- "class": 'navbar-item'};
-
- addCategory( item, count );
- dojo.connect(dojo.byId(itemId), 'onclick', dojo.hitch(null, selectCategory, itemId));
- }
-
- addPlugins();
- processHash();
-
- /* Adjusting width of mainNode - the css class is shared
- so tailoring it for the preference apps */
-
- var mainNode = dojo.byId( "mainNode" );
- dojo.style( mainNode, "maxWidth", "700px" );
- dojo.style( mainNode, "minWidth", "500px" );
- }
-
-
- function manageDefaultData( preferences, settings ){
-
- // var example = [ { "subcategory":"Font", [ { "label":"Family", "value":"serif" }, {"label":"Size", "value":"10pt"}, {"label":"Line Height", "value":"12pt"} ] ];
-
- for( var count = 0; count < settings.length; count++ ){
-
- var category = settings[count].category;
-
- if( !localStorage.getItem( category ) ){
-
- var subcategories = [];
-
- var subcategory = settings[count].subcategory;
-
- for( var sub = 0; sub < subcategory.length; sub++ ){
-
- var elements = [];
-
- for( var item = 0; item < subcategory[sub].items.length; item++ ){
-
- var element = {};
- element.label = subcategory[sub].items[item].label;
- element.value = subcategory[sub].items[item].setting;
- elements.push( element );
- }
-
- subcategories.push( { "label":subcategory[sub].label, "data":elements } );
- }
-
- localStorage.setItem( category, JSON.stringify( subcategories ) );
- }
- }
- }
-
dojo.addOnLoad(function() {
mBootstrap.startup().then(function(core) {
-
- settingsCore = core;
-
+
var serviceRegistry = core.serviceRegistry;
var preferences = core.preferences;
-
- preferencesCorePreferences = core.preferences;
document.body.style.visibility = "visible";
dojo.parser.parse();
- preferenceDialogService = new mDialogs.DialogService(serviceRegistry);
-
// Register services
- var dialogService = new mDialogs.DialogService(serviceRegistry);
var operationsClient = new mOperationsClient.OperationsClient(serviceRegistry);
- preferencesStatusService = new mStatus.StatusReportingService(serviceRegistry, operationsClient, "statusPane", "notifications", "notificationArea");
- commandService = new mCommands.CommandService({serviceRegistry: serviceRegistry});
-
- var siteService = new mSiteService.SiteService(serviceRegistry);
+ var preferencesStatusService = new mStatus.StatusReportingService(serviceRegistry, operationsClient, "statusPane", "notifications", "notificationArea");
+ var commandService = new mCommands.CommandService({
+ serviceRegistry: serviceRegistry
+ });
+
var fileClient = new mFileClient.FileClient(serviceRegistry);
- var searcher = new mSearchClient.Searcher({serviceRegistry: serviceRegistry, commandService: commandService, fileService: fileClient});
-
+ var searcher = new mSearchClient.Searcher({
+ serviceRegistry: serviceRegistry,
+ commandService: commandService,
+ fileService: fileClient
+ });
+
+ var preferenceDialogService = new mDialogs.DialogService(serviceRegistry);
mGlobalCommands.generateBanner("banner", serviceRegistry, commandService, preferences, searcher);
- preferencesStatusService.setMessage("Loading...");
- manageDefaultData( preferences, initialSettings );
- drawUserInterface( initialSettings );
- dojo.subscribe("/dojo/hashchange", this, function() {
- processHash();
- });
+ preferencesStatusService.setMessage("Loading...");
+
+ /* Note 'pageActions' is the attach id for commands in the toolbar */
+
+ var containerParameters = { preferences: preferences,
+ preferencesStatusService: preferencesStatusService,
+ commandService: commandService,
+ preferenceDialogService: preferenceDialogService,
+ settingsCore: core,
+ pageActions: "pageActions" };
+
+ var settingsContainer = new orion.widgets.settings.SettingsContainer( containerParameters, dojo.byId( "selectionAgent" ) );
+ settingsContainer.startup();
+
preferencesStatusService.setMessage("");
});
});
-});
+}); \ No newline at end of file