cpee 2.1.129 → 2.1.131

data/cockpit/js/details.js

@@ -82,7 +82,7 @@ function do_main_work(svgid) { //{{{
   var tnewnode = ttarget.parents('g.element[element-id]');
   var tnewtype = tnewnode.attr('element-type') + '_' + tnewnode.attr('element-endpoint');
 
-  desc.refresh(function(graphrealization){
+  desc.redraw(function(graphrealization){
     var vtarget = manifestation.adaptor.illustrator.get_node_by_svg_id(svgid);
     if (vtarget.length > 0) {
       vtarget.parents('g.element[element-id]').addClass('selected');

data/cockpit/js/instance.js

@@ -193,13 +193,6 @@ function cockpit() { //{{{
     },
     complete: function() {
       var q = $.parseQuerySimple();
-      if (q.min || q.min == "") {
-        uidash_toggle_vis_tab($('#instance'));
-        uidash_toggle_vis_tab($('#parameters'));
-      }
-      if (q.dea || q.dea == "") {
-        uidash_toggle_vis_tab($('#instance'));
-      }
       if (q.theme) { graph_theme = q.theme; }
       if (q.position) { graph_position = q.position == 'false' ? 'false' : 'true'; }
       if (q.highlight) {
@@ -256,6 +249,13 @@ function cockpit() { //{{{
         uidash_activate_tab("#tabexecution");
         create_instance($("body").attr('current-base'),q.exec,true,true);
       }
+      if (q.min || q.min == "") {
+        uidash_toggle_vis_tab($('#instance'));
+        uidash_toggle_vis_tab($('#parameters'));
+      }
+      if (q.dea || q.dea == "") {
+        uidash_toggle_vis_tab($('#instance'));
+      }
     }
   });
   $.ajax({
@@ -360,6 +360,7 @@ async function sse() { //{{{
           case 'description':
             monitor_instance_dsl();
             monitor_graph_change(false);
+            document.dispatchEvent(graph_changed);
             break;
           case 'endpoints':
             monitor_instance_values("endpoints");
@@ -559,7 +560,11 @@ function monitor_instance_values(type,vals) {// {{{
               });
             }
           });
-          $.when.apply($, deferreds).done();
+          $.when.apply($, deferreds).done(function(){
+            if (save['graph_adaptor'] && !suspended_redrawing) {
+              save['graph_adaptor'].redraw();
+            }
+          });
         } else if(type == "attributes") {
           $(" > attributes > *",res).each((k,v)=>{
             save['attributes_raw'][v.nodeName] = v.textContent;
@@ -723,12 +728,10 @@ function adaptor_init(url,theme,dslx) { //{{{
       suspended_redrawing = false;
     });
   } else {
-    save['graph_adaptor'].update(function(graphrealization){
-      var svgid = manifestation.selected();
-      graphrealization.set_description($(dslx));
-      manifestation.events.click(svgid);
-      format_instance_pos();
-    });
+    var svgid = manifestation.selected();
+    save['graph_adaptor'].set_description($(dslx));
+    manifestation.events.click(svgid);
+    format_instance_pos();
   }
 } //}}}
 
@@ -1402,7 +1405,7 @@ function format_visual_remove(what,cls,sum=true) {//{{{
 
 function scroll_into_view(what) { //{{{
   if (save['state'] != "running") return;
-  var tcontainer = $('#graphcolumn')[0];
+  var tcontainer = $('#modelling')[0];
   if ($('g[element-id="' + what + '"]').length > 0) {
     var telement = $('g[element-id="' + what + '"]')[0].getBBox().y;
     if (tcontainer.scrollTop > telement) {

data/cockpit/js/wfadaptor.js

@@ -191,8 +191,6 @@ function WfAdaptor(theme_base,doit) { // Controller {{{
   this.illustrator = illustrator = new WfIllustrator(this);
   this.description = description = new WfDescription(this, this.illustrator);
 
-  this.update = function(doit){ doit(self); };
-
   this.draw_element = function(type,id,label) {
     let pos = {'row': 1,'col': 0};
     let block = { 'max': {'row': pos.row, 'col': pos.col}, 'endnodes': [], 'svg': $X('<g class="group" xmlns="http://www.w3.org/2000/svg"/>') };
@@ -200,8 +198,8 @@ function WfAdaptor(theme_base,doit) { // Controller {{{
     self.illustrator.set_svg(block);
   }
 
-  this.redraw = function(){
-    description.redraw();
+  this.redraw = function(doit){
+    description.redraw(doit);
   }
 
   $.getScript(self.theme_base).done(function() {
@@ -230,6 +228,7 @@ function WfIllustrator(wf_adaptor) { // View  {{{
     this.width_shift = this.width * 0.39;
     this.width_shift_label = 7;
     this.group_extend = 1;
+    this.structural_tighten = 3; // 'structural' borders are smaller in y
     this.elements = {}; // the svgs
     this.svg = {};
     this.draw = {};
@@ -254,6 +253,9 @@ function WfIllustrator(wf_adaptor) { // View  {{{
       '  <marker id="arrow" viewBox="0 0 10 10" refX="28.5" refY="5" orient="auto" markerUnits="strokeWidth" markerWidth="14" markerHeight="3.5">' +
       '    <path d="m 2 2 l 6 3 l -6 3 z"/>' +
       '  </marker>' +
+      '  <marker id="endarrow" viewBox="0 0 10 10" refX="7" refY="5" orient="auto" markerUnits="strokeWidth" markerWidth="14" markerHeight="5.2">' +
+      '    <path d="M 2,2 L 6.21,4.11 Q 8,5 6.21,5.89 L 2,8 Z"/>' +
+      '  </marker>' +
       '  <clipPath id="startclip">' +
       '    <rect x="-4" y="-4" width="35" height="38"/>' +
       '  </clipPath>' +
@@ -774,22 +776,23 @@ function WfIllustrator(wf_adaptor) { // View  {{{
 
     return g;
   } // }}}
-  var draw_border = this.draw.draw_border = function(id, p1, p2, group) { // {{{
+  var draw_border = this.draw.draw_border = function(id, p1, p2, group, yshrink) { // {{{
+    yshrink = yshrink || 0;
     let bstart = get_x(p1.row,p1.col,'border from');
     let bend = get_x_plus(p1.row,p2.row,p2.col,'border to');
     group.prepend($X('<rect element-id="' + id + '" x="' + (bstart - 1.1 * self.width_shift - self.group_extend) + '" ' +
-        'y="' + ((p1.row-1)*self.height+self.height_shift/2-self.group_extend) + '" ' +
+        'y="' + ((p1.row-1)*self.height+self.height_shift/2-self.group_extend+yshrink) + '" ' +
         'width="' + (bend-bstart+2*self.group_extend) + '" ' +
-        'height="' + (((p2.row+1)-p1.row)*self.height+2*self.group_extend) + '" ' +
+        'height="' + (((p2.row+1)-p1.row)*self.height+2*self.group_extend-2*yshrink) + '" ' +
         'class="block" rx="12" ry="12" xmlns="http://www.w3.org/2000/svg"/>'));
   } // }}}
-  var draw_tile = this.draw.draw_tile = function(id, p1, p2, group) { // {{{
+  var draw_tile = this.draw.draw_tile = function(id, p1, p2, group, yshrink=0) { // {{{
     let bstart = get_x(p1.row,p1.col,'tile from');
     let bend = get_x_plus(p1.row,p2.row,p2.col,'tile to');
     group.prepend($X('<rect element-id="' + id + '" x="' + (bstart - 1.1 * self.width_shift - self.group_extend) + '" ' +
-        'y="' + ((p1.row-1)*self.height+self.height_shift/2-self.group_extend) + '" ' +
+        'y="' + ((p1.row-1)*self.height+self.height_shift/2-self.group_extend+yshrink) + '" ' +
         'width="' + (bend-bstart+2*self.group_extend) + '" ' +
-        'height="' + (((p2.row+1)-p1.row)*self.height+2*self.group_extend) + '" ' +
+        'height="' + (((p2.row+1)-p1.row)*self.height+2*self.group_extend-2*yshrink) + '" ' +
         'class="tile" rx="12" ry="12" xmlns="http://www.w3.org/2000/svg"/>'));
   } // }}}
   var draw_connection = this.draw.draw_connection = function(group, start, end, context_row, arrow) { // {{{
@@ -801,40 +804,40 @@ function WfIllustrator(wf_adaptor) { // View  {{{
     if(((end['row']-start['row']) == 0) && ((end['col']-start['col']) == 0)) return;
     var line;
     if (arrow)
-      line = $X('<path xmlns="http://www.w3.org/2000/svg" class="edge" marker-end="url(#arrow)"/>');
+      line = $X('<path xmlns="http://www.w3.org/2000/svg" class="edge" marker-end="url(#' + (end.structural ? 'endarrow' : 'arrow') + ')"/>');
     else
       line = $X('<path xmlns="http://www.w3.org/2000/svg" class="edge"/>');
     if (end['row']-start['row'] == 0 || end['col']-start['col'] == 0) { // straight line
-      line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15) +" "+
-                            String(cend) +   "," + String(end['row']*self.height-15)
+      line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
+                            String(cend) +   "," + String(end['row']*self.height-15+end.yoffset)
       );
     } else if (end['row']-start['row'] > 0) { // downwards
       if (end['col']-start['col'] > 0) {// left - right
         if (self.compact) {
-          line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15) +" "+
+          line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
                                 String(cstart+14) + "," + String((end['row']-1)*self.height) +" "+ // first turn of horizontal-line going away from node
                                 String(cend) + "," + String((end['row']-1)*self.height) +" "+
-                                String(cend) + "," + String(end['row']*self.height-15)
+                                String(cend) + "," + String(end['row']*self.height-15+end.yoffset)
           );
         } else {
-          line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15) +" "+
-                                String(cend) + "," + String(start['row']*self.height-15) +" "+
-                                String(cend) + "," + String(end['row']*self.height-15)
+          line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
+                                String(cend) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
+                                String(cend) + "," + String(end['row']*self.height-15+end.yoffset)
           );
         }
       } else { // right - left
-        line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15) +" "+
+        line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
                               String(cstart) + "," + String(end['row']*self.height-32) +" "+
                               String(cend+14) + "," + String(end['row']*self.height-32) +" "+ // last turn of horizontal-line going into the node
-                              String(cend) + "," + String(end['row']*self.height-15)
+                              String(cend) + "," + String(end['row']*self.height-15+end.yoffset)
         );
       }
     } else if(end['row']-start['row'] < 0) { // upwards
-      line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15) +" "+
+      line.attr("d", "M " + String(cstart) + "," + String(start['row']*self.height-15+start.yoffset) +" "+
                             String(cstart) + "," + String((self.dim.symbols.length-1)*self.height+4) +" "+
                             String(cend+15) + "," + String((self.dim.symbols.length-1)*self.height+4) +" "+
                             String(cend+15) + "," + String(end['row']*self.height+15)+" "+
-                            String(cend) + "," + String(end['row']*self.height-15)
+                            String(cend) + "," + String(end['row']*self.height-15+end.yoffset)
       );
     }
     self.svg.container.append(line);
@@ -890,7 +893,7 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
     labels = [];
     let start = performance.now();
     illustrator.clear();
-    var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false});
+    var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false,yoffset:0});
     illustrator.set_svg(graph);
     self.set_labels(graph);
     illustrator.set_duration(start);
@@ -946,53 +949,38 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
     used_id_list.push(prefix + id);
     return prefix + id;
   } // }}}
-  var refresh = this.refresh = function(doit) {
-    id_counter = {};
-    labels = [];
-    let start = performance.now();
-    illustrator.clear();
-    clean_description();
-    var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false});
-    illustrator.set_svg(graph);
-    self.set_labels(graph);
-    illustrator.set_duration(start);
-    doit(self);
-  }
-  var redraw = this.redraw = function(){
+  var redraw = this.redraw = function(doit) {
     id_counter = {};
     let start = performance.now();
     labels = [];
     illustrator.clear();
     clean_description();
-    var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false});
+    var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false,yoffset:0});
     illustrator.set_svg(graph);
     self.set_labels(graph);
     illustrator.set_duration(start);
