1:48 a.m.
Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com>
---
ui/css/theme-default/checkbox-flat.css | 25 ++++++++++
ui/js/widgets/checkbox-flat.js | 86 ++++++++++++++++++++++++++++++++++
2 files changed, 111 insertions(+)
create mode 100644 ui/css/theme-default/checkbox-flat.css
create mode 100644 ui/js/widgets/checkbox-flat.js
diff --git a/ui/css/theme-default/checkbox-flat.css
b/ui/css/theme-default/checkbox-flat.css
new file mode 100644
index 0000000..b8712b3
--- /dev/null
+++ b/ui/css/theme-default/checkbox-flat.css
@@ -0,0 +1,25 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 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.
+ */
+
+ .checkbox-item {
+ cursor: pointer;
+ }
+
+ .checkbox-inline {
+ display: inline-block;
+ }
\ No newline at end of file
diff --git a/ui/js/widgets/checkbox-flat.js b/ui/js/widgets/checkbox-flat.js
new file mode 100644
index 0000000..877a52d
--- /dev/null
+++ b/ui/js/widgets/checkbox-flat.js
@@ -0,0 +1,86 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 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.
+ */
+
+
+// How to use:
+// $(".selector").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.
+// });
+// $(".selector").click(function() {
+// console.log($(".selector").checkboxFlat("value")); //Get
value of the checked checkbox.
+// });
+
+ (function($) {
+ $.widget("kimchi.checkboxFlat", {
+ options: {
+ id: "",
+ name: "",
+ content: [],
+ checked: []
+ },
+
+ _create: function() {
+ var that = this;
+ var idBase = that.options.id;
+ var name = that.options.name;
+ var checked = that.options.checked;
+ var content = that.options.content;
+ var html = "";
+ for (var i=1;i<content.length+1;i++) {
+ if($.inArray(i,checked) < 0) {
+ html += "<div class='checkbox-item checkbox-inline
icon-check-empty-1' id='" + idBase + i + "' name='" + name
+ "'></div>" +
+ "<label class='checkbox-label
checkbox-inline' for='" + idBase + i + "'>" + content[i-1] +
"</label>";
+ } else {
+ html += "<div class='checkbox-item checkbox-inline
icon-ok-squared' id='" + idBase + i + "' name='" + name +
"'></div>" +
+ "<label class='checkbox-label
checkbox-inline' for='" + idBase + i + "'>" + content[i-1] +
"</label>";
+ }
+ }
+ $(html).appendTo(that.element);
+ $(".checkbox-item").on("click", function() {
+ var tickID = $(this).attr("id");
+ var tick = tickID.substring(idBase.length,tickID.length);
+ if($(this).hasClass("icon-check-empty-1")) {
+ $(this).removeClass("icon-check-empty-1");
+ $(this).addClass("icon-ok-squared");
+ checked.push(Number(tick));
+ } else {
+ $(this).removeClass("icon-ok-squared");
+ $(this).addClass("icon-check-empty-1");
+ checked.splice($.inArray(Number(tick),checked),1);
+ }
+ });
+ },
+
+ value: function() {
+ var value = new Array();
+ var vContent = this.options.content;
+ var vChencked = this.options.checked;
+ for(var i=0;i<vChencked.length;i++) {
+ value.push(vContent[vChencked[i]-1]);
+ }
+ return value;
+ },
+
+ _destroy: function() {
+ this.element.remove();
+ }
+ });
+ })(jQuery);
\ No newline at end of file
--
2.1.0