80 lines
5.2 KiB
HTML
80 lines
5.2 KiB
HTML
<section id="view-ui" class="view">
|
||
<header class="bar top">
|
||
<label class="pill" title="Pack the XML (and textures) come from — open it in IOP Manager first">
|
||
<i data-icon="box"></i>
|
||
<select id="ims-session" disabled></select>
|
||
</label>
|
||
<input id="ims-entry" type="text" value="xml/uiimageset.xml" spellcheck="false" title="Entry inside the pack" />
|
||
<button id="ims-load" class="iconbtn" disabled><i data-icon="refresh"></i><span>Load</span></button>
|
||
<button id="ims-open-file" class="iconbtn" title="Open an imageset XML from disk"><i data-icon="folder"></i><span>Open file…</span></button>
|
||
<div class="ims-title"><span id="ims-title" class="muted"></span><span id="ims-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||
<button id="ims-texsrc" class="iconbtn" title="Where the textures come from"><i data-icon="image"></i><span id="ims-texsrc-label">Textures</span></button>
|
||
<div class="spacer"></div>
|
||
<button id="ims-undo" class="iconbtn only" title="Undo (Ctrl+Z)"><i data-icon="undo"></i></button>
|
||
<button id="ims-redo" class="iconbtn only" title="Redo (Ctrl+Y)"><i data-icon="redo"></i></button>
|
||
<button id="ims-save" class="btn primary"><i data-icon="save"></i>Save</button>
|
||
</header>
|
||
|
||
<div class="split">
|
||
<aside id="ims-left" class="ims-left">
|
||
<div class="ims-head">
|
||
<div class="search"><i data-icon="search"></i><input id="ims-search" type="search" placeholder="Search imagesets" spellcheck="false" /></div>
|
||
<span id="ims-set-count" class="muted"></span>
|
||
</div>
|
||
<div id="ims-sets" class="ims-list"></div>
|
||
<div class="ims-foot">
|
||
<button id="ims-add-set" class="iconbtn" title="New imageset"><i data-icon="plus"></i><span>Imageset</span></button>
|
||
<button id="ims-del-set" class="iconbtn only danger" title="Delete this imageset"><i data-icon="trash"></i></button>
|
||
</div>
|
||
</aside>
|
||
<div class="splitter" data-target="ims-left" data-edge="left" title="Drag to resize"></div>
|
||
|
||
<div class="main-col">
|
||
<div class="bar nav">
|
||
<div class="seg">
|
||
<button id="ims-zoom-out" title="Zoom out"><i data-icon="minus"></i></button>
|
||
<button id="ims-zoom" title="100 %">100%</button>
|
||
<button id="ims-zoom-in" title="Zoom in"><i data-icon="plus"></i></button>
|
||
</div>
|
||
<button id="ims-fit" class="iconbtn" title="Fit the texture"><i data-icon="fit"></i><span>Fit</span></button>
|
||
<button id="ims-showall" class="iconbtn toggle on" title="Show every box"><i data-icon="grid"></i><span>All boxes</span></button>
|
||
<button id="ims-drawmode" class="iconbtn toggle" title="Drag on the texture to add an image"><i data-icon="draw"></i><span>Draw</span></button>
|
||
<div class="spacer"></div>
|
||
<span id="ims-hover" class="mono"></span>
|
||
<span id="ims-texinfo" class="muted ims-texinfo"></span>
|
||
</div>
|
||
<div class="ims-stage"><canvas id="ims-canvas" tabindex="0"></canvas></div>
|
||
<div id="ims-empty" class="empty">
|
||
<div class="empty-card">
|
||
<i data-icon="image" class="big"></i>
|
||
<h2>UI Image Set editor</h2>
|
||
<p>Open <b>rs.iop</b> in IOP Manager, then press <b>Load</b> to edit <code>xml/uiimageset.xml</code>. Textures are read from the packs next to it (map.iop, map2.iop, sakura.iop, …).</p>
|
||
</div>
|
||
</div>
|
||
<div class="ims-help muted">Drag a box to move it, its handles to resize · Alt/right-drag or drag empty space to pan · wheel to zoom · arrows nudge (Shift ×10) · Delete removes</div>
|
||
</div>
|
||
|
||
<div class="splitter" data-target="ims-side" data-edge="right" title="Drag to resize"></div>
|
||
<aside id="ims-side" class="ims-side" hidden>
|
||
<section class="ims-card">
|
||
<h4>Imageset</h4>
|
||
<div id="ims-setform" class="ims-form"></div>
|
||
</section>
|
||
<section class="ims-card grow">
|
||
<h4>Images <span id="ims-img-count" class="muted"></span></h4>
|
||
<div class="search"><i data-icon="search"></i><input id="ims-img-search" type="search" placeholder="Search images" spellcheck="false" /></div>
|
||
<div id="ims-images" class="ims-list small"></div>
|
||
<div class="ims-foot">
|
||
<button id="ims-add-img" class="iconbtn" title="New image (or use Draw)"><i data-icon="plus"></i><span>Image</span></button>
|
||
<button id="ims-dup-img" class="iconbtn only" title="Duplicate"><i data-icon="copy"></i></button>
|
||
<button id="ims-del-img" class="iconbtn only danger" title="Delete (Del)"><i data-icon="trash"></i></button>
|
||
</div>
|
||
</section>
|
||
<section id="ims-imgbox" class="ims-card">
|
||
<h4>Selected image</h4>
|
||
<div id="ims-imgform" class="ims-form"></div>
|
||
<div class="ims-cropwrap"><canvas id="ims-crop"></canvas></div>
|
||
</section>
|
||
</aside>
|
||
</div>
|
||
</section> |