ivoryos 1.2.5__py3-none-any.whl → 1.4.4__py3-none-any.whl

ivoryos/routes/data/templates/workflow_view.html

@@ -4,127 +4,357 @@
 
 {% block body %}
 <style>
-  .vis-time-axis .vis-text.vis-minor,
-  .vis-time-axis .vis-text.vis-major {
-    color: #666;
-  }
-  .vis-item.stop {
-    background-color: red;
-    color: white;
-    border: none;
-    font-weight: bold;
-  }
+    .vis-time-axis .vis-text.vis-minor,
+    .vis-time-axis .vis-text.vis-major {
+        color: #666;
+    }
+    .vis-item.stop {
+        background-color: #dc3545;
+        color: white;
+        border: none;
+        font-weight: bold;
+    }
+    .vis-item.prep {
+        background-color: #17a2b8;
+        border-color: #138496;
+    }
+    .vis-item.script {
+        background-color: #28a745;
+        border-color: #1e7e34;
+    }
+    .vis-item.cleanup {
+        background-color: #ffc107;
+        border-color: #d39e00;
+        color: #212529;
+    }
+    #visualization {
+        border: 1px solid #dee2e6;
+        border-radius: 0.375rem;
+        background-color: #fff;
+        min-height: 200px;
+    }
+
+    .section-header {
+        border-bottom: 2px solid #dee2e6;
+        padding-bottom: 0.5rem;
+        margin-bottom: 1rem;
+        color: #495057;
+    }
+    .loading-spinner {
+        display: none;
+    }
 </style>
 
-<div id="timeline"></div>
 
+    <div class="timeline-section" style="margin-bottom: 2rem;">
+        <h3 class="section-header">
+            <i class="fas fa-clock me-2"></i>Execution Timeline
+        </h3>
+        <div class="alert alert-info" role="alert">
+            <i class="fas fa-info-circle me-2"></i>
+            <strong>Tip:</strong> Click on timeline items to navigate to detailed views. Use Ctrl+scroll to zoom.
+        </div>
+        <div id="visualization"></div>
+    </div>
+
+    <!-- Phase Output Plot Section -->
+
+    <div class="data-section" style="margin-bottom: 2rem;">
+        <h3 class="section-header">
+            <div class="col-md-6">
+                <label for="output-select" class="form-label">Select Data Type:</label>
+                <select id="output-select" class="form-select">
+                    <option value="">Loading data types...</option>
+                </select>
+            </div>
+        </h3>
+
+        <div class="plot-controls">
+            <div>
+                <div class="col-md-6 text-md-end">
+                    <div class="loading-spinner">
+                        <div class="spinner-border spinner-border-sm text-primary me-2" role="status">
+                            <span class="visually-hidden">Loading...</span>
+                        </div>
+                        Loading plot data...
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div id="phase-plot" style="height:450px;" class="border rounded bg-white shadow-sm"></div>
+    </div>
+
+    <!-- Workflow Details Section -->
+
+    <div>
+        <h2 class="section-header">
+            <i class="fas fa-project-diagram me-2"></i>Workflow: {{ workflow.name }}
+        </h2>
+
+        <!-- Prep Phase -->
+        {% if grouped.prep %}
+            <div class="mb-4">
+                <h4 class="text-info mb-3">
+                    <i class="fas fa-tools me-2"></i>Prep
+                </h4>
+                <div class="row">
+                    {% for phase in grouped.prep %}
+                        <div class="col-lg-6 mb-3">
+                            {% include "components/step_card.html" %}
+                        </div>
+                    {% endfor %}
+                </div>
+            </div>
+        {% endif %}
+
+        <!-- Script Iterations -->
+        {% for repeat_index, phase_list in grouped.script.items()|sort %}
+            <div class="mb-4" id="card-iter{{ repeat_index }}">
+                <h4 class="text-success mb-3">
+                    <i class="fas fa-redo me-2"></i>Iteration {{ repeat_index }}
+                </h4>
+                <div class="row">
+                    {% for phase in phase_list %}
+                        <div class="col-lg-6 mb-3">
+                            {% include "components/step_card.html" %}
+                        </div>
+                    {% endfor %}
+                </div>
+            </div>
+        {% endfor %}
+
+        <!-- Cleanup Phase -->
+        {% if grouped.cleanup %}
+            <div>
+                <h4 class="text-warning mb-3">
+                    <i class="fas fa-broom me-2"></i>Cleanup
+                </h4>
+                <div class="row">
+                    {% for phase in grouped.cleanup %}
+                        <div class="col-lg-6 mb-3">
+                            {% include "components/step_card.html" %}
+                        </div>
+                    {% endfor %}
+                </div>
+            </div>
+        {% endif %}
+    </div>
+
+
+
+<!-- External Dependencies -->
 <script src="https://unpkg.com/vis-timeline@latest/standalone/umd/vis-timeline-graph2d.min.js"></script>
 <link href="https://unpkg.com/vis-timeline@latest/styles/vis-timeline-graph2d.min.css" rel="stylesheet"/>
