From 69f0dbbe2ebbbc8d7fa89afe1a7078d0fe206be9 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 14 Feb 2012 15:53:08 -0800 Subject: Adding all the components to the panel Signed-off-by: Valerio Virgillito --- .../ComponentsPanelBase.js | 90 +++++++++++++++++++++- node_modules/components-data/anchor.json | 21 +++++ node_modules/components-data/checkbox.json | 21 +++++ node_modules/components-data/image.json | 21 +++++ node_modules/components-data/number-input.json | 21 +++++ node_modules/components-data/radio-button.json | 21 +++++ node_modules/components-data/range-input.json | 21 +++++ node_modules/components-data/select.json | 21 +++++ node_modules/components-data/textarea.json | 21 +++++ node_modules/components-data/toggle-button.json | 21 +++++ .../montage-application-cloud/main.reel/main.js | 1 + 11 files changed, 278 insertions(+), 2 deletions(-) create mode 100644 node_modules/components-data/anchor.json create mode 100644 node_modules/components-data/checkbox.json create mode 100644 node_modules/components-data/image.json create mode 100644 node_modules/components-data/number-input.json create mode 100644 node_modules/components-data/radio-button.json create mode 100644 node_modules/components-data/range-input.json create mode 100644 node_modules/components-data/select.json create mode 100644 node_modules/components-data/textarea.json create mode 100644 node_modules/components-data/toggle-button.json diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 7e5a76ee..bb6b049a 100644 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -25,15 +25,60 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component { "text": "Montage Components", "children": [ + { + "text": "Anchor", + "dataFile" : "node_modules/components-data/anchor.json", + "component": "anchor" + }, { "text": "Button", "dataFile" : "node_modules/components-data/button.json", "component": "button" }, + { + "text": "Checkbox", + "dataFile" : "node_modules/components-data/checkbox.json", + "component": "checkbox" + }, + { + "text": "Image Component", + "dataFile" : "node_modules/components-data/image.json", + "component": "imageComponent" + }, + { + "text": "NumberInput", + "dataFile" : "node_modules/components-data/number-input.json", + "component": "numberInput" + }, + { + "text": "Select Input", + "dataFile" : "node_modules/components-data/select.json", + "component": "select" + }, + { + "text": "Radio Button", + "dataFile" : "node_modules/components-data/radio-button.json", + "component": "radioButton" + }, + { + "text": "Range Input", + "dataFile" : "node_modules/components-data/range-input.json", + "component": "rangeInput" + }, + { + "text": "TextArea", + "dataFile" : "node_modules/components-data/textarea.json", + "component": "textarea" + }, { "text": "Textfield", "dataFile" : "node_modules/components-data/textfield.json", "component": "textfield" + }, + { + "text": "Toogle Button", + "dataFile" : "node_modules/components-data/toggle-button.json", + "component": "toggleButton" } ] } @@ -211,6 +256,7 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component NJevent("elementAdding", {"el": element, "data":styles}); }); + } }, @@ -219,18 +265,58 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component var el; switch(name) { + case "anchor": + el = NJUtils.makeNJElement("a", "Anchor", "component"); + el.elementModel.pi = "AnchorPi"; + break; case "button": el = NJUtils.makeNJElement(name, "Button", "component"); el.elementModel.pi = "ButtonPi"; el.setAttribute("type", "button"); el.innerHTML = "Button"; break; - case "textfield": { + case "checkbox": + el = NJUtils.makeNJElement("input", "Checkbox", "component"); + el.elementModel.pi = "CheckboxPi"; + el.setAttribute("type", "checkbox"); + break; + case "imageComponent": + el = NJUtils.makeNJElement("image", "Image", "component"); + el.elementModel.pi = "ImageComponentPi"; + break; + case "numberInput": + el = NJUtils.makeNJElement("input", "Number Input", "component"); + el.elementModel.pi = "NumberInputPi"; + el.setAttribute("type", "number"); + break; + case "select": + el = NJUtils.makeNJElement("select", "Select", "component"); + el.elementModel.pi = "SelectPi"; + break; + case "radioButton": + el = NJUtils.makeNJElement("input", "Radio Button", "component"); + el.elementModel.pi = "RadioButtonPi"; + el.setAttribute("type", "radio"); + break; + case "rangeInput": + el = NJUtils.makeNJElement("input", "Range Input", "component"); + el.elementModel.pi = "RangeInputPi"; + el.setAttribute("type", "range"); + break; + case "textfield": el = NJUtils.makeNJElement("input", "Textfield", "component"); el.elementModel.pi = "TextfieldPi"; el.setAttribute("type", "text"); break; - } + case "textarea": + el = NJUtils.makeNJElement("textarea", "TextArea", "component"); + el.elementModel.pi = "TextArea"; + break; + case "toggleButton": + el = NJUtils.makeNJElement("button", "Toggle Button", "component"); + el.elementModel.pi = "ToggleButtonPi"; + el.innerHTML = "Off"; + break; } return el; diff --git a/node_modules/components-data/anchor.json b/node_modules/components-data/anchor.json new file mode 100644 index 00000000..b0284c7e --- /dev/null +++ b/node_modules/components-data/anchor.json @@ -0,0 +1,21 @@ +{ + "component": "anchor", + + "module": "montage/ui/anchor.reel", + + "name": "Anchor", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/checkbox.json b/node_modules/components-data/checkbox.json new file mode 100644 index 00000000..8991d210 --- /dev/null +++ b/node_modules/components-data/checkbox.json @@ -0,0 +1,21 @@ +{ + "component": "checkbox", + + "module": "montage/ui/checkbox.reel", + + "name": "Checkbox", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/image.json b/node_modules/components-data/image.json new file mode 100644 index 00000000..4a90ec5b --- /dev/null +++ b/node_modules/components-data/image.json @@ -0,0 +1,21 @@ +{ + "component": "imageComponent", + + "module": "montage/ui/image.reel", + + "name": "Image", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/number-input.json b/node_modules/components-data/number-input.json new file mode 100644 index 00000000..1898ec4f --- /dev/null +++ b/node_modules/components-data/number-input.json @@ -0,0 +1,21 @@ +{ + "component": "numberInput", + + "module": "montage/ui/number-input.reel", + + "name": "NumberInput", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/radio-button.json b/node_modules/components-data/radio-button.json new file mode 100644 index 00000000..e76cc6b4 --- /dev/null +++ b/node_modules/components-data/radio-button.json @@ -0,0 +1,21 @@ +{ + "component": "radioButton", + + "module": "montage/ui/radio-button.reel", + + "name": "RadioButton", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/range-input.json b/node_modules/components-data/range-input.json new file mode 100644 index 00000000..44950890 --- /dev/null +++ b/node_modules/components-data/range-input.json @@ -0,0 +1,21 @@ +{ + "component": "rangeInput", + + "module": "montage/ui/range-input.reel", + + "name": "RangeInput", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/select.json b/node_modules/components-data/select.json new file mode 100644 index 00000000..b823f8d6 --- /dev/null +++ b/node_modules/components-data/select.json @@ -0,0 +1,21 @@ +{ + "component": "select", + + "module": "montage/ui/select-input.reel", + + "name": "SelectInput", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/textarea.json b/node_modules/components-data/textarea.json new file mode 100644 index 00000000..608011e1 --- /dev/null +++ b/node_modules/components-data/textarea.json @@ -0,0 +1,21 @@ +{ + "component": "textarea", + + "module": "montage/ui/textarea.reel", + + "name": "TextArea", + + "properties": [ + + { + "name": "value", + "type": "string", + "default": "Button" + }, + { + "name": "disabled", + "type": "boolean", + "default": "false" + } + ] +} \ No newline at end of file diff --git a/node_modules/components-data/toggle-button.json b/node_modules/components-data/toggle-button.json new file mode 100644 index 00000000..88b6eff0 --- /dev/null +++ b/node_modules/components-data/toggle-button.json @@ -0,0 +1,21 @@ +{ + "component": "toggleButton", + + "module": "montage/ui/toggle-button.reel", + + "name": "ToggleButton", + + "properties": [ + + { + "name": "label", + "type": "string", + "default": "Button" + }, + { + "name": "enabled", + "type": "boolean", + "default": "true" + } + ] +} \ No newline at end of file diff --git a/user-document-templates/montage-application-cloud/main.reel/main.js b/user-document-templates/montage-application-cloud/main.reel/main.js index 86871fd3..0c61b1af 100644 --- a/user-document-templates/montage-application-cloud/main.reel/main.js +++ b/user-document-templates/montage-application-cloud/main.reel/main.js @@ -31,6 +31,7 @@ exports.Main = Montage.create(Component, { } }, + // Adding components to the user document by using a async require. addComponentToUserDocument:{ value:function(element, data, callback){ -- cgit v1.2.3