feat (app): first setup

Dockerfile

@@ -0,0 +1,13 @@
+FROM python:3.9
+
+RUN useradd -m -u 1000 user
+USER user
+ENV PATH="/home/user/.local/bin:$PATH"
+
+WORKDIR /app
+
+COPY --chown=user ./requirements.txt requirements.txt
+RUN pip install --no-cache-dir --upgrade -r requirements.txt
+
+COPY --chown=user . /app
+CMD ["uvicorn", "server_factory_predictor:app", "--host", "0.0.0.0", "--port", "8000"]

README.md

@@ -1,6 +1,6 @@
 ---
-title: Factory Ml
-emoji: 🌖
+title: Factory ML
+emoji: 🏭
 colorFrom: indigo
 colorTo: yellow
 sdk: docker

evaluate.csv

@@ -0,0 +1,11 @@
+temperature,pressure,diagnosis
+77,153,N
+93,170,N
+87,43,P
+49,198,P
+110,30,P
+68,142,N
+104,38,P
+55,175,P
+82,157,N
+96,55,P

factory_predictor.py

@@ -0,0 +1,68 @@
+import pandas as pd
+from sklearn.linear_model import LogisticRegression
+from sklearn.preprocessing import LabelEncoder
+from sklearn.metrics import accuracy_score
+
+class FactoryPredictor:
+    def __init__(self):
+        self.model = LogisticRegression()
+        self.le_diagnosis = LabelEncoder()
+        self.temperature = 0
+        self.pressure = 0
+
+    def train(self, csv_train='train.csv', csv_test='test.csv'):
+        # Load the train data
+        data_train = pd.read_csv(csv_train)
+
+        # Encode categorical variables
+        data_train['diagnosis'] = self.le_diagnosis.fit_transform(data_train['diagnosis'])
+
+        # Split features and target
+        X_train = data_train[
+            ['temperature', 'pressure']]
+        y_train = data_train['diagnosis']
+
+        # Train the model
+        self.model.fit(X_train, y_train)
+
+        # Load the test data
+        data_test = pd.read_csv(csv_test)
+
+        # Encode categorical variables
+        data_test['diagnosis'] = self.le_diagnosis.fit_transform(data_test['diagnosis'])
+
+        # Split features and target
+        X_test = data_test[
+            ['temperature', 'pressure']]
+        y_test = data_test['diagnosis']
+
+        # Evaluate the model
+        y_pred = self.model.predict(X_test)
+        accuracy = accuracy_score(y_test, y_pred)
+        print(f"Model accuracy: {accuracy:.2f}")
+
+    def inform_temperature(self, temperature):
+        self.temperature = temperature
+        if self.pressure > 0:
+            return self.predict(self.temperature, self.pressure)
+        return 'N'
+
+    def inform_pressure(self, pressure):
+        self.pressure = pressure
+        if self.temperature > 0:
+            return self.predict(self.temperature, self.pressure)
+        return 'N'
+
+    def predict(self, temperature, pressure):
+        # Create a DataFrame with the same feature names as the training data
+        input_data = pd.DataFrame(
+            [[temperature, pressure]],
+            columns=['temperature', 'pressure'])
+
+        # Make prediction
+        prediction = self.model.predict(input_data)
+
+        # Decode prediction
+        diagnosis = self.le_diagnosis.inverse_transform(prediction)[0]
+
+        return diagnosis

requirements.txt

@@ -0,0 +1,4 @@
+fastapi
+uvicorn[standard]
+pandas
+scikit-learn

server_factory_predictor.py