+<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
 
-<h1>Experiment Step View</h1>
+<script type="text/javascript">
+    document.addEventListener('DOMContentLoaded', function() {
+        // ---------------- Timeline Setup ----------------
+        const container = document.getElementById('visualization');
+        const groups = [
+            { id: 'all', content: 'Workflow Execution' }
+        ];
 
-<div id="visualization"></div>
+        const items = [
+            {% if grouped.prep %}
+                {
+                    id: 'prep',
+                    content: 'Prep',
+                    start: '{{ grouped.prep[0].start_time }}',
+                    end: '{{ grouped.prep[-1].end_time }}',
+                    className: 'prep',
+                    group: 'all',
+                },
+            {% endif %}
 
-<script type="text/javascript">
-  var container = document.getElementById('visualization');
-
-  const items = [
-    {% if grouped.prep %}
-      {
-        id: 'prep',
-        content: 'Prep Phase',
-        start: '{{ grouped.prep[0].start_time }}',
-        end: '{{ grouped.prep[-1].end_time }}',
-        className: 'prep',
-        group: 'prep'
-      },
-    {% endif %}
-
-    {% for repeat_index, step_list in grouped.script.items()|sort %}
-      {
-        id: 'iter{{ repeat_index }}',
-        content: 'Iteration {{ repeat_index }}',
-        start: '{{ step_list[0].start_time }}',
-        end: '{{ step_list[-1].end_time }}',
-        className: 'script',
-        group: 'iter{{ repeat_index }}'
-      },
-      {% for step in step_list %}
-        {% if step.method_name == "stop" %}
-          {
-            id: 'stop-{{ step.id }}',
-            content: '🛑 Stop',
-            start: '{{ step.start_time }}',
-            type: 'point',
-            className: 'stop',
-            group: 'iter{{ repeat_index }}'
-          },
-        {% endif %}
-      {% endfor %}
-    {% endfor %}
-
-    {% if grouped.cleanup %}
-      {
-        id: 'cleanup',
-        content: 'Cleanup Phase',
-        start: '{{ grouped.cleanup[0].start_time }}',
-        end: '{{ grouped.cleanup[-1].end_time }}',
-        className: 'cleanup',
-        group: 'cleanup'
-
-      },
-    {% endif %}
-  ];
-
-  const groups = [
-      {% if grouped.prep %}{ id: 'prep', content: 'Prep' },{% endif %}
-      {% for repeat_index in grouped.script.keys()|sort %}{ id: 'iter{{ repeat_index }}', content: 'Iteration {{ repeat_index }}' },{% endfor %}
-      {% if grouped.cleanup %}{ id: 'cleanup', content: 'Cleanup' },{% endif %}
-  ];
-
-  var options = {
-      clickToUse: true,
-      stack: false,  // important to keep point within group row
-      horizontalScroll: true,
-      zoomKey: 'ctrlKey'
-  };
-
-  // Initialize your timeline with the sorted groups
-  const timeline = new vis.Timeline(container, items, groups, options);
-
-  timeline.on('select', function (props) {
-    const id = props.items[0];
-    if (id && id.startsWith('iter')) {
-      const card = document.getElementById('card-' + id);
-      if (card) {
-        const yOffset = -80;
-        const y = card.getBoundingClientRect().top + window.pageYOffset + yOffset;
-        window.scrollTo({ top: y, behavior: 'smooth' });
-      }
-    }
-  });
+            {% for repeat_index, step_list in grouped.script.items()|sort %}
+                {
+                    id: 'iter{{ repeat_index }}',
+                    content: 'Iteration {{ repeat_index }}',
+                    start: '{{ step_list[0].start_time }}',
+                    end: '{{ step_list[-1].end_time }}',
+                    className: 'script',
+                    group: 'all',
+                },
+                {% for step in step_list %}
+                    {% if step.method_name == "stop" %}
+                        {
+                            id: 'stop-{{ step.id }}',
+                            content: '🛑 Stop',
+                            start: '{{ step.start_time }}',
+                            type: 'point',
+                            className: 'stop',
+                            group: 'all',
+                            title: 'Stop event at {{ step.start_time }}'
+                        },
+                    {% endif %}
+                {% endfor %}
+            {% endfor %}
+
+            {% if grouped.cleanup %}
+                {
+                    id: 'cleanup',
+                    content: 'Cleanup ',
+                    start: '{{ grouped.cleanup[0].start_time }}',
+                    end: '{{ grouped.cleanup[-1].end_time }}',
+                    className: 'cleanup',
+                    group: 'all',
+                },
+            {% endif %}
+        ];
+
+        var timeline = new vis.Timeline(container, items, groups, {
+            clickToUse: true,
+            stack: false,        // keep items from overlapping vertically
+            horizontalScroll: true,
+            zoomKey: 'ctrlKey'
+        });
+
+        timeline.on('select', function (props) {
+            const id = props.items[0];
+            if (id && id.startsWith('iter')) {
+                const card = document.getElementById('card-' + id);
+                if (card) {
+                    const yOffset = -80;
+                    const y = card.getBoundingClientRect().top + window.pageYOffset + yOffset;
+                    window.scrollTo({ top: y, behavior: 'smooth' });
+                }
+            }
+        });
+
+        // ---------------- Phase Data Plot ----------------
+        const loadingSpinner = document.querySelector('.loading-spinner');
+        const select = document.getElementById('output-select');
+
+        loadingSpinner.style.display = 'block';
+
+
+        fetch("{{ url_for('data.workflow_phase_data', workflow_id=workflow.id) }}")
+            .then(res => {
+                if (!res.ok) {
+                    throw new Error(`HTTP error! status: ${res.status}`);
+                }
+                return res.json();
+            })
+            .then(data => {
+                loadingSpinner.style.display = 'none';
+
+                const repeatKeys = Object.keys(data).sort((a, b) => a - b);
+                const dataSection = document.querySelector('.data-section'); // Get the entire section
+
+                if (!repeatKeys.length) {
+                    // Hide the entire data section if no data
+                    dataSection.style.display = 'none';
+                    return;
+                }
+
+                const allKeys = new Set();
+                repeatKeys.forEach(k => {
+                    Object.keys(data[k]).forEach(key => allKeys.add(key));
+                });
+
+                // If no keys found, also hide the section
+                if (allKeys.size === 0) {
+                    dataSection.style.display = 'none';
+                    return;
+                }
+
+                // Show the data section since we have data
+                dataSection.style.display = 'block';
+
+                // Clear and populate select options
+                select.innerHTML = '';
+                allKeys.forEach(k => {
+                    const option = new Option(k, k);
+                    select.appendChild(option);
+                });
+
+                function plotData(selectedKey) {
+                    const x = [];
+                    const y = [];
+
+                    repeatKeys.forEach(repeat_index => {
+                        const arr = data[repeat_index][selectedKey];
+                        if (arr && arr.length) {
+                            const batchCount = arr.length;
+
+                            arr.forEach((d, batchIdx) => {
+                                // Compute fractional x for batch indexing: e.g. 1.1, 1.2, 1.3
+                                const xVal = parseFloat(repeat_index) + (batchIdx + 1) / (batchCount + 1);
+
+                                if (typeof d === 'object' && d.x !== undefined && d.y !== undefined) {
+                                    x.push(xVal);
+                                    y.push(d.y);
+                                } else if (typeof d === 'number') {
+                                    x.push(xVal);
+                                    y.push(d);
+                                }
+                            });
+                        }
+                    });
+
+                    const trace = {
+                        x: x,
+                        y: y,
+                        mode: 'markers',
+                        name: selectedKey,
+                        marker: { size: 8 },
+                        line: { shape: 'linear', width: 1 },
+                    };
+
+                    const layout = {
+                        xaxis: {
+                            title: 'Trial (Batch Sub-index)',
+                            gridcolor: '#e9ecef',
+                            tickvals: repeatKeys.map(k => parseFloat(k)),
+                            ticktext: repeatKeys.map(k => `Trial ${k}`),
+                        },
+                        yaxis: {
+                            title: selectedKey,
+                            gridcolor: '#e9ecef'
+                        },
+                        plot_bgcolor: '#ffffff',
+                        paper_bgcolor: '#ffffff',
+                        margin: { t: 60, r: 40, b: 60, l: 80 }
+                    };
+
+                    const config = {
+                        responsive: true,
+                        displayModeBar: true,
+                        modeBarButtonsToRemove: ['lasso2d', 'select2d']
+                    };
+
+                    Plotly.newPlot('phase-plot', [trace], layout, config);
+                }
+
+                select.addEventListener('change', e => {
+                    if (e.target.value) {
+                        plotData(e.target.value);
+                    }
+                });
+
+                // Plot first available data type
+                if (allKeys.size > 0) {
+                    plotData([...allKeys][0]);
+                }
+            })
+            .catch(error => {
+                loadingSpinner.style.display = 'none';
+                console.error('Error loading phase data:', error);
+
+                const dataSection = document.querySelector('.data-section');
+                // Hide the section on error as well
+                dataSection.style.display = 'none';
+
+                // Optionally, you could show an error message instead:
+                // dataSection.innerHTML = `
+                //     <div class="alert alert-danger m-3" role="alert">
+                //         <i class="fas fa-exclamation-triangle me-2"></i>
+                //         <strong>Error:</strong> Unable to load phase data. ${error.message}
+                //     </div>
+                // `;
+            });
+    });
 </script>
 
