From fd1af0a4d194d8567da50e9e2797674c91cde088 Mon Sep 17 00:00:00 2001
From: Demis Bellot <demis.bellot@gmail.com>
Date: Wed, 16 Oct 2024 17:39:00 +0800
Subject: [PATCH] update diagram

---
 AiServer/wwwroot/img/overview.svg          | 2 +-
 AiServer/wwwroot/mjs/components/UiHome.mjs | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/AiServer/wwwroot/img/overview.svg b/AiServer/wwwroot/img/overview.svg
index 771ea74..6d959fc 100644
--- a/AiServer/wwwroot/img/overview.svg
+++ b/AiServer/wwwroot/img/overview.svg
@@ -1 +1 @@
-<svg aria-roledescription="flowchart-v2" role="graphics-document document" viewBox="0 0 412.1500244140625 323.8000183105469" style="max-width: 412.1500244140625px;" class="flowchart" xmlns="http://www.w3.org/2000/svg" width="100%" id="export-svg"><style xmlns="http://www.w3.org/1999/xhtml">@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"); p {margin: 0;}</style><style>#export-svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:10px;fill:#333;}#export-svg .error-icon{fill:#ffffff;}#export-svg .error-text{fill:#000000;stroke:#000000;}#export-svg .edge-thickness-normal{stroke-width:1px;}#export-svg .edge-thickness-thick{stroke-width:3.5px;}#export-svg .edge-pattern-solid{stroke-dasharray:0;}#export-svg .edge-thickness-invisible{stroke-width:0;fill:none;}#export-svg .edge-pattern-dashed{stroke-dasharray:3;}#export-svg .edge-pattern-dotted{stroke-dasharray:2;}#export-svg .marker{fill:#000000;stroke:#000000;}#export-svg .marker.cross{stroke:#000000;}#export-svg svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:10px;}#export-svg p{margin:0;}#export-svg .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#export-svg .cluster-label text{fill:#000000;}#export-svg .cluster-label span{color:#000000;}#export-svg .cluster-label span p{background-color:transparent;}#export-svg .label text,#export-svg span{fill:#333;color:#333;}#export-svg .node rect,#export-svg .node circle,#export-svg .node ellipse,#export-svg .node polygon,#export-svg .node path{fill:#ffffff;stroke:#000000;stroke-width:1px;}#export-svg .rough-node .label text,#export-svg .node .label text,#export-svg .image-shape .label,#export-svg .icon-shape .label{text-anchor:middle;}#export-svg .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#export-svg .rough-node .label,#export-svg .node .label,#export-svg .image-shape .label,#export-svg .icon-shape .label{text-align:center;}#export-svg .node.clickable{cursor:pointer;}#export-svg .root .anchor path{fill:#000000!important;stroke-width:0;stroke:#000000;}#export-svg .arrowheadPath{fill:#000000;}#export-svg .edgePath .path{stroke:#000000;stroke-width:2.0px;}#export-svg .flowchart-link{stroke:#000000;fill:none;}#export-svg .edgeLabel{background-color:hsl(-120, 0%, 80%);text-align:center;}#export-svg .edgeLabel p{background-color:hsl(-120, 0%, 80%);}#export-svg .edgeLabel rect{opacity:0.5;background-color:hsl(-120, 0%, 80%);fill:hsl(-120, 0%, 80%);}#export-svg .labelBkg{background-color:rgba(204, 204, 204, 0.5);}#export-svg .cluster rect{fill:#ffffff;stroke:hsl(0, 0%, 90%);stroke-width:1px;}#export-svg .cluster text{fill:#000000;}#export-svg .cluster span{color:#000000;}#export-svg div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:#ffffff;border:1px solid hsl(0, 0%, 90%);border-radius:2px;pointer-events:none;z-index:100;}#export-svg .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#export-svg rect.text{fill:none;stroke-width:0;}#export-svg .icon-shape,#export-svg .image-shape{background-color:hsl(-120, 0%, 80%);text-align:center;}#export-svg .icon-shape p,#export-svg .image-shape p{background-color:hsl(-120, 0%, 80%);padding:2px;}#export-svg .icon-shape rect,#export-svg .image-shape rect{opacity:0.5;background-color:hsl(-120, 0%, 80%);fill:hsl(-120, 0%, 80%);}#export-svg .node .neo-node{stroke:#000000;}#export-svg [data-look="neo"].node rect,#export-svg [data-look="neo"].cluster rect,#export-svg [data-look="neo"].node polygon{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node rect,#export-svg [data-look="neo"].node polygon,#export-svg [data-look="neo"].node path{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node .neo-line path{stroke:hsl(0, 0%, 70%);filter:none;}#export-svg [data-look="neo"].node circle{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node circle .state-start{fill:#000000;}#export-svg [data-look="neo"].statediagram-cluster rect{fill:#ffffff;stroke:url(#export-svg-gradient);stroke-width:1px;}#export-svg [data-look="neo"].icon-shape .icon{fill:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].icon-shape .icon-neo path{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}</style><g><marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="5" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-pointEnd"><path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 0 L 10 5 L 0 10 z"/></marker><marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="4.5" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-pointStart"><path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 5 L 10 10 L 10 0 z"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="11" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-circleEnd"><circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="-1" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-circleStart"><circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="12" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="export-svg_flowchart-v2-crossEnd"><path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="-1" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="export-svg_flowchart-v2-crossStart"><path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/></marker><g class="root"><g class="clusters"/><g class="edgePaths"><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MTUwLjIzMTI1MDc2MjkzOTQ1LCJ5Ijo0Ni45MDI2MDIxNzM0NTU3Nn0seyJ4Ijo1My44Mzc1MDE1MjU4Nzg5MDYsInkiOjc4fSx7IngiOjUzLjgzNzUwMTUyNTg3ODkwNiwieSI6MTA4LjU2MjQ5NjE4NTMwMjczfV0=" data-id="L_A_C_0" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_C_0" d="M150.23125076293945,46.90260217345576L61.22901132167403,75.61543956451622Q53.837501525878906,78 53.962501525878906,85.76562428474426L54.087501525878906,93.53124856948853L54.27312354166621,105.06301523813681"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MjAxLjA3NTAwMDc2MjkzOTQ1LCJ5Ijo1M30seyJ4IjoyMDEuMDc1MDAwNzYyOTM5NDUsInkiOjc4fSx7IngiOjIwMS4wNzUwMDA3NjI5Mzk0NSwieSI6MTAzfV0=" data-id="L_A_D_1" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_D_1" d="M201.07500076293945,53L201.07500076293945,71.62377415082605Q201.07500076293945,78 201.20000076293945,84.37500047683716L201.32500076293945,90.75000095367432L201.4965844690648,99.50077062060677"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MjUxLjkxODc1MDc2MjkzOTQ1LCJ5Ijo0Ni4zNjM4ODQ2MzQ4ODQyfSx7IngiOjM1My4zMTI1LCJ5Ijo3OH0seyJ4IjozNTMuMzEyNSwieSI6MTAzLjU2MjQ5NjE4NTMwMjczfV0=" data-id="L_A_E_2" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_E_2" d="M251.91875076293945,46.3638846348842L347.09145965654386,76.05895776142499Q353.3125,78 353.4375,84.51562452316283L353.5625,91.03124904632566L353.7357755032338,100.06323399139518"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MjAxLjA3NTAwMDc2MjkzOTQ1LCJ5IjoyMDUuNzk5OTk1NDIyMzYzMjh9LHsieCI6MjAxLjA3NTAwMDc2MjkzOTQ1LCJ5IjoyMzAuNzk5OTk1NDIyMzYzMjh9LHsieCI6MjAxLjA3NTAwMDc2MjkzOTQ1LCJ5IjoyNTUuNzk5OTk1NDIyMzYzMjh9XQ==" data-id="L_D_D1_3" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_D_D1_3" d="M201.57500076293945,206.2999973297119L201.20252523950396,224.55129655716928Q201.07500076293945,230.79999542236328 201.07500076293945,237.04999542236328L201.07500076293945,243.29999542236328L201.07500076293945,251.79999542236328"/></g><g class="edgeLabels"><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_C_0" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_D_1" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_E_2" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_D_D1_3" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g></g><g class="nodes"><g transform="translate(201.07500076293945, 30.5)" data-look="neo" data-et="node" data-node="true" data-id="A" id="flowchart-A-19096" class="node default"><rect stroke="url(#gradient)" height="45" width="101.6875" y="-22.5" x="-50.84375" data-id="A" style="" class="basic label-container"/><g transform="translate(-20.84375, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="41.6875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>AI Server</p></span></div></foreignObject></g></g><g transform="translate(53.837501525878906, 154.39999771118164)" data-look="neo" data-et="node" data-node="true" data-id="C" id="flowchart-C-19098" class="node default"><polygon transform="translate(-45.83750057220459,45.83750057220459)" class="label-container" points="45.83750057220459,0 91.67500114440918,-45.83750057220459 45.83750057220459,-91.67500114440918 0,-45.83750057220459"/><g transform="translate(-15.83750057220459, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="31.67500114440918"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Ollama</p></span></div></foreignObject></g></g><g transform="translate(201.07500076293945, 154.39999771118164)" data-look="neo" data-et="node" data-node="true" data-id="D" id="flowchart-D-19100" class="node default"><polygon transform="translate(-51.39999961853027,51.39999961853027)" class="label-container" points="51.39999961853027,0 102.79999923706055,-51.39999961853027 51.39999961853027,-102.79999923706055 0,-51.39999961853027"/><g transform="translate(-21.399999618530273, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="42.79999923706055"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>LLM APIs</p></span></div></foreignObject></g></g><g transform="translate(353.3125, 154.39999771118164)" data-look="neo" data-et="node" data-node="true" data-id="E" id="flowchart-E-19102" class="node default"><polygon transform="translate(-50.83749961853027,50.83749961853027)" class="label-container" points="50.83749961853027,0 101.67499923706055,-50.83749961853027 50.83749961853027,-101.67499923706055 0,-50.83749961853027"/><g transform="translate(-20.837499618530273, -22.5)" style="" class="label"><rect/><foreignObject height="45" width="41.67499923706055"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Comfy UI <br />+ <br />FFmpeg</p></span></div></foreignObject></g></g><g transform="translate(201.07500076293945, 285.7999954223633)" data-look="neo" data-et="node" data-node="true" data-id="D1" id="flowchart-D1-19104" class="node default"><rect stroke="url(#gradient)" height="60" width="260" y="-30" x="-130" data-id="D1" style="" class="basic label-container"/><g transform="translate(-100, -15)" style="" class="label"><rect/><foreignObject height="30" width="200"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table; white-space: break-spaces; line-height: 1.5; max-width: 200px; text-align: center; width: 200px;"><span class="nodeLabel"><p>OpenRouter / OpenAI / Mistral AI / Google Cloud / GroqCloud</p></span></div></foreignObject></g></g></g></g></g><linearGradient y2="0%" x2="100%" y1="0%" x1="0%" gradientUnits="objectBoundingBox" id="export-svg-gradient"><stop stop-opacity="1" stop-color="#0042eb" offset="0%"/><stop stop-opacity="1" stop-color="#eb0042" offset="100%"/></linearGradient></svg>
\ No newline at end of file
+<svg aria-roledescription="flowchart-v2" role="graphics-document document" viewBox="0 0 765.0125732421875 331.5874938964844" style="max-width: 765.0125732421875px;" class="flowchart" xmlns="http://www.w3.org/2000/svg" width="100%" id="export-svg"><style xmlns="http://www.w3.org/1999/xhtml">@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"); p {margin: 0;}</style><style>#export-svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:10px;fill:#333;}#export-svg .error-icon{fill:#ffffff;}#export-svg .error-text{fill:#000000;stroke:#000000;}#export-svg .edge-thickness-normal{stroke-width:1px;}#export-svg .edge-thickness-thick{stroke-width:3.5px;}#export-svg .edge-pattern-solid{stroke-dasharray:0;}#export-svg .edge-thickness-invisible{stroke-width:0;fill:none;}#export-svg .edge-pattern-dashed{stroke-dasharray:3;}#export-svg .edge-pattern-dotted{stroke-dasharray:2;}#export-svg .marker{fill:#000000;stroke:#000000;}#export-svg .marker.cross{stroke:#000000;}#export-svg svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:10px;}#export-svg p{margin:0;}#export-svg .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#export-svg .cluster-label text{fill:#000000;}#export-svg .cluster-label span{color:#000000;}#export-svg .cluster-label span p{background-color:transparent;}#export-svg .label text,#export-svg span{fill:#333;color:#333;}#export-svg .node rect,#export-svg .node circle,#export-svg .node ellipse,#export-svg .node polygon,#export-svg .node path{fill:#ffffff;stroke:#000000;stroke-width:1px;}#export-svg .rough-node .label text,#export-svg .node .label text,#export-svg .image-shape .label,#export-svg .icon-shape .label{text-anchor:middle;}#export-svg .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#export-svg .rough-node .label,#export-svg .node .label,#export-svg .image-shape .label,#export-svg .icon-shape .label{text-align:center;}#export-svg .node.clickable{cursor:pointer;}#export-svg .root .anchor path{fill:#000000!important;stroke-width:0;stroke:#000000;}#export-svg .arrowheadPath{fill:#000000;}#export-svg .edgePath .path{stroke:#000000;stroke-width:2.0px;}#export-svg .flowchart-link{stroke:#000000;fill:none;}#export-svg .edgeLabel{background-color:hsl(-120, 0%, 80%);text-align:center;}#export-svg .edgeLabel p{background-color:hsl(-120, 0%, 80%);}#export-svg .edgeLabel rect{opacity:0.5;background-color:hsl(-120, 0%, 80%);fill:hsl(-120, 0%, 80%);}#export-svg .labelBkg{background-color:rgba(204, 204, 204, 0.5);}#export-svg .cluster rect{fill:#ffffff;stroke:hsl(0, 0%, 90%);stroke-width:1px;}#export-svg .cluster text{fill:#000000;}#export-svg .cluster span{color:#000000;}#export-svg div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:#ffffff;border:1px solid hsl(0, 0%, 90%);border-radius:2px;pointer-events:none;z-index:100;}#export-svg .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#export-svg rect.text{fill:none;stroke-width:0;}#export-svg .icon-shape,#export-svg .image-shape{background-color:hsl(-120, 0%, 80%);text-align:center;}#export-svg .icon-shape p,#export-svg .image-shape p{background-color:hsl(-120, 0%, 80%);padding:2px;}#export-svg .icon-shape rect,#export-svg .image-shape rect{opacity:0.5;background-color:hsl(-120, 0%, 80%);fill:hsl(-120, 0%, 80%);}#export-svg .node .neo-node{stroke:#000000;}#export-svg [data-look="neo"].node rect,#export-svg [data-look="neo"].cluster rect,#export-svg [data-look="neo"].node polygon{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node rect,#export-svg [data-look="neo"].node polygon,#export-svg [data-look="neo"].node path{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node .neo-line path{stroke:hsl(0, 0%, 70%);filter:none;}#export-svg [data-look="neo"].node circle{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].node circle .state-start{fill:#000000;}#export-svg [data-look="neo"].statediagram-cluster rect{fill:#ffffff;stroke:url(#export-svg-gradient);stroke-width:1px;}#export-svg [data-look="neo"].icon-shape .icon{fill:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg [data-look="neo"].icon-shape .icon-neo path{stroke:url(#export-svg-gradient);filter:drop-shadow( 0px 1px 2px rgba(0, 0, 0, 0.25));}#export-svg :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}</style><g><marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="5" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-pointEnd"><path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 0 L 10 5 L 0 10 z"/></marker><marker orient="auto" markerHeight="8" markerWidth="8" markerUnits="userSpaceOnUse" refY="5" refX="4.5" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-pointStart"><path style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 0 5 L 10 10 L 10 0 z"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="11" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-circleEnd"><circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5" refX="-1" viewBox="0 0 10 10" class="marker flowchart-v2" id="export-svg_flowchart-v2-circleStart"><circle style="stroke-width: 1; stroke-dasharray: 1, 0;" class="arrowMarkerPath" r="5" cy="5" cx="5"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="12" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="export-svg_flowchart-v2-crossEnd"><path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/></marker><marker orient="auto" markerHeight="11" markerWidth="11" markerUnits="userSpaceOnUse" refY="5.2" refX="-1" viewBox="0 0 11 11" class="marker cross flowchart-v2" id="export-svg_flowchart-v2-crossStart"><path style="stroke-width: 2; stroke-dasharray: 1, 0;" class="arrowMarkerPath" d="M 1,1 l 9,9 M 10,1 l -9,9"/></marker><g class="root"><g class="clusters"/><g class="edgePaths"><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MzA5Ljk1OTM3NTM4MTQ2OTcsInkiOjQxLjMzOTUxNjM3MDYzMDEzNn0seyJ4IjoxMzgsInkiOjc4fSx7IngiOjEzOCwieSI6MTA2Ljg5Mzc1MzA1MTc1NzgxfV0=" data-id="L_A_D_0" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_D_0" d="M309.9593753814697,41.339516370630136L145.1879663238139,76.4675780476751Q138,78 138.125,85.34843873977661L138.25,92.69687747955322L138.43196817788987,103.39433354205367"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MzI1LjAwODg4MTQxODMyODU0LCJ5Ijo1M30seyJ4IjoyODUuMjM3NDk5MjM3MDYwNTUsInkiOjc4fSx7IngiOjI4NS4yMzc0OTkyMzcwNjA1NSwieSI6MTEyLjQ1NjI0OTIzNzA2MDU1fV0=" data-id="L_A_C_1" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_C_1" d="M325.00888141832854,53L292.6369949538425,73.34873110327365Q285.23749923706055,78 285.36249923706055,86.73906254768372L285.48749923706055,95.47812509536743L285.68029071418744,108.95665931354372"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6Mzk2LjU5NzM2OTM0NDYxMDksInkiOjUzfSx7IngiOjQzNi4zNjg3NTE1MjU4Nzg5LCJ5Ijo3OH0seyJ4Ijo0MzYuMzY4NzUxNTI1ODc4OSwieSI6MTAzfV0=" data-id="L_A_E_2" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_E_2" d="M396.5973693446109,53L430.9704577862012,74.6066720317428Q436.3687515258789,78 436.4937515258789,84.375L436.6187515258789,90.75L436.7903352261411,99.5007687133731"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6NDExLjY0Njg3NTM4MTQ2OTcsInkiOjM4LjE2OTU3Nzc3NjgxODczfSx7IngiOjY3NS42OTM3NDg0NzQxMjExLCJ5Ijo3OH0seyJ4Ijo2NzUuNjkzNzQ4NDc0MTIxMSwieSI6MTA3LjQ1NjI0OTIzNzA2MDU1fV0=" data-id="L_A_F_3" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_A_F_3" d="M411.6468753814697,38.16957777681873L668.2874322075763,76.88278660315216Q675.6937484741211,78 675.8187484741211,85.48906278610227L675.9437484741211,92.97812557220455L676.1269937437365,103.95680820745258"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6MTM4LCJ5IjoyMDkuNjkzNzQ4NDc0MTIxMX0seyJ4IjoxMzgsInkiOjIzOC41ODc1MDE1MjU4Nzg5fSx7IngiOjEzOCwieSI6MjYzLjU4NzUwMTUyNTg3ODl9XQ==" data-id="L_D_D1_4" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_D_D1_4" d="M138.5,210.19375038146973L138.11004236719768,232.3384703467743Q138,238.5875015258789 138,244.8375015258789L138,251.0875015258789L138,259.5875015258789"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6NDM2LjM2ODc1MTUyNTg3ODksInkiOjIxMy41ODc1MDE1MjU4Nzg5fSx7IngiOjQzNi4zNjg3NTE1MjU4Nzg5LCJ5IjoyMzguNTg3NTAxNTI1ODc4OX0seyJ4Ijo0MzYuMzY4NzUxNTI1ODc4OSwieSI6MjcxLjA4NzUwMTUyNTg3ODl9XQ==" data-id="L_E_E1_5" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_E_E1_5" d="M436.8687515258789,214.08750152587896L436.5345333325119,230.46419300086342Q436.3687515258789,238.5875015258789 436.3687515258789,246.7125015258789L436.3687515258789,254.8375015258789L436.3687515258789,267.0875015258789"/><path marker-end="url(#export-svg_flowchart-v2-pointEnd)" data-points="W3sieCI6Njc1LjY5Mzc0ODQ3NDEyMTEsInkiOjIwOS4xMzEyNTIyODg4MTgzNn0seyJ4Ijo2NzUuNjkzNzQ4NDc0MTIxMSwieSI6MjM4LjU4NzUwMTUyNTg3ODl9LHsieCI6Njc1LjY5Mzc0ODQ3NDEyMTEsInkiOjI3MS4wODc1MDE1MjU4Nzg5fV0=" data-id="L_F_F1_6" data-et="edge" data-edge="true" style="" class="edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link" id="L_F_F1_6" d="M676.1937484741211,209.63124656677243L675.8340254020418,230.46371254637597Q675.6937484741211,238.5875015258789 675.6937484741211,246.7125015258789L675.6937484741211,254.8375015258789L675.6937484741211,267.0875015258789"/></g><g class="edgeLabels"><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_D_0" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_C_1" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_E_2" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_A_F_3" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_D_D1_4" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_E_E1_5" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g><g class="edgeLabel"><g transform="translate(0, 0)" data-id="L_F_F1_6" class="label"><foreignObject height="0" width="0"><div class="labelBkg" xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="edgeLabel"></span></div></foreignObject></g></g></g><g class="nodes"><g transform="translate(360.8031253814697, 30.5)" data-look="neo" data-et="node" data-node="true" data-id="A" id="flowchart-A-28924" class="node default"><rect stroke="url(#gradient)" height="45" width="101.6875" y="-22.5" x="-50.84375" data-id="A" style="" class="basic label-container"/><g transform="translate(-20.84375, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="41.6875"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>AI Server</p></span></div></foreignObject></g></g><g transform="translate(138, 158.29375076293945)" data-look="neo" data-et="node" data-node="true" data-id="D" id="flowchart-D-28926" class="node default"><polygon transform="translate(-51.39999961853027,51.39999961853027)" class="label-container" points="51.39999961853027,0 102.79999923706055,-51.39999961853027 51.39999961853027,-102.79999923706055 0,-51.39999961853027"/><g transform="translate(-21.399999618530273, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="42.79999923706055"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>LLM APIs</p></span></div></foreignObject></g></g><g transform="translate(285.23749923706055, 158.29375076293945)" data-look="neo" data-et="node" data-node="true" data-id="C" id="flowchart-C-28928" class="node default"><polygon transform="translate(-45.83750057220459,45.83750057220459)" class="label-container" points="45.83750057220459,0 91.67500114440918,-45.83750057220459 45.83750057220459,-91.67500114440918 0,-45.83750057220459"/><g transform="translate(-15.83750057220459, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="31.67500114440918"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Ollama</p></span></div></foreignObject></g></g><g transform="translate(436.3687515258789, 158.29375076293945)" data-look="neo" data-et="node" data-node="true" data-id="E" id="flowchart-E-28930" class="node default"><polygon transform="translate(-55.29375076293945,55.29375076293945)" class="label-container" points="55.29375076293945,0 110.5875015258789,-55.29375076293945 55.29375076293945,-110.5875015258789 0,-55.29375076293945"/><g transform="translate(-25.293750762939453, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="50.587501525878906"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Media APIs</p></span></div></foreignObject></g></g><g transform="translate(675.6937484741211, 158.29375076293945)" data-look="neo" data-et="node" data-node="true" data-id="F" id="flowchart-F-28932" class="node default"><polygon transform="translate(-50.83749961853027,50.83749961853027)" class="label-container" points="50.83749961853027,0 101.67499923706055,-50.83749961853027 50.83749961853027,-101.67499923706055 0,-50.83749961853027"/><g transform="translate(-20.837499618530273, -22.5)" style="" class="label"><rect/><foreignObject height="45" width="41.67499923706055"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Comfy UI <br />+ <br />FFmpeg</p></span></div></foreignObject></g></g><g transform="translate(138, 293.5875015258789)" data-look="neo" data-et="node" data-node="true" data-id="D1" id="flowchart-D1-28934" class="node default"><rect stroke="url(#gradient)" height="60" width="260" y="-30" x="-130" data-id="D1" style="" class="basic label-container"/><g transform="translate(-100, -15)" style="" class="label"><rect/><foreignObject height="30" width="200"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table; white-space: break-spaces; line-height: 1.5; max-width: 200px; text-align: center; width: 200px;"><span class="nodeLabel"><p>OpenRouter / OpenAI / Mistral AI / Google Cloud / GroqCloud</p></span></div></foreignObject></g></g><g transform="translate(436.3687515258789, 293.5875015258789)" data-look="neo" data-et="node" data-node="true" data-id="E1" id="flowchart-E1-28936" class="node default"><rect stroke="url(#gradient)" height="45" width="216.0124969482422" y="-22.5" x="-108.0062484741211" data-id="E1" style="" class="basic label-container"/><g transform="translate(-78.0062484741211, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="156.0124969482422"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Replicate / dall-e-3 / Text to speech</p></span></div></foreignObject></g></g><g transform="translate(675.6937484741211, 293.5875015258789)" data-look="neo" data-et="node" data-node="true" data-id="F1" id="flowchart-F1-28938" class="node default"><rect stroke="url(#gradient)" height="45" width="162.63750457763672" y="-22.5" x="-81.31875228881836" data-id="F1" style="" class="basic label-container"/><g transform="translate(-51.31875228881836, -7.5)" style="" class="label"><rect/><foreignObject height="15" width="102.63750457763672"><div xmlns="http://www.w3.org/1999/xhtml" style="display: table-cell; white-space: normal; line-height: 1.5; max-width: 200px; text-align: center;"><span class="nodeLabel"><p>Diffusion / Whisper / tts</p></span></div></foreignObject></g></g></g></g></g><linearGradient y2="0%" x2="100%" y1="0%" x1="0%" gradientUnits="objectBoundingBox" id="export-svg-gradient"><stop stop-opacity="1" stop-color="#0042eb" offset="0%"/><stop stop-opacity="1" stop-color="#eb0042" offset="100%"/></linearGradient></svg>
\ No newline at end of file
diff --git a/AiServer/wwwroot/mjs/components/UiHome.mjs b/AiServer/wwwroot/mjs/components/UiHome.mjs
index babc393..8b78f13 100644
--- a/AiServer/wwwroot/mjs/components/UiHome.mjs
+++ b/AiServer/wwwroot/mjs/components/UiHome.mjs
@@ -13,7 +13,7 @@ export default {
       </p>
       <p class="mt-6 text-lg leading-8 text-gray-600">
         Self-hosted private gateway to manage access to multiple LLM APIs, Ollama endpoints, 
-        Comfy UI and FFmpeg Agents 
+        Media APIs, Comfy UI and FFmpeg Agents 
       </p>
     </div>
     <div class="mt-8 flex justify-center">
@@ -191,7 +191,7 @@ export default {
         <div class="mt-12 border-b border-gray-200">
           <nav class="-mb-px flex" aria-label="Tabs">
             <div v-for="ui in uis" @click="routes.to({ op:ui.id })" 
-                :class="['cursor-pointer w-1/4 border-b-2 px-1 py-2 text-center text-sm font-medium text-gray-500', ui.id == (routes.op || 'Chat') ? 'border-indigo-500 text-indigo-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700']">
+                :class="['cursor-pointer w-1/4 border-b-2 px-1 py-2 text-center text-sm font-medium text-gray-500', ui.id == (routes.op || 'TextToImage') ? 'border-indigo-500 text-indigo-600' : 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700']">
                 <div class="flex flex-col justify-center items-center">
                     <img :src="ui.icon" class="w-8 h-8">
                     <span class="hidden md:inline mt-3">{{ui.label}}</span>
@@ -202,7 +202,7 @@ export default {
                 
         <div class="mt-8 flow-root">
           <div class="-m-2 rounded-xl bg-gray-900/5 p-2 ring-1 ring-inset ring-gray-900/10 lg:-m-4 lg:rounded-2xl lg:p-4">
-            <img :src="'/img/uis/'+(routes.op || 'Chat')+'.webp'" alt="App screenshot" width="2432" height="1442" class="rounded-md shadow-2xl ring-1 ring-gray-900/10">
+            <img :src="'/img/uis/'+(routes.op || 'TextToImage')+'.webp'" alt="App screenshot" width="2432" height="1442" class="rounded-md shadow-2xl ring-1 ring-gray-900/10">
           </div>
         </div>
       </div>