cpee 2.1.135 → 2.1.136

data/cockpit/js/instance.js

@@ -1,4 +1,5 @@
 var es;
+var es_reconnect;
 var suspended_redrawing = false;
 var skip_location = false;
 var myid = ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c => (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16));
@@ -20,8 +21,16 @@ var save = {};
     save['attributes'] = undefined;
     save['attributes_raw'] = {};
 var node_state = {};
+var tracking_memory = 10000; // ms finished uuids are remembered, to drop late events
 var debug = false;
 
+var cpee= {
+  'instance': undefined,
+  'base': undefined,
+  'attributes': {},
+  'url': undefined
+}
+
 function global_init() {
   suspended_redrawing = false;
   loading = false;
@@ -39,7 +48,8 @@ function global_init() {
   save['details'] = undefined;
   save['details_target'] = {};
   save['instance_pos'] = [];
-  save['modeltype'] = 'CPEE';
+  save['instance_pos_anon'] = {};
+  save['position_states'] = {};
   save['modifiers'] = {};
   save['modifiers_active'] = {};
   save['modifiers_additional'] = {};
@@ -147,9 +157,8 @@ function cockpit() { //{{{
   $("button[name=loadtestset]").click(function(e){new CustomMenu(e).menu($('#templates'),function(){ load_testset(false) } ); });
   $("button[name=loadtestsetfile]").click(load_testsetfile);
   $("button[name=loadmodelfile]").click(load_modelfile);
-  $("button[name=loadmodeltype]").click(function(e){new CustomMenu(e).menu($('#modeltypes'),load_modeltype, $("button[name=loadmodeltype]")); });
   $("button[name=savetestsetfile]").click(function(){ save_testsetfile(); });
-  $("button[name=savebpmnfile]").click(function(){ save_bpmnfile(); });
+  $("button[name=savemodelfile]").click(function(){ save_modelfile(); });
   $("button[name=savesvgfile]").click(function(){ save_svgfile(); });
   $("button[name=state_start]").click(function(){ $(this).parent().find('button').attr("disabled","disabled");start_instance(); });
   $("button[name=state_stop]").click(function(){ $(this).parent().find('button').attr("disabled","disabled");stop_instance(); });
@@ -163,6 +172,7 @@ function cockpit() { //{{{
     save['graph_adaptor'].illustrator.get_elements().removeClass('marked');
     localStorage.removeItem('marked');
     localStorage.removeItem('marked_from');
+    details_leave(true);
     $('#dat_details').empty();
     e.stopImmediatePropagation();
   });
@@ -263,16 +273,6 @@ function cockpit() { //{{{
       }
     }
   });
-  $.ajax({
-    url: "transformations.xml",
-    dataType: 'xml',
-    success: function(res){
-      $('transformation',res).each(function(){
-        var ts = $(this).text();
-        $('#modeltypes').append($("<div class='menuitem'></div>").text(ts));
-      });
-    }
-  });
 } //}}}
 
 function check_subscription() { // {{{
@@ -348,6 +348,31 @@ function create_instance(base,name,load,exec) {// {{{
   }
 }// }}}
 