-<h2>Workflow: {{ workflow.name }}</h2>
-
-{% if grouped.prep %}
-  <h4 class="mt-4">Prep Phase</h4>
-  {% for step in grouped.prep %}
-    {% include "components/step_card.html" %}
-  {% endfor %}
-{% endif %}
-
-{% for repeat_index, step_list in grouped.script.items()|sort %}
-  <h4 class="mt-4" id="card-iter{{ repeat_index }}">Iteration {{ repeat_index }}</h4>
-  {% for step in step_list %}
-    {% include "components/step_card.html" %}
-  {% endfor %}
-{% endfor %}
-
-{% if grouped.cleanup %}
-  <h4 class="mt-4">Cleanup Phase</h4>
-  {% for step in grouped.cleanup %}
-    {% include "components/step_card.html" %}
-  {% endfor %}
-{% endif %}
 {% endblock %}

ivoryos/routes/design/design.py

@@ -35,6 +35,9 @@ def _create_forms(instrument, script, autofill, pseudo_deck = None):
         _object = global_config.defined_variables.get(instrument)
         functions = utils._inspect_class(_object)
         forms = create_form_from_pseudo(pseudo=functions, autofill=autofill, script=script)
+    elif instrument.startswith("blocks"):
+        forms = create_form_from_pseudo(pseudo=global_config.building_blocks[instrument], autofill=autofill, script=script)
+        functions = global_config.building_blocks[instrument]
     else:
         if deck:
             functions = global_config.deck_snapshot.get(instrument, {})