+    if (doit) doit(self);
   }
   var update = this.update = function(svgid) { // {{{
     id_counter = {};
-    if(update_illustrator){
-      let start = performance.now();
-      labels = [];
-      illustrator.clear();
-      clean_description();
-      var graph = parse(description.children('description').get(0), {'row':0,'col':0,final:false,wide:false});
-      illustrator.set_svg(graph);
-      self.set_labels(graph);
-      illustrator.set_duration(start);
+    var notify_target = () => {
+      var newn = $('*[new=true]',description);
+      newn.removeAttr('new');
+
+      if (newn.attr('svg-id') != undefined)
+        adaptor.notify(newn.attr('svg-id'));
+      else if (svgid != undefined)
+        adaptor.notify(svgid);
+      else if (newn.parents('[svg-id]').length > 0)
+        adaptor.notify(newn.parent('[svg-id]').attr('svg-id'));
+      else
+        console.info('Something went horribly wrong');
+    };
+    if (update_illustrator) {
+      self.redraw(notify_target);
+    } else {
+      notify_target();
     }
-
-    var newn = $('*[new=true]',description);
-    newn.removeAttr('new');
-
-    if (newn.attr('svg-id') != undefined)
-      adaptor.notify(newn.attr('svg-id'));
-    else if (svgid != undefined)
-      adaptor.notify(svgid);
-    else if (newn.parents('[svg-id]').length > 0)
-      adaptor.notify(newn.parent('[svg-id]').attr('svg-id'));
-    else
-      console.info('Something went horribly wrong');
   } // }}}
   // }}}
   // Adaption functions {{{
@@ -1180,6 +1168,15 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
           set_details(ctname,csname,pos,context,true);
           [undefined, endnodes] = draw_position(ctname,parent_pos,pos,prev,block,[],context,{svg: g, pos: origpos});
         }
