c0ckp1t 1.0.12 → 1.0.14

package/Config.mjs

@@ -189,6 +189,7 @@ export function defaultVueComponents(prefix = "") {
         XTextarea: { path: `${prefix}/components/xtextarea.vue`, hash: `f8bb08419082aa5443630ab07172674b50c7a248` },
         XHidden: { path: `${prefix}/components/xhidden.vue`, hash: `ecb396e12dd894040e715c0854275e4d5016fcb9` },
         XCode: { path: `${prefix}/components/xcode.vue`, hash: `4d9d9165fea0539c9a983fcdffae8dedcfd537ae` },
+        XCodeSlot: { path: `${prefix}/components/xcode-slot.vue`, hash: `` },
         XButton: { path: `${prefix}/components/xbutton.vue`, hash: `2e956caa47e46377ea5a809f7438d0fc38be73b9` },
         XTabs: { path: `${prefix}/components/xtabs.vue`, hash: `83dc219106bdc86ae86dcd16cf95ebd7f11bc952` },
         XKv: { path: `${prefix}/components/xkv.vue`, hash: `8951d3a5e3786cfc9c705b13c1f71e3f90dd2552` },

package/c0ckp1t-demo/{C0ckp1tConfig.mjs → Config.mjs}

@@ -10,6 +10,8 @@ const instanceId =  "demo";
 // Used for requestion app components and files
 const appEndpoint = "";
 
+const islandDir = "c0ckp1t-demo"
+
 // ________________________________________________________________________________
 // GLOBAL CONSTANTS
 // ________________________________________________________________________________
@@ -21,6 +23,7 @@ export default {
     type: "LOCAL",
     appName:  "C0ckp1t Demo",
     appEndpoint: appEndpoint,
+    islandDir: islandDir,
 
     // This creates the navigation tree
     root: {
@@ -55,11 +58,11 @@ export default {
 
     // This is used to create routes for the vue router
     routes: [
-        {path: instanceId, location: `${appEndpoint}/c0ckp1t-demo/main.vue`, children: [
+        {path: instanceId, location: `${appEndpoint}/${islandDir}/main.vue`, children: [
                 {path: '', redirect: `/${instanceId}/homepage`},
-                {path: 'homepage', location: `${appEndpoint}/c0ckp1t-demo/pages/homepage.vue`},
+                {path: 'homepage', location: `${appEndpoint}/${islandDir}/pages/homepage.vue`},
                 {path: 'docs', redirect: `/${instanceId}/docs/Introduction.md`},
-                {path: 'docs/:pathMatch(.*)*', location: `${appEndpoint}/core/pages/Documentation.vue`},
+                {path: 'docs/:pathMatch(.*)*', location: `${appEndpoint}/${islandDir}/pages/documentation.vue`},
             ] },
     ]
 

package/c0ckp1t-demo/components/sidebar.vue

@@ -39,8 +39,7 @@ logger.debug("[INIT]")
 
       <ul class="nav flex-column mb-auto">
         <RouterLink class="nav-link d-flex align-items-center gap-2" :to="`${routerEndpoint}/homepage`">Homepage</RouterLink>
-        <RouterLink class="nav-link d-flex align-items-center gap-2" :class="{ 'router-link-active': isDocsActive }" :to="`${routerEndpoint}/docs`" v-if="registry?.store?.context?.accessLevel <= 500">Documentation</RouterLink>
-        <RouterLink class="nav-link d-flex align-items-center gap-2" :to="`${routerEndpoint}/admin`" v-if="registry?.store?.context?.accessLevel <= 500">Admin</RouterLink>
+        <RouterLink class="nav-link d-flex align-items-center gap-2" :class="{ 'router-link-active': isDocsActive }" :to="`${routerEndpoint}/docs`" >Documentation</RouterLink>
       </ul>
 
       <hr class="my-2"> 

package/c0ckp1t-demo/docs/Introduction.md

@@ -1,3 +1,4 @@
 
 # C0ckp1t Demo Application
 
+* [Issues](./Issues.md)

package/c0ckp1t-demo/docs/Issues.md

@@ -0,0 +1,3 @@
+
+# Issues
+

package/c0ckp1t-demo/pages/documentation.vue

@@ -0,0 +1,64 @@
+<script setup>
+/*
+  [VARS] - init, imports, template, script, style, name
+
+  Usage:
+    const documentation = defineAsyncComponent(() => import("/v3/actions/auth/www/pages/documentation.vue"))
+    <documentation/>
+*/
+// ________________________________________________________________________________
+// IMPORTS
+// ________________________________________________________________________________
+import {reactive, computed, ref, onMounted, onUnmounted, defineAsyncComponent, watch} from 'vue'
+import {getLogger} from "Logging";
+import {store as storeLocal, api as apiLocal, registry, instanceId} from '../store.mjs'
+import Documentation from "/core/pages/Documentation.vue"
+
+// !# C0CKP1T_START imports
+
+// !# C0CKP1T_END imports
+
+// ________________________________________________________________________________
+// LOGGING
+// ________________________________________________________________________________
+const LOG_HEADER = "pages/homepage.vue"
+const logger = getLogger(LOG_HEADER)
+logger.debug("[INIT]")
+
+// !# C0CKP1T_START script
+const local = reactive({
+    id: LOG_HEADER,
+    instanceId: instanceId
+})
+// !# C0CKP1T_END script
+
+// ________________________________________________________________________________
+// INIT
+// ________________________________________________________________________________
+async function init() {
+    if (registry.state.isReady) {
+// !# C0CKP1T_START init
+
+// !# C0CKP1T_END init
+    } else {
+        setTimeout(async () => { await init() }, 1000)
+    }
+}
+onMounted(async () => { init() })
+</script>
+
+<template>
+<!--  !# C0CKP1T_START template -->
+<x-section extra="fs-3" k="Documentation" :visible="true">
+    <Documentation :remotePathMapping="`/${storeLocal.islandDir}/docs`"></Documentation>
+</x-section>
+<!--  !# C0CKP1T_END template -->
+</template>
+
+<style scoped>
+/* !# C0CKP1T_START style */
+
+/* !# C0CKP1T_END style */
+</style>
+
+

package/c0ckp1t-demo/store.mjs

@@ -12,7 +12,7 @@ import {getLogger} from "Logging";
 import {store as storeMain, api as apiMain} from 'GlobalStore'
 
 // !# C0CKP1T_START import
-import C0ckp1tConfig from "./C0ckp1tConfig.mjs";
+import C0ckp1tConfig from "./Config.mjs";
 // !# C0CKP1T_END import
 
 export const instanceId = C0ckp1tConfig.instanceId
@@ -38,7 +38,7 @@ export const store = reactive({
   endpoint: routerEndpoint,
 
 // !# C0CKP1T_START store
-
+  islandDir: C0ckp1tConfig.islandDir,
 // !# C0CKP1T_END store
 })
 

package/components/xcode-slot.vue

@@ -0,0 +1,112 @@
+<script setup>
+import {computed, defineProps, reactive} from 'vue'
+import {getLogger} from "Logging";
+
+const props = defineProps({
+  title: {type: String, required: true, default: "Code"},
+  lang: {type: String, default: 'text'},
+  code: {type: String, required: true},
+})
+// ________________________________________________________________________________
+// LOGGING
+// ________________________________________________________________________________
+const LOG_HEADER = 'xcode-slot.vue'
+const logger = getLogger(LOG_HEADER)
+logger.debug("[INIT]")
+
+// ________________________________________________________________________________
+// STATE
+// ________________________________________________________________________________
+const local = reactive({
+  id: LOG_HEADER,
+  lang: props.lang,
+  copied: false,
+})
+
+const HTML_ESCAPE_TEST_RE = /[&<>"]/
+const HTML_ESCAPE_REPLACE_RE = /[&<>"]/g
+const HTML_REPLACEMENTS = {
+  '&': '&amp;',
+  '<': '&lt;',
+  '>': '&gt;',
+  '"': '&quot;'
+}
+
+function replaceUnsafeChar(ch) {
+  return HTML_REPLACEMENTS[ch]
+}
+
+function escapeHtml(str) {
+  if (HTML_ESCAPE_TEST_RE.test(str)) {
+    return str.replace(HTML_ESCAPE_REPLACE_RE, replaceUnsafeChar)
+  }
+  return str
+}
+
+// ________________________________________________________________________________
+// COPY TO CLIPBOARD
+// ________________________________________________________________________________
+async function copyCode() {
+  try {
+    await navigator.clipboard.writeText(props.code)
+    local.copied = true
+    logger.debug("[copyCode] - copied to clipboard")
+    setTimeout(() => { local.copied = false }, 2000)
+  } catch (err) {
+    logger.error("[copyCode] - failed to copy", err)
+  }
+}
+
+// ________________________________________________________________________________
+// HIGHLIGHTED HTML
+// ________________________________________________________________________________
+const html = computed(() => {
+  const code = props.code || ''
+
+  if (local.lang && hljs.getLanguage(local.lang)) {
+    try {
+      return '<pre class="hljs"><code>' +
+          hljs.highlight(code, {language: local.lang, ignoreIllegals: true}).value +
+          '</code></pre>';
+    } catch (__) {
+    }
+  }
+
+  return '<pre class="hljs"><code>' + escapeHtml(code) + '</code></pre>';
+})
+
+</script>
+
+<template>
+  <div>
+    <div class="code-item container">
+
+      <div class="row mb-0 mt-0 pt-0 pb-0 align-items-center">
+        <div class="col-auto">
+          <span class="code-title">{{ props.title }}</span>
+        </div>
+        <div class="col"></div>
+        <div class="col-auto">
+          <button class="btn btn-sm btn-dark copy-btn" @click="copyCode" :title="local.copied ? 'Copied!' : 'Copy to clipboard'">
+            <i :class="local.copied ? 'fa fa-check' : 'fa fa-copy'"></i>
+            <span v-if="local.copied" class="copy-feedback">Copied!</span>
+          </button>
+        </div>
+      </div>
+
+      <div v-html="html"></div>
+
+    </div> <!-- code-item -->
+  </div>
+</template>
+
+<style scoped>
+.code-item {
+  border: 1px solid black;
+}
+
+.code-title {
+  font-weight: bold;
+  font-size: 0.9em;
+}
+</style>

package/components/xcode.vue

@@ -1,38 +1,43 @@
 <script setup>
-import {computed,  reactive, onMounted} from 'vue'
+import {computed, defineProps, reactive, onMounted} from 'vue'
 
-import {store as storeMain, api as apiMain} from '@/GlobalStore.mjs'
-import {getLogger} from "../core/Logging.mjs"
+import {store as storeMain, api as apiMain } from 'GlobalStore'
+import {getLogger} from "Logging";
+import {Http} from "WsUtils"
 
 const props = defineProps({
   url: {type: String, required: true},
   lang: {type: String, default: 'text'},
-  startLine: {type: Number, default: null}, // note: start line is 0 indexed, most editors are 1 indexed
-  endLine: {type: Number, default: null},
+  startLine: {type: [Number, String], default: null}, // note: start line is 0 indexed, most editors are 1 indexed
+  endLine: {type: [Number, String], default: null},
+  registryName: {
+    type: String,
+    default: storeMain.defaultInstanceId
+  }
 })
-
 // ________________________________________________________________________________
 // LOGGING
 // ________________________________________________________________________________
-const LOG_HEADER = 'xcode.vue'
+const LOG_HEADER = 'code-item.vue'
 const logger = getLogger(LOG_HEADER)
-logger.debug("INIT")
+logger.debug("[INIT]")
 
 // ________________________________________________________________________________
 // STATE
 // ________________________________________________________________________________
 const local = reactive({
-  id: "xcode.vue",
+  id: LOG_HEADER,
   isLoading: false,
 // !# C0CKP1T_START local
   code: "Not Available",
   lang: props.lang,
   fullCode: "N/A",
-  fullView: false
+  fullView: false,
+  hasError: false,
+  copied: false,
 // !# C0CKP1T_END local
 })
 
-
 const HTML_ESCAPE_TEST_RE = /[&<>"]/
 const HTML_ESCAPE_REPLACE_RE = /[&<>"]/g
 const HTML_REPLACEMENTS = {
@@ -52,35 +57,38 @@ function escapeHtml(str) {
   }
   return str
 }
-
+const registry = storeMain.r[props.registryName]
 async function findCode() {
   if (typeof props.url !== 'string' || props.url.length < 3) {
     local.fullCode = `[INVALID_URL] - problem with props.url\n\n`
+    local.hasError = true
+    return
   }
-
-  const resp = await apiMain.fetchText(props.url)
+  logger.debug(`[findCode] - ${props.url}`)
+  const resp = await registry.getText( props.url)
   logger.debug(resp)
   if (!resp.isOk) {
-    if (resp.result.includes('File does not exist')) {
-    } else {
-      logger.error(resp)
-      return
-    }
+    local.fullCode = `[API_ERROR]\n${resp.result}\n\n`
+    local.hasError = true
+    return
   }
+  // Get the full code
   local.fullCode = resp.result
+  local.hasError = false
 }
 
 // // Highlighter function. Should return escaped HTML
 const html = computed(() => {
-  console.log("Recomputing HTML")
-  console.log(props)
+  // console.log("Recomputing HTML")
+  // console.log(props)
   // Handle line range if specified
   let code = local.fullCode
   if (local.fullCode && local.fullView === false) {
     const lines = local.fullCode.split('\n')
-    const start = props.startLine != null ? props.startLine : 0
-    const end = props.endLine != null ? props.endLine + 1 : lines.length // +1 because slice excludes end
+    const start = props.startLine != null ? parseInt(props.startLine) : 0
+    const end = props.endLine != null ? parseInt(props.endLine) + 1 : lines.length // +1 because slice excludes end
 
+    // console.log(`slice - start=${start} - end=${end}`)
     // Extract only the lines we want
     code = lines.slice(start, end).join('\n')
   }
@@ -96,6 +104,20 @@ const html = computed(() => {
 
   return '<pre class="hljs"><code>' + escapeHtml(local.code) + '</code></pre>';
 })
+
+// ________________________________________________________________________________
+// COPY TO CLIPBOARD
+// ________________________________________________________________________________
+async function copyCode() {
+  try {
+    await navigator.clipboard.writeText(props.code)
+    local.copied = true
+    logger.debug("[copyCode] - copied to clipboard")
+    setTimeout(() => { local.copied = false }, 2000)
+  } catch (err) {
+    logger.error("[copyCode] - failed to copy", err)
+  }
+}
 // ________________________________________________________________________________
 // INIT
 // ________________________________________________________________________________
@@ -106,34 +128,72 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="code-item">
-    <div class="row mb-2">
-      <div class="col-auto">
-        <x-label :isCompact="true" k="File:">{{ props.url ?? 'INVALID' }}</x-label>
-      </div>
-      <div class="col">
-      </div>
-      <div class="col-auto">
-        <x-label :isCompact="true" k="Lang:">{{ local.lang }}</x-label>
-      </div>
-      <div class="col-auto" v-if="props.startLine && props.endLine">
-        <x-label :isCompact="true" k="Lines:">{{ props.startLine}}-{{props.endLine}}</x-label>
-      </div>
-      <div class="col-auto">
-        <ExecButton icon="fa-rotate-right" :callback="() => findCode()"></ExecButton>
+  <div>
+    <div class="code-item container" >
+
+      <div class="row mb-0 mt-0 pt-0 pb-0 align-items-center" v-if="!local.fullView">
+        <div class="col-auto">
+          <span class="filename">{{ props.url?.split('/').pop() ?? 'INVALID' }}</span>
+        </div>
+        <div class="col"></div>
+        <div class="col-auto">
+          <ExecButton class="btn-sm btn btn-dark" icon="fa-rotate-right" :callback="() => findCode()"></ExecButton>
+        </div>
+        <div class="col-auto">
+          <x-toggle k="Full" v-model="local.fullView"></x-toggle>
+        </div>
+        <div class="col-auto">
+          <button class="btn btn-sm btn-dark copy-btn" @click="copyCode" :title="local.copied ? 'Copied!' : 'Copy to clipboard'">
+            <i :class="local.copied ? 'fa fa-check' : 'fa fa-copy'"></i>
+            <span v-if="local.copied" class="copy-feedback">Copied!</span>
+          </button>
+        </div>
       </div>
-      <div class="col-auto">
-        <x-toggle k="Full" v-model="local.fullView"></x-toggle>
+
+      <div class="full-view mb-0 pb-0 mt-0 pt-0" v-else>
+
+        <div class="row align-items-center">
+          <div class="col-auto">
+            <span class="filename">{{ props.url ?? 'INVALID' }}</span>
+          </div>
+          <div class="col"></div>
+          <div class="col-auto">
+            <ExecButton icon="fa-rotate-right" :callback="() => findCode()"></ExecButton>
+          </div>
+          <div class="col-auto">
+            <x-toggle k="Full" v-model="local.fullView"></x-toggle>
+          </div>
+          <div class="col-auto">
+            <button class="btn btn-sm btn-dark copy-btn" @click="copyCode" :title="local.copied ? 'Copied!' : 'Copy to clipboard'">
+              <i :class="local.copied ? 'fa fa-check' : 'fa fa-copy'"></i>
+              <span v-if="local.copied" class="copy-feedback">Copied!</span>
+            </button>
+          </div>
+        </div>
+
+        <div class="row align-items-center">
+          <div class="col-auto">
+            <x-label :isCompact="true" k="Lang:">{{ local.lang }}</x-label>
+          </div>
+          <div class="col-auto" v-if="props.startLine && props.endLine">
+            <x-label :isCompact="true" k="Lines:">{{ props.startLine }}-{{ props.endLine }}</x-label>
+          </div>
+        </div>
+
       </div>
-    </div>
-    <div v-html="html"></div>
+
+      <div v-html="html"></div>
+
+    </div> <!-- code-item -->
+
   </div>
 </template>
 
 <style scoped>
 .code-item {
+  color: white;
   border: 1px solid black;
-  padding: 2px;
+  background-color: #434e5a;
 }
 
 </style>

package/components/xmap.vue

@@ -72,7 +72,7 @@ onMounted(async () => {
 
     <div class="row menu align-items-center">
       <div class="col-auto">
-        <span class="fw-bold  ">{{ props.k }}</span>
+        <span class="fw-bold text-secondary">{{ props.k }}</span>
       </div>
       <div class="col-auto">
         <x-input k="Add Item" v-model="local.textAddKey"></x-input>
@@ -97,7 +97,7 @@ onMounted(async () => {
       </div>
 
       <div class="col-auto">
-        <ExecButton icon="fa-trash" class="me-1"  :callback=" () => removeKey(k)"
+        <ExecButton icon="fa-trash"   :callback=" () => removeKey(k)"
         ></ExecButton>
       </div>
     </div>

package/components/xsound.vue

@@ -1,6 +1,5 @@
 <script setup>
 import { reactive, computed, markRaw, onMounted, onBeforeUnmount } from 'vue'
-import XDropdown2 from '/components/xdropdown2.vue'
 
 // https://wavesurfer-js.org/docs/
 // NOTE: streaming not supported?
@@ -197,7 +196,7 @@ onBeforeUnmount(() => {
             </div>
             
             <!-- Playback Rate -->
-            <XDropdown2
+            <x-dropdown2
                 v-model="local.playbackRate"
                 :items="playbackRateOptions"
                 :on-change="onPlaybackRateChange"

package/core/CoreUtils.mjs

@@ -81,6 +81,9 @@ export const DEFAULTS = {
         "anonymous": "INFO",
         "demo": "INFO"
     },
+
+
+    bootswatchURL: "https://cdn.jsdelivr.net/npm/bootswatch@5.3.8/dist",
 };
 
 

package/core/DocUtils.mjs

@@ -110,7 +110,7 @@ ${message}
     }
 
     retrieveText = async (registry, remotePath) => {
-        logger.info(`[retrieveText] - remotePath=${remotePath}`)
+        logger.info(`[retrieveText] - instanceId=${registry?.instanceId} remotePath=${remotePath}`)
         /**
         const key = remotePathURL.substring(remotePathURL.lastIndexOf('/') + 1)
         const cachedText = await cacheGet(key)

package/core/GlobalStore.mjs

@@ -64,9 +64,15 @@ export const store = reactive({
     username: null,
 
     // ________________________________________________________________________________
-    // Documentation
+    // TOP NAVBAR
     // ________________________________________________________________________________
-    isCollapsedTOC: false,
+    showTopNavBar: true,
+
+    // ________________________________________________________________________________
+    // documentation
+    // ________________________________________________________________________________
+    showDocReload: true,
+    showDocPath: true,
 
     // ________________________________________________________________________________
     // Vue App Instance - gets created in App.vue
@@ -85,11 +91,6 @@ export const store = reactive({
     mainOffCanvasOpen: false,
     mainOffCanvasWidth: 0,
 
-    // ________________________________________________________________________________
-    // Documentation
-    // ________________________________________________________________________________
-    documentation: "/v3/text-markdown/c0ckp1t/Introduction.md",
-
     // ________________________________________________________________________________
     // P1t Modal
     // ________________________________________________________________________________

package/core/Island.mjs

@@ -40,13 +40,14 @@ export default class Island {
 
         this.instanceId = config.instanceId
         this.SERVER_API_URL = config.SERVER_API_URL
+        this.type = "Island"
+        this.apiMain = apiMain;
 
         this.LOG_HEADER = `${this.instanceId}`;
         this.logger = getLogger(this.LOG_HEADER);
         this.logger.debug('[INIT]');
 
         this.connection = new Connection(config)
-
         // ________________________________________________________________________________
         // STATE - NOT saved in browser storage
         // ________________________________________________________________________________
@@ -335,6 +336,9 @@ export default class Island {
 
     getText = async (endpoint) => {
         this.logger.info(`[getText] -  endpoint=${endpoint}`)
+        if (endpoint.startsWith("http") || endpoint.startsWith("HTTP")) {
+            return await Http.getText(endpoint, "omit")
+        }
         if (endpoint.startsWith('/c0ckp1t/')) {
             const path = `${this.config.SERVER_API_URL}${endpoint}`;
             return await Http.getText(path)

package/core/IslandDefault.mjs

@@ -20,8 +20,10 @@ import {getLogger} from 'Logging';
 export default class IslandDefault {
     constructor(apiMain, config) {
 
-        this.instanceId = config.instanceId
-        this.config = config
+        this.instanceId = config.instanceId;
+        this.type = "IslandDefault";
+        this.config = config;
+        this.apiMain = apiMain;
 
         this.LOG_HEADER = `${this.instanceId}`;
         this.logger = getLogger(this.LOG_HEADER);
@@ -69,7 +71,7 @@ export default class IslandDefault {
     // ________________________________________________________________________________
     routeByEndpoint = async (endpoint) => {
         this.logger.debug(`routeByEndpoint - endpoint=${endpoint}`);
-        await this.apiMain.routeByEndpoint( `/${this.instanceId}${endpoint}` );
+        await this.apiMain.routeByEndpoint(`/${this.instanceId}${endpoint}`);
     }
 
     /**
@@ -92,7 +94,7 @@ export default class IslandDefault {
         this.logger.info(`selectNode - node.endpoint=${node.endpoint}`);
         this.store.selectedNode = null;
         this.store.selectedNode = node;
-        await this.apiMain.routeByEndpoint( node.endpoint );
+        await this.apiMain.routeByEndpoint(node.endpoint);
     }
 
     // ________________________________________________________________________________
@@ -154,14 +156,14 @@ export default class IslandDefault {
      * @param type
      * @returns {Promise<Response>}
      */
-    resolver =  async (path, type) => {
+    resolver = async (path, type) => {
         /**
          * Path.normalize() in vue3-sfc-loader's defaultPathResolve
          *  collapses // in https:// down to https:/
          *  It uses Path.normalize(Path.join(Path.dirname(getPathname(refPath.toString()))
          *  but Node's posix.dirname doesn't understand URL protocols
          */
-        if(path.startsWith("https:/c")) {
+        if (path.startsWith("https:/c")) {
             path = path.replace("https:/c", "https://c");
         }
         this.logger.debug(`[resolver] - fetching - ${path} - ${type}`)
@@ -172,9 +174,13 @@ export default class IslandDefault {
 
 
     getText = async (endpoint) => {
+        this.logger.debug(`[getText] - ${endpoint}`);
+        if (endpoint.startsWith("http") || endpoint.startsWith("HTTP")) {
+            return await Http.getText(endpoint, "omit")
+        } else {
             const path = `${this.config.SERVER_API_URL}${endpoint}`;
-            this.logger.debug(`[getText] - ${path}`);
             return await Http.getText(path)
+        }
     }
 
     async getBinary(endpoint) {
@@ -198,9 +204,9 @@ export default class IslandDefault {
     // ________________________________________________________________________________
     // init
     // ________________________________________________________________________________
-    init = async ()   => {
-       await this.rootNode()
-       this.state.isReady = true
+    init = async () => {
+        await this.rootNode()
+        this.state.isReady = true
     }
 
 } // end of IslandDefault class