@@ -84,15 +87,39 @@ def experiment_builder():
 
     # edit_action_info = session.get("edit_action")
 
-
-    exec_string = script.python_script if script.python_script else script.compile(current_app.config['SCRIPT_FOLDER'])
+    try:
+        exec_string = script.python_script if script.python_script else script.compile(current_app.config['SCRIPT_FOLDER'])
+    except Exception as e:
+        exec_string = {}
+        flash(f"Error in Python script: {e}")
     session['python_code'] = exec_string
 
     design_buttons = {stype: create_action_button(script, stype) for stype in script.stypes}
 
     return render_template('experiment_builder.html', off_line=off_line, history=deck_list,
                            script=script, defined_variables=deck_variables, buttons_dict=design_buttons,
-                           local_variables=global_config.defined_variables)
+                           local_variables=global_config.defined_variables, block_variables=global_config.building_blocks)
+
+@design.route("/draft/code_preview", methods=["GET"])
+@login_required
+def compile_preview():
+    # Get mode and batch from query parameters
+    script = utils.get_script_file()
+    mode = request.args.get("mode", "single")   # default to "single"
+    batch = request.args.get("batch", "sample") # default to "sample"
+
+    try:
+        # Example: decide which code to return based on mode/batch
+        if mode == "single":
+            code = script.compile(current_app.config['SCRIPT_FOLDER'])
+        elif mode == "batch":
+            code = script.compile(current_app.config['SCRIPT_FOLDER'], batch=True, mode=batch)
+        else:
+            code = "Invalid mode. Please select 'single' or 'batch'."
+    except Exception as e:
+        code = f"Error compiling: {e}"
+    # print(code)
+    return jsonify(code=code)
 
 
 @design.route("/draft/meta", methods=["PATCH"])
