New REM client: REM-Client 25f0f4f (base manager: build map with grid and zoom, SUPPLY tab for a site's wares)
This commit is contained in:
+57
-2
@@ -129,6 +129,13 @@
|
||||
.sitemap .mine .s { left: -4dp; top: -4dp; width: 8dp; height: 8dp; border-radius: 0; background-color: #7cf27c; }
|
||||
.sitemap .site .s { left: -4dp; top: -4dp; width: 8dp; height: 8dp; border-radius: 0; border: 1dp #7cf27c; background-color: transparent; }
|
||||
.sitemap .mark { position: absolute; width: 0; height: 0; pointer-events: none; }
|
||||
.sitemap .gl { position: absolute; left: 0; top: 0; width: 100%; height: 1dp; background-color: #5cc8f018; pointer-events: none; }
|
||||
.sitemap .gl.v { width: 1dp; height: 100%; }
|
||||
.sitemap .gc { position: absolute; top: 2dp; width: 0; font-size: 10dp; color: #5cc8f080; pointer-events: none; }
|
||||
.sitemap .gr { position: absolute; left: 3dp; height: 0; font-size: 10dp; color: #5cc8f080; pointer-events: none; }
|
||||
.sitemap .mapzoom { position: absolute; right: 4dp; bottom: 4dp; display: flex; flex-direction: row; z-index: 5; }
|
||||
.sitemap .mapzoom .zb { padding: 1dp 7dp; margin-left: 3dp; font-size: 12dp; color: #dbe6f0; background-color: #0a1424d0; border: 1dp #5cc8f060; cursor: pointer; }
|
||||
.sitemap .mapzoom .zb:hover { color: #f2b13c; border-color: #f2b13c; }
|
||||
.sitemap .mark .m { position: absolute; left: -9dp; top: -9dp; width: 14dp; height: 14dp; border: 2dp #f2b13c; background-color: #f2b13c40; }
|
||||
</style>
|
||||
</head>
|
||||
@@ -352,6 +359,7 @@
|
||||
<div class="subtabs">
|
||||
<div class="tab" data-class-active="sys_sub == 0" data-action="sys-sub" data-arg="0">Build</div>
|
||||
<div class="tab" data-class-active="sys_sub == 1" data-action="sys-sub" data-arg="1">Objects</div>
|
||||
<div class="tab" data-if="sys_mine" data-class-active="sys_sub == 2" data-action="sys-sub" data-arg="2">Supply</div>
|
||||
</div>
|
||||
|
||||
<!-- BUILD: the catalog, the type's model and wares, placing a site -->
|
||||
@@ -386,12 +394,16 @@
|
||||
<div class="label">Place the site</div>
|
||||
<div>
|
||||
<div id="sitemap" class="sitemap">
|
||||
<div class="gl" data-for="g : map_lines" data-class-v="g.cls == 'v'" data-style-left="g.left" data-style-top="g.top"></div>
|
||||
<div class="gc" data-for="g : map_cols" data-style-left="g.left">{{ g.label }}</div>
|
||||
<div class="gr" data-for="g : map_rows" data-style-top="g.top">{{ g.label }}</div>
|
||||
<div class="dot" data-for="d : site_dots" data-class-sun="d.cls == 'sun'" data-class-planet="d.cls == 'planet'" data-class-station="d.cls == 'station'"
|
||||
data-class-hole="d.cls == 'hole' || d.cls == 'gate'" data-class-mine="d.cls == 'mine'" data-class-site="d.cls == 'site'"
|
||||
data-style-left="d.left" data-style-top="d.top"><div class="s"></div><span class="l" data-if="d.label != ''">{{ d.label }}</span></div>
|
||||
<div class="mark" data-if="mark_set" data-style-left="mark_left" data-style-top="mark_top"><div class="m" data-style-transform="mark_rot"></div></div>
|
||||
<div class="mapzoom"><span class="zb" data-action="map-zoom" data-arg="+">+</span><span class="zb" data-action="map-zoom" data-arg="-">-</span><span class="zb" data-action="map-zoom" data-arg="0">{{ map_zoom }}</span></div>
|
||||
<div class="mark" data-if="mark_shown" data-style-left="mark_left" data-style-top="mark_top"><div class="m" data-style-transform="mark_rot"></div></div>
|
||||
</div>
|
||||
<div class="hint">{{ mark_set ? 'Planned at ' + mark_text + ' - drag to move it.' : 'Click the map where the site shall stand.' }}</div>
|
||||
<div class="hint">{{ mark_set ? 'Planned at ' + mark_text + ' - drag to move it.' : 'Click the map where the site shall stand. Wheel zooms, right button drags.' }}</div>
|
||||
<div class="amount"><span class="label">Turn</span><input class="range" type="range" min="0" max="345" step="15" data-value="turn"/><span class="v">{{ turn_text }}</span></div>
|
||||
<div class="actions">
|
||||
<div class="btn primary" data-class-disabled="!mark_set" data-action="site">{{ site_text }}<div class="tip">Builds a construction site of the picked type where it is planned on the map. Deliver its wares in space (target it, trade) or fund it - traders bring them.</div></div>
|
||||
@@ -400,6 +412,49 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SUPPLY: a site's wares bought on the Galactic Market (buy orders, escrow from the bank) - traders fly them in -->
|
||||
<div class="page" data-if="sys_sub == 2">
|
||||
<div class="colm side narrow">
|
||||
<div class="table grow">
|
||||
<div class="head"><span class="c1">Construction site</span></div>
|
||||
<div class="body">
|
||||
<div class="empty" data-if="sup_sites.size == 0">No construction site here.</div>
|
||||
<div class="row" data-for="r : sup_sites" data-class-selected="r.selected" data-action="pick-object" data-attr-data-arg="r.key">
|
||||
<span class="c1">{{ r.a }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="colm">
|
||||
<div class="panel">
|
||||
<div class="t">{{ sup_title }}</div>
|
||||
<div class="hint">{{ sup_line }}</div>
|
||||
</div>
|
||||
<div class="table grow">
|
||||
<div class="head"><span class="c1">Ware</span><span class="c2">Delivered</span><span class="c3">Ordered</span><span class="c4">Price / unit</span></div>
|
||||
<div class="body">
|
||||
<div class="empty" data-if="sup_wares.size == 0">{{ sup_empty }}</div>
|
||||
<div class="row" data-for="r : sup_wares" data-class-selected="r.selected" data-action="pick-supply" data-attr-data-arg="r.key">
|
||||
<span class="c1">{{ r.a }}</span><span class="c2">{{ r.b }}</span><span class="c3">{{ r.c }}</span><span class="c4">{{ r.d }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div data-if="sup_has">
|
||||
<div class="amount"><span class="label">Amount</span><input class="range" type="range" min="1" step="1" data-attr-max="sup_qty_max" data-value="sup_qty"/><span class="v">{{ sup_qty_text }}</span></div>
|
||||
<div class="namefield"><span class="label">Price / unit</span><input class="text" type="text" data-value="sup_price" maxlength="10"/></div>
|
||||
<div class="hint">{{ sup_price_hint }}</div>
|
||||
<div class="actions">
|
||||
<div class="btn primary" data-class-disabled="!sup_can_order" data-action="sup-order">{{ sup_order_text }}<div class="tip">Places a buy order for this ware on the Galactic Market at the site; the amount times the price leaves your bank as escrow. Trader pilots bring it and are paid from it.</div></div>
|
||||
<div class="btn" data-class-disabled="!sup_can_back" data-action="sup-back">Take back<div class="tip">Withdraws the buy orders for this ware - what is not delivered yet goes back to your bank.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions" style="margin-top: 10dp;">
|
||||
<div class="btn" data-class-disabled="!sup_can_all" data-action="sup-all">{{ sup_all_text }}<div class="tip">Buy orders for every ware still missing, each at its suggested price.</div></div>
|
||||
<div class="btn" data-class-disabled="!sup_any" data-action="sup-none">Take all back<div class="tip">Withdraws every buy order of the site; the escrow goes back to your bank.</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- OBJECTS: the system's objects, the picked one -->
|
||||
<div class="page" data-if="sys_sub == 1">
|
||||
<div class="colm side">
|
||||
|
||||
Reference in New Issue
Block a user