From 2ecc7f540086f6a53d3bb42e151972d8012650cb Mon Sep 17 00:00:00 2001 From: Ronja Date: Sun, 25 Oct 2020 18:55:33 +0100 Subject: [PATCH] number stuff --- Luxe/assets/wip/8Arrow.image.lx | 3 + Luxe/assets/wip/8Arrow.png | 3 + Luxe/blocks/ui/adventure.wren | 107 ++++++++++++++++++------------- Luxe/blocks/ui/box.wren | 7 +- Luxe/blocks/ui/number_field.wren | 86 +++++++++++++++++++++++++ Luxe/blocks/ui/scroll_box.wren | 12 +++- 6 files changed, 169 insertions(+), 49 deletions(-) create mode 100644 Luxe/assets/wip/8Arrow.image.lx create mode 100644 Luxe/assets/wip/8Arrow.png create mode 100644 Luxe/blocks/ui/number_field.wren diff --git a/Luxe/assets/wip/8Arrow.image.lx b/Luxe/assets/wip/8Arrow.image.lx new file mode 100644 index 0000000..4021d2e --- /dev/null +++ b/Luxe/assets/wip/8Arrow.image.lx @@ -0,0 +1,3 @@ +image = { + source = "assets/wip/8Arrow.png" +} \ No newline at end of file diff --git a/Luxe/assets/wip/8Arrow.png b/Luxe/assets/wip/8Arrow.png new file mode 100644 index 0000000..fe64793 --- /dev/null +++ b/Luxe/assets/wip/8Arrow.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:bf7053427cfa4fca8170baa14caa0b3ac5a9bee43d62cf3e51ba49c94f6ed39c +size 104 diff --git a/Luxe/blocks/ui/adventure.wren b/Luxe/blocks/ui/adventure.wren index 7979d8c..c048254 100644 --- a/Luxe/blocks/ui/adventure.wren +++ b/Luxe/blocks/ui/adventure.wren @@ -9,6 +9,7 @@ import "luxe: render" for Material, TextAlign import "luxe: color" for Color import "luxe: game" for Frame import "luxe: containers" for Lists +import "luxe: math" for Math import "globals" for Globals import "blocks/ui/clickable" for Clickable @@ -17,10 +18,11 @@ import "math/observable" for Observable import "blocks/ui/simple_text" for UISimpleText import "blocks/ui/ui" for Ui import "blocks/ui/slider" for UiSlider -import "blocks/ui/box" for UiBox +import "blocks/ui/box" for UIBox import "blocks/ui/scroll_box" for UiScrollBox import "blocks/ui/compass" for UiCompass import "blocks/ui/info" for UiInfo //this is a cyclic dependency waiting to happen... +import "blocks/ui/number_field" for NumberField import "math/math" for M import "math/util" for Util import "blocks/human/human" for Human @@ -33,6 +35,8 @@ class UiAdventure{ static resources{"resources"} static depart{"depart"} + adventure{_game.adventures.planning} //shortcut to get currently planning adventure (observable) + construct new(ent, ui){ _ent = ent _ui = ui @@ -113,7 +117,7 @@ class UiAdventure{ } }.toList - _game.adventures.planning.on_change(true){|val| + adventure.on_change(true){|val| if(val == null) return var angle = -val.direction * 360 / steps UiCompass.set_angle(compass, angle) @@ -123,7 +127,6 @@ class UiAdventure{ if(event.type == UIEvent.change){ var angle = event.change var angleIndex = M.mod(-(steps * angle / 360).round, steps) - var adventure = _game.adventures.planning adventure.value.direction = angleIndex adventure.emit() } @@ -145,7 +148,7 @@ class UiAdventure{ UILayout.set_behave(_ent, slider, UILayoutBehave.left | UILayoutBehave.right) //| UILayout.set_margin(_ent, slider, 4, 4, 4, 0) - _game.adventures.planning.on_change(true){|val| + adventure.on_change(true){|val| if(val == null) return var relative_distance = val.distance / _game.adventures.max_distance UiSlider.set_value(slider, relative_distance) @@ -154,7 +157,6 @@ class UiAdventure{ Control.set_events(slider){|event| if(event.type == UIEvent.change){ var distance = (event.change * _game.adventures.max_distance).round - var adventure = _game.adventures.planning adventure.value.distance = distance adventure.emit() } @@ -170,7 +172,7 @@ class UiAdventure{ UILayout.set_behave(_ent, text, UILayoutBehave.left) //| UILayout.set_margin(_ent, text, 4, 8, 4, 0) - _game.adventures.planning.on_change(true) { |val| + adventure.on_change(true) { |val| if(val == null) return //this stuff does bad things var dir = full_step_names[val.direction] @@ -192,7 +194,7 @@ class UiAdventure{ _game.focus.on_change(true) {|val| if(!val) return if(_ui.ui_mode == Ui.Planning && _page.value == UiAdventure.people){ - var adventure = _game.adventures.planning + var adventure = adventure if(adventure.value && !adventure.value.adventurers.contains(val)) { adventure.value.adventurers.insert(0, val) adventure.emit() @@ -209,20 +211,20 @@ class UiAdventure{ var x_image = Assets.image("assets/wip/8Cross") _adventurerListItems = [] - _game.adventures.planning.on_change(true) {|adventure| + adventure.on_change(true) {|planning| //cleanup _adventurerListItems.each{|item| Control.destroy(item) } _adventurerListItems.clear() - if(!adventure) return + if(!planning) return //rebuild var i = -1 - adventure.adventurers.each{ |adventurer| + planning.adventurers.each{ |adventurer| i = i + 1 - var item = UiBox.create(_ent) + var item = UIBox.create(_ent) UILayout.set_behave(_ent, item, UILayoutBehave.left | UILayoutBehave.right)//| UILayout.set_margin(_ent, item, 0, 0, 0, 0) UILayout.set_contain(_ent, item, UILayoutContain.row | UILayoutContain.start)//| @@ -263,8 +265,8 @@ class UiAdventure{ Clickable.set_on_click(remove) { Frame.end{ Globals["Tooltip"].clear(remove) - Lists.remove(adventure.adventurers, adventurer) - _game.adventures.planning.emit() + Lists.remove(planning.adventurers, adventurer) + adventure.emit() } } @@ -286,16 +288,15 @@ class UiAdventure{ } var list = UiScrollBox.create(_ent) + UiScrollBox.set_drag_cancelled(list, false) Control.child_add(page, list) UILayout.set_behave(_ent, list, UILayoutBehave.fill) UILayout.set_margin(_ent, list, 40, 0, 0, 0) - - var tiny_head = Assets.image("assets/wip/8Head") var x_image = Assets.image("assets/wip/8Cross") _itemListItems = [] - _game.adventures.planning.on_change(true) {|adventure| + adventure.on_change(true) {|adventure| //cleanup _itemListItems.each{|item| Control.destroy(item) @@ -305,51 +306,37 @@ class UiAdventure{ if(!adventure) return //rebuild - adventure.adventurers.each{ |adventurer| - var item = UiBox.create(_ent) + _game.resources.list().each{ |resource| + var item = UIBox.create(_ent) UILayout.set_behave(_ent, item, UILayoutBehave.left | UILayoutBehave.right)//| UILayout.set_margin(_ent, item, 0, 0, 0, 0) UILayout.set_contain(_ent, item, UILayoutContain.row | UILayoutContain.start)//| Control.set_size(item, -1, 12) - Clickable.make_clickable(item) - Clickable.set_on_click(item) { - _ui.ui_mode = Ui.Info - _ui.info.page.value = UiInfo.human - _game.focus.value = adventurer - } UiScrollBox.add(list, item) - var head = UIImage.create(_ent) - Control.child_add(item, head) - Control.set_size(head, 8, 8) - UIImage.set_image(head, tiny_head) - UIImage.set_color(head, Human.get_color(adventurer)) - UILayout.set_margin(_ent, head, 2, 0, 0, 0) - var name = UILabel.create(_ent) Control.child_add(item, name) UILabel.set_align_vertical(name, TextAlign.bottom) UILabel.set_font(name, _ui.font) UILabel.set_text_size(name, 8) - UILabel.set_text(name, Human.get_name(adventurer)) + UILabel.set_text(name, "%(resource["name"])(%(resource["amount"]))") UILayout.set_behave(_ent, name, UILayoutBehave.hfill | UILayoutBehave.left)//| UILayout.set_margin(_ent, name, 2, 1, 0, 1) - var remove = UIImage.create(_ent) - Clickable.make_clickable(remove) - Control.child_add(item, remove) - Control.set_size(remove, 8, 8) - UIImage.set_image(remove, x_image) - UIImage.set_color(remove, Color.hex(0xec172a)) - UILayout.set_margin(_ent, remove, 0, 0, 2, 0) - Clickable.set_tooltip(remove, "remove") - Clickable.set_on_click(remove) { - Frame.end{ - Globals["Tooltip"].clear(remove) - Lists.remove(adventure.adventurers, adventurer) - _game.adventures.planning.emit() + var amount = NumberField.create(_ent) + UILayout.set_margin(_ent, amount, 0, 1, 2, 1) + Control.child_add(item, amount) + //change resource data + Control.set_events(amount){|event| + if(event.type == UIEvent.change){ + var value = event.change.round + adventure.resources.set(resource["name"], value) } } + //change ui on resource data change + adventure.resources.on_change{|value| + NumberField.set_value(amount, Math.clamp(value.get(resource["name"]), 0, resource["amount"])) + } _itemListItems.add(item) } @@ -364,6 +351,36 @@ class UiAdventure{ UILayout.set_behave(_ent, page, UILayoutBehave.fill) UILayout.set_margin(_ent, page, 0, 0, 0, 16) + var ready = UILabel.create(_ent) + Control.child_add(page, ready) + Control.set_size(ready, 100, 20) + UILabel.set_align_vertical(ready, TextAlign.bottom) + UILabel.set_font(ready, _ui.font) + UILabel.set_text_size(ready, 16) + UILabel.set_text(ready, "READY?") + UILayout.set_behave(_ent, ready, UILayoutBehave.left | UILayoutBehave.top) //| + UILayout.set_margin(_ent, ready, 56, 8, 0, 0) + + var go = UILabel.create(_ent) + Control.child_add(page, go) + Control.set_size(go, 100, 20) + UILabel.set_align_vertical(go, TextAlign.bottom) + UILabel.set_font(go, _ui.font) + UILabel.set_text_size(go, 16) + UILabel.set_text(go, "GO") + UILayout.set_behave(_ent, go, UILayoutBehave.left | UILayoutBehave.top) //| + UILayout.set_margin(_ent, go, 56, 24, 0, 0) + Clickable.make_clickable(go) + Clickable.set_state_change(go){ |data, button| + UILabel.set_text(go, data["hover"]?"GO!":"GO") + } + Clickable.set_on_click(go){ + //todo, start adventure, not discard!! + _ui.ui_mode = Ui.Info + _game.adventures.discard() + _page.value = UiAdventure.direction + } + _page.on_change(true){|val| Control.set_visible(page, val == UiAdventure.depart) } diff --git a/Luxe/blocks/ui/box.wren b/Luxe/blocks/ui/box.wren index fc03258..9d4c223 100644 --- a/Luxe/blocks/ui/box.wren +++ b/Luxe/blocks/ui/box.wren @@ -10,7 +10,7 @@ import "math/rect" for AABB import "math/math" for M import "blocks/debug" for DrawDebug -class UiBox{ +class UIBox{ static create(ent){ var box = Control.create(ent) @@ -25,4 +25,9 @@ class UiBox{ return box } + static set_color(box, color){ + var data = Control.get_state_data(box) + data["style"].color = color + } + } \ No newline at end of file diff --git a/Luxe/blocks/ui/number_field.wren b/Luxe/blocks/ui/number_field.wren new file mode 100644 index 0000000..b491393 --- /dev/null +++ b/Luxe/blocks/ui/number_field.wren @@ -0,0 +1,86 @@ +import "luxe: ui/label" for UILabel +import "luxe: ui/control" for Control +import "luxe: ui/image" for UIImage +import "luxe: render" for TextAlign +import "luxe: world" for UILayout, UILayoutContain, UIEvent, UI +import "luxe: assets" for Assets + +import "math/util" for Util +import "blocks/ui/box" for UIBox +import "blocks/ui/clickable" for Clickable + +class NumberField{ + + static create(ent){ + var root = Control.create(ent) + UILayout.set_contain(ent, root, UILayoutContain.row | UILayoutContain.start)//| + Control.set_size(root, 27, 10) + + var arrow = Assets.image("assets/wip/8Arrow") + + var leftArrow = UIImage.create(ent) + UIImage.set_image(leftArrow, arrow) + Control.set_size(leftArrow, 8, 8) + Control.child_add(root, leftArrow) + UILayout.set_margin(ent, leftArrow, -1, 0, 0, 0) + Clickable.make_clickable(leftArrow) + Clickable.set_on_click(leftArrow){ + var data = Control.get_state_data(root) + UI.events_emit(root, UIEvent.change, data["value"] - 1) + } + + var label = UILabel.create(ent) + Control.child_add(root, label) + Control.set_size(label, 12, 10) + UILabel.set_align_vertical(label, TextAlign.bottom) + UILabel.set_align(label, TextAlign.center) + UILabel.set_font(label, "assets/fonts/BabyBlocks") + UILabel.set_text_size(label, 8) + UILabel.set_text(label, "0") + UILayout.set_margin(ent, label, 1, 0, 0, 0) + + var rightArrow = UIImage.create(ent) + UIImage.set_image(rightArrow, arrow) + Control.set_size(rightArrow, 8, 8) + Control.child_add(root, rightArrow) + UILayout.set_margin(ent, rightArrow, 0, 0, 0, 0) + UIImage.set_uv(rightArrow, 1, 0, 0, 1) + Clickable.make_clickable(rightArrow) + Clickable.set_on_click(rightArrow){ + var data = Control.get_state_data(root) + UI.events_emit(root, UIEvent.change, data["value"] + 1) + } + + //input stuff + Control.set_allow_input(root, true) + Control.set_state_data(root, {"pressed": false, "value":0, "drag_start_mouse": -1, "drag_start_value":-1, "label": label}) + Control.set_process(root){|control, data, event, x,y,w,h| + if(event.control != control) return + if(!Util.valid_event(event, true)) return + if(event.type == UIEvent.press){ + data["pressed"] = true + data["drag_start_mouse"] = event.x + data["drag_start_value"] = data["value"] + UI.capture(control) + UI.event_cancel(ent, event.id) + } + if(event.type == UIEvent.move && data["pressed"]){ + var diff = event.x - data["drag_start_mouse"] + var value_change = diff / 3 + UI.events_emit(control, UIEvent.change, data["drag_start_value"] + value_change) + } + if(event.type == UIEvent.release){ + data["pressed"] = false + UI.uncapture(control) + } + } + + return root + } + + static set_value(field, value){ + var data = Control.get_state_data(field) + data["value"] = value + UILabel.set_text(data["label"], value.toString) + } +} \ No newline at end of file diff --git a/Luxe/blocks/ui/scroll_box.wren b/Luxe/blocks/ui/scroll_box.wren index e9a4ae5..4b22009 100644 --- a/Luxe/blocks/ui/scroll_box.wren +++ b/Luxe/blocks/ui/scroll_box.wren @@ -21,7 +21,7 @@ class UiScrollBox{ style.color = [1,1,1,1] style.thickness = 1 Control.set_allow_input(box, true) - var state = {"style": style, "pressed": false, "position": 0, "scrollSpeed": 4, "ent": ent, "spring": 32, "contentHeight": 0} + var state = {"style": style, "pressed": false, "position": 0, "scrollSpeed": 4, "ent": ent, "spring": 32, "contentHeight": 0, "drag_cancelled":true} Control.set_state_data(box, state) var slider = UiSlider.create(ent) @@ -32,7 +32,7 @@ class UiScrollBox{ UiSlider.set_value(slider, 0) Control.set_size(slider, 7, -1) UILayout.set_behave(ent, slider, UILayoutBehave.right | UILayoutBehave.vfill) //| - UILayout.set_margin(ent, slider, -1, 0, 0, 0) + UILayout.set_margin(ent, slider, 0, 0, 0, 0) Control.set_events(slider){|event| if(event.type == UIEvent.change){ var position = 0 @@ -53,7 +53,7 @@ class UiScrollBox{ UILayout.set_contain(ent, childContainer, UILayoutContain.column | UILayoutContain.start) //| Control.set_allow_input(childContainer, true) Control.set_events(childContainer){ |event| - if(!Util.valid_event(event, true)) return + if(!Util.valid_event(event, state["drag_cancelled"])) return if(event.type == UIEvent.press) { Control.set_state_data(childContainer, true) UI.capture(childContainer) @@ -126,6 +126,7 @@ class UiScrollBox{ update_content(box) } + static update_content(box){ var state = Control.get_state_data(box) var container = state["childContainer"] @@ -147,6 +148,11 @@ class UiScrollBox{ static set_position(box, position) { set_position(box, position, false) } + + static set_drag_cancelled(box, drag_cancelled){ + var state = Control.get_state_data(box) + state["drag_cancelled"] = drag_cancelled + } static set_position(box, position, delay_commit){ var state = Control.get_state_data(box)