LosaDev Tools: Lost Saga modding tools in the browser
This commit is contained in:
LosaDev committed
commit
c5e04472fb
105 files changed
+38541
No files matched your search
@@ -0,0 +1,110 @@
|
||||
<section id="view-ans" class="view">
|
||||
<header class="bar top">
|
||||
<button id="ans-src" class="iconbtn" title="Where skeletons, meshes and animations are read from"><i data-icon="box"></i><span id="ans-src-label">Choose packs…</span></button>
|
||||
<button id="ans-new" class="iconbtn" title="A new empty animation on the current character"><i data-icon="newfile"></i><span>New</span></button>
|
||||
<button id="ans-open-file" class="iconbtn" title="Open an .ani from disk (e.g. exported from Blender)"><i data-icon="folder"></i><span>Open .ani…</span></button>
|
||||
<div class="ims-title"><span id="ans-title" class="muted"></span><span id="ans-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="ans-undo" class="iconbtn only" title="Undo (Ctrl+Z)" disabled><i data-icon="undo"></i></button>
|
||||
<button id="ans-redo" class="iconbtn only" title="Redo (Ctrl+Y)" disabled><i data-icon="redo"></i></button>
|
||||
<button id="ans-export" class="iconbtn" title="Export"><i data-icon="download"></i><span>Export</span></button>
|
||||
<button id="ans-save" class="btn primary" disabled><i data-icon="save"></i>Save</button>
|
||||
</header>
|
||||
|
||||
<div class="split">
|
||||
<aside id="ans-left" class="ims-left">
|
||||
<div class="mdl-kinds">
|
||||
<div id="ans-kinds" class="seg">
|
||||
<button data-kind="model" class="on" title="Model configs: use as the character (skeleton + meshes)">Models</button>
|
||||
<button data-kind="skl" title="Skeletons: use as the character">Skel</button>
|
||||
<button data-kind="msh" title="Meshes: add to the character">Meshes</button>
|
||||
<button data-kind="ani" title="Animations: open, join, retarget">Anims</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ims-head">
|
||||
<div class="search"><i data-icon="search"></i><input id="ans-search" type="search" placeholder="Search" spellcheck="false" /></div>
|
||||
<span id="ans-count" class="muted"></span>
|
||||
</div>
|
||||
<div id="ans-list" class="mdl-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Double-click uses it · right-click for more</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="ans-left" data-edge="left" title="Drag to resize"></div>
|
||||
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<div id="ans-tools" class="seg">
|
||||
<button data-tool="view" class="on" title="View: drag turns the camera, click picks a bone (Esc)">View</button>
|
||||
<button data-tool="rotate" title="Rotate the selected bone: drag (Ctrl = twist around the view) (R)">Rotate</button>
|
||||
<button data-tool="move" title="Move the selected bone (mostly the root, Bip01): drag (G)">Move</button>
|
||||
</div>
|
||||
<button id="ans-t-mesh" class="iconbtn toggle on" title="Meshes"><i data-icon="cube"></i><span>Mesh</span></button>
|
||||
<button id="ans-t-bones" class="iconbtn toggle on" title="Bones"><i data-icon="bone"></i><span>Bones</span></button>
|
||||
<button id="ans-t-ghost" class="iconbtn toggle on" title="The source skeleton of an import / retarget, drawn where it lands"><i data-icon="swap"></i><span>Source</span></button>
|
||||
<button id="ans-t-grid" class="iconbtn toggle on only" title="Floor grid (y = 0)"><i data-icon="floor"></i></button>
|
||||
<div class="spacer"></div>
|
||||
<span id="ans-info" class="muted ims-texinfo"></span>
|
||||
<button id="ans-reset" class="iconbtn only" title="Reset the view"><i data-icon="focus"></i></button>
|
||||
</div>
|
||||
<div class="mdl-stage">
|
||||
<canvas id="ans-canvas" tabindex="0"></canvas>
|
||||
<div id="ans-labels" class="ans-labels"></div>
|
||||
<div id="ans-loading" class="mdl-loading" hidden><i></i><span>Loading…</span></div>
|
||||
</div>
|
||||
<div id="ans-transport" class="ans-transport">
|
||||
<button id="ans-play" class="iconbtn only" title="Play / pause (Space)"><i data-icon="play"></i></button>
|
||||
<span id="ans-clock" class="mono"></span>
|
||||
<select id="ans-speed" title="Playback 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="2">2×</option>
|
||||
</select>
|
||||
<button id="ans-loop" class="iconbtn toggle on only" title="Loop"><i data-icon="refresh"></i></button>
|
||||
<span class="ans-sep"></span>
|
||||
<button id="ans-key" class="iconbtn" title="Key the selected bone at the playhead (K)"><i data-icon="plus"></i><span>Key</span></button>
|
||||
<button id="ans-key-all" class="iconbtn" title="Key every bone at the playhead (Shift+K)"><i data-icon="plus"></i><span>Key all</span></button>
|
||||
<button id="ans-del-keys" class="iconbtn" title="Delete the selected keys (Del)"><i data-icon="trash"></i></button>
|
||||
<div class="spacer"></div>
|
||||
<span id="ans-range-label" class="muted"></span>
|
||||
</div>
|
||||
<div id="ans-dope" class="ans-dope"><canvas id="ans-dope-canvas" tabindex="0"></canvas></div>
|
||||
<div id="ans-empty" class="empty">
|
||||
<div class="empty-card">
|
||||
<i data-icon="bone" class="big"></i>
|
||||
<h2>Anim Studio</h2>
|
||||
<p>Pick the packs, then double-click a <b>model</b> or <b>skeleton</b> for the character (heroes: <b>human_man</b> / <b>human_woman</b>) and an <b>animation</b> to edit — or <b>New</b> for an empty one.</p>
|
||||
<p class="muted">Click a bone, then Rotate / Move and drag; every change keys the bone at the playhead. Shift-drag the ruler for a time range.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="splitter" data-target="ans-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="ans-side" class="ims-side ans-side">
|
||||
<section class="ims-card">
|
||||
<h4>Character <span id="ans-char-name" class="muted"></span></h4>
|
||||
<div id="ans-char"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Clip <span id="ans-clip-name" class="muted"></span></h4>
|
||||
<div id="ans-clip"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Bone <span id="ans-bone-name" class="muted"></span></h4>
|
||||
<div id="ans-bone"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Cut & join</h4>
|
||||
<div id="ans-ops"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Events <span id="ans-ev-count" class="muted"></span></h4>
|
||||
<div id="ans-events"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Hitbox</h4>
|
||||
<div id="ans-hit"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Blender</h4>
|
||||
<div id="ans-blender"></div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,86 @@
|
||||
<section id="view-cos" class="view">
|
||||
<header class="bar top">
|
||||
<button id="cos-src" class="iconbtn" title="Where the hero body, meshes and animations are read from"><i data-icon="box"></i><span id="cos-src-label">Choose packs…</span></button>
|
||||
<button id="cos-import" class="iconbtn" title="Import a 3D model as the costume: .glb / .gltf (Blender: File → Export → glTF 2.0, with its armature if it has one), .fbx (binary) or .obj"><i data-icon="import"></i><span>Import 3D…</span></button>
|
||||
<button id="cos-blender" class="iconbtn" title="Save the body you see (skeleton, weights, textures) as a .glb to model on in Blender"><i data-icon="cube"></i><span>Body for Blender…</span></button>
|
||||
<div class="ims-title"><span id="cos-title" class="muted"></span><span id="cos-dirty" class="dot bad" title="Not saved yet" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="cos-save" class="btn primary" disabled><i data-icon="save"></i>Save</button>
|
||||
</header>
|
||||
|
||||
<div class="split">
|
||||
<aside id="cos-left" class="ims-left">
|
||||
<div class="mdl-kinds">
|
||||
<div id="cos-kinds" class="seg">
|
||||
<button data-kind="msh" class="on" title="Meshes: double-click puts it on the hero (costume bodies, hands, helmets, cloaks…)">Meshes</button>
|
||||
<button data-kind="ani" title="Animations: double-click plays it on the hero">Anims</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ims-head">
|
||||
<div class="search"><i data-icon="search"></i><input id="cos-search" type="search" placeholder="Search (e.g. _body_)" spellcheck="false" /></div>
|
||||
<span id="cos-count" class="muted"></span>
|
||||
</div>
|
||||
<div id="cos-list" class="mdl-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Double-click: wear the mesh / play the animation</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="cos-left" data-edge="left" title="Drag to resize"></div>
|
||||
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<div id="cos-sex" class="seg">
|
||||
<button data-sex="man" class="on" title="sp2_human_man: human_body, default_hand, face, hair">Man</button>
|
||||
<button data-sex="woman" title="sp2_human_woman: the _hw meshes (same skeleton)">Woman</button>
|
||||
</div>
|
||||
<button id="cos-t-bones" class="iconbtn toggle only" title="Bones"><i data-icon="bone"></i></button>
|
||||
<button id="cos-t-grid" class="iconbtn toggle on only" title="Floor grid (y = 0)"><i data-icon="floor"></i></button>
|
||||
<button id="cos-t-wire" class="iconbtn toggle only" title="Wireframe"><i data-icon="grid"></i></button>
|
||||
<div class="spacer"></div>
|
||||
<span id="cos-info" class="muted ims-texinfo"></span>
|
||||
<button id="cos-reset" class="iconbtn only" title="Reset the view"><i data-icon="focus"></i></button>
|
||||
</div>
|
||||
<div class="mdl-stage">
|
||||
<canvas id="cos-canvas" tabindex="0"></canvas>
|
||||
<div id="cos-loading" class="mdl-loading" hidden><i></i><span>Loading…</span></div>
|
||||
</div>
|
||||
<div class="ans-transport">
|
||||
<button id="cos-play" class="iconbtn only" title="Play / pause (Space)"><i data-icon="play"></i></button>
|
||||
<select id="cos-anim" title="Animation"></select>
|
||||
<span id="cos-clock" class="mono"></span>
|
||||
<input id="cos-scrub" type="range" min="0" max="1000" value="0" class="grow" title="Time" />
|
||||
<button id="cos-tpose" class="iconbtn" title="Stop and show the rest pose (T-pose: where the costume is modelled)"><i data-icon="bone"></i><span>T-pose</span></button>
|
||||
</div>
|
||||
<div id="cos-empty" class="empty">
|
||||
<div class="empty-card">
|
||||
<i data-icon="shirt" class="big"></i>
|
||||
<h2>Costume Studio</h2>
|
||||
<p>Pick the packs: the hero body appears in its T-pose. <b>Import 3D…</b> a .glb / .gltf / .obj — it is fitted to the body, takes its bones' weights (or the body's) and moves with every animation.</p>
|
||||
<p class="muted">For an exact fit: <b>Body for Blender…</b>, model the clothes on that body in Blender (parent them to its armature with weights, or leave that to this tool), export glTF 2.0 and import it here. Save writes the .msh, its material and the .dds textures.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="splitter" data-target="cos-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="cos-side" class="ims-side ans-side">
|
||||
<section class="ims-card">
|
||||
<h4>Hero <span id="cos-char-name" class="muted"></span></h4>
|
||||
<div id="cos-char"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Costume <span id="cos-file-name" class="muted"></span></h4>
|
||||
<div id="cos-opts"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Materials</h4>
|
||||
<div id="cos-mats"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Result</h4>
|
||||
<div id="cos-report"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Register in game <span id="cos-reg-file" class="muted"></span></h4>
|
||||
<div id="cos-reg"></div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,38 @@
|
||||
<section id="view-fx" class="view">
|
||||
<header class="bar top">
|
||||
<button id="fx-src" class="iconbtn" title="Choose packs or extracted resources"><i data-icon="box"></i><span id="fx-src-label">Choose packs…</span></button>
|
||||
<button id="fx-open-file" class="iconbtn" title="Open an effect script from disk"><i data-icon="folder"></i><span>Open file…</span></button>
|
||||
<button id="fx-new" class="iconbtn" title="Create a new effect"><i data-icon="plus"></i><span>New</span></button>
|
||||
<div class="ims-title"><span id="fx-title" class="muted"></span><span id="fx-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="fx-to-lab" class="iconbtn" title="Edit this effect in FX Lab (sliders, curves, hero preview)"><i data-icon="brush"></i><span>Edit in FX Lab</span></button>
|
||||
<button id="fx-save-as" class="iconbtn" disabled><i data-icon="download"></i><span>Save As…</span></button>
|
||||
<button id="fx-save" class="btn primary" disabled><i data-icon="save"></i>Save</button>
|
||||
</header>
|
||||
<div class="split">
|
||||
<aside id="fx-left" class="ims-left">
|
||||
<div class="ims-head"><div class="search"><i data-icon="search"></i><input id="fx-search" type="search" placeholder="Search effects" spellcheck="false" /></div><span id="fx-count" class="muted"></span></div>
|
||||
<div id="fx-list" class="mdl-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Double-click an effect to open it</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="fx-left" data-edge="left" title="Drag to resize"></div>
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<button id="fx-play" class="iconbtn toggle on" title="Play or pause"><i data-icon="play"></i><span>Play</span></button>
|
||||
<button id="fx-restart" class="iconbtn" title="Restart preview"><i data-icon="refresh"></i><span>Restart</span></button>
|
||||
<button id="fx-grid" class="iconbtn toggle on" title="Floor grid"><i data-icon="floor"></i><span>Grid</span></button>
|
||||
<div class="spacer"></div><span id="fx-stats" class="mono muted"></span>
|
||||
<button id="fx-reset" class="iconbtn only" title="Reset camera"><i data-icon="focus"></i></button>
|
||||
</div>
|
||||
<div class="mdl-stage fx-stage"><canvas id="fx-canvas" tabindex="0"></canvas></div>
|
||||
<div id="fx-empty" class="empty"><div class="empty-card"><i data-icon="zap" class="big"></i><h2>Effect editor</h2><p>Choose the game's packs or an extracted resource folder, then open an effect. Drag to orbit, right-drag to pan, wheel to zoom.</p></div></div>
|
||||
<div class="ims-help muted">Select a system in the hierarchy to set each particle or model separately. Particle preview uses the Map editor simulator; model and light preview is not available yet.</div>
|
||||
</div>
|
||||
<div class="splitter" data-target="fx-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="fx-side" class="ims-side fx-side">
|
||||
<section class="ims-card"><h4>Hierarchy</h4><div id="fx-hierarchy" class="fx-hierarchy"></div><div class="fx-actions"><button id="fx-add-particle" class="iconbtn"><i data-icon="plus"></i>Particle</button><button id="fx-add-model" class="iconbtn"><i data-icon="plus"></i>Model</button><button id="fx-add-emitter" class="iconbtn"><i data-icon="plus"></i>Emitter</button><button id="fx-add-affector" class="iconbtn"><i data-icon="plus"></i>Affector</button><button id="fx-duplicate-block" class="iconbtn" title="Duplicate selected particle or model"><i data-icon="copy"></i></button><button id="fx-move-up" class="iconbtn" title="Move selected particle or model up"><i data-icon="up"></i></button><button id="fx-move-down" class="iconbtn" title="Move selected particle or model down"><i data-icon="down"></i></button><button id="fx-delete-block" class="iconbtn danger" title="Remove selected block"><i data-icon="trash"></i></button></div></section>
|
||||
<section class="ims-card"><h4>Properties <span id="fx-selection" class="muted"></span></h4><div id="fx-properties" class="fx-properties"></div><div class="fx-actions"><button id="fx-add-field" class="iconbtn"><i data-icon="plus"></i>Field</button></div></section>
|
||||
<section class="ims-card fx-script-card"><h4>Effect script <span id="fx-parse-status" class="muted"></span></h4><textarea id="fx-script" class="fx-script" spellcheck="false" aria-label="Effect script"></textarea></section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,50 @@
|
||||
<section id="view-fxlab" class="view">
|
||||
<header class="bar top">
|
||||
<button id="fxl-src" class="iconbtn" title="Game packs used for pack textures and the hero preview"><i data-icon="box"></i><span id="fxl-src-label">Choose packs…</span></button>
|
||||
<button id="fxl-new" class="iconbtn" title="Start an empty effect"><i data-icon="plus"></i><span>New</span></button>
|
||||
<input id="fxl-name" class="fxl-name" type="text" spellcheck="false" value="my_effect" title="Effect name (file name of the export)" />
|
||||
<button id="fxl-save-preset" class="iconbtn" title="Save as a preset (FX Lab library)"><i data-icon="save"></i><span>Save preset</span></button>
|
||||
<button id="fxl-open" class="iconbtn" title="Open an existing Lost Saga effect (packs or file) or a preset JSON"><i data-icon="folder"></i><span>Open…</span></button>
|
||||
<button id="fxl-export-json" class="iconbtn" title="Export the preset as JSON"><i data-icon="download"></i><span>JSON</span></button>
|
||||
<div class="spacer"></div>
|
||||
<button id="fxl-export-sheet" class="iconbtn" title="Render the free preview to a sprite sheet PNG + Aseprite-style JSON"><i data-icon="image"></i><span>Sprite sheet…</span></button>
|
||||
<button id="fxl-save" class="iconbtn" title="Save the script back to the effect it was opened from" hidden><i data-icon="save"></i><span id="fxl-save-label">Save</span></button>
|
||||
<button id="fxl-export-ls" class="btn primary" title="Write resource/effect/<name>.txt and its textures (DDS) to a folder"><i data-icon="upload"></i>Export LS effect…</button>
|
||||
</header>
|
||||
<div class="split">
|
||||
<aside id="fxl-left" class="ims-left">
|
||||
<div class="ims-head"><div class="search"><i data-icon="search"></i><input id="fxl-search" type="search" placeholder="Search presets" spellcheck="false" /></div></div>
|
||||
<div id="fxl-presets" class="ims-list fxl-presets"></div>
|
||||
<div class="ims-foot muted mdl-hint">Click a preset to load it</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="fxl-left" data-edge="left" title="Drag to resize"></div>
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<button id="fxl-play" class="iconbtn toggle on" title="Play or pause"><i data-icon="play"></i><span>Play</span></button>
|
||||
<button id="fxl-restart" class="iconbtn only" title="Restart (fire the effect again)"><i data-icon="refresh"></i></button>
|
||||
<button id="fxl-grid" class="iconbtn only toggle on" title="Floor grid"><i data-icon="floor"></i></button>
|
||||
<select id="fxl-mode" title="Where the effect plays">
|
||||
<option value="free">Free (no hero)</option>
|
||||
<option value="bone">On hero (bone)</option>
|
||||
<option value="hit">Hit target</option>
|
||||
</select>
|
||||
<select id="fxl-anim" title="Hero animation played with the effect" hidden></select>
|
||||
<select id="fxl-bg" title="Background">
|
||||
<option value="gray">Gray</option><option value="dark">Dark</option><option value="black">Black</option>
|
||||
</select>
|
||||
<div class="spacer"></div><span id="fxl-stats" class="mono muted"></span>
|
||||
<button id="fxl-reset" class="iconbtn only" title="Reset camera"><i data-icon="focus"></i></button>
|
||||
</div>
|
||||
<div id="fxl-stage" class="mdl-stage fx-stage"><canvas id="fxl-canvas" tabindex="0"></canvas></div>
|
||||
<div class="ims-help muted">Pick a preset, then tune the selected layer on the right. Drag to orbit, right-drag to pan, wheel to zoom. Curves: drag points, double-click to add, right-click to remove.</div>
|
||||
</div>
|
||||
<div class="splitter" data-target="fxl-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="fxl-side" class="ims-side fx-side fxl-side">
|
||||
<section class="ims-card"><h4>Layers</h4><div id="fxl-layers" class="fxl-layers"></div>
|
||||
<details id="fxl-notes" class="fxl-notes" hidden></details>
|
||||
<div class="fx-actions"><button id="fxl-add-layer" class="iconbtn"><i data-icon="plus"></i>Layer</button><button id="fxl-dup-layer" class="iconbtn" title="Duplicate layer"><i data-icon="copy"></i></button><button id="fxl-up-layer" class="iconbtn" title="Move up"><i data-icon="up"></i></button><button id="fxl-del-layer" class="iconbtn danger" title="Remove layer"><i data-icon="trash"></i></button></div></section>
|
||||
<section class="ims-card fxl-props-card"><h4>Layer <span id="fxl-layer-name" class="muted"></span></h4><div id="fxl-props" class="fxl-props"></div></section>
|
||||
<section class="ims-card"><details><summary class="muted">Lost Saga script (generated)</summary><textarea id="fxl-script" class="fx-script fxl-script" spellcheck="false" readonly></textarea></details></section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,38 @@
|
||||
<section id="view-hero" class="view">
|
||||
<header class="bar top">
|
||||
<button id="hero-src" class="iconbtn"><i data-icon="box"></i><span id="hero-src-label">Choose packs…</span></button>
|
||||
<div class="ims-title"><span id="hero-title" class="muted">Hero Creator · experimental</span><span id="hero-dirty" class="dot bad" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="hero-export" class="btn primary" disabled><i data-icon="download"></i>Export config…</button>
|
||||
</header>
|
||||
<div class="split">
|
||||
<aside id="hero-left" class="ims-left">
|
||||
<div class="ims-head"><div class="search"><i data-icon="search"></i><input id="hero-search" type="search" placeholder="Search heroes" spellcheck="false" /></div><span id="hero-count" class="muted"></span></div>
|
||||
<div id="hero-list" class="hero-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Select a hero as the base</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="hero-left" data-edge="left" title="Drag to resize"></div>
|
||||
<div class="main-col hero-main">
|
||||
<div id="hero-empty" class="empty"><div class="empty-card"><i data-icon="cube" class="big"></i><h2>Hero Creator</h2><p>Choose the client packs and a hero. Customize gear meshes, moves, skills and effects, then export changed INI files for testing.</p></div></div>
|
||||
<div id="hero-work" hidden>
|
||||
<div class="hero-summary"><h2 id="hero-name"></h2><p id="hero-summary" class="muted"></p></div>
|
||||
<div class="hero-studio">
|
||||
<div id="hero-stage" class="hero-stage" tabindex="0"><div id="hero-action-label" class="hero-action-label">Select an action to preview</div><div id="hero-practice-hud" class="hero-practice-hud" hidden><b>TRAINING</b><span id="hero-dummy-health">Dummy 100 / 100</span></div></div>
|
||||
<div class="hero-playbar"><button id="hero-idle" class="iconbtn">Idle pose</button><button id="hero-stop" class="iconbtn">Stop</button><button id="hero-practice" class="iconbtn" disabled>Training mode</button><span id="hero-play-status" class="muted"></span></div>
|
||||
<div id="hero-practice-help" class="hero-practice-help" hidden>↑ ↓ ← → move · double tap or Shift dash · A jump · S guard · D attack / hold D half attack · SD / ASD / AD / AS skills · 1–4 skill shortcuts · Esc exit</div>
|
||||
<div id="hero-combos" class="hero-combos"></div>
|
||||
<div id="hero-skills" class="hero-skills"></div>
|
||||
<div id="hero-action-info" class="hero-action-info muted"></div>
|
||||
</div>
|
||||
<div class="hero-tabs seg"><button data-hero-tab="gear" class="on">Gear</button><button data-hero-tab="moves">Moveset</button><button data-hero-tab="skills">Skills</button><button data-hero-tab="effects">Effects</button><button data-hero-tab="flow" title="Every attack: input → animation events → hits → attack attributes → effects / sounds / buffs, with the checks">Flow</button></div>
|
||||
<div id="hero-content" class="hero-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="splitter" data-target="hero-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="hero-side" class="ims-side hero-side">
|
||||
<section class="ims-card"><h4>Preview</h4><p class="muted">Play combos and skills here using the animations and effect references in the hero config.</p><button id="hero-preview" class="btn" disabled>Reload hero preview</button><div id="hero-preview-status" class="muted"></div></section>
|
||||
<section class="ims-card"><h4>Selected field</h4><div id="hero-field-detail" class="muted">Select a field to edit its exact INI value.</div></section>
|
||||
<section class="ims-card"><h4>Export status</h4><div id="hero-export-status" class="muted">Only changed INI files will be exported. The game packs remain untouched.</div></section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,16 @@
|
||||
<section id="view-items" class="view">
|
||||
<header class="bar top">
|
||||
<div class="zone-title"><h2>Items</h2><span id="it-source" class="muted"></span></div>
|
||||
<div class="spacer"></div>
|
||||
<div class="search"><i data-icon="search"></i><input id="it-search" type="search" placeholder="Name, ID, icon or section" spellcheck="false" /></div>
|
||||
<label class="chip"><input id="it-hide" type="checkbox" checked /><span>Hide unnamed</span></label>
|
||||
<select id="it-text" title="Text table (language) the names come from"></select>
|
||||
<button id="it-folder" class="iconbtn" title="Read the items from another game folder"><i data-icon="folder"></i><span>Folder</span></button>
|
||||
<button id="it-reload" class="iconbtn" title="Read the packs again (after a patch or an edit)"><i data-icon="refresh"></i><span>Reload</span></button>
|
||||
</header>
|
||||
<div class="it-body">
|
||||
<nav id="it-cats" class="it-cats"></nav>
|
||||
<div class="it-list"><div id="it-table" class="vtable"></div><div id="it-count" class="muted it-count"></div></div>
|
||||
<aside id="it-detail" class="it-detail"><div class="it-empty muted">Pick an item.</div></aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,87 @@
|
||||
<section id="view-map" class="view">
|
||||
<header class="bar top">
|
||||
<button id="map-src" class="iconbtn" title="Where the maps, meshes and textures are read from"><i data-icon="box"></i><span id="map-src-label">Choose packs…</span></button>
|
||||
<button id="map-open-file" class="iconbtn" title="Open a map .ini from disk"><i data-icon="folder"></i><span>Open file…</span></button>
|
||||
<div class="ims-title"><span id="map-title" class="muted"></span><span id="map-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="map-add" class="iconbtn" title="Add an object, effect or point"><i data-icon="plus"></i><span>Add</span></button>
|
||||
<button id="map-undo" class="iconbtn only" title="Undo (Ctrl+Z)" disabled><i data-icon="undo"></i></button>
|
||||
<button id="map-redo" class="iconbtn only" title="Redo (Ctrl+Y)" disabled><i data-icon="redo"></i></button>
|
||||
<button id="map-save" class="btn primary"><i data-icon="save"></i>Save</button>
|
||||
</header>
|
||||
|
||||
<div class="split">
|
||||
<aside id="map-left" class="ims-left">
|
||||
<div class="ims-head map-head">
|
||||
<select id="map-mode" title="Mode"><option value="">All modes</option></select>
|
||||
</div>
|
||||
<div class="ims-head">
|
||||
<div class="search"><i data-icon="search"></i><input id="map-search" type="search" placeholder="Search maps / models" spellcheck="false" /></div>
|
||||
<span id="map-count" class="muted"></span>
|
||||
</div>
|
||||
<div id="map-list" class="mdl-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Double-click a map to open it</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="map-left" data-edge="left" title="Drag to resize"></div>
|
||||
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<button id="map-t-anim" class="iconbtn toggle on" title="Map animation: moving textures (water, sky, glow), animated objects, elevators — off shows the map at rest"><i data-icon="play"></i><span>Anim</span></button>
|
||||
<button id="map-t-light" class="iconbtn toggle on" title="Lighting, fog and background from the config"><i data-icon="zap"></i><span>Light</span></button>
|
||||
<button id="map-t-tex" class="iconbtn toggle on only" title="Textures"><i data-icon="image"></i></button>
|
||||
<button id="map-t-wire" class="iconbtn toggle only" title="Wireframe"><i data-icon="grid"></i></button>
|
||||
<button id="map-t-col" class="iconbtn toggle" title="Collision mesh (.cms): where players can stand"><i data-icon="shield"></i><span>Collision</span></button>
|
||||
<button id="map-t-outline" class="iconbtn toggle on" title="Outline edges (.edg)"><i data-icon="draw"></i><span>Outline</span></button>
|
||||
<button id="map-t-objects" class="iconbtn toggle on" title="Objects placed by the config"><i data-icon="cube"></i><span>Objects</span></button>
|
||||
<button id="map-t-labels" class="iconbtn toggle" title="Names of every point"><i data-icon="note"></i><span>Labels</span></button>
|
||||
<button id="map-t-grid" class="iconbtn toggle only" title="Floor grid"><i data-icon="floor"></i></button>
|
||||
<label class="pill" title="Snap dragged points to a grid"><i data-icon="target"></i>
|
||||
<select id="map-snap"><option value="0">No snap</option><option value="10">10</option><option value="25">25</option><option value="50">50</option><option value="100">100</option></select>
|
||||
</label>
|
||||
<div class="spacer"></div>
|
||||
<span id="map-hover" class="mono ims-texinfo"></span>
|
||||
<button id="map-top" class="iconbtn only" title="Top view (T)"><i data-icon="up"></i></button>
|
||||
<button id="map-reset" class="iconbtn only" title="Reset the view"><i data-icon="focus"></i></button>
|
||||
</div>
|
||||
<div class="mdl-stage">
|
||||
<canvas id="map-canvas" tabindex="0"></canvas>
|
||||
<div id="map-labels" class="map-labels"></div>
|
||||
<div id="map-loading" class="mdl-loading" hidden><i></i><span>Loading…</span></div>
|
||||
</div>
|
||||
<div id="map-empty" class="empty">
|
||||
<div class="empty-card">
|
||||
<i data-icon="map" class="big"></i>
|
||||
<h2>Map editor</h2>
|
||||
<p>Pick the packs (<b>Choose packs…</b>: the client folder with rs.iop and map.iop), then double-click a map. Select an object and use <b>G</b> to move, <b>R</b> to rotate its editor preview, or <b>S</b> to scale. Drag points to move; Alt-drag changes height. Editor rotation is saved in a comment so it returns when reopened, but the game ignores it because map files have no rotation field.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ims-help muted">Click a point to select · P move · R rotate preview · S scale · Snap base to map floor · Alt-drag: height · arrows nudge · Ctrl+D copy · Del remove · F focus · T top view</div>
|
||||
</div>
|
||||
|
||||
<div class="splitter" data-target="map-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="map-side" class="ims-side map-side" hidden>
|
||||
<section class="ims-card">
|
||||
<h4>Map</h4>
|
||||
<div id="map-info" class="ims-form"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Layers</h4>
|
||||
<div id="map-layers" class="map-layers"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Objects <span id="map-object-count" class="muted">0</span></h4>
|
||||
<div class="search"><i data-icon="search"></i><input id="map-object-search" type="search" placeholder="Search objects / models" spellcheck="false" /></div>
|
||||
<div id="map-object-list" class="map-object-list"></div>
|
||||
</section>
|
||||
<section class="ims-card">
|
||||
<h4>Sections <span id="map-sec-count" class="muted"></span></h4>
|
||||
<div class="search"><i data-icon="search"></i><input id="map-sec-search" type="search" placeholder="Filter sections / values" spellcheck="false" /></div>
|
||||
<div id="map-sections" class="map-sections"></div>
|
||||
</section>
|
||||
<section id="map-sec-card" class="ims-card grow" hidden>
|
||||
<h4><span id="map-sec-name"></span></h4>
|
||||
<div id="map-sec"></div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,85 @@
|
||||
<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>
|
||||
@@ -0,0 +1,84 @@
|
||||
<section id="view-quests" class="view">
|
||||
<header class="bar top">
|
||||
<div class="zone-title"><h2>Quests</h2><span id="q-source" class="muted"></span></div>
|
||||
<div class="spacer"></div>
|
||||
<nav class="seg" id="q-subtabs">
|
||||
<button data-sub="quests" class="on"><i data-icon="scroll"></i>Quests</button>
|
||||
<button data-sub="rewards"><i data-icon="gem"></i>Rewards</button>
|
||||
<button data-sub="missions"><i data-icon="layout"></i>Missions</button>
|
||||
<button data-sub="checks"><i data-icon="check"></i>Checks</button>
|
||||
</nav>
|
||||
<select id="q-text" title="Text table (language) the texts come from and new texts go into"></select>
|
||||
<button id="q-export" class="iconbtn" title="Write the quest, reward and mission INIs as they are now into a folder, for the game server's config folder"><i data-icon="download"></i><span>Export for server</span></button>
|
||||
<button id="q-folder" class="iconbtn" title="Read the quests from another game folder"><i data-icon="folder"></i><span>Folder</span></button>
|
||||
<button id="q-reload" class="iconbtn" title="Read the packs again"><i data-icon="refresh"></i><span>Reload</span></button>
|
||||
</header>
|
||||
|
||||
<div class="sub on q-sub" data-sub="quests">
|
||||
<div class="q-body">
|
||||
<div class="q-list">
|
||||
<div class="bar nav">
|
||||
<div class="search"><i data-icon="search"></i><input id="q-search" type="search" placeholder="Title, main index, section, class" spellcheck="false" /></div>
|
||||
<select id="q-class" title="Quest class"></select>
|
||||
<select id="q-filter" title="Show">
|
||||
<option value="">All</option>
|
||||
<option value="event">Events (dates)</option>
|
||||
<option value="active">Events running now</option>
|
||||
<option value="daily">Daily</option>
|
||||
<option value="repeat">Repeatable</option>
|
||||
<option value="problems">With problems</option>
|
||||
</select>
|
||||
<button id="q-new" class="iconbtn" title="New quest"><i data-icon="plus"></i><span>New</span></button>
|
||||
</div>
|
||||
<div id="q-table" class="vtable"></div>
|
||||
<div id="q-count" class="muted it-count"></div>
|
||||
</div>
|
||||
<div id="q-detail" class="q-detail"><div class="it-empty muted">Pick a quest.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sub q-sub" data-sub="rewards">
|
||||
<div class="q-body two">
|
||||
<div class="q-list">
|
||||
<div class="bar nav">
|
||||
<div class="search"><i data-icon="search"></i><input id="qr-search" type="search" placeholder="RewardIndex, name, type" spellcheck="false" /></div>
|
||||
<select id="qr-type" title="Present type"></select>
|
||||
<label class="chip"><input id="qr-unused" type="checkbox" /><span>Unused only</span></label>
|
||||
<button id="qr-new" class="iconbtn" title="New reward"><i data-icon="plus"></i><span>New</span></button>
|
||||
</div>
|
||||
<div id="qr-table" class="vtable"></div>
|
||||
<div id="qr-count" class="muted it-count"></div>
|
||||
</div>
|
||||
<div id="qr-detail" class="q-detail"><div class="it-empty muted">Pick a reward.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sub q-sub" data-sub="missions">
|
||||
<div class="q-body">
|
||||
<div class="q-list">
|
||||
<div class="bar nav">
|
||||
<nav class="seg" id="qm-kind">
|
||||
<button data-kind="daily" class="on">Daily</button>
|
||||
<button data-kind="weekly">Weekly</button>
|
||||
<button data-kind="monthly">Monthly</button>
|
||||
</nav>
|
||||
<div class="search"><i data-icon="search"></i><input id="qm-search" type="search" placeholder="Date, code, title" spellcheck="false" /></div>
|
||||
<button id="qm-new" class="iconbtn" title="New date (a copy of the selected one)"><i data-icon="plus"></i><span>New</span></button>
|
||||
</div>
|
||||
<div id="qm-table" class="vtable"></div>
|
||||
<div id="qm-count" class="muted it-count"></div>
|
||||
</div>
|
||||
<div id="qm-detail" class="q-detail"><div class="it-empty muted">Pick a date.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sub q-sub" data-sub="checks">
|
||||
<div class="bar nav">
|
||||
<button id="qc-run" class="iconbtn"><i data-icon="refresh"></i><span>Check again</span></button>
|
||||
<select id="qc-sev"><option value="">Errors and warnings</option><option value="error">Errors only</option></select>
|
||||
<div class="spacer"></div>
|
||||
<span id="qc-count" class="muted"></span>
|
||||
</div>
|
||||
<div id="qc-table" class="vtable"></div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,38 @@
|
||||
<section id="view-tables" class="view">
|
||||
<header class="bar top">
|
||||
<div class="zone-title"><h2>Tables</h2><span id="dt-source" class="muted"></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="dt-client" class="iconbtn" title="Read the client tables from another game folder (default: this profile's)"><i data-icon="box"></i><span>Game folder</span></button>
|
||||
<button id="dt-server" class="iconbtn" title="The game server's tables folder (ls_gamesvr\config\tables)"><i data-icon="server"></i><span>Server folder</span></button>
|
||||
<button id="dt-file" class="iconbtn" title="Open any .dat table file"><i data-icon="folder"></i><span>Open file</span></button>
|
||||
<button id="dt-maker" class="iconbtn" title="ioDataMaker folder (Config.xlsx + ExcelData): column descriptions and enum names"><i data-icon="gear"></i><span>ioDataMaker</span></button>
|
||||
<button id="dt-reload" class="iconbtn" title="List the tables again"><i data-icon="refresh"></i><span>Reload</span></button>
|
||||
</header>
|
||||
<div class="dt-body">
|
||||
<nav id="dt-list" class="dt-list"></nav>
|
||||
<div class="dt-main">
|
||||
<div class="bar nav" id="dt-tools">
|
||||
<div class="search"><i data-icon="search"></i><input id="dt-search" type="search" placeholder="Filter rows (any cell)" spellcheck="false" /></div>
|
||||
<select id="dt-enc" title="Code page of the text columns">
|
||||
<option value="euc-kr">Korean (CP949)</option>
|
||||
<option value="big5">Trad. Chinese (Big5)</option>
|
||||
<option value="windows-874">Thai (874)</option>
|
||||
<option value="gbk">Simpl. Chinese (GBK)</option>
|
||||
<option value="shift_jis">Japanese</option>
|
||||
<option value="windows-1252">Western (1252)</option>
|
||||
</select>
|
||||
<button id="dt-add" class="iconbtn" title="Add a row after the selection (Ctrl+Enter)"><i data-icon="plus"></i><span>Row</span></button>
|
||||
<button id="dt-dup" class="iconbtn" title="Duplicate the selected rows (Ctrl+D)"><i data-icon="copy"></i><span>Duplicate</span></button>
|
||||
<button id="dt-del" class="iconbtn danger" title="Delete the selected rows (Ctrl+Delete)"><i data-icon="trash"></i><span>Delete</span></button>
|
||||
<button id="dt-undo" class="iconbtn only" title="Undo (Ctrl+Z)"><i data-icon="undo"></i></button>
|
||||
<button id="dt-redo" class="iconbtn only" title="Redo (Ctrl+Y)"><i data-icon="redo"></i></button>
|
||||
<div class="spacer"></div>
|
||||
<button id="dt-import" class="iconbtn" title="Replace the rows with an .xlsx / .csv whose first row names the columns (an ioDataMaker sheet works too)"><i data-icon="upload"></i><span>Import</span></button>
|
||||
<button id="dt-export" class="iconbtn" title="Export as .xlsx (or .csv)"><i data-icon="download"></i><span>Export</span></button>
|
||||
<button id="dt-save" class="btn primary" disabled title="Write the table back (Ctrl+S)"><i data-icon="save"></i>Save</button>
|
||||
</div>
|
||||
<div id="dt-grid" class="dt-grid"><div class="it-empty muted">Pick a table.</div></div>
|
||||
<div id="dt-status" class="muted dt-status"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,53 @@
|
||||
<section id="view-tex" class="view">
|
||||
<header class="bar top">
|
||||
<button id="tex-open" class="iconbtn" title="Open a folder of textures (.png .jpg .tga .bmp .dds)"><i data-icon="folder"></i><span>Open folder…</span></button>
|
||||
<button id="tex-openfile" class="iconbtn" title="Open one picture (or drop it on the view)"><i data-icon="image"></i><span>Open file…</span></button>
|
||||
<button id="tex-convert" class="iconbtn" title="Every .png / .jpg / .tga / .bmp of the folder → .dds (the format in Save as .dds)"><i data-icon="swap"></i><span>Convert folder to .dds…</span></button>
|
||||
<div class="ims-title"><span id="tex-title" class="muted"></span><span id="tex-dirty" class="dot bad" title="Not saved yet" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="tex-saveas" class="btn" disabled><i data-icon="download"></i>Save as…</button>
|
||||
<button id="tex-save" class="btn primary" disabled title="<name>.dds next to the picture (Ctrl+S)"><i data-icon="save"></i>Save .dds</button>
|
||||
</header>
|
||||
|
||||
<div class="split">
|
||||
<aside id="tex-left" class="ims-left">
|
||||
<div class="ims-head">
|
||||
<div class="search"><i data-icon="search"></i><input id="tex-search" type="search" placeholder="Search" spellcheck="false" /></div>
|
||||
<span id="tex-count" class="muted"></span>
|
||||
<button id="tex-refresh" class="iconbtn only" title="Read the folder again"><i data-icon="refresh"></i></button>
|
||||
</div>
|
||||
<div id="tex-list" class="mdl-list tex-list"></div>
|
||||
<div id="tex-dir" class="ims-foot muted mdl-hint tex-dir"></div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="tex-left" data-edge="left" title="Drag to resize"></div>
|
||||
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<div id="tex-tools" class="seg"></div>
|
||||
<div class="spacer"></div>
|
||||
<span id="tex-zoom" class="muted mono"></span>
|
||||
<button id="tex-100" class="iconbtn" title="Actual size (100%)"><span>1:1</span></button>
|
||||
<button id="tex-fit" class="iconbtn only" title="Fit the picture (0)"><i data-icon="fit"></i></button>
|
||||
</div>
|
||||
<div class="mdl-stage tex-stage">
|
||||
<canvas id="tex-canvas" tabindex="0"></canvas>
|
||||
<div id="tex-loading" class="mdl-loading" hidden><i></i><span>Loading…</span></div>
|
||||
<div id="tex-empty" class="empty">
|
||||
<div class="empty-card">
|
||||
<i data-icon="brush" class="big"></i>
|
||||
<h2>Texture Studio</h2>
|
||||
<p><b>Open folder…</b> and click a picture. Select what to change — <b>Magic wand</b> / <b>Colour range</b> (click a colour), <b>Lasso</b>, <b>Rectangle</b>; Shift adds, Alt takes away — then <b>Recolour</b> it and <b>Apply</b>.</p>
|
||||
<p class="muted"><b>Save .dds</b> writes the game's format (DXT1 / DXT5 with mip maps, like its own textures); <b>Convert folder to .dds…</b> does every .png of the folder at once. Wheel: zoom, middle / right drag or Space: move.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="splitter" data-target="tex-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="tex-side" class="ims-side ans-side">
|
||||
<section class="ims-card"><h4>Selection</h4><div id="tex-sel"></div></section>
|
||||
<section class="ims-card"><h4>Recolour</h4><div id="tex-rc"></div></section>
|
||||
<section class="ims-card"><h4>Save as .dds</h4><div id="tex-exp"></div></section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,80 @@
|
||||
<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>
|
||||
@@ -0,0 +1,62 @@
|
||||
<section id="view-wnd" class="view">
|
||||
<header class="bar top">
|
||||
<button id="wnd-src" class="iconbtn" title="Where the UI files are read from"><i data-icon="box"></i><span id="wnd-src-label">Choose packs…</span></button>
|
||||
<button id="wnd-open-file" class="iconbtn" title="Open a window .xml from disk"><i data-icon="folder"></i><span>Open file…</span></button>
|
||||
<div class="ims-title"><span id="wnd-title" class="muted"></span><span id="wnd-dirty" class="dot bad" title="Unsaved changes" hidden></span></div>
|
||||
<div class="spacer"></div>
|
||||
<button id="wnd-undo" class="iconbtn only" title="Undo (Ctrl+Z)" disabled><i data-icon="undo"></i></button>
|
||||
<button id="wnd-redo" class="iconbtn only" title="Redo (Ctrl+Y)" disabled><i data-icon="redo"></i></button>
|
||||
<button id="wnd-save" class="btn primary"><i data-icon="save"></i>Save</button>
|
||||
</header>
|
||||
<div class="split">
|
||||
<aside id="wnd-left" class="ims-left">
|
||||
<div class="ims-head">
|
||||
<div class="search"><i data-icon="search"></i><input id="wnd-search" type="search" placeholder="Search window files" spellcheck="false" /></div>
|
||||
<span id="wnd-count" class="muted"></span>
|
||||
</div>
|
||||
<div id="wnd-list" class="mdl-list"></div>
|
||||
<div class="ims-foot muted mdl-hint">Double-click a file to open it</div>
|
||||
</aside>
|
||||
<div class="splitter" data-target="wnd-left" data-edge="left" title="Drag to resize"></div>
|
||||
<div class="main-col">
|
||||
<div class="bar nav">
|
||||
<div class="seg"><button id="wnd-zoom" title="100 %">100%</button></div>
|
||||
<button id="wnd-fit" class="iconbtn" title="Fit the window"><i data-icon="fit"></i><span>Fit</span></button>
|
||||
<label class="pill" title="Game screen size (for aligned windows)"><i data-icon="grid"></i>
|
||||
<select id="wnd-screen"><option value="800x600">800×600</option><option value="1024x768" selected>1024×768</option><option value="1280x720">1280×720</option><option value="1920x1080">1920×1080</option></select>
|
||||
</label>
|
||||
<label class="pill" title="Button state to show"><i data-icon="target"></i>
|
||||
<select id="wnd-state"><option>Normal</option><option>Over</option><option>Push</option><option>Disable</option></select>
|
||||
</label>
|
||||
<button id="wnd-t-preview" class="iconbtn toggle" title="Preview: the window as the game shows it (no outlines, no hidden windows)"><i data-icon="play"></i><span>Preview</span></button>
|
||||
<button id="wnd-t-img" class="iconbtn toggle on only" title="Images and frames"><i data-icon="image"></i></button>
|
||||
<button id="wnd-t-text" class="iconbtn toggle on only" title="Texts"><i data-icon="note"></i></button>
|
||||
<button id="wnd-t-bounds" class="iconbtn toggle on" title="Window outlines"><i data-icon="draw"></i><span>Bounds</span></button>
|
||||
<button id="wnd-t-hidden" class="iconbtn toggle on" title="Windows that start hidden (IWS_START_HIDE)"><i data-icon="copy"></i><span>Hidden</span></button>
|
||||
<div class="spacer"></div>
|
||||
<span id="wnd-textinfo" class="muted ims-texinfo"></span>
|
||||
<span id="wnd-hover" class="mono ims-texinfo"></span>
|
||||
</div>
|
||||
<div class="ims-stage"><canvas id="wnd-canvas" tabindex="0"></canvas></div>
|
||||
<div id="wnd-empty" class="empty">
|
||||
<div class="empty-card">
|
||||
<i data-icon="layout" class="big"></i>
|
||||
<h2>UI window editor</h2>
|
||||
<p>Pick the packs, then double-click a window file (xml/…wnd.xml). Click a window to select it, drag to move, handles to resize; every element and attribute can be edited on the right.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ims-help muted">Click selects · drag moves · handles resize · arrows nudge (Shift ×10) · Alt/right-drag pans · wheel zooms · Del removes a child window</div>
|
||||
</div>
|
||||
<div class="splitter" data-target="wnd-side" data-edge="right" title="Drag to resize"></div>
|
||||
<aside id="wnd-side" class="ims-side map-side" hidden>
|
||||
<section class="ims-card">
|
||||
<h4>Windows <span id="wnd-count-win" class="muted"></span></h4>
|
||||
<div id="wnd-tree" class="wnd-tree"></div>
|
||||
</section>
|
||||
<section id="wnd-props-card" class="ims-card grow" hidden>
|
||||
<h4><span id="wnd-props-name"></span></h4>
|
||||
<div id="wnd-props" class="wnd-props"></div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
Reference in new issue
Block a user