Re-implement Tabbed using jquery-ui elements

re621 · Mar 22, 2020 · 03ac1f9 · 03ac1f9
1 parent 0388cf7
commit 03ac1f9
Showing 1 changed file with 12 additions and 17 deletions.
diff --git a/src/js/components/Tabbed.ts b/src/js/components/Tabbed.ts
@@ -12,31 +12,26 @@ export class Tabbed {
 
     public create() {
         let _self = this;
-        let $container = $("<re-tab-container>");
 
-        let $tabGroup = $("<re-tab-group>");
+        let $container = $("<div>");
+        let $tabList = $("<ul>").appendTo($container);
 
         this.config.content.forEach(function (entry, index) {
-            $("<input>")
-                .attr("name", _self.config.name)
-                .attr("type", "radio")
-                .attr("id", "tab-" + _self.config.name + "-" + index)
-                .addClass("re-tab-input")
-                .appendTo($tabGroup);
-            $("<label>")
-                .attr("for", "tab-" + _self.config.name + "-" + index)
-                .addClass("re-tab-label")
-                .html(entry.name)
-                .appendTo($tabGroup);
+            let $tab = $("<a>")
+                .attr("href", "#fragment-" + index)
+                .html(entry.name);
+            $("<li>").appendTo($tabList).append($tab);
+
             $("<div>")
-                .addClass("re-tab-panel")
+                .attr("id", "fragment-" + index)
                 .append(entry.page)
-                .appendTo($tabGroup);
+                .appendTo($container);
         });
 
-        $tabGroup.find("input").first().attr("checked", "checked");
+        $container.tabs({
+            //        heightStyle: "auto",
+        });
 
-        $container.append($tabGroup);
         return $container;
     }