bak

src/components/ExportDialog.vue

@@ -3,12 +3,13 @@ import { onBeforeUnmount, onMounted, ref } from 'vue'
 import {
   PhCode,
   PhDownloadSimple,
+  PhEngine,
   PhFileHtml,
   PhFilmSlate,
   PhX,
 } from '@phosphor-icons/vue'
 import { useSceneStore } from '@/stores/scene'
-import { downloadExampleHtml, downloadExport } from '@/lib/exportPlayer'
+import { downloadExampleHtml, downloadRuntime, downloadSceneExport } from '@/lib/exportPlayer'
 import { downloadSceneAsVideo, pickMimeType } from '@/lib/videoExport'
 import { downloadFromServer } from '@/lib/serverExport'
 
@@ -31,8 +32,13 @@ function sceneClone() {
   return JSON.parse(JSON.stringify(store.scene))
 }
 
-function exportJs() {
-  downloadExport(sceneClone())
+function exportScene() {
+  downloadSceneExport(sceneClone())
+  close()
+}
+
+function exportRuntime() {
+  downloadRuntime()
   close()
 }
 
@@ -133,14 +139,26 @@ onBeforeUnmount(() => document.removeEventListener('keydown', onKeyDown))
           </header>
 
           <div v-if="!progress" class="options">
-            <button class="opt" @click="exportJs">
+            <button class="opt" @click="exportRuntime">
+              <div class="opt-icon"><PhEngine :size="20" /></div>
+              <div class="opt-text">
+                <div class="opt-title">
+                  animatr-runtime.js
+                  <span class="badge">1× pro Seite</span>
+                </div>
+                <div class="opt-desc">Engine — einmal einbinden, beliebig viele Szenen teilen sich die Runtime</div>
+              </div>
+              <PhDownloadSimple :size="14" class="opt-arrow" />
+            </button>
+
+            <button class="opt" @click="exportScene">
               <div class="opt-icon"><PhCode :size="20" /></div>
               <div class="opt-text">
                 <div class="opt-title">
                   animation.js
-                  <span class="badge">Web Embed</span>
+                  <span class="badge">Szene</span>
                 </div>
-                <div class="opt-desc">Selbstständiges JS — in eine eigene Seite einbinden</div>
+                <div class="opt-desc">Nur Szenen-Daten — benötigt geladene Runtime</div>
               </div>
               <PhDownloadSimple :size="14" class="opt-arrow" />
             </button>