New Push
This commit is contained in:
1 parent
c3d1df42b0
commit
6836892907
22 files changed
+1869
-302
No files matched your search
@@ -1,4 +1,4 @@
|
||||
<!doctype html><html lang=de class=no-js> <head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta name=description content="Halbautomatische Disc-Ripping-Plattform für DVDs & Blu-rays mit HandBrake-Encoding"><meta name=author content=Michael><link href=https://mboehmlaender.github.io/ripster/architecture/frontend/ rel=canonical><link href=../backend/ rel=prev><link href=../database/ rel=next><link rel=icon href=../../assets/images/favicon.png><meta name=generator content="mkdocs-1.6.1, mkdocs-material-9.7.0"><title>Frontend-Komponenten - Ripster</title><link rel=stylesheet href=../../assets/stylesheets/main.618322db.min.css><link rel=stylesheet href=../../assets/stylesheets/palette.ab4e12ef.min.css><link rel=preconnect href=https://fonts.gstatic.com crossorigin><link rel=stylesheet href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback"><style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style><link rel=stylesheet href=../../stylesheets/extra.css><script>__md_scope=new URL("../..",location),__md_hash=e=>[...e].reduce(((e,_)=>(e<<5)-e+_.charCodeAt(0)),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script></head> <body dir=ltr data-md-color-scheme=default data-md-color-primary=deep-purple data-md-color-accent=purple> <input class=md-toggle data-md-toggle=drawer type=checkbox id=__drawer autocomplete=off> <input class=md-toggle data-md-toggle=search type=checkbox id=__search autocomplete=off> <label class=md-overlay for=__drawer></label> <div data-md-component=skip> <a href=#frontend-komponenten class=md-skip> Zum Inhalt </a> </div> <div data-md-component=announce> </div> <div data-md-color-scheme=default data-md-component=outdated hidden> </div> <header class="md-header md-header--shadow md-header--lifted" data-md-component=header> <nav class="md-header__inner md-grid" aria-label=Kopfzeile> <a href=../.. title=Ripster class="md-header__button md-logo" aria-label=Ripster data-md-component=logo> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 14a2 2 0 0 1-2-2c0-1.11.89-2 2-2s2 .89 2 2a2 2 0 0 1-2 2m0-10a8 8 0 0 0-8 8 8 8 0 0 0 8 8 8 8 0 0 0 8-8 8 8 0 0 0-8-8"/></svg> </a> <label class="md-header__button md-icon" for=__drawer> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"/></svg> </label> <div class=md-header__title data-md-component=header-title> <div class=md-header__ellipsis> <div class=md-header__topic> <span class=md-ellipsis> Ripster </span> </div> <div class=md-header__topic data-md-component=header-topic> <span class=md-ellipsis> Frontend-Komponenten </span> </div> </div> </div> <form class=md-header__option data-md-component=palette> <input class=md-option data-md-color-media data-md-color-scheme=default data-md-color-primary=deep-purple data-md-color-accent=purple aria-label="Dunkelmodus aktivieren" type=radio name=__palette id=__palette_0> <label class="md-header__button md-icon" title="Dunkelmodus aktivieren" for=__palette_1 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 8a4 4 0 0 0-4 4 4 4 0 0 0 4 4 4 4 0 0 0 4-4 4 4 0 0 0-4-4m0 10a6 6 0 0 1-6-6 6 6 0 0 1 6-6 6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg> </label> <input class=md-option data-md-color-media data-md-color-scheme=slate data-md-color-primary=deep-purple data-md-color-accent=purple aria-label="Hellmodus aktivieren" type=radio name=__palette id=__palette_1> <label class="md-header__button md-icon" title="Hellmodus aktivieren" for=__palette_0 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12s-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6a6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg> </label> </form> <script>var palette=__md_get("__palette");if(palette&&palette.color){if("(prefers-color-scheme)"===palette.color.media){var media=matchMedia("(prefers-color-scheme: light)"),input=document.querySelector(media.matches?"[data-md-color-media='(prefers-color-scheme: light)']":"[data-md-color-media='(prefers-color-scheme: dark)']");palette.color.media=input.getAttribute("data-md-color-media"),palette.color.scheme=input.getAttribute("data-md-color-scheme"),palette.color.primary=input.getAttribute("data-md-color-primary"),palette.color.accent=input.getAttribute("data-md-color-accent")}for(var[key,value]of Object.entries(palette.color))document.body.setAttribute("data-md-color-"+key,value)}</script> <label class="md-header__button md-icon" for=__search> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M9.Line truncated
|
||||
<!doctype html><html lang=de class=no-js> <head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta name=description content="Halbautomatische Disc-Ripping-Plattform für DVDs & Blu-rays mit HandBrake-Encoding"><meta name=author content=Michael><link href=https://mboehmlaender.github.io/ripster/architecture/frontend/ rel=canonical><link href=../backend/ rel=prev><link href=../database/ rel=next><link rel=icon href=../../assets/images/favicon.png><meta name=generator content="mkdocs-1.6.1, mkdocs-material-9.7.0"><title>Frontend-Komponenten - Ripster</title><link rel=stylesheet href=../../assets/stylesheets/main.618322db.min.css><link rel=stylesheet href=../../assets/stylesheets/palette.ab4e12ef.min.css><link rel=preconnect href=https://fonts.gstatic.com crossorigin><link rel=stylesheet href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback"><style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style><link rel=stylesheet href=../../stylesheets/extra.css><script>__md_scope=new URL("../..",location),__md_hash=e=>[...e].reduce(((e,_)=>(e<<5)-e+_.charCodeAt(0)),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script></head> <body dir=ltr data-md-color-scheme=default data-md-color-primary=deep-purple data-md-color-accent=purple> <input class=md-toggle data-md-toggle=drawer type=checkbox id=__drawer autocomplete=off> <input class=md-toggle data-md-toggle=search type=checkbox id=__search autocomplete=off> <label class=md-overlay for=__drawer></label> <div data-md-component=skip> <a href=#frontend-komponenten class=md-skip> Zum Inhalt </a> </div> <div data-md-component=announce> </div> <div data-md-color-scheme=default data-md-component=outdated hidden> </div> <header class="md-header md-header--shadow md-header--lifted" data-md-component=header> <nav class="md-header__inner md-grid" aria-label=Kopfzeile> <a href=../.. title=Ripster class="md-header__button md-logo" aria-label=Ripster data-md-component=logo> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 14a2 2 0 0 1-2-2c0-1.11.89-2 2-2s2 .89 2 2a2 2 0 0 1-2 2m0-10a8 8 0 0 0-8 8 8 8 0 0 0 8 8 8 8 0 0 0 8-8 8 8 0 0 0-8-8"/></svg> </a> <label class="md-header__button md-icon" for=__drawer> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"/></svg> </label> <div class=md-header__title data-md-component=header-title> <div class=md-header__ellipsis> <div class=md-header__topic> <span class=md-ellipsis> Ripster </span> </div> <div class=md-header__topic data-md-component=header-topic> <span class=md-ellipsis> Frontend-Komponenten </span> </div> </div> </div> <form class=md-header__option data-md-component=palette> <input class=md-option data-md-color-media data-md-color-scheme=default data-md-color-primary=deep-purple data-md-color-accent=purple aria-label="Dunkelmodus aktivieren" type=radio name=__palette id=__palette_0> <label class="md-header__button md-icon" title="Dunkelmodus aktivieren" for=__palette_1 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 8a4 4 0 0 0-4 4 4 4 0 0 0 4 4 4 4 0 0 0 4-4 4 4 0 0 0-4-4m0 10a6 6 0 0 1-6-6 6 6 0 0 1 6-6 6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg> </label> <input class=md-option data-md-color-media data-md-color-scheme=slate data-md-color-primary=deep-purple data-md-color-accent=purple aria-label="Hellmodus aktivieren" type=radio name=__palette id=__palette_1> <label class="md-header__button md-icon" title="Hellmodus aktivieren" for=__palette_0 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12s-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6a6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg> </label> </form> <script>var palette=__md_get("__palette");if(palette&&palette.color){if("(prefers-color-scheme)"===palette.color.media){var media=matchMedia("(prefers-color-scheme: light)"),input=document.querySelector(media.matches?"[data-md-color-media='(prefers-color-scheme: light)']":"[data-md-color-media='(prefers-color-scheme: dark)']");palette.color.media=input.getAttribute("data-md-color-media"),palette.color.scheme=input.getAttribute("data-md-color-scheme"),palette.color.primary=input.getAttribute("data-md-color-primary"),palette.color.accent=input.getAttribute("data-md-color-accent")}for(var[key,value]of Object.entries(palette.color))document.body.setAttribute("data-md-color-"+key,value)}</script> <label class="md-header__button md-icon" for=__search> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M9.Line truncated
|
||||
</span><span id=__span-0-2><a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a>│ Metadaten auswählen │
|
||||
</span><span id=__span-0-3><a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a>├─────────────────────────────────────┤
|
||||
</span><span id=__span-0-4><a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a>│ Suche: [Inception ] 🔍 │
|
||||
@@ -25,20 +25,23 @@
|
||||
</span><span id=__span-1-10><a id=__codelineno-1-10 name=__codelineno-1-10 href=#__codelineno-1-10></a>│ ☑ Track 1: Deutsch │
|
||||
</span><span id=__span-1-11><a id=__codelineno-1-11 name=__codelineno-1-11 href=#__codelineno-1-11></a>│ ☐ Track 2: English │
|
||||
</span><span id=__span-1-12><a id=__codelineno-1-12 name=__codelineno-1-12 href=#__codelineno-1-12></a>├─────────────────────────────────────┤
|
||||
</span><span id=__span-1-13><a id=__codelineno-1-13 name=__codelineno-1-13 href=#__codelineno-1-13></a>│ [Encodierung starten] │
|
||||
</span><span id=__span-1-13><a id=__codelineno-1-13 name=__codelineno-1-13 href=#__codelineno-1-13></a>│ [Encoding starten] │
|
||||
</span><span id=__span-1-14><a id=__codelineno-1-14 name=__codelineno-1-14 href=#__codelineno-1-14></a>└─────────────────────────────────────┘
|
||||
</span></code></pre></div> <h3 id=dynamicsettingsformjsx>DynamicSettingsForm.jsx<a class=headerlink href=#dynamicsettingsformjsx title="Permanent link">¶</a></h3> <p>Wiederverwendbares Formular, das aus dem Settings-Schema generiert wird.</p> <p><strong>Unterstützte Feldtypen:</strong></p> <table> <thead> <tr> <th>Typ</th> <th>UI-Element</th> </tr> </thead> <tbody> <tr> <td><code>string</code></td> <td>Text-Input</td> </tr> <tr> <td><code>number</code></td> <td>Zahlen-Input mit Min/Max</td> </tr> <tr> <td><code>boolean</code></td> <td>Toggle/Checkbox</td> </tr> <tr> <td><code>select</code></td> <td>Dropdown</td> </tr> <tr> <td><code>password</code></td> <td>Passwort-Input</td> </tr> </tbody> </table> <h3 id=pipelinestatuscardjsx>PipelineStatusCard.jsx<a class=headerlink href=#pipelinestatuscardjsx title="Permanent link">¶</a></h3> <p>Status-Anzeige-Widget für die Dashboard-Seite.</p> <h3 id=jobdetaildialogjsx>JobDetailDialog.jsx<a class=headerlink href=#jobdetaildialogjsx title="Permanent link">¶</a></h3> <p>Vollständiger Job-Detail-Dialog mit Logs-Viewer.</p> <hr> <h2 id=hooks>Hooks<a class=headerlink href=#hooks title="Permanent link">¶</a></h2> <h3 id=usewebsocketjs>useWebSocket.js<a class=headerlink href=#usewebsocketjs title="Permanent link">¶</a></h3> <p>Zentraler Custom-Hook für die WebSocket-Verbindung.</p> <div class="language-js highlight"><pre><span></span><code><span id=__span-2-1><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a><span class=kd>const</span><span class=w> </span><span class=p>{</span><span class=w> </span><span class=nx>status</span><span class=p>,</span><span class=w> </span><span class=nx>lastMessage</span><span class=w> </span><span class=p>}</span><span class=w> </span><span class=o>=</span><span class=w> </span><span class=nx>useWebSocket</span><span class=p>({</span>
|
||||
</span></code></pre></div> <h3 id=dynamicsettingsformjsx>DynamicSettingsForm.jsx<a class=headerlink href=#dynamicsettingsformjsx title="Permanent link">¶</a></h3> <p>Wiederverwendbares Formular, das aus dem Settings-Schema generiert wird.</p> <p><strong>Unterstützte Feldtypen:</strong></p> <table> <thead> <tr> <th>Typ</th> <th>UI-Element</th> </tr> </thead> <tbody> <tr> <td><code>string</code></td> <td>Text-Input</td> </tr> <tr> <td><code>number</code></td> <td>Zahlen-Input mit Min/Max</td> </tr> <tr> <td><code>boolean</code></td> <td>Toggle/Checkbox</td> </tr> <tr> <td><code>select</code></td> <td>Dropdown</td> </tr> <tr> <td><code>password</code></td> <td>Passwort-Input</td> </tr> </tbody> </table> <h3 id=pipelinestatuscardjsx>PipelineStatusCard.jsx<a class=headerlink href=#pipelinestatuscardjsx title="Permanent link">¶</a></h3> <p>Status-Anzeige-Widget für die Dashboard-Seite.</p> <h3 id=jobdetaildialogjsx>JobDetailDialog.jsx<a class=headerlink href=#jobdetaildialogjsx title="Permanent link">¶</a></h3> <p>Vollständiger Job-Detail-Dialog mit Logs-Viewer.</p> <hr> <h2 id=hooks>Hooks<a class=headerlink href=#hooks title="Permanent link">¶</a></h2> <h3 id=usewebsocketjs>useWebSocket.js<a class=headerlink href=#usewebsocketjs title="Permanent link">¶</a></h3> <p>Zentraler Custom-Hook für die WebSocket-Verbindung.</p> <div class="language-js highlight"><pre><span></span><code><span id=__span-2-1><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a><span class=nx>useWebSocket</span><span class=p>({</span>
|
||||
</span><span id=__span-2-2><a id=__codelineno-2-2 name=__codelineno-2-2 href=#__codelineno-2-2></a><span class=w> </span><span class=nx>onMessage</span><span class=o>:</span><span class=w> </span><span class=p>(</span><span class=nx>msg</span><span class=p>)</span><span class=w> </span><span class=p>=></span><span class=w> </span><span class=p>{</span>
|
||||
</span><span id=__span-2-3><a id=__codelineno-2-3 name=__codelineno-2-3 href=#__codelineno-2-3></a><span class=w> </span><span class=k>if</span><span class=w> </span><span class=p>(</span><span class=nx>msg</span><span class=p>.</span><span class=nx>type</span><span class=w> </span><span class=o>===</span><span class=w> </span><span class=s1>'PIPELINE_STATE_CHANGE'</span><span class=p>)</span><span class=w> </span><span class=p>{</span>
|
||||
</span><span id=__span-2-4><a id=__codelineno-2-4 name=__codelineno-2-4 href=#__codelineno-2-4></a><span class=w> </span><span class=nx>setPipelineState</span><span class=p>(</span><span class=nx>msg</span><span class=p>.</span><span class=nx>data</span><span class=p>);</span>
|
||||
</span><span id=__span-2-3><a id=__codelineno-2-3 name=__codelineno-2-3 href=#__codelineno-2-3></a><span class=w> </span><span class=k>if</span><span class=w> </span><span class=p>(</span><span class=nx>msg</span><span class=p>.</span><span class=nx>type</span><span class=w> </span><span class=o>===</span><span class=w> </span><span class=s1>'PIPELINE_STATE_CHANGED'</span><span class=p>)</span><span class=w> </span><span class=p>{</span>
|
||||
</span><span id=__span-2-4><a id=__codelineno-2-4 name=__codelineno-2-4 href=#__codelineno-2-4></a><span class=w> </span><span class=nx>setPipelineState</span><span class=p>(</span><span class=nx>msg</span><span class=p>.</span><span class=nx>payload</span><span class=p>);</span>
|
||||
</span><span id=__span-2-5><a id=__codelineno-2-5 name=__codelineno-2-5 href=#__codelineno-2-5></a><span class=w> </span><span class=p>}</span>
|
||||
</span><span id=__span-2-6><a id=__codelineno-2-6 name=__codelineno-2-6 href=#__codelineno-2-6></a><span class=w> </span><span class=p>}</span>
|
||||
</span><span id=__span-2-7><a id=__codelineno-2-7 name=__codelineno-2-7 href=#__codelineno-2-7></a><span class=p>});</span>
|
||||
</span></code></pre></div> <p><strong>Features:</strong> - Automatische Verbindung zu <code>/ws</code> - Reconnect mit exponential backoff - Message-Parsing (JSON) - Status-Tracking (connecting, connected, disconnected)</p> <hr> <h2 id=api-client-clientjs>API-Client (client.js)<a class=headerlink href=#api-client-clientjs title="Permanent link">¶</a></h2> <p>Zentraler HTTP-Client für alle Backend-Anfragen.</p> <div class="language-js highlight"><pre><span></span><code><span id=__span-3-1><a id=__codelineno-3-1 name=__codelineno-3-1 href=#__codelineno-3-1></a><span class=c1>// Beispiel-Aufrufe</span>
|
||||
</span></code></pre></div> <p><strong>Features:</strong> - Automatische Verbindung zu <code>/ws</code> - Reconnect mit festem Intervall (<code>1500ms</code>) - Message-Parsing (JSON)</p> <hr> <h2 id=api-client-clientjs>API-Client (client.js)<a class=headerlink href=#api-client-clientjs title="Permanent link">¶</a></h2> <p>Zentraler HTTP-Client für alle Backend-Anfragen.</p> <div class="language-js highlight"><pre><span></span><code><span id=__span-3-1><a id=__codelineno-3-1 name=__codelineno-3-1 href=#__codelineno-3-1></a><span class=c1>// Beispiel-Aufrufe</span>
|
||||
</span><span id=__span-3-2><a id=__codelineno-3-2 name=__codelineno-3-2 href=#__codelineno-3-2></a><span class=kd>const</span><span class=w> </span><span class=nx>state</span><span class=w> </span><span class=o>=</span><span class=w> </span><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>getPipelineState</span><span class=p>();</span>
|
||||
</span><span id=__span-3-3><a id=__codelineno-3-3 name=__codelineno-3-3 href=#__codelineno-3-3></a><span class=kd>const</span><span class=w> </span><span class=nx>results</span><span class=w> </span><span class=o>=</span><span class=w> </span><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>searchOmdb</span><span class=p>(</span><span class=s1>'Inception'</span><span class=p>);</span>
|
||||
</span><span id=__span-3-4><a id=__codelineno-3-4 name=__codelineno-3-4 href=#__codelineno-3-4></a><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>selectMetadata</span><span class=p>(</span><span class=nx>jobId</span><span class=p>,</span><span class=w> </span><span class=nx>omdbData</span><span class=p>,</span><span class=w> </span><span class=nx>playlist</span><span class=p>);</span>
|
||||
</span><span id=__span-3-5><a id=__codelineno-3-5 name=__codelineno-3-5 href=#__codelineno-3-5></a><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>confirmEncode</span><span class=p>(</span><span class=nx>jobId</span><span class=p>,</span><span class=w> </span><span class=p>{</span><span class=w> </span><span class=nx>audioTracks</span><span class=o>:</span><span class=w> </span><span class=p>[</span><span class=mf>0</span><span class=p>,</span><span class=w> </span><span class=mf>1</span><span class=p>],</span><span class=w> </span><span class=nx>subtitleTracks</span><span class=o>:</span><span class=w> </span><span class=p>[</span><span class=mf>0</span><span class=p>]</span><span class=w> </span><span class=p>});</span>
|
||||
</span><span id=__span-3-4><a id=__codelineno-3-4 name=__codelineno-3-4 href=#__codelineno-3-4></a><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>selectMetadata</span><span class=p>({</span><span class=w> </span><span class=nx>jobId</span><span class=p>,</span><span class=w> </span><span class=nx>title</span><span class=p>,</span><span class=w> </span><span class=nx>year</span><span class=p>,</span><span class=w> </span><span class=nx>imdbId</span><span class=p>,</span><span class=w> </span><span class=nx>selectedPlaylist</span><span class=w> </span><span class=p>});</span>
|
||||
</span><span id=__span-3-5><a id=__codelineno-3-5 name=__codelineno-3-5 href=#__codelineno-3-5></a><span class=k>await</span><span class=w> </span><span class=nx>api</span><span class=p>.</span><span class=nx>confirmEncodeReview</span><span class=p>(</span><span class=nx>jobId</span><span class=p>,</span><span class=w> </span><span class=p>{</span>
|
||||
</span><span id=__span-3-6><a id=__codelineno-3-6 name=__codelineno-3-6 href=#__codelineno-3-6></a><span class=w> </span><span class=nx>selectedEncodeTitleId</span><span class=o>:</span><span class=w> </span><span class=mf>1</span><span class=p>,</span>
|
||||
</span><span id=__span-3-7><a id=__codelineno-3-7 name=__codelineno-3-7 href=#__codelineno-3-7></a><span class=w> </span><span class=nx>selectedTrackSelection</span><span class=o>:</span><span class=w> </span><span class=p>{</span><span class=w> </span><span class=mf>1</span><span class=o>:</span><span class=w> </span><span class=p>{</span><span class=w> </span><span class=nx>audioTrackIds</span><span class=o>:</span><span class=w> </span><span class=p>[</span><span class=mf>1</span><span class=p>],</span><span class=w> </span><span class=nx>subtitleTrackIds</span><span class=o>:</span><span class=w> </span><span class=p>[</span><span class=mf>3</span><span class=p>]</span><span class=w> </span><span class=p>}</span><span class=w> </span><span class=p>}</span>
|
||||
</span><span id=__span-3-8><a id=__codelineno-3-8 name=__codelineno-3-8 href=#__codelineno-3-8></a><span class=p>});</span>
|
||||
</span></code></pre></div> <p><strong>Features:</strong> - Zentralisierte Fehlerbehandlung - Automatische JSON-Serialisierung - Basis-URL aus Umgebungsvariable (<code>VITE_API_BASE</code>)</p> <hr> <h2 id=build-entwicklung>Build & Entwicklung<a class=headerlink href=#build-entwicklung title="Permanent link">¶</a></h2> <h3 id=entwicklungsserver>Entwicklungsserver<a class=headerlink href=#entwicklungsserver title="Permanent link">¶</a></h3> <div class="language-bash highlight"><pre><span></span><code><span id=__span-4-1><a id=__codelineno-4-1 name=__codelineno-4-1 href=#__codelineno-4-1></a><span class=nb>cd</span><span class=w> </span>frontend
|
||||
</span><span id=__span-4-2><a id=__codelineno-4-2 name=__codelineno-4-2 href=#__codelineno-4-2></a>npm<span class=w> </span>run<span class=w> </span>dev
|
||||
</span><span id=__span-4-3><a id=__codelineno-4-3 name=__codelineno-4-3 href=#__codelineno-4-3></a><span class=c1># → http://localhost:5173</span>
|
||||
|
||||
Reference in new issue
Block a user