editor.php

<div id="ks-editor">
    <!--The id "ks-editor" indicates, that the javascript associated with this should automatically be executed-->
    <h1>Interface</h1>
    <div id="box-select-layer"><div id="2d-graph"></div></div>
    <section id="toolbar"></section>
    <section id="tool-menu">
        <div id="collect-menu" class="hidden">
            <h3>Collected items</h3>
            <button id="clear-collection">Clear</button>
            <ul id="selected-items"></ul>
        </div>
        <div id="select-menu" class="">
            <p id="nothing-selected">Nothing selected</p>
            <div id="node-selected" class="hidden">
                <label for="node-name" hidden>Name</label>
                </br>
                <input type="text" id="node-name" name="node-name" placeholder="Enter name" class="bottom-space"></input>

                </br>

                <label for="node-description">Description</label>
                </br>
                <textarea id="node-description" name="node-description" class="bottom-space"></textarea>

                </br>
                <label for="node-image">Node Image</label>
                </br>
                <img id="node-image-preview" style="color:red" class="preview-image" src="" />
                </br>
                <input type="text" id="node-image" name="node-image" placeholder="Enter file name or URL" class="bottom-space" />

                </br>
                <label for="node-detail-image">Info Image</label>
                </br>
                <img id="node-detail-image-preview" style="color:red" class="preview-image" src="" />
                </br>
                <input type="text" id="node-detail-image" name="node-detail-image" placeholder="Enter file name or URL" class="bottom-space" />

                </br>
                <label for="node-type">Type</label>
                </br>
                <select id="node-type" name="node-type" class="bottom-space">
                    <option value="Vorlesung">Vorlesung</option>
                    <option value="Algorithmus">Algorithmus</option>
                    <option value="Definition">Definition</option>
                    <option value="Beispiel">Beispiel</option>
                    <option value="Übung">Übung</option>
                    <option value="Kapitel">Kapitel</option>
                </select>

                </br>
                <label for="node-video">Video</label>
                </br>
                <input type="text" placeholder="Video URL" id="node-video" name="node-video"></input>

                </br>
                <label for="node-references">References</label> <small>One URL per line</small>
                </br>
                <textarea id="node-references" name="node-references" class="bottom-space"></textarea>
            </div>
            <div id="link-selected" class="hidden">
                <h3 id="link-name"></h3>
            </div>
        </div>
        <div id="settings-menu" class="hidden" checked>
            <label for="label-toggle" class="bottom-space">
                <input type="checkbox" checked id="label-toggle" name="label-toggle"></input>
                Show labels in graph
            </label>
            </br>
            </br>


            <h3>Space</h3>
            <label for="space-id-select">Currently open</label>
            </br>
            <select id="space-id-select" name="space-id-select" class="bottom-space">
            </select>

            </br>
            </br>

            <h3>Physics Simulation</h3>

            <button id="reanimate-button" name="reanimate-button" class="bottom-space">Re-simulate</button>

            </br>

            <label for="stop-physics-delay">Amount of time [in seconds] after which the physics simulation is stopped</label>
            </br>
            <input type="number" onkeypress="return (event.charCode !=8 && event.charCode ==0 || (event.charCode >= 48 && event.charCode <= 57))" value="5" id="stop-physics-delay" name="stop-physics-delay" class="small-width">
            </input>
        </div>
    </section>
</div>