@@ -0,0 +1,89 @@
+from fastapi import FastAPI, HTTPException, BackgroundTasks
+from fastapi.responses import RedirectResponse
+from fastapi.middleware.cors import CORSMiddleware
+from fastapi.responses import FileResponse
+from fastapi.staticfiles import StaticFiles
+import uvicorn
+import os
+
+# Import the FactoryPredictor class
+from factory_predictor import FactoryPredictor
+
+app = FastAPI()
+
+# Serve static files
+app.mount("/static", StaticFiles(directory="static"), name="static")
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["http://127.0.0.1:5173","http://localhost:5173","http://127.0.0.1:8000","http://localhost:8000"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+# Create a global instance of FactoryPredictor
+predictor = FactoryPredictor()
+
+# Global variable to store training status
+training_status = "Not started"
+
+# Redirect root to /docs
+@app.get("/")
+def root():
+    return RedirectResponse(url="/editor/")
+
+@app.get("/editor/")
+def get_editor():
+    return FileResponse(os.path.join("static", "editor", "index.html"))
+
+def train_model():
+    global training_status
+    training_status = "In progress"
+    try:
+        predictor.train()
+        training_status = "Completed"
+    except Exception as e:
+        training_status = f"Failed: {str(e)}"
+
+@app.post("/train")
+async def train(background_tasks: BackgroundTasks):
+    background_tasks.add_task(train_model)
+    return {"message": "Training started in the background"}
+
+@app.get("/training_status")
+async def get_training_status():
+    return {"status": training_status}
+
+@app.get("/predict")
+async def predict(temperature: int, pressure: int):
+    if training_status != "Completed":
+        raise HTTPException(status_code=400, detail="Model not trained yet")
+    try:
+        predicted_diagnosis = predictor.predict(temperature, pressure)
+        return {"diagnosis": str(predicted_diagnosis)}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e)) from e
+    
+@app.post("/inform_temperature")
+async def inform_temperature(value: int):
+    if training_status != "Completed":
+        raise HTTPException(status_code=400, detail="Model not trained yet")
+    try:
+        predicted_diagnosis = predictor.inform_temperature(value)
+        return str(predicted_diagnosis)
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e)) from e
+
+@app.post("/inform_pressure")
+async def inform_pressure(value: int):
+    if training_status != "Completed":
+        raise HTTPException(status_code=400, detail="Model not trained yet")
+    try:
+        predicted_diagnosis = predictor.inform_pressure(value)
+        return str(predicted_diagnosis)
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e)) from e
+
+if __name__ == "__main__":
+    uvicorn.run(app, host="0.0.0.0", port=8000)

static/editor/index.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Playground Editor</title>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mundorum/collections@0.3.0/full.min.css">
+  <script type="module" src="/static/editor/js/editor-rest.js"></script>
+  <script type="module">
+    import { EditorPg } from '/static/editor/js/editor-pg.js'
+    window.editorPg = EditorPg.i
+  </script>
+</head>
+<body onload="editorPg.start()">
+  <oid-sphere assets="https://mundorum.github.io/oid/oid/playground/assets/" stydefault="https://cdn.jsdelivr.net/npm/@mundorum/collections@0.3.0/full.min.css" global></oid-sphere>
+  <div style="width:100%;height:100vh;display:flex;flex-direction:column">
+    <div style="width:100%">
+    <h2>
+      <oid-sphere id="control" stylesheets="https://cdn.jsdelivr.net/npm/@mundorum/collections@0.3.0/" 
+                  style="display: flex; align-items: center; gap: 20px;">
+        Playground Editor
+        <file-oid label="Composition" publish="dispatch~file/loaded" style="width:200px"></file-oid>
+        <select id="oid-list" class="btn btn-secondary">
+          <option value="" selected>Select an id</option>
+        </select>
+        <button-oid label="Render" publish="click~control/render"></button-oid>
+        <button-oid label="Code" publish="click~control/code"></button-oid>
+        <button-oid label="Clear" publish="click~control/clear"></button-oid>
+        <button-oid label="Download Code" publish="click~control/download/code"></button-oid>
+        <button-oid label="Download Page" publish="click~control/download/page"></button-oid>
+      </oid-sphere>
+    </h2>
+    </div>
+    
+    <div style="height:100%">
+    <split-pane-oid>
+      <div style="width:100%;height:100%" slot="side-a">
+        <split-pane-oid split="vertical">
+          <div id="pg-tree" slot="side-a"
+               style="width:100%;height:100%;padding:5px;border-style:solid;border-width:1px">
+            <oid-sphere id="control">
+              <graph-oid layout="vh"
+                         subscribe="tree/node~node/add;tree/edge~edge/add;tree/clear~graph/clear"></graph-oid>
+            </oid-sphere>
+          </div>
+          <textarea id="pg-editor" slot="side-b" class="code"
+                    style="width:100%;height:100%"></textarea>
+        </split-pane-oid>
+      </div>
+      <div style="width:100%;height:100%" slot="side-b">
+        <split-pane-oid split="vertical" proportion="75%">
+          <div id="pg-render" slot="side-a"
+               style="width:100%;height:100%;padding:5px;border-style:solid;border-width:1px">
+          </div>
+          <div id="pg-bus" style="width:100%;height:100%" slot="side-b">
+            <oid-sphere id="control">
+              <console-oid class="code" prompt="" subscribe="control/monitor~display">
+              </console-oid>
+            </oid-sphere>
+          </div>
+        </split-pane-oid>
+      </div>
+    </split-pane-oid>
+  </div>
+  </div>
+</body>
+</html>

