update

components.d.ts

@@ -15,6 +15,7 @@ declare module '@vue/runtime-core' {
     ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
     ElInput: typeof import('element-plus/es')['ElInput']
     ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
+    ElLink: typeof import('element-plus/es')['ElLink']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElTreeV2: typeof import('element-plus/es')['ElTreeV2']
     ProfilerPanel: typeof import('./src/components/ProfilerPanel.vue')['default']

release/preview-template/dist/index.html

@@ -1,4 +1,4 @@
-<script type="module" crossorigin src="/dist/assets/index.17ee060a.js"></script>
+<script type="module" crossorigin src="/dist/assets/index.4dc42c8f.js"></script>
-<link rel="stylesheet" href="/dist/assets/index.9940da1d.css">
+<link rel="stylesheet" href="/dist/assets/index.741f95c0.css">
 <div id="dev-app" style="width: 400px;height: 100%;display: flex;flex-direction: column;justify-content: center;"></div>
 

release/preview-template/index.ejs

@@ -58,16 +58,6 @@
         toggle(isOpen);
     }, false);
 
-    // profilerBtn.addEventListener('click', () => {
-    //     if (profilerBtn.classList.contains('checked')) {
-    //         profilerBtn.classList.remove('checked');
-    //         window.dispatchEvent(new CustomEvent('showProfiler', { detail: { show: false } }));
-    //     } else {
-    //         profilerBtn.classList.add('checked');
-    //         window.dispatchEvent(new CustomEvent('showProfiler', { detail: { show: true } }));
-    //     }
-    // }, false);
-
     function toggle(isOpen) {
         const devApp = document.getElementById('dev-app');
         window.ccdevShow = isOpen;

release/preview-template/toolbar.ejs

@@ -1,35 +0,0 @@
-<div class="toolbar disabled">
-    <div class="item"><button id="btn-show-devtools">CCDevtools</button></div>
-    <div class="item">
-        <select id="opts-device" value="<%=config.device%>">
-            <% Object.keys(devices).forEach((key) => {%>
-            <option value="<%=key%>"><%=devices[key].name%>(<%=devices[key].width%> X <%=devices[key].height%>)</option>
-            <% }) %>
-        </select>
-    </div>
-    <div class="item"><button id="btn-rotate" class="<%=config.rotate ? 'checked' : ''%>">Rotate</button></div>
-    <span style="font-size: small;" class="item">Debug Mode:</span>
-    <div class="item">
-        <select id="opts-debug-mode" value="<%=config.debugMode%>">
-            <option value="NONE">None</option>
-            <option value="VERBOSE">Verbose</option>
-            <option value="INFO">Info</option>
-            <option value="WARN">Warn</option>
-            <option value="ERROR">Error</option>
-            <option value="INFO_FOR_WEB_PAGE">Info For Web Page</option>
-            <option value="WARN_FOR_WEB_PAGE">Warn For Web Page</option>
-            <option value="ERROR_FOR_WEB_PAGE">Error For Web Page</option>
-        </select>
-    </div>
-    <div class="item"><button id="btn-show-fps" class="<%=config.showFps ? 'checked' : ''%>">Show FPS</button></div>
-    <div class="item">
-        <span style="font-size: small;" class="item">FPS:</span><input id="input-set-fps" type="number" value="<%=config.fps%>" />
-    </div>
-    <div style="margin-right: 0;" class="item"><button id="btn-pause">Pause</button><button id="btn-step">Step</button></div>
-    <div class="item"><button id="btn-step" style="display: none;">Step</button></div>
-    <div id="step-length">
-        <span>Step Length: </span>
-        <input type="text" value="1">
-        <span>ms</span>
-    </div>
-</div>

release/preview-template/version.json

@@ -1 +1 @@
-{"name":"ccc-devtools","version":"2022/7/17","author":"Next","repo":"https://github.com/potato47/ccc-devtools.git"}
+{"name":"ccc-devtools","version":"2022/8/4","author":"Next","repo":"https://github.com/potato47/ccc-devtools.git"}

src/App.vue

@@ -18,6 +18,7 @@ window.addEventListener('showProfiler', (e: any) => {
   <el-card :body-style="{ padding: 0 }" style="margin: 10px;">
     <TreePanel :show="true"></TreePanel>
   </el-card>
+  <el-link type="primary" href="https://github.com/potato47/ccc-devtools" target="_blank" style="position:absolute;left: 5px;bottom: 5px;">ccc-devtools</el-link>
 </template>
 
 <style scoped>

src/components/CCNode.vue

@@ -1,11 +1,11 @@
 <template>
-    <template v-if="ccNode!.name != 'PROFILER_NODE'">
     <div class="row">
         <el-checkbox v-model="ccNode!.active" size="small" style="margin-right: 10px;" />
         <span class="header-title" style="flex: 1;">Node</span>
         <el-button size="small" @click="Utils.drawNodeRect(ccNode)">+</el-button>
         <el-button size="small" @click="Utils.outputToConsole(ccNode)">></el-button>
     </div>
+    <template v-if="ccNode!.name != 'PROFILER_NODE'">
         <PropItem v-for="prop in NodeModel.props" :key="prop.key" :model="NodeModel" :prop-name="prop.name"
             :prop-key="prop.key" :update-key="updateKey!"></PropItem>
     </template>

src/components/ProfilerPanel.vue

@@ -18,12 +18,12 @@ const props = defineProps({
     show: Boolean,
 });
 
-let updateKey = ref(1);
 let items = ref<any[]>([]);
 
 function refresh() {
-    if (props.show) {
+    // @ts-ignore
-        updateKey.value = -updateKey.value;
+    if (!cc || !cc.profiler || !cc.profiler._stats) {
+        return;
     }
     // @ts-ignore
     const stats = cc.profiler._stats;