Dynamically create the OB2 from the OB1 tab.

vasl_templates/webapp/static/main.js

@@ -37,6 +37,25 @@ $(document).ready( function () {
     // all done - we can show the menu now
     $("#menu").show() ;
 
+    // dynamically create the OB2 tab from OB1
+    var $ob2 = $("#tabs-ob1").clone() ;
+    var adjustAttr = function( $elem, attrName ) {
+        var val = $elem.attr( attrName ) ;
+        if ( val && val.substring(val.length-1) === "1" )
+            $elem.attr( attrName, val.substring(0,val.length-1)+"2" ) ;
+    } ;
+    var fixupOB2 = function( $elem ) {
+        adjustAttr( $elem, "id" ) ;
+        adjustAttr( $elem, "name" ) ;
+        adjustAttr( $elem, "data-id" ) ;
+        adjustAttr( $elem, "for" ) ;
+        $elem.children().each( function() {
+            fixupOB2( $(this) ) ;
+        } ) ;
+    } ;
+    fixupOB2( $ob2 ) ;
+    $("#tabs-ob2").html( $ob2.html() ) ;
+
     // initialize
     $("#tabs").tabs( {
         heightStyle: "fill",

vasl_templates/webapp/templates/index.html

@@ -114,34 +114,7 @@
     </fieldset>
 </div>
 
-<div id="tabs-ob2">
-    <fieldset class="tl"> <legend>OB setup</legend>
-        <div id="panel-obsetup2" class="panel-obsetup">
-            <textarea name="OB_SETUP_2" type="text" class="param"></textarea>
-            <div class="footer">
-                <input type="button" class="generate" data-id="mol" value="MOL">
-                <input type="button" class="generate" data-id="mol-p" value="MOL-P">
-                <input type="button" class="generate" data-id="pf" value="PF">
-                <input type="button" class="generate" data-id="psk" value="PSK">
-                <input type="button" class="generate" data-id="atmm" value="ATMM">
-                <input type="button" class="generate" data-id="baz" value="BAZ">
-                <input type="button" class="generate" data-id="ob_setup_2" value="Go">
-                <input type="button" class="generate" data-id="piat" value="PIAT">
-                <div class="r">
-                    <label for="ob_setup_width_2">Width:</label>
-                    <input type="text" class="param" name="OB_SETUP_WIDTH_2" size="5">
-                </div>
-            </div>
-        </div>
-    </fieldset>
-    <fieldset class="r"> <legend>Vehicles</legend>
-        <div id="panel-obvehicles2">
-        </div>
-    </fieldset>
-    <fieldset class="bl"> <legend>Ordnance</legend>
-        <div id="panel-obordnance2">
-        </div>
-    </fieldset>
+<div id="tabs-ob2"> <!-- nb: this will be created dynamically from the OB1 tab -->
 </div>
 
 <div id="tabs-other">