@@ -192,7 +219,8 @@ def update_ui_state():
         deck_variables = list(pseudo_deck.keys()) if pseudo_deck else []
         deck_variables.remove("deck_name") if len(deck_variables) > 0 else deck_variables
         html = render_template("components/sidebar.html", history=deck_list,
-                               defined_variables=deck_variables, local_variables = global_config.defined_variables)
+                               defined_variables=deck_variables, local_variables = global_config.defined_variables,
+                               block_variables=global_config.building_blocks)
         return jsonify({"html": html})
     return jsonify({"error": "Invalid request"}), 400
 
@@ -253,7 +281,7 @@ def submit_script():
     """
     .. :quickref: Workflow Design; convert Python to workflow script
 
-    .. http:post:: /design/submit_python
+    .. http:post:: /draft/submit_python
 
     Convert a Python script to a workflow script and save it in the database.
 
@@ -310,26 +338,39 @@ def methods_handler(instrument: str = ''):
 
     success = True
     msg = ""
+    request.form
     if "hidden_name" in request.form:
+        deck_snapshot = global_config.deck_snapshot
+        block_snapshot = global_config.building_blocks
         method_name = request.form.get("hidden_name", None)
         form = forms.get(method_name) if forms else None
         insert_position = request.form.get("drop_target_id", None)
+
         if form:
             kwargs = {field.name: field.data for field in form if field.name != 'csrf_token'}
             if form.validate_on_submit():
                 function_name = kwargs.pop("hidden_name")
+                batch_action = kwargs.pop("batch_action", False)
                 save_data = kwargs.pop('return', '')
                 primitive_arg_types = utils.get_arg_type(kwargs, functions[function_name])
 
                 # todo
-                print(primitive_arg_types)
+                # print(primitive_arg_types)
 
                 script.eval_list(kwargs, primitive_arg_types)
                 kwargs = script.validate_variables(kwargs)
+                coroutine = False
+                if instrument.startswith("deck") and deck_snapshot:
+                    coroutine = deck_snapshot[instrument][function_name].get("coroutine", False)
+                elif instrument.startswith("blocks") and block_snapshot:
+                    coroutine = block_snapshot[instrument][function_name].get("coroutine", False)
                 action = {"instrument": instrument, "action": function_name,
                           "args": kwargs,
                           "return": save_data,
-                          'arg_types': primitive_arg_types}
+                          'arg_types': primitive_arg_types,
+                          "coroutine": coroutine,
+                          "batch_action": batch_action,
+                          }
                 script.add_action(action=action, insert_position=insert_position)
             else:
                 msg = [f"{field}: {', '.join(messages)}" for field, messages in form.errors.items()]
@@ -374,7 +415,13 @@ def methods_handler(instrument: str = ''):
                 success = False
                 msg = [f"{field}: {', '.join(messages)}" for field, messages in form.errors.items()]
     utils.post_script_file(script)
-    exec_string = script.compile(current_app.config['SCRIPT_FOLDER'])
+    #TODO
+    try:
+        exec_string = script.compile(current_app.config['SCRIPT_FOLDER'])
+    except Exception as e:
+        exec_string = {}
+        msg = f"Compilation failed: {str(e)}"
+    # exec_string = script.compile(current_app.config['SCRIPT_FOLDER'])
     session['python_code'] = exec_string
     design_buttons = {stype: create_action_button(script, stype) for stype in script.stypes}
     html = render_template("components/canvas_main.html", script=script, buttons_dict=design_buttons)
@@ -388,7 +435,7 @@ def get_operation_sidebar(instrument: str = ''):
     """
     .. :quickref: Workflow Design; handle methods of a specific instrument
 
