85 lines
5.6 KiB
HTML
85 lines
5.6 KiB
HTML
<section id="view-mdl" class="view">
|
||
<header class="bar top">
|
||
<button id="mdl-src" class="iconbtn" title="Where models, textures and animations are read from"><i data-icon="box"></i><span id="mdl-src-label">Choose packs…</span></button>
|
||
<button id="mdl-open-file" class="iconbtn" title="Open a .msh, .ani, .skl or model .txt from disk"><i data-icon="folder"></i><span>Open file…</span></button>
|
||
<div class="ims-title"><span id="mdl-title" class="muted"></span><span id="mdl-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||
<div class="spacer"></div>
|
||
<button id="mdl-export" class="iconbtn" title="Export the model or a screenshot"><i data-icon="download"></i><span>Export</span></button>
|
||
<button id="mdl-save" class="btn primary" disabled><i data-icon="save"></i>Save</button>
|
||
</header>
|
||
|
||
<div class="split">
|
||
<aside id="mdl-left" class="ims-left">
|
||
<div class="mdl-kinds">
|
||
<div id="mdl-kinds" class="seg">
|
||
<button data-kind="model" class="on" title="Model configs (resource/model): skeleton + meshes + animations">Models</button>
|
||
<button data-kind="msh" title="Meshes (.msh)">Meshes</button>
|
||
<button data-kind="ani" title="Animations (.ani)">Anims</button>
|
||
<button data-kind="skl" title="Skeletons (.skl)">Skeletons</button>
|
||
</div>
|
||
</div>
|
||
<div class="ims-head">
|
||
<div class="search"><i data-icon="search"></i><input id="mdl-search" type="search" placeholder="Search" spellcheck="false" /></div>
|
||
<span id="mdl-count" class="muted"></span>
|
||
</div>
|
||
<div id="mdl-list" class="mdl-list"></div>
|
||
<div class="ims-foot muted mdl-hint">Double-click opens · right-click for more</div>
|
||
</aside>
|
||
<div class="splitter" data-target="mdl-left" data-edge="left" title="Drag to resize"></div>
|
||
|
||
<div class="main-col">
|
||
<div class="bar nav">
|
||
<button id="mdl-t-tex" class="iconbtn toggle on" title="Textures"><i data-icon="image"></i><span>Textures</span></button>
|
||
<button id="mdl-t-wire" class="iconbtn toggle" title="Wireframe"><i data-icon="grid"></i><span>Wire</span></button>
|
||
<button id="mdl-t-bones" class="iconbtn toggle" title="Bones"><i data-icon="bone"></i><span>Bones</span></button>
|
||
<button id="mdl-t-points" class="iconbtn toggle on" title="Control points (Type_Index)"><i data-icon="target"></i><span>Points</span></button>
|
||
<button id="mdl-t-grid" class="iconbtn toggle on only" title="Floor grid"><i data-icon="floor"></i></button>
|
||
<button id="mdl-t-box" class="iconbtn toggle only" title="Bounding box"><i data-icon="fit"></i></button>
|
||
<button id="mdl-t-texanim" class="iconbtn toggle on only" title="Texture animations from the material scripts (scroll, rotate, wave, frames…)"><i data-icon="zap"></i></button>
|
||
<div class="spacer"></div>
|
||
<span id="mdl-info" class="muted ims-texinfo"></span>
|
||
<button id="mdl-reset" class="iconbtn only" title="Reset the view (double-click the view)"><i data-icon="focus"></i></button>
|
||
</div>
|
||
<div class="mdl-stage">
|
||
<canvas id="mdl-canvas" tabindex="0"></canvas>
|
||
<div id="mdl-labels"></div>
|
||
<div id="mdl-loading" class="mdl-loading" hidden><i></i><span>Loading…</span></div>
|
||
</div>
|
||
<div id="mdl-empty" class="empty">
|
||
<div class="empty-card">
|
||
<i data-icon="cube" class="big"></i>
|
||
<h2>Model viewer</h2>
|
||
<p>Pick the packs (<b>Choose packs…</b>, e.g. the client folder with map.iop and rs.iop), then double-click a model, mesh, animation or skeleton. Drag to turn, right-drag to pan, wheel to zoom.</p>
|
||
</div>
|
||
</div>
|
||
<div id="mdl-timeline" class="mdl-timeline" hidden>
|
||
<button id="mdl-play" class="iconbtn only" title="Play / pause (Space)"><i data-icon="play"></i></button>
|
||
<div class="mdl-track">
|
||
<div id="mdl-events" class="mdl-events"></div>
|
||
<input id="mdl-time" type="range" min="0" max="1000" step="1" value="0" />
|
||
</div>
|
||
<span id="mdl-clock" class="mono"></span>
|
||
<select id="mdl-speed" title="Speed">
|
||
<option value="0.1">0.1×</option><option value="0.25">0.25×</option><option value="0.5">0.5×</option><option value="1" selected>1×</option><option value="1.5">1.5×</option><option value="2">2×</option>
|
||
</select>
|
||
<button id="mdl-loop" class="iconbtn toggle on only" title="Loop"><i data-icon="refresh"></i></button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="splitter" data-target="mdl-side" data-edge="right" title="Drag to resize"></div>
|
||
<aside id="mdl-side" class="ims-side" hidden>
|
||
<section class="ims-card">
|
||
<h4>Scene <span id="mdl-scene-count" class="muted"></span></h4>
|
||
<div id="mdl-scene" class="mdl-rows"></div>
|
||
</section>
|
||
<section id="mdl-mesh-card" class="ims-card" hidden>
|
||
<h4>Mesh <span id="mdl-mesh-name" class="muted"></span></h4>
|
||
<div id="mdl-mesh"></div>
|
||
</section>
|
||
<section id="mdl-ani-card" class="ims-card grow" hidden>
|
||
<h4>Animation <span id="mdl-ani-name" class="muted"></span></h4>
|
||
<div id="mdl-ani" class="mdl-ani"></div>
|
||
</section>
|
||
</aside>
|
||
</div>
|
||
</section> |