static/editor/js/editor-pg.js

@@ -0,0 +1,147 @@
+import { Sphere, Bus } from 'https://cdn.jsdelivr.net/npm/@mundorum/collections@0.3.0/full.js'
+// import { Sphere, Bus } from '@mundorum/oid/oid.js'
+
+// if (!new URL(document.location).searchParams.has('dev')) {
+//   await import('@mundorum/collections/full.js')
+// }
+
+export class EditorPg {
+  start () {
+    this._controlSphere = Sphere.get('control').bus
+    this._controlSphere.subscribe(
+      'file/loaded', this._renderFile.bind(this))
+    this._controlSphere.subscribe(
+      'control/download/code', this._downloadCode.bind(this))
+    this._controlSphere.subscribe(
+      'control/download/page', this._downloadPage.bind(this))
+    this._controlSphere.subscribe(
+      'control/render', this._renderOids.bind(this))
+    this._controlSphere.subscribe(
+      'control/code', this._codeOids.bind(this))
+    this._controlSphere.subscribe(
+      'control/clear', this._clearOids.bind(this))
+    Bus.i.subscribe('#', this._busMonitor.bind(this))
+  }
+
+  _renderFile (topic, message) {
+    this._template = message.value
+    document.querySelector("#pg-render").innerHTML = this._template
+    this._showTree()
+  }
+
+  _showTree () {
+    const root = document.querySelector("#pg-render")
+    this._controlSphere.publish('tree/clear')
+    document.querySelector("#oid-list").innerHTML =
+      '<option value="">Select an OID</option>'
+    for (let childId = 1; childId <= root.children.length; childId++)
+      this._buildTree(root.children[childId-1], null, childId)
+  }
+
+  _buildTree (element, parentId, childId) {
+    const id = (parentId != null) ? `${parentId}.${childId}` : `${childId}`
+    const name = element.nodeName.toLowerCase()
+
+    // node
+    const node = { id: id,
+                   label: name + (element.id ? `: ${element.id}` : '') }
+    if (!name.endsWith('-oid'))
+      node.format = 'light'
+    this._controlSphere.publish('tree/node', node)
+    if (element.id) {
+      const option = document.createElement('option')
+      option.value = element.id
+      option.text = element.id
+      document.querySelector("#oid-list").appendChild(option)
+    }
+
+    // edge
+    if (parentId != null) {
+      const edge = { source: parentId,
+                     target: id }
+      this._controlSphere.publish('tree/edge', edge)
+    }
+
+    for (let childId = 1; childId <= element.children.length; childId++)
+      this._buildTree(element.children[childId-1], id, childId)
+  }
+
+  _renderOids () {
+    const div = document.createElement('div')
+    div.innerHTML = document.querySelector("#pg-editor").value
+
+    const selectedOption = document.querySelector("#oid-list").value
+    let base = document.querySelector(
+      (selectedOption === '') ? '#pg-render' : `#${selectedOption}`)
+
+    if (base instanceof SVGElement) {
+      const foreignObject = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject')
+      foreignObject.setAttribute('width', '100%')
+      foreignObject.setAttribute('height', '100%')
+      base.appendChild(foreignObject)
+      base = foreignObject
+    }
+
+    while (div.firstChild)
+      base.appendChild(div.firstChild)
+
+    this._showTree()
+  }
+
+  _codeOids () {
+    const selectedOption = document.querySelector("#oid-list").value
+    const base = document.querySelector(
+      (selectedOption === '') ? '#pg-render' : `#${selectedOption}`)
+    document.querySelector("#pg-editor").value = base.innerHTML
+  }
+
+  _clearOids () {
+    document.querySelector("#pg-render").innerHTML = 
+      (this._template != null) ? this._template : ''
+    this._showTree()
+  }
+
+  _busMonitor (topic, message) {
+    Sphere.get('control').bus.
+      publish('control/monitor', {value: `[${topic}] ${JSON.stringify(message)}`})
+  }
+
+  _downloadCode () {
+    this._download('code.html', document.querySelector('#pg-render').innerHTML)
+  }
+
+  _downloadPage () {
+    this._download('page.html',
+                   EditorPg.pageBegin +
+                   document.querySelector('#pg-render').innerHTML +
+                   EditorPg.pageEnd)
+  }
+
+  _download (fileName, content) {
+    const a = document.createElement('a')
+    a.style.display = 'none'
+    document.body.appendChild(a)
+    a.href = window.URL.createObjectURL(
+      new Blob([content], {type: 'text/plain'}))
+    a.setAttribute('download', fileName)
+    a.click()
+    window.URL.revokeObjectURL(a.href)
+    document.body.removeChild(a)
+  }
+}
+
+EditorPg.i = new EditorPg()
+
+EditorPg.pageBegin =
+`<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mundorum/oid/oid.min.css">
+  <script src="https://cdn.jsdelivr.net/npm/@mundorum/collections/full.min.js"></script>
+</head>
+<body>
+<oid-sphere assets="https://mundorum.github.io/oid/oid/playground/assets/" stydefault="https://cdn.jsdelivr.net/npm/@mundorum/oid/oid.min.css" global></oid-sphere>`
+
+EditorPg.pageEnd =
+`</body>
+</html>`