+function subscribe(url,retry,success) { //{{{
+  es_reconnect = undefined;
+  if ($('body').attr('current-instance') != url) { return; } // instance switched while waiting for reconnect
+  $.ajax({
+    type: "POST",
+    url: url + "/notifications/subscriptions/",
+    data: subscription_state == 'more' ? sub_more : sub_less,
+    success: function(res){
+      subscription = res;
+      append_to_log("monitoring", "id", subscription);
+      sse(); // also (re)loads everything, so a reconnect catches up on what was missed
+      if (success) { success(); }
+    },
+    error: function(xhr) {
+      if (retry && (xhr.status == 0 || xhr.status >= 500)) {
+        append_to_log("monitoring", "closed", "server not reachable, reconnecting in 5 seconds.");
+        es_reconnect = setTimeout(() => subscribe(url,true), 5000);
+      } else {
+        subscription = undefined;
+        append_to_log("monitoring", "closed", "For Good.");
+        sse();
+      }
+    }
+  });
+} //}}}
 async function sse() { //{{{
   var url = $('body').attr('current-instance');
   if (subscription) {
@@ -408,20 +433,29 @@ async function sse() { //{{{
       append_to_log(data['type'], data['topic'] + '/' + data['name'], JSON.stringify(data['content']));
     };
     es.onerror = function() {
-      append_to_log("monitoring", "closed", "finished or abandoned or not existing or server down. one of these, i assume.");
-      // setTimeout(sse,10000);
+      // the server deletes the subscription when the connection closes, so the
+      // native EventSource retry can never succeed. resubscribe instead.
+      this.close();
+      if (save['state'] == 'finished' || save['state'] == 'abandoned') {
+        append_to_log("monitoring", "closed", "instance " + save['state'] + ".");
+        return;
+      }
+      append_to_log("monitoring", "closed", "connection lost, reconnecting in 5 seconds.");
+      es_reconnect = setTimeout(() => subscribe(url,true), 5000);
     };
   }
-  await monitor_instance_values("endpoints"); // we cant render before we know specialized endpoint symbols
-  await monitor_instance_values("attributes"); // attributes first, to catch the <resources> attribute which overrides current-resources
-  monitor_instance_values("dataelements");
-  monitor_instance_values("documents");
+  await monitor_instance_values("endpoints",undefined,true); // we cant render before we know specialized endpoint symbols
+  await monitor_instance_values("attributes",undefined,true); // attributes first, to catch the <resources> attribute which overrides current-resources
+  monitor_instance_values("documents",undefined,true);
+  monitor_instance_values("dataelements",undefined,true);
   monitor_instance_dsl();
   monitor_graph_change(false);
   monitor_instance_state();
 } //}}}
 
 function monitor_instance(cin,rep,load,exec) {// {{{
+  if (es) { es.close(); }
+  clearTimeout(es_reconnect);
   global_init();
   format_visual_clear();
   format_visual_vote_clear();
@@ -429,16 +463,21 @@ function monitor_instance(cin,rep,load,exec) {// {{{
   $("body").attr('current-instance',sanitize_url(cin));
   $("body").attr('current-resources',sanitize_url(rep));
 
+  url = $("body").attr('current-instance');
+
+  cpee.url = $("body").attr('current-instance');
+  cpee.base = $("body").attr('current-base');
+  cpee.instance = url.match(/(\d+)\/?$/)[1];
+
   $("input[name=instance-url]").val($("body").attr('current-instance'));
   $("input[name=res-url]").val($("body").attr('current-resources'));
 
   $('#parameters ui-content ui-area > button, ui-tabbed.parameters ui-content ui-area > button').attr('disabled','disabled');
+  details_leave(false);
   $('#dat_details').empty();
 
   $('#modifiers > div').remove();
 
-  url = $("body").attr('current-instance');
-
   $.ajax({
     type: "GET",
     url: url,
@@ -472,22 +511,9 @@ function monitor_instance(cin,rep,load,exec) {// {{{
       // Change url to return to current instance when reloading (because new subscription is made)
       $("input[name=votecontinue]").prop( "checked", false );
 
-      $.ajax({
-        type: "POST",
-        url: url + "/notifications/subscriptions/",
-        data: sub_less,
-        success: function(res){
-          subscription = res;
-          append_to_log("monitoring", "id", subscription);
-          sse();
-          if (load || exec) {
-            load_testset(exec);
-          }
-        },
-        error: function() {
-          subscription = undefined;
-          append_to_log("monitoring", "closed", "For Good.");
-          sse();
+      subscribe(url,false,function(){
+        if (load || exec) {
+          load_testset(exec);
         }
       });
     },
@@ -498,7 +524,7 @@ function monitor_instance(cin,rep,load,exec) {// {{{
   });
 }// }}}
 
-function monitor_instance_values(type,vals) {// {{{
+function monitor_instance_values(type,vals,first=false) {// {{{
   if (type == "dataelements" && save['state'] == "running") {
     let de = save[type].save();
     Object.entries(vals).forEach(([key,value]) => {
@@ -527,6 +553,9 @@ function monitor_instance_values(type,vals) {// {{{
       url: url + "/properties/" + type + "/",
       success: function(res){
         save[type].content(res);
+        if (first) {
+          document.dispatchEvent(eval(type + '_loaded'));
+        }
         if (type == "endpoints") {
           save['endpoints_list'] = {};
           var tmp = {};
@@ -545,6 +574,7 @@ function monitor_instance_values(type,vals) {// {{{
                   save['endpoints_cache'] = tmp;
                   def.resolve();
                   // when updating attributes clear the attributes, because they might change as well. New arguments are possible.
+                  details_leave(true);
                   $('#dat_details').empty();
                 });
               },
@@ -562,6 +592,7 @@ function monitor_instance_values(type,vals) {// {{{
                     save['endpoints_cache'] = tmp;
                     def.resolve();
                     // when updating attributes clear the attributes, because they might change as well. New arguments are possible.
+                    details_leave(true);
                     $('#dat_details').empty();
                   });
                 },
@@ -577,6 +608,7 @@ function monitor_instance_values(type,vals) {// {{{
         } else if(type == "attributes") {
           $(" > attributes > *",res).each((k,v)=>{
             save['attributes_raw'][v.nodeName] = v.textContent;
+            cpee.attributes[v.nodeName] = v.textContent;
           });
           document.dispatchEvent(eval(type + '_changed'));
           if ($(" > attributes > resources",res).length > 0) {
@@ -584,11 +616,6 @@ function monitor_instance_values(type,vals) {// {{{
           } else {
             save['resources'] = undefined;
           }
-          if ($(" > attributes > modeltype",res).length > 0) {
-            save['modeltype'] = $(" > attributes > modeltype",res).text();
-          } else {
-            save['modeltype'] = undefined;
-          }
           if ($('#modifiers').length > 0) {
             if ($('#modifiers > div').length == 0) {
               modifiers_display().then(function(){ modifiers_select(); });
@@ -679,58 +706,27 @@ function adaptor_init(url,theme,dslx) { //{{{
         save['graph'].removeAttr('svg-subtype');
         save['graph'].removeAttr('svg-label');
         document.dispatchEvent(graph_changed);
-        if (save['modeltype'] != 'CPEE') {
-          $.ajax({
-            type: "PUT",
-            url: url + "/properties/attributes/modeltype/",
-            data: {'value': 'CPEE'},
-            error: report_failure
-          });
-          $.ajax({
-            type: "PUT",
-            url: url + "/properties/transformation/",
-            contentType: 'text/xml',
-            headers: {
-              'Content-ID': 'transformation',
-              'CPEE-Event-Source': myid
-            },
-            data: '<transformation xmlns="http://cpee.org/ns/properties/2.0"><description type="copy"/><dataelements type="none"/><endpoints type="none"/></transformation>',
-            success: function() {
-              $.ajax({
-                type: "PUT",
-                url: url + "/properties/description/",
-                contentType: 'text/xml',
-                headers: {
-                  'Content-ID': 'description',
-                  'CPEE-Event-Source': myid
-                },
-                data: g,
-                error: report_failure
-              });
-            },
-            error: report_failure
-          });
-        } else {
-          $.ajax({
-            type: "PUT",
-            url: url + "/properties/description/",
-            contentType: 'text/xml',
-            headers: {
-              'Content-ID': 'description',
-              'CPEE-Event-Source': myid
-            },
-            data: g,
-            error: report_failure
-          });
-        }
+        $.ajax({
+          type: "PUT",
+          url: url + "/properties/dslx/",
+          contentType: 'text/xml',
+          headers: {
+            'Content-ID': 'dslx',
+            'CPEE-Event-Source': myid
+          },
+          data: g,
+          error: report_model_failure
+        });
         manifestation.events.click(svgid);
         format_instance_pos();
         if (manifestation.selected() == "unknown") { // nothing selected
+          details_leave(false);
           $('#dat_details').empty();
         }
       };
 
       monitor_instance_pos();
+      details_leave(false);
       $('#dat_details').empty();
 
       // while inside and svgs are reloaded, do nothing here
@@ -805,7 +801,7 @@ function monitor_instance_pos() {// {{{
   if (graph_position && graph_position == 'false') {
     save['instance_pos'] = [];
     format_visual_clear();
-    format_instance_pos();
+    format_instance_pos_load();
     return;
   };
   var url = $('body').attr('current-instance');
@@ -815,42 +811,84 @@ function monitor_instance_pos() {// {{{
     success: function(res){
       save['instance_pos'] = $("positions > *",res);
       format_visual_clear();
-      format_instance_pos();
+      format_instance_pos_load();
     }
   });
 }// }}}
 
+function track_start(states,uuid,what,cls) {// {{{
+  if (states[uuid]) { return; } // already running, or a late start after the end
+  states[uuid] = { position: what, state: 'running' };
+  let anon = save['instance_pos_anon'][what];
+  if (anon && anon[cls] > 0) {
+    anon[cls] -= 1; // most likely the snapshot entry itself, so it is already counted
+    return;
+  }
+  format_visual_add(what,cls);
+} // }}}
+function track_end(states,uuid,what,cls) {// {{{
+  let cur = states[uuid];
+  if (cur && cur.state == 'done') { return; }
+  states[uuid] = { position: what, state: 'done' };
+  setTimeout(() => {delete states[uuid]},tracking_memory);
+  let anon = save['instance_pos_anon'][what];
+  if (!cur) { // start never seen, so it belongs to a snapshot entry, if any
+    if (!anon || !(anon[cls] > 0)) { return; }
+    anon[cls] -= 1;
+  }
+  format_visual_remove(what,cls);
+} // }}}
+function track_forget_running(states,what) {// {{{
+  // counts were reset, so running uuids are no longer counted. ends of them
+  // consume snapshot entries instead.
+  for (const [uuid, ele] of Object.entries(states)) {
+    if (ele.state == 'running' && (what == undefined || ele.position == what)) { delete states[uuid]; }
+  }
+} // }}}
+
 function monitor_instance_running(content,event) {// {{{
-  let uuid = content['activity-uuid'];
-  let cur = save['activity_red_states'][uuid];
   if (event == "calling" || event == "manipulating") {
-    if (!cur && save['instance_pos'].filter( (_,e) => { return e.nodeName == content.activity }).length == 0) {
-      save['activity_red_states'][uuid] = { position: content.activity, state: 'active' };
-      format_visual_add(content.activity,"active");
-    }
+    track_start(save['activity_red_states'],content['activity-uuid'],content.activity,"active");
   } else if (event == "done") {
-    if ((cur && cur.state == 'active') || save['instance_pos'].filter( (_,e) => { return e.nodeName == content.activity }).length > 0) {
-      format_visual_remove(content.activity,"active");
-    }
-    save['activity_red_states'][uuid] = { position: content.activity, state: 'done' };
-    setTimeout(() => {delete save['activity_red_states'][uuid]},1000);
+    track_end(save['activity_red_states'],content['activity-uuid'],content.activity,"active");
+  }
+} // }}}
+function monitor_instance_pos_mark(b) {// {{{
+  if (b.uuid) {
+    track_start(save['position_states'],b.uuid,b.position,"passive");
+  } else { // set by user, behaves like a snapshot entry
+    let anon = save['instance_pos_anon'][b.position] ??= {};
+    if (anon['passive'] > 0) { return; }
+    anon['passive'] = 1;
+    format_visual_add(b.position,"passive");
+  }
+} // }}}
+function monitor_instance_pos_unmark(b) {// {{{
+  if (b.uuid) {
+    track_end(save['position_states'],b.uuid,b.position,"passive");
+  } else { // set by user, clears the node
+    track_forget_running(save['position_states'],b.position);
+    if (save['instance_pos_anon'][b.position]) { save['instance_pos_anon'][b.position]['passive'] = 0; }
+    if (node_state[b.position]) { node_state[b.position]['passive'] = 0; }
+    format_visual_set(b.position);
   }
 } // }}}
 function monitor_instance_pos_change(content) {// {{{
   if (graph_position && graph_position == 'false') { return; }
+  // unmark first, a single change may unmark and mark the same node (e.g. loops)
+  if (content['unmark']) {
+    $.each(content['unmark'],function(a,b){
+      monitor_instance_pos_unmark(b);
+    });
+  }
   if (content['at']) {
     $.each(content['at'],function(a,b){
-      format_visual_add(b.position,"passive",false);
+      monitor_instance_pos_mark(b);
     });
   }
   if (content['after']) {
     $.each(content['after'],function(a,b){
-      format_visual_add(b.position,"passive",false);
-    });
-  }
-  if (content['unmark']) {
-    $.each(content['unmark'],function(a,b){
-      format_visual_remove(b.position,"passive",false)
+      monitor_instance_pos_mark(b);
     });
   }
   if (!content['at'] && !content['unmark'] && !content['after'] && !content['wait']) {
@@ -882,6 +920,8 @@ function monitor_instance_state_change(notification) { //{{{
       monitor_instance_pos();
     }
     if (notification == "running") {
+      track_forget_running(save['position_states']);
+      for (const [key, ele] of Object.entries(save['instance_pos_anon'])) { ele['passive'] = 0; }
       for (const [key, ele] of Object.entries(node_state)) {
         for (i=0; i<ele.passive; i++) {
           format_visual_remove(key,'passive');
@@ -1050,56 +1090,9 @@ function get_testset(deferred) {// {{{
 }// }}}
 function save_svgfile() {// {{{
   var url = $('body').attr('current-instance');
+  if (!save['graph_adaptor']) { return; } // no instance loaded
 
-  var gc = $('#graphcanvas').clone();
-  var start = parseInt(gc.attr('width'));
-  $('#graphgrid > svg:not(#graphcanvas)').each( (i,ele) => {
-    const gr = $X('<g transform="translate(' + start + ')" xmlns="http://www.w3.org/2000/svg"></g>');
-    start = start + parseInt(ele.getAttribute('width'));
-    $('g',ele).each((j,g) => {
-      gr.append($(g).clone());
-    });
-    gc.append(gr);
-  });
-  gc.find('.selected').removeClass('selected');
-  var varreps = {};
-  var ffamily = '';
-  $(window.document.styleSheets).each(function(i,x){
-    if (x && x.href && x.ownerNode.attributes.getNamedItem('data-include-export')) {
-      $(x.cssRules).each(function(j,y){
-        if (y.selectorText == ":root") {
-          $(y.style).each(function(k,z) {
-            varreps['var\\(' + z + '\\)'] = getComputedStyle(document.documentElement).getPropertyValue(z).toString();
-          });
-        }
-        if (y.selectorText == "svg") {
-          $(y.style).each(function(k,z) {
-            if (z == 'font-family') {
-              ffamily = getComputedStyle($('#graphgrid > svg')[0]).getPropertyValue(z).toString();
-            }
-          });
-        }
-        var loc = $(gc).find(y.selectorText.replace(/svg /g,''));
-        var cst = y.style.cssText;
-        for (k in varreps) {
-          cst = cst.replace(new RegExp(k,'g'),varreps[k]);
-        }
-        loc.each(function(k,loco) {
-          var sty = $(loco).attr('style') == undefined ? '' : $(loco).attr('style');
-          $(loco).attr('style',cst + sty);
-        });
-      });
-      $(gc).find('text.super,g.hoverstyle,g.markstyle').each(function(k,loco){
-        $(loco).attr('style',$(loco).attr('style') + ' display: none; ');
-      });
-      ffamily = ffamily.replace(/-/,' ').split(' ').map(function(word) { return word[0].toUpperCase() + word.substr(1); }).join(' ');
-      $(gc).find('text').each(function(k,loco){
-        $(loco).attr('style',$(loco).attr('style') + ' font-family: \'' + ffamily + '\'; ');
-      });
-    }
-  });
-  gc.attr('width',start+1);
-  gc.find('.duration').remove();
+  var gc = $(save['graph_adaptor'].get_svg());
   $.ajax({
     type: "GET",
     url: url + "/properties/attributes/info/",
@@ -1112,23 +1105,21 @@ function save_svgfile() {// {{{
   });
 } // }}}
 
-function save_bpmnfile() {// {{{
+function save_modelfile() {// {{{
   var url = $('body').attr('current-instance');
-
-  let dpm = JSON.parse($('svg[data-pos-matrix]').attr('data-pos-matrix'));
-  let dcl = JSON.parse($('svg[data-con-list]').attr('data-con-list'));
-
-  let david = david_bpmn_convert(dpm,dcl);
-
-  $.ajax({
-    type: "GET",
-    url: url + "/properties/attributes/info/",
-    success: function(res){
-      $('#savebpmnfile').attr('download',res + '.bpmn');
-      $('#savebpmnfile').attr('href','data:application/xml;charset=utf-8;base64,' + $B64(david.serializePrettyXML()));
-      document.getElementById('savebpmnfile').click();
-    },
-    error: report_failure
+  if (!save['graph_adaptor']) { return; } // no instance loaded
+
+  let extensions = { 'Signavio': 'bpmn', 'ChatGPT_Mermaid': 'mmd', 'ChatGPT_Graphviz': 'dot' };
+  Promise.all([
+    $.ajax({ type: "GET", url: url + "/properties/description/", dataType: 'text' }),
+    $.ajax({ type: "GET", url: url + "/properties/attributes/info/" }),
+    $.ajax({ type: "GET", url: url + "/properties/attributes/modeltype/" }).catch(() => 'CPEE') // instances without modeltype
+  ]).then(function([desc,info,modeltype]){
+    $('#savemodelfile').attr('download',info + '.' + (extensions[modeltype] || 'xml'));
+    $('#savemodelfile').attr('href','data:application/xml;charset=utf-8;base64,' + $B64(desc));
+    document.getElementById('savemodelfile').click();
+  },function(xhr){
+    append_to_log("failure", 'GET ' + url + '/properties/description/', xhr.status + ' ' + xhr.statusText);
   });
 }// }}}
 async function set_testset(testset,exec) {// {{{
@@ -1140,8 +1131,10 @@ async function set_testset(testset,exec) {// {{{
   // load old testsets. remove 12/2026
   $("testset > description manipulate",testset).each((_,t) => {
     if ($('code',t).length == 0) {
-      let st = $(t).text();
-      $(t).text();
+      // only direct text nodes, children (if any) stay untouched
+      let txt = $(t).contents().filter((_,n) => n.nodeType == Node.TEXT_NODE);
+      let st = txt.text();
+      txt.remove();
       let c = $X('<code xmlns="http://cpee.org/ns/description/1.0"/>');
           c.text(st);
       $(t).append(c);
@@ -1267,6 +1260,7 @@ function load_testset(exec) {// {{{
       url: url,
       success: function(res){
         save['dsl'] = null; // reload dsl and position under all circumstances
+        details_leave(false);
         $('#dat_details').empty();
 
         document.title = "Untitled";
@@ -1278,32 +1272,6 @@ function load_testset(exec) {// {{{
     });
   }
 }// }}}
-function load_modeltype() {// {{{
-  if (loading) return;
-  var url = $('body').attr('current-instance');
-  loading = true;
-
-  var name = $("#modeltypes div.menuitem[data-selected=selected]").text();
-  $.ajax({
-    cache: false,
-    dataType: 'xml',
-    url: name + ".xml",
-    success: function(res){
-      $.ajax({
-        type: "PUT",
-        url: url + "/properties/attributes/modeltype/",
-        data: ({value: name}),
-        success: function(){
-          set_testset(res,false);
-        },
-        error: report_failure
-      });
-    },
-    complete: function() {
-      loading = false;
-    }
-  });
-}// }}}
 
 async function load_des(url,model) { //{{{
   return $.ajax({
@@ -1510,13 +1478,27 @@ function format_visual_vote_clear() {//{{{
   $("#votes").empty();
  }//}}}
 
-function format_instance_pos() { //{{{
+function format_instance_pos_load() { //{{{
+  // counts were just cleared, they are rebuilt from the snapshot
+  save['instance_pos_anon'] = {};
+  track_forget_running(save['activity_red_states']);
+  track_forget_running(save['position_states']);
   $(save['instance_pos']).each(function(){
     var taskname = this.nodeName;
     var taskstate = this.textContent;
-    format_visual_add(taskname,save['state'] == 'running' ? (taskstate == 'at' ? 'active' : 'passive') : 'passive');
+    var anon = save['instance_pos_anon'][taskname] ??= {};
+    var clss = ['passive']; // like position events, at and after are passive
+    if (save['state'] == 'running' && taskstate == 'at') { clss.push('active'); }
+    clss.forEach((cls) => {
+      anon[cls] = (anon[cls] ?? 0) + 1;
+      format_visual_add(taskname,cls);
+    });
   });
 } //}}}
+function format_instance_pos() { //{{{
+  // graph was redrawn, so only render the current state again
+  Object.keys(node_state).forEach((what) => { format_visual_set(what); });
+} //}}}
 
 function format_visual_forms() { //{{{
   if (save['state'] != "ready" && save['state'] != "stopped") {
@@ -1651,4 +1633,12 @@ function add_ui_pos(e) { //{{{
   });
 } //}}}
 
-function report_failure(){}
+function report_failure(xhr,status,error){ //{{{
+  // used as ajax error callback, this is the request
+  append_to_log("failure", this.type + ' ' + this.url, xhr.status + ' ' + (error || status));
+} //}}}
+function report_model_failure(xhr,status,error){ //{{{
+  // if the server sends a real error, dont reload, we handle in sse, only if
+  // the server is down or we fail on riddl facade, reload
+  if (xhr.status == 0 || xhr.status >= 500) { monitor_graph_change(true); }
+} //}}}

data/cockpit/js/llm-ui-bubble.js

@@ -0,0 +1,36 @@
+function clean_bubble_ui_type(type) { //{{{
+  let status = $('#' + ui.current_bubble);
+  if (type == 'loading') {
+    status.removeClass('success');
+    status.removeClass('error');
+  } else if (type == 'success') {
+    status.removeClass('loading');
+    status.removeClass('error');
+  } else if (type == 'error') {
+    status.removeClass('success');
+    status.removeClass('loading');
+  } else {
+    status.removeClass('success');
+    status.removeClass('error');
+    status.removeClass('loading');
+  }
+} //}}}
+function set_bubble_ui(llms,what,type='') { //{{{
+  if (!what) { what = 'Unknown Error'; }
+  let status = $('#' + ui.current_bubble);
+  clean_bubble_ui_type(type);
+  status.addClass(type);
+  if (what.match(/Agent/)) {
+    let myllm = llms.find(":selected").val();
+    if (myllm === undefined){ myllm = default_llm; }
+    what += ' (' + myllm + ')';
+  }
+  status.text(what);
+  status[0].parentElement.scrollTo({ top: status[0].parentElement.scrollHeight, behavior: 'smooth' });
+} //}}}
+function add_bubble_ui(type) { //{{{
+  let id = Math.random().toString(36).substring(2, 10);
+  $('<div></div>').attr('id',id).addClass(type).appendTo('#status');
+  ui.current_bubble = id;
+  return id;
+} //}}}