-    .. http:get:: /design/instruments/<string:instrument>
+    .. http:get:: /draft/instruments/<string:instrument>
 
     :param instrument: The name of the instrument to handle methods for.
     :type instrument: str
@@ -422,7 +469,9 @@ def get_operation_sidebar(instrument: str = ''):
         # edit_action_info = session.get("edit_action")
         html = render_template("components/sidebar.html", off_line=off_line, history=deck_list,
                                defined_variables=deck_variables,
-                               local_variables=global_config.defined_variables)
+                               local_variables=global_config.defined_variables,
+                               block_variables=global_config.building_blocks,
+                               )
     return jsonify({"html": html})
 
 

ivoryos/routes/design/design_file.py

@@ -17,7 +17,7 @@ def load_json():
     .. http:post:: /files/script-json
 
     :form file: workflow design JSON file
-    :status 302: load script json and then redirects to :http:get:`/ivoryos/design/draft`
+    :status 302: load script json and then redirects to :http:get:`/ivoryos/draft`
     """
 
     if request.method == "POST":
@@ -38,7 +38,7 @@ def download_python():
 
     .. http:post:: /files/script-python
 
-    :status 302: redirects to :http:get:`/ivoryos/design/script/`
+    :status 302: redirects to :http:get:`/ivoryos/draft`
     """
     script = utils.get_script_file()
     run_name = script.name if script.name else "untitled"
@@ -53,7 +53,7 @@ def download_json():
 
     .. http:post:: /files/script-json
 
-    :status 302: redirects to :http:get:`/ivoryos/design/script/`
+    :status 302: redirects to :http:get:`/ivoryos/draft`
     """
     script = utils.get_script_file()
     run_name = script.name if script.name else "untitled"