static/editor/js/editor-rest.js

@@ -0,0 +1,79 @@
+import { Oid } from 'https://cdn.jsdelivr.net/npm/@mundorum/collections@0.3.0/full.js'
+// import { Oid } from '@mundorum/oid/oid.js'
+
+Oid.customize('oid:rest', {
+  cid: 'cancer-predictor',
+  api: {
+    oas: {
+      paths: {
+        'http://127.0.0.1:8000/train?train_path={train_path}&test_path={test_path}': {
+          'post': {
+            operationId: 'train',
+            parameters: [
+              {name: 'train_path',
+               in: 'path'
+              },
+              {name: 'test_path',
+               in: 'path'
+              }
+            ]
+          }
+        },
+        'http://127.0.0.1:8000/predict?radius_mean={radius_mean}&texture_mean={texture_mean}&symmetry_mean={symmetry_mean}&fractal_dimension_mean={fractal_dimension_mean}': {
+          'get': {
+            operationId: 'predict',
+            parameters: [
+              {name: 'radius_mean',
+               in: 'path'
+              },
+              {name: 'texture_mean',
+               in: 'path'
+              },
+              {name: 'symmetry_mean',
+               in: 'path'
+              },
+              {name: 'fractal_dimension_mean',
+               in: 'path'
+              }
+            ]
+          }
+        }
+      }
+    }
+  }
+})
+
+Oid.customize('oid:rest', {
+  cid: 'factory-predictor',
+  api: {
+    oas: {
+      paths: {
+        'http://127.0.0.1:8000/train': {
+          'post': {
+            operationId: 'train'
+          }
+        },
+        'http://127.0.0.1:8000/inform_temperature?value={value}': {
+          'post': {
+            operationId: 'temperature',
+            parameters: [
+              {name: 'value',
+               in: 'path'
+              }
+            ]
+          }
+        },
+        'http://127.0.0.1:8000/inform_pressure?value={value}': {
+          'post': {
+            operationId: 'pressure',
+            parameters: [
+              {name: 'value',
+               in: 'path'
+              }
+            ]
+          }
+        }
+      }
+    }
+  }
+})