+        if (illustrator.elements[sname].border == 'structural') {
+          // structural border: outgoing arrow starts at the group border instead of from the icon
+          // small y offset.
+          endnodes = endnodes.map(function(p) {
+            var np = JSON.parse(JSON.stringify(p));
+            np.yoffset = illustrator.height_shift/2 + illustrator.group_extend + 15 - illustrator.structural_tighten;
+            return np;
+          });
+        }
         prev = JSON.parse(JSON.stringify(endnodes));
       }
     });
@@ -1255,18 +1252,20 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
       } else { console.log("no icon "+ sname);}
       if (illustrator.elements[sname] && illustrator.elements[sname].border) {
         let wide = (illustrator.elements[sname].wide == true && block.max.col == pos.col) ? pos.col + 1 : block.max.col;
+        let yshrink = illustrator.elements[sname].border == 'structural' ? illustrator.structural_tighten : 0;
         if (illustrator.elements[sname].closing_symbol) {
-          illustrator.draw.draw_border($(context).attr('svg-id'), pos, { col: wide, row: block.max.row + 1 }, block.svg);
+          illustrator.draw.draw_border($(context).attr('svg-id'), pos, { col: wide, row: block.max.row + 1 }, block.svg, yshrink);
         } else {
-          illustrator.draw.draw_border($(context).attr('svg-id'), pos, { col: wide, row: block.max.row }, block.svg);
+          illustrator.draw.draw_border($(context).attr('svg-id'), pos, { col: wide, row: block.max.row }, block.svg, yshrink);
         }
       }
       if (illustrator.elements[sname] && illustrator.elements[sname].type == 'complex') {
         let wide = (illustrator.elements[sname].wide == true && block.max.col == pos.col) ? pos.col + 1 : block.max.col;
+        let yshrink = illustrator.elements[sname].border == 'structural' ? illustrator.structural_tighten : 0;
         if (illustrator.elements[sname].closing_symbol) {
-          illustrator.draw.draw_tile($(context).attr('svg-id'), pos, { col: wide, row: block.max.row + 1 }, block.svg);
+          illustrator.draw.draw_tile($(context).attr('svg-id'), pos, { col: wide, row: block.max.row + 1 }, block.svg, yshrink);
         } else {
-          illustrator.draw.draw_tile($(context).attr('svg-id'), pos, { col: wide, row: block.max.row }, block.svg);
+          illustrator.draw.draw_tile($(context).attr('svg-id'), pos, { col: wide, row: block.max.row }, block.svg, yshrink);
         }
       }
     }
