Skip to content

Instantly share code, notes, and snippets.

@anithegregorian
Last active November 22, 2021 08:51

Revisions

  1. anithegregorian revised this gist Nov 22, 2021. No changes.
  2. anithegregorian revised this gist Nov 22, 2021. No changes.
  3. anithegregorian revised this gist Nov 22, 2021. No changes.
  4. anithegregorian created this gist Nov 20, 2021.
    65 changes: 65 additions & 0 deletions mxGraphLayout.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,65 @@
    <main id="main">

    <!-- Placeholder for sidebar contents (Stencils) -->
    <aside id="geSidebarStencils" v-on:click.ctrl.alt="doGraphAction('showjsonsource')" v-on:click.ctrl.shift="doGraphAction('showxmlsource')"></aside>

    <!-- Placeholder for diagram -->
    <section id="geDiagramContainer"></section>

    <!-- Placeholder for sidebar contents (Properties) -->
    <aside id="geSidebarProperties"
    v-bind:class="[
    isObjectSelected ? 'props-visible' : 'props-invisible',
    isSidebarExpanded ? 'sidebar-expanded' : 'sidebar-collapsed']">
    <h2 class="panelTitle" v-text="activeNodeLabel"></h2>

    <div id="panelProperties">

    <form v-on:submit.prevent>
    <fieldset v-bind:disabled="!getClusterStatus('unprovisioned')">

    <!-- Render topology status if available -->
    <div id="topologyStatus" v-if="filteredTopologyStatus" v-cloak>

    <div class="access-properties">
    <h4 class="form-parent">Access Properties</h4>
    </div>

    <div class="form-group form-inline form-text">
    <label class="prop-label">public ip address</label>
    <input class="form-control" type="text" v-model="filteredTopologyStatus.public_url"/>
    </div>

    <div class="form-group form-inline form-text">
    <label class="prop-label">public port</label>
    <input class="form-control" type="text" v-model="filteredTopologyStatus.ssh_port"/>
    </div>

    <div class="form-group form-inline form-text">
    <label class="prop-label">status of vm</label>
    <input class="form-control" type="text" v-model="filteredTopologyStatus.status"/>
    </div>

    <div class="form-group form-inline form-btn-group">
    <a v-bind:href="filteredTopologyStatus.ssh_url" rel="external" target="_blank" class="btn btn-primary btn-hollow">In Browser SSH URL</a>
    <a v-bind:href="filteredTopologyStatus.http_url" rel="external" target="_blank" class="btn btn-primary btn-hollow">HTTP Access</a>
    </div>

    </div>

    <!-- Render each VueJS Component dynamically from [properties] array object -->
    <component
    v-for="(property, idx) in properties[selectedNodeId]"
    v-bind:property="property"
    v-bind:is="property.name"
    v-bind:key="property.key + idx"
    v-bind:id="getDomID(property, idx)">
    </component>
    </fieldset>
    </form>

    </div>

    </aside>

    </main>