static/gallery/factory-ai.html

@@ -0,0 +1,40 @@
+<div style="width: 100%; height: 60%; background-color: lightgrey; text-align: center">
+  <div style="font-size:larger;font-weight: bold">Factory</div>
+  <span id="engine" style="width: 45%; display: inline-block; vertical-align: middle">
+    <image-oid source="assets:images/di-pietro-engine.gif" publish="mouseleave~thermo/low;mouseenter~thermo/medium;click~thermo/high/alert">
+    </image-oid>
+  </span> 
+  <span id="cooler" style="width: 45%; display: inline-block; vertical-align: middle">
+    <state-pane-oid initial="off" subscribe="predictor/train~last">
+      <image-oid id="off" source="assets:images/evaporative-cooling.png"></image-oid>
+      <image-oid id="on" source="assets:images/evaporative-cooling.gif"></image-oid>
+    </state-pane-oid>
+  </span>
+</div>
+<div style="width: 100%; height: 35%; background-color: grey; text-align: center">
+  <div style="font-size: larger; font-weight: bold;">Control Panel</div>
+  <span id="alert" style="width: 20%; display: inline-block; vertical-align: middle">
+    <state-pane-oid initial="N" subscribe="update/alert~state">
+      <image-oid id="N" source="assets:images/light-green.svg"></image-oid>
+      <image-oid id="P" source="assets:images/light-red.svg"></image-oid>
+    </state-pane-oid>
+  </span>
+  <span id="train" style="width: 20%; display: inline-block; vertical-align: middle">
+    <switch-oid publish="on~predictor/train">
+    </switch-oid>
+  </span>
+  <span id="temperature" style="width: 20%; display: inline-block; vertical-align: middle">
+    <div style="font-size: larger; font-weight: bold;">Temperature</div>
+    <slider-oid min="40" max="120" value="40" index publish="change~predictor/temperature">
+    </slider-oid>
+  </span>
+  <span id="pressure" style="width: 20%; display: inline-block; vertical-align: middle">
+    <div style="font-size: larger; font-weight: bold;">Pressure</div>
+    <slider-oid min="40" max="200" value="40" index publish="change~predictor/pressure">
+    </slider-oid>
+  </span>
+  <rest-oid custom="factory-predictor"
+            subscribe="predictor/train~post/train;predictor/temperature~post/temperature;predictor/pressure~post/pressure"
+            publish="dispatch~update/alert">
+  </rest-oid>
+</div>

test.csv

@@ -0,0 +1,11 @@
+temperature,pressure,diagnosis
+70,145,N
+88,162,N
+83,158,N
+97,47,P
+53,188,P
+45,200,P
+105,35,P
+65,140,N
+102,42,P
+58,182,P

train.csv

@@ -0,0 +1,17 @@
+temperature,pressure,diagnosis
+75,150,N
+80,155,N
+72,148,N
+85,160,N
+78,152,N
+90,165,N
+95,50,P
+100,45,P
+85,40,P
+92,48,P
+98,52,P
+50,180,P
+55,190,P
+48,195,P
+60,185,P
+52,192,P