bug fix: error, layout & error handling

www/html/_assets/js/studio.js

@@ -209,12 +209,16 @@ studio.frame = function (_args){
         http.post(uri,function(x){
             if(x.status == 200 && x.readyState == 4){
                 _r = JSON.parse(x.responseText)
-                sessionStorage._data = x.responseText
-                // console.log(_r)
+                // sessionStorage._data = x.responseText
                 _compute(_label,_r)
 
             }else{
-                alert(' error round '+x.responseText)
+                const parser = new DOMParser();
+                const doc = parser.parseFromString(x.responseText, 'text/html');
+                _message = $(doc.querySelector('title')).text().replace(/\/\/ Werkzeug Debugger/g,'').trim()
+                
+                sessionStorage.error_mesage = _message
+                dialog.show({uri:'www/html/error.html',title:'Error Found',context:studio._context})
             }
         })
 
@@ -360,7 +364,7 @@ studio.frame = function (_args){
             
             sessionStorage._label = _args.label
             sessionStorage._query = _query
-            var _kwargs = {uri:'www/html/sheet.html',title:'Generated Python Code',context:''}
+            var _kwargs = {uri:'www/html/python.html',title:'Generated Python Code',context:studio._context}
             dialog.show(_kwargs)
 
         })

www/html/error.html

@@ -0,0 +1,30 @@
+<style>
+    .error {
+        display:grid;
+        grid-template-columns: 48px auto;
+        gap:8px;
+        align-items: center;
+        align-content: center;
+        width:650px;
+    }
+    .error .fa-triangle-exclamation {font-size:48px; color:maroon;}
+</style>
+<script>
+    $(document).ready(function(){
+        var _msg = sessionStorage.error_mesage
+        $('.error .message').html(_msg)
+    })
+</script>
+<div class="error">
+    <div>
+        <i class="fa-solid fa-triangle-exclamation"></i>
+    </div>
+    <div class="message"></div>
+</div>
+<p>
+    <div class="border border-round" align="center" style="margin-left:25%; width:50%"
+    onclick="$('.jxmodal').slideUp( function(){ $('.jxmodal').remove()})"
+    >
+        <div class="active">Okay</div>
+    </div>
+</p>