Update checkbox styling and add PRO checkbox

docs/assets/css/style.css

@@ -89,13 +89,13 @@ input[type="file"] {
     color: rgb(255 255 255 / 50%);
 }
 
-.header .typeScript {
+.header .checkbox {
     display: flex;
     align-items: center;
     margin-right: 15px;
 }
 
-.header .typeScript input {
+.header .checkbox input {
     margin-right: 5px;
 }
 

docs/assets/js/common.js

@@ -10,11 +10,13 @@
     var $run = document.querySelector('.run');
     var $popups = document.querySelector('.popups');
     var $console = document.querySelector('.console');
+    var $pro = document.querySelector('#pro');
     var $typeScript = document.querySelector('#typeScript');
     var $file = document.querySelector('#file');
 
     var loadedLibs = [];
     window['consoleLog']($console);
+    $pro.checked = localStorage.getItem('pro') === 'true';
     $typeScript.checked = localStorage.getItem('typeScript') === 'true';
 
     var editor = null;
@@ -219,6 +221,11 @@
         }
     });
 
+    $pro.addEventListener('change', function () {
+        localStorage.setItem('pro', $pro.checked ? 'true' : 'false');
+        window.location.reload();
+    });
+
     $typeScript.addEventListener('change', function () {
         localStorage.setItem('typeScript', $typeScript.checked ? 'true' : 'false');
         window.location.reload();

docs/index.html

@@ -93,9 +93,12 @@
                 </div>
                 <div class="tool">
                     <div class="qq">QQ群: 320881312</div>
-                    <div class="typeScript">
+                    <div class="checkbox">
                         <input type="checkbox" id="typeScript"><label for="typeScript">TS</label>
                     </div>
+                    <div class="checkbox">
+                        <input type="checkbox" id="pro"><label for="pro">PRO</label>
+                    </div>
                     <div class="run">▶ Run Code</div>
                 </div>
             </header>
@@ -123,10 +126,24 @@
         <div class="popinner"></div>
     </div>
     <script src="./assets/js/console.js"></script>
-    <script src="./uncompiled/artplayer/index.js"></script>
-    <!-- <script src="./compiled/artplayer.js"></script> -->
     <script src="./assets/js/vs/loader.js"></script>
-    <script src="./assets/js/common.js"></script>
+    <script>
+        var artplayer = document.createElement('script');
+        var common = document.createElement('script');
+
+        artplayer.onload = function () {
+            common.src = "./assets/js/common.js";
+            document.body.appendChild(common);
+        }
+
+        if (localStorage.getItem('pro') === 'true') {
+            artplayer.src = "./compiled/artplayer.js"
+        } else {
+            artplayer.src = "./uncompiled/artplayer/index.js"
+        }
+
+        document.body.appendChild(artplayer);
+    </script>
     <script>
         var isLocalhost = Boolean(
             window.location.hostname === 'localhost' ||

docs/uncompiled/artplayer/index.js

@@ -242,7 +242,7 @@ class Artplayer extends (0, _emitterDefault.default) {
         return "development";
     }
     static get build() {
-        return "2023-11-27 09:54:42";
+        return "2023-12-11 16:42:11";
     }
     static get config() {
         return 0, _configDefault.default;