@@ -1274,6 +1273,14 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
 
     // Calculate Connection {{{
     let connection_case = 0;
+    var conn_target = pos;
+    if (illustrator.elements[sname].border == 'structural' && !second) {
+      // structural border: incoming arrow stops at the group border instead of reaching into the icon
+      // (only a pixel-level yoffset, row/col stay integers so get_x() column lookups stay correct)
+      conn_target = JSON.parse(JSON.stringify(pos));
+      conn_target.yoffset = -illustrator.height + illustrator.height_shift/2 - illustrator.group_extend + 15 + illustrator.structural_tighten;
+      conn_target.structural = true;
+    }
     if(illustrator.elements[sname] != undefined && illustrator.elements[sname].closeblock == true) { // Close Block if element e.g. loop
       if (second) {
         if (second.pos.row+1 < pos.row) { // when no content, dont paint the up arrow
@@ -1296,7 +1303,7 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
     } else { endnodes = [JSON.parse(JSON.stringify(pos))]; } // sets this element as only endpoint (aggregate)
     if(prev[0].row == 0 || prev[0].col == 0) { // this enforces the connection from description to the first element
       connection_case = 3;
-      illustrator.draw.draw_connection(block.svg, { row: 1, col: 1 }, pos, 0, true);
+      illustrator.draw.draw_connection(block.svg, { row: 1, col: 1, yoffset: 0 }, conn_target, 0, true);
     } else {
       if (illustrator.elements[sname].noarrow == undefined || illustrator.elements[sname].noarrow == false) {
         for (let node=0; node < prev.length; node++) {
@@ -1308,15 +1315,15 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
               }
               connection_case = 4;
               // console.log('++ case 4',prev[node].row,pos.row,illustrator.dim.debug());
-              illustrator.draw.draw_connection(block.svg, pn, pos, 0, true);
+              illustrator.draw.draw_connection(block.svg, pn, conn_target, 0, true);
             } else {
               connection_case = 5;
               if (prev.length == 1) {
                 // console.log('++ case 5a',parent_pos.row, '---', prev[node].row,pos.row,illustrator.dim.debug());
-                illustrator.draw.draw_connection(block.svg, prev[node], pos, 0, true);
+                illustrator.draw.draw_connection(block.svg, prev[node], conn_target, 0, true);
               } else {
                 // console.log('++ case 5b',prev[node].row,pos.row,illustrator.dim.debug());
-                illustrator.draw.draw_connection(block.svg, prev[node], pos, 0, true);
+                illustrator.draw.draw_connection(block.svg, prev[node], conn_target, 0, true);
               }
             }
           }
@@ -1326,7 +1333,7 @@ function WfDescription(wf_adaptor, wf_illustrator) { // Model {{{
           if (prev[node] && !prev[node].final) {
             connection_case = 6;
             // console.log('++ case 6',prev[node].row,pos.row,illustrator.dim.debug());
-            illustrator.draw.draw_connection(block.svg, prev[node], pos, prev[node].row, false);
+            illustrator.draw.draw_connection(block.svg, prev[node], conn_target, prev[node].row, false);
           }
         }
       }

data/cockpit/llm.html

@@ -136,35 +136,35 @@
       </svg>
     </template>
 
+    <div class='hidden' id="areanew"> <!--{{{-->
+      <table class='x-ui-layout'>
+      <tr>
+        <td>Resources:</td>
+        <td><input name="res-url" type="text" value=""/></td>
+        <td></td>
+      </tr>
+      <tr>
+        <td>Engine:</td>
+        <td><input name="base-url" type="text" value=""/></td>
+        <td><button name="base">create new instance</button></td>
+      </tr>
+      <tr>
+        <td>Instance:</td>
+        <td><input name="instance-url" type="text" value=""/></td>
+        <td><button name="instance">monitor instance</button></td>
+      </tr>
+      </table>
+    </div> <!--}}}-->
+
     <ui-tabbed id="instance">
       <ui-tabbar>
         <ui-tab class="switch"                                                ></ui-tab>
-        <ui-tab class=""                data-tab="new"       id="tabnew"      >New</ui-tab>
         <ui-tab class="inactive hidden" data-tab="instance"  id="tabinstance" >Instance</ui-tab>
         <ui-tab class="inactive hidden" data-tab="execution" id="tabexecution">Execution</ui-tab>
         <ui-behind                                                            ><a style='display:none' target='_blank' id='current-instance'></a><a style='display:none' target='_blank' id='current-instance-properties'>P</a><a style='display:none' target='_blank' id='current-instance-subscriptions'>S</a><a style='display:none' target='_blank' id='current-instance-callbacks'>C</a></ui-behind>
         <ui-last                                                              ><a class="logo" href=".."></a></ui-last>
       </ui-tabbar>
       <ui-content>
-        <ui-area data-belongs-to-tab="new" id="areanew"> <!--{{{-->
-          <table class='x-ui-layout'>
-          <tr>
-            <td>Resources:</td>
-            <td><input name="res-url" type="text" value=""/></td>
-            <td></td>
-          </tr>
-          <tr>
-            <td>Engine:</td>
-            <td><input name="base-url" type="text" value=""/></td>
-            <td><button name="base">create new instance</button></td>
-          </tr>
-          <tr>
-            <td>Instance:</td>
-            <td><input name="instance-url" type="text" value=""/></td>
-            <td><button name="instance">monitor instance</button></td>
-          </tr>
-          </table>
-        </ui-area> <!--}}}-->
         <ui-area data-belongs-to-tab="instance" id="areainstance" class="inactive"> <!--{{{-->
           <div>
             <div class='section'>
@@ -264,7 +264,6 @@
       <ui-tabbar>
         <ui-before                                                 ></ui-before>
         <ui-tab class=""         data-tab="details" id="tabdetails">Graph</ui-tab>
-        <ui-tab class="inactive" data-tab="dsl"     id="tabdsl"    >Description</ui-tab>
         <ui-tab class="inactive" data-tab="log"     id="tablog"    >Log</ui-tab>
         <ui-behind                                                 ><a style='display:none' target='_blank' id='current-track'>T</a><a style='display:none' target='_blank' id='current-graph'>G</a></ui-behind>
       </ui-tabbar>
@@ -279,7 +278,7 @@
           <ui-resizehandle class='hidden'>drag to resize</ui-resizehandle>
           <ui-part id='input'>
             <div id='status'></div>
-            <div id='prompt_container' class="max">
+            <div id='prompt_container'>
               <div id='prompt' contenteditable="true" title="Please enter your modelling instructions here..." placeholder="Please enter your modelling instructions here..."></div>
               <div id='prompt_submit_container' class="single">
                 <select name="generation" id="generation" class='hidden'>
@@ -315,7 +314,6 @@
             <div id="dat_details" class='x-ui-layout'></div>
           </ui-part>
         </ui-area>
-        <ui-area data-belongs-to-tab="dsl" id="areadsl" class="inactive"></ui-area>
         <ui-area data-belongs-to-tab="log" id="arealog" class="inactive"> <!--{{{-->
           <div>Persistent Log: <a style='display:none' target='_blank' id='current-log'></a> [<a style='display:none' target='_blank' id='xml-log'>X</a>,<a style='display:none' target='_blank' id='shifted-log'>S</a>]</div>
           <table id="dat_log" class="x-ui-layout"></table>

data/cockpit/llmmodel.html

@@ -64,7 +64,6 @@
 
     <script type="text/javascript" src="js/llm.js"></script>
     <link   rel="stylesheet"      href="css/llm.css" type="text/css"/>
-    <link   rel="stylesheet"      href="css/llmmodel.css" type="text/css"/>
 
     <link rel="stylesheet" href="css/ui.css" type="text/css"/>
     <link rel="stylesheet" href="css/extended_columns-label.css" type="text/css"/>
@@ -89,31 +88,31 @@
       </svg>
     </template>
 
+    <div class='hidden' id="areanew"> <!--{{{-->
+      <table class='x-ui-layout'>
+      <tr>
+        <td>Resources:</td>
+        <td><input name="res-url" type="text" value=""/></td>
+      </tr>
+      <tr>
+        <td>Engine:</td>
+        <td><input name="base-url" type="text" value=""/></td>
+      </tr>
+      <tr>
+        <td>Instance:</td>
+        <td><input name="instance-url" type="text" value=""/></td>
+      </tr>
+      </table>
+    </div> <!--}}}-->
+
     <ui-tabbed id="instance">
       <ui-tabbar>
         <ui-tab class="switch"                                                ></ui-tab>
-        <ui-tab class=""                data-tab="new"       id="tabnew"      >Config</ui-tab>
-        <ui-tab class="inactive hidden" data-tab="instance"  id="tabinstance" >Instance</ui-tab>
+        <ui-tab class="inactive hidden" data-tab="instance"  id="tabinstance" >Model</ui-tab>
         <ui-behind                                                            ><a style='display:none' target='_blank' id='current-instance'></a><a style='display:none' target='_blank' id='current-instance-properties'>P</a><a style='display:none' target='_blank' id='current-instance-subscriptions'>S</a><a style='display:none' target='_blank' id='current-instance-callbacks'>C</a></ui-behind>
         <ui-last                                                              ><a class="logo" href=".."></a></ui-last>
       </ui-tabbar>
       <ui-content>
-        <ui-area data-belongs-to-tab="new" id="areanew"> <!--{{{-->
-          <table class='x-ui-layout'>
-          <tr>
-            <td>Resources:</td>
-            <td><input name="res-url" type="text" value=""/></td>
-          </tr>
-          <tr>
-            <td>Engine:</td>
-            <td><input name="base-url" type="text" value=""/></td>
-          </tr>
-          <tr>
-            <td>Instance:</td>
-            <td><input name="instance-url" type="text" value=""/></td>
-          </tr>
-          </table>
-        </ui-area> <!--}}}-->
         <ui-area data-belongs-to-tab="instance" id="areainstance" class="inactive"> <!--{{{-->
           <div>
             <div class='section'>
@@ -178,7 +177,7 @@
           <ui-resizehandle class='hidden'>drag to resize</ui-resizehandle>
           <ui-part id='input'>
             <div id='status'></div>
-            <div id='prompt_container' class="max">
+            <div id='prompt_container'>
               <div id='prompt' contenteditable="true" title="Please enter your modelling instructions here..." placeholder="Please enter your modelling instructions here..."></div>
               <div id='prompt_submit_container' class="single">
                 <select name="generation" id="generation" class='hidden'>