[PATCH V2] UI: Sample of menu/button/radio/checkbox/seletmenu/textbox
V1 -> V2: Add lincense. Signed-off-by: Wen Wang <wenwang@linux.vnet.ibm.com> --- ...u-button-radio-checkbox-text-select-sample.html | 101 +++++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html diff --git a/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html b/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html new file mode 100644 index 0000000..2b97073 --- /dev/null +++ b/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html @@ -0,0 +1,101 @@ +<!-- +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2014 + * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +--> +<!DOCTYPE html> +<html> + <head> + <meta charset="UTF-8"> + <title>Demo</title> + <script src="../../../libs/jquery-1.10.0.min.js"></script> + <script src="../../../libs/jquery-ui.min.js"></script> + <script src="../menu-flat.js"></script> + <script src="../button-flat.js"></script> + <script src="../radio-flat.js"></script> + <script src="../checkbox-flat.js"></script> + <script src="../textbox-flat.js"></script> + <script src="../selectmenu-flat.js"></script> + <link rel="stylesheet" href="../../../libs/themes/base/jquery-ui.min.css"> + <link rel="stylesheet" href="../../../css/theme-default/menu-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/button-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/radio-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/checkbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/textbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/selectmenu-flat.css"> + <link rel="stylesheet" href="../../../css/fontello/css/animation.css"> + <link rel="stylesheet" href="../../../css/fontello/css/fontello.css"> + </head> + <body> + <div id="menu"></div> + <div style="height:50px"><div id="select"></div></div> + <div class="radio-demo"></div> + <div class="checkbox-demo"></div> + <input class="text-demo"> + <button class="button-demo">submit</button> + <script> + $(document).ready(function() { + $("#menu").menuFlat({ + content: [1,2,3,4,5,6], //Set content of the menu. + icon: "icon-edit-alt", //Set icon of the menu button. + listIconList: ["icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-user"] + //Set icons of the menu list. + // name is optional which set the name of the menu list. + }); + $("#menu0").on("click", function() { + alert("hello"); + }); + $("#menu1").on("click", function() { + console.log("hello"); + }); + $("#select").selectmenuFlat({ + content: [1,2,3,4,5,6], //Set content of the select menu + selected: 2 // set the selected option, starts from "1" + }); + $("#select").selectmenuFlat("value", "4"); //Set value. + var t = $("#select").selectmenuFlat("value"); //Get value + console.log(t); + $(".radio-demo").radioFlat({ + id: "t", //Base id of the radio set. + name: "test", //name of the radio. + whichChecked: 2, //First selected position, starts from 1. + content: ["apple", "banana", "orange", "cherry"] //set the content array. + }); + $(".radio-demo").click(function() { + console.log($(".radio-demo").radioFlat("value")); //this is how to get the value of selected radio value + }); + $(".checkbox-demo").checkboxFlat({ + id: "t", //Checkbox base id. + name: "test", //Checkbox name. + content: ["apple", "banana", "orange", "cherry"], //Contents of the checkbox set. + checked: [1,3] //Set the checked item, which starts with number 1. + }); + $(".checkbox-demo").click(function() { + console.log($(".selector").checkboxFlat("value")); //Get value of the checked checkbox. + }); + $(".text-demo").textboxFlat({ + hint: "hint" + }); + $(".text-demo").css({ + "height": "30px", + "width": "200px" + }); + $(".button-demo").buttonFlat(); + }); + </script> + </body> +</html> \ No newline at end of file -- 2.1.0
Few comments bellow... On Wed Feb 04 2015 at 3:55:50 PM Wen Wang <wenwang@linux.vnet.ibm.com> wrote:
V1 -> V2: Add lincense.
Signed-off-by: Wen Wang <wenwang@linux.vnet.ibm.com> --- ...u-button-radio-checkbox-text-select-sample.html | 101 +++++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 ui/js/widgets/samples/menu-button-radio-checkbox-text- select-sample.html
diff --git a/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html b/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html new file mode 100644 index 0000000..2b97073 --- /dev/null +++ b/ui/js/widgets/samples/menu-button-radio-checkbox-text- select-sample.html @@ -0,0 +1,101 @@ +<!-- +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2014
s/2014/2015
+ * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +--> +<!DOCTYPE html> +<html> + <head> + <meta charset="UTF-8"> + <title>Demo</title> + <script src="../../../libs/jquery-1.10.0.min.js"></script> + <script src="../../../libs/jquery-ui.min.js"></script> + <script src="../menu-flat.js"></script> + <script src="../button-flat.js"></script> + <script src="../radio-flat.js"></script> + <script src="../checkbox-flat.js"></script> + <script src="../textbox-flat.js"></script> + <script src="../selectmenu-flat.js"></script> + <link rel="stylesheet" href="../../../libs/themes/ base/jquery-ui.min.css"> + <link rel="stylesheet" href="../../../css/theme- default/menu-flat.css"> + <link rel="stylesheet" href="../../../css/theme- default/button-flat.css"> + <link rel="stylesheet" href="../../../css/theme- default/radio-flat.css"> + <link rel="stylesheet" href="../../../css/theme- default/checkbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme- default/textbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme- default/selectmenu-flat.css"> + <link rel="stylesheet" href="../../../css/fontello/ css/animation.css"> + <link rel="stylesheet" href="../../../css/fontello/ css/fontello.css"> + </head> + <body> + <div id="menu"></div> + <div style="height:50px"><div id="select"></div></div> + <div class="radio-demo"></div> + <div class="checkbox-demo"></div> + <input class="text-demo"> + <button class="button-demo">submit</button> + <script> + $(document).ready(function() { + $("#menu").menuFlat({ + content: [1,2,3,4,5,6], //Set content of the menu. + icon: "icon-edit-alt", //Set icon of the menu button. + listIconList: ["icon-edit-alt","icon-edit- alt","icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-user"] + //Set icons of the menu list. + // name is optional which set the name of the menu list.
Indentation of the comments look like wrong for me.
+ }); + $("#menu0").on("click", function() { + alert("hello"); + }); + $("#menu1").on("click", function() { + console.log("hello"); + }); + $("#select").selectmenuFlat({ + content: [1,2,3,4,5,6], //Set content of the select menu + selected: 2 // set the selected option, starts from "1" + }); + $("#select").selectmenuFlat("value", "4"); //Set value. + var t = $("#select").selectmenuFlat("value"); //Get value + console.log(t); + $(".radio-demo").radioFlat({ + id: "t", //Base id of the radio set. + name: "test", //name of the radio. + whichChecked: 2, //First selected position, starts from 1. + content: ["apple", "banana", "orange", "cherry"] //set the content array. + }); + $(".radio-demo").click(function() { + console.log($(".radio-demo").radioFlat("value")); //this is how to get the value of selected radio value + }); + $(".checkbox-demo").checkboxFlat({ + id: "t", //Checkbox base id. + name: "test", //Checkbox name. + content: ["apple", "banana", "orange", "cherry"], //Contents of the checkbox set. + checked: [1,3] //Set the checked item, which starts with number 1. + }); + $(".checkbox-demo").click(function() { + console.log($(".selector").checkboxFlat("value")); //Get value of the checked checkbox. + }); + $(".text-demo").textboxFlat({ + hint: "hint" + }); + $(".text-demo").css({ + "height": "30px", + "width": "200px" + }); + $(".button-demo").buttonFlat(); + }); + </script> + </body> +</html> \ No newline at end of file -- 2.1.0
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
Thanks for the tips Paulo, I will have the time changed. I am not sure what's wrong with the the indentation of the comments. I will resend a version and hopefully it worked well On 2/4/2015 11:03 PM, Paulo Ricardo Paz Vital wrote:
Few comments bellow...
On Wed Feb 04 2015 at 3:55:50 PM Wen Wang <wenwang@linux.vnet.ibm.com <mailto:wenwang@linux.vnet.ibm.com>> wrote:
V1 -> V2: Add lincense.
Signed-off-by: Wen Wang <wenwang@linux.vnet.ibm.com <mailto:wenwang@linux.vnet.ibm.com>> --- ...u-button-radio-checkbox-text-select-sample.html | 101 +++++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html
diff --git a/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html b/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html new file mode 100644 index 0000000..2b97073 --- /dev/null +++ b/ui/js/widgets/samples/menu-button-radio-checkbox-text-select-sample.html @@ -0,0 +1,101 @@ +<!-- +/* + * Project Kimchi + * + * Copyright IBM, Corp. 2014
s/2014/2015
+ * + * Licensed under the Apache License, Version 2.0 (the 'License'); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an 'AS IS' BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +--> +<!DOCTYPE html> +<html> + <head> + <meta charset="UTF-8"> + <title>Demo</title> + <script src="../../../libs/jquery-1.10.0.min.js"></script> + <script src="../../../libs/jquery-ui.min.js"></script> + <script src="../menu-flat.js"></script> + <script src="../button-flat.js"></script> + <script src="../radio-flat.js"></script> + <script src="../checkbox-flat.js"></script> + <script src="../textbox-flat.js"></script> + <script src="../selectmenu-flat.js"></script> + <link rel="stylesheet" href="../../../libs/themes/base/jquery-ui.min.css"> + <link rel="stylesheet" href="../../../css/theme-default/menu-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/button-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/radio-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/checkbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/textbox-flat.css"> + <link rel="stylesheet" href="../../../css/theme-default/selectmenu-flat.css"> + <link rel="stylesheet" href="../../../css/fontello/css/animation.css"> + <link rel="stylesheet" href="../../../css/fontello/css/fontello.css"> + </head> + <body> + <div id="menu"></div> + <div style="height:50px"><div id="select"></div></div> + <div class="radio-demo"></div> + <div class="checkbox-demo"></div> + <input class="text-demo"> + <button class="button-demo">submit</button> + <script> + $(document).ready(function() { + $("#menu").menuFlat({ + content: [1,2,3,4,5,6], //Set content of the menu. + icon: "icon-edit-alt", //Set icon of the menu button. + listIconList: ["icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-edit-alt","icon-user"] + //Set icons of the menu list. + // name is optional which set the name of the menu list.
Indentation of the comments look like wrong for me.
+ }); + $("#menu0").on("click", function() { + alert("hello"); + }); + $("#menu1").on("click", function() { + console.log("hello"); + }); + $("#select").selectmenuFlat({ + content: [1,2,3,4,5,6], //Set content of the select menu + selected: 2 // set the selected option, starts from "1" + }); + $("#select").selectmenuFlat("value", "4"); //Set value. + var t = $("#select").selectmenuFlat("value"); //Get value + console.log(t); + $(".radio-demo").radioFlat({ + id: "t", //Base id of the radio set. + name: "test", //name of the radio. + whichChecked: 2, //First selected position, starts from 1. + content: ["apple", "banana", "orange", "cherry"] //set the content array. + }); + $(".radio-demo").click(function() { + console.log($(".radio-demo").radioFlat("value")); //this is how to get the value of selected radio value + }); + $(".checkbox-demo").checkboxFlat({ + id: "t", //Checkbox base id. + name: "test", //Checkbox name. + content: ["apple", "banana", "orange", "cherry"], //Contents of the checkbox set. + checked: [1,3] //Set the checked item, which starts with number 1. + }); + $(".checkbox-demo").click(function() { + console.log($(".selector").checkboxFlat("value")); //Get value of the checked checkbox. + }); + $(".text-demo").textboxFlat({ + hint: "hint" + }); + $(".text-demo").css({ + "height": "30px", + "width": "200px" + }); + $(".button-demo").buttonFlat(); + }); + </script> + </body> +</html> \ No newline at end of file -- 2.1.0
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
participants (2)
-
Paulo Ricardo Paz Vital -
Wen Wang