From cc274595c79cee3ee97908ce7ce0051a3cdf74d9 Mon Sep 17 00:00:00 2001
From: Cooldude2606 <25043174+Cooldude2606@users.noreply.github.com>
Date: Sun, 26 Jan 2025 00:19:34 +0000
Subject: [PATCH] Convert rocket info and autofill

---
 exp_gui/module/control.lua                    |   4 +-
 exp_gui/module/elements.lua                   |  10 +-
 exp_gui/module/prototype.lua                  |  14 +-
 exp_legacy/module/config/_file_loader.lua     |   4 +-
 exp_legacy/module/modules/gui/autofill.lua    | 130 ++++++++------
 exp_legacy/module/modules/gui/readme.lua      |   4 +-
 exp_legacy/module/modules/gui/rocket-info.lua | 167 ++++++++----------
 exp_util/module/flying_text.lua               |  18 +-
 8 files changed, 174 insertions(+), 177 deletions(-)

diff --git a/exp_gui/module/control.lua b/exp_gui/module/control.lua
index a2491682..9aaa52cf 100644
--- a/exp_gui/module/control.lua
+++ b/exp_gui/module/control.lua
@@ -138,7 +138,7 @@ local function ensure_elements(player, element_defines, elements, parent)
     local done = {}
     for define, visible in pairs(element_defines) do
         local element = elements[define.name]
-        if not element then
+        if not element or not element.valid then
             element = define(parent)
             elements[define.name] = element
             assert(element, "Element define did not return an element: " .. define.name)
@@ -200,7 +200,7 @@ local function on_gui_opened(event)
         if visible then
             event.element = element
             --- @diagnostic disable-next-line invisible
-            define:_raise_event(event)
+            define:raise_event(event)
         end
     end
 
diff --git a/exp_gui/module/elements.lua b/exp_gui/module/elements.lua
index e8c0e99e..ebc96819 100644
--- a/exp_gui/module/elements.lua
+++ b/exp_gui/module/elements.lua
@@ -13,12 +13,14 @@ elements.aligned_flow = ExpGui.element("aligned_flow")
     }
     :style(function(def, element, parent, opts)
         opts = opts or {}
+        local vertical_align = opts.vertical_align or "center"
+        local horizontal_align = opts.horizontal_align or "right"
         return {
             padding = { 1, 2 },
-            vertical_align = opts.vertical_align or "center",
-            horizontal_align = opts.horizontal_align or "right",
-            vertically_stretchable = opts.vertical_align and opts.vertical_align ~= "center",
-            horizontally_stretchable = opts.horizontal_align and opts.horizontal_align ~= "center",
+            vertical_align = vertical_align,
+            horizontal_align = horizontal_align,
+            vertically_stretchable = vertical_align ~= "center",
+            horizontally_stretchable = horizontal_align ~= "center",
         }
     end)
 
diff --git a/exp_gui/module/prototype.lua b/exp_gui/module/prototype.lua
index 42956a2b..661583dc 100644
--- a/exp_gui/module/prototype.lua
+++ b/exp_gui/module/prototype.lua
@@ -14,7 +14,7 @@ ExpElement.events = {}
 --- @alias ExpElement.DrawCallback fun(def: ExpElement, parent: LuaGuiElement, ...): LuaGuiElement?, function?
 --- @alias ExpElement.PostDrawCallback fun(def: ExpElement, element: LuaGuiElement?, parent: LuaGuiElement, ...): table?
 --- @alias ExpElement.PostDrawCallbackAdder fun(self: ExpElement, definition: table | ExpElement.PostDrawCallback): ExpElement
---- @alias ExpElement.OnEventAdder<E> fun(self: ExpElement, handler: fun(def: ExpElement, event: E)): ExpElement
+--- @alias ExpElement.OnEventAdder<E> fun(self: ExpElement, handler: fun(def: ExpElement, event: E, element: LuaGuiElement)): ExpElement
 
 --- @class ExpElement._debug
 --- @field defined_at string
@@ -343,7 +343,7 @@ function ExpElement._prototype:unlink_element(element)
     assert(self._has_handlers, "Element has no event handlers")
     local element_tags = element.tags
     if not element_tags then
-        element_tags = {}
+        return element, ExpElement._prototype.unlink_element
     end
 
     local event_tags = element_tags["ExpGui"]
@@ -371,24 +371,24 @@ local function event_handler(event)
     for _, define_name in ipairs(event_tags) do
         local define = ExpElement._elements[define_name]
         if define then
-            define:_raise_event(event)
+            define:raise_event(event)
         end
     end
 end
 
 --- Raise all handlers for an event on this definition
---- @param event EventData
-function ExpElement._prototype:_raise_event(event)
+--- @param event EventData | { element: LuaGuiElement }
+function ExpElement._prototype:raise_event(event)
     local handlers = self._events[event.name]
     if not handlers then return end
     for _, handler in ipairs(handlers) do
-        handler(self, event)
+        handler(self, event, event.element)
     end
 end
 
 --- Add an event handler
 --- @param event defines.events
---- @param handler fun(def: ExpElement, event: EventData)
+--- @param handler fun(def: ExpElement, event: EventData, element: LuaGuiElement)
 --- @return ExpElement
 function ExpElement._prototype:on_event(event, handler)
     ExpElement.events[event] = event_handler
diff --git a/exp_legacy/module/config/_file_loader.lua b/exp_legacy/module/config/_file_loader.lua
index fec5505e..425f422d 100644
--- a/exp_legacy/module/config/_file_loader.lua
+++ b/exp_legacy/module/config/_file_loader.lua
@@ -44,9 +44,9 @@ return {
 
     --- GUI
     "modules.gui.readme",
-    --"modules.gui.rocket-info",
+    "modules.gui.rocket-info",
     "modules.gui.science-info",
-    --"modules.gui.autofill",
+    "modules.gui.autofill",
     --"modules.gui.task-list",
     --"modules.gui.warp-list",
     --"modules.gui.player-list",
diff --git a/exp_legacy/module/modules/gui/autofill.lua b/exp_legacy/module/modules/gui/autofill.lua
index a435ebad..5d4f690c 100644
--- a/exp_legacy/module/modules/gui/autofill.lua
+++ b/exp_legacy/module/modules/gui/autofill.lua
@@ -4,10 +4,10 @@
     @alias autofill
 ]]
 
+local Storage = require("modules/exp_util/storage")
 local FlyingText = require("modules/exp_util/flying_text")
-local Gui = require("modules.exp_legacy.expcore.gui") -- @dep expcore.gui
+local Gui = require("modules/exp_gui")
 local Roles = require("modules.exp_legacy.expcore.roles") -- @dep expcore.gui
-local Storage = require("modules/exp_util/storage") -- @dep utils.global
 local config = require("modules.exp_legacy.config.gui.autofill") -- @dep config.gui.autofill
 local Event = require("modules/exp_legacy/utils/event") -- @dep utils.event
 
@@ -25,17 +25,19 @@ end
 
 --- Toggle entity section visibility
 -- @element toggle_item_button
-local toggle_section =
-    Gui.element{
+local toggle_section = Gui.element("autofill_toggle_section")
+    :draw{
         type = "sprite-button",
         sprite = "utility/expand",
         tooltip = { "autofill.toggle-section-tooltip" },
         style = "frame_action_button",
-        name = Gui.unique_static_name,
+        name = Gui.property_from_name,
     }
-    :style(Gui.sprite_style(20))
-    :on_click(function(_, element, _)
-        local header_flow = element.parent
+    :style(Gui.styles.sprite{
+        size = 20
+    })
+    :on_click(function(def, event, element)
+        local header_flow = assert(element.parent)
         local flow_name = header_flow.caption
         local flow = header_flow.parent.parent[flow_name]
         if Gui.toggle_visible_state(flow) then
@@ -50,8 +52,8 @@ local toggle_section =
 --- Toggle enitity button, used for toggling autofill for the specific entity
 -- All entity autofill settings will be ignored if its disabled
 -- @element entity_toggle
-local entity_toggle =
-    Gui.element(function(_, parent, entity_name)
+local entity_toggle = Gui.element("entity_toggle")
+    :draw(function(_, parent, entity_name)
         return parent.add{
             type = "sprite-button",
             sprite = "utility/confirm_slot",
@@ -59,8 +61,11 @@ local entity_toggle =
             style = "shortcut_bar_button_green",
         }
     end)
-    :style(Gui.sprite_style(22))
-    :on_click(function(player, element, _)
+    :style(Gui.styles.sprite{
+        size = 22
+    })
+    :on_click(function(def, event, element)
+        local player = Gui.get_player(event)
         local entity_name = string.match(element.parent.parent.name, "(.*)%-header")
         if not autofill_player_settings[player.name] then return end
         local setting = autofill_player_settings[player.name][entity_name]
@@ -75,7 +80,7 @@ local entity_toggle =
             element.style = "shortcut_bar_button_green"
         end
         -- Correct the button size
-        local style = element.style --[[@as LuaStyle]]
+        local style = element.style
         style.padding = -2
         style.height = 22
         style.width = 22
@@ -83,18 +88,17 @@ local entity_toggle =
 
 --- Draw a section header and main scroll
 -- @element autofill_section_container
-local section =
-    Gui.element(function(definition, parent, section_name, table_size)
+local section = Gui.element("autofill_section")
+    :draw(function(def, parent, section_name, table_size)
         -- Draw the header for the section
-        local header = Gui.header(
-            parent,
-            { "autofill.toggle-section-caption", rich_img("item", section_name), { "entity-name." .. section_name } },
-            { "autofill.toggle-section-tooltip" },
-            true,
-            section_name .. "-header"
-        )
+        local header = Gui.elements.header(parent, {
+            name = section_name .. "-header",
+            caption = { "autofill.toggle-section-caption", rich_img("item", section_name), { "entity-name." .. section_name } },
+            tooltip = { "autofill.toggle-section-tooltip" },
+            label_name = "label",
+        })
 
-        definition:triggers_events(header.parent.header_label)
+        def:link_element(header.parent.label)
 
         -- Right aligned button to toggle the section
         header.caption = section_name
@@ -109,17 +113,17 @@ local section =
 
         section_table.visible = false
 
-        return definition:no_events(section_table)
+        return def:unlink_element(section_table)
     end)
-    :on_click(function(_, element, event)
+    :on_click(function(def, event, element)
         event.element = element.parent.alignment[toggle_section.name]
         toggle_section:raise_event(event)
     end)
 
 --- Toggle item button, used for toggling autofill for the specific item
 -- @element toggle_item_button
-local toggle_item_button =
-    Gui.element(function(_, parent, item)
+local toggle_item_button = Gui.element("toggle_item_button")
+    :draw(function(_, parent, item)
         return parent.add{
             type = "sprite-button",
             sprite = "item/" .. item.name,
@@ -127,8 +131,12 @@ local toggle_item_button =
             style = "shortcut_bar_button_red",
         }
     end)
-    :style(Gui.sprite_style(32, nil, { right_margin = -3 }))
-    :on_click(function(player, element)
+    :style(Gui.styles.sprite{
+        size = 32,
+        right_margin = -3,
+    })
+    :on_click(function(def, event, element)
+        local player = Gui.get_player(event)
         local item_name = element.parent.tooltip
         local entity_name = element.parent.parent.parent.name
         if not autofill_player_settings[player.name] then return end
@@ -144,7 +152,7 @@ local toggle_item_button =
             element.style = "shortcut_bar_button_green"
         end
         -- Correct the button size
-        local style = element.style --[[@as LuaStyle]]
+        local style = element.style
         style.right_margin = -3
         style.padding = -2
         style.height = 32
@@ -153,8 +161,8 @@ local toggle_item_button =
 
 --- Amount text field for a autofill item
 -- @element amount_textfield
-local amount_textfield =
-    Gui.element(function(_, parent, item)
+local amount_textfield = Gui.element("amount_textfield")
+    :draw(function(_, parent, item)
         return parent.add{
             type = "textfield",
             text = item.amount,
@@ -170,9 +178,10 @@ local amount_textfield =
         height = 31,
         padding = -2,
     }
-    :on_text_changed(function(player, element, _)
+    :on_text_changed(function(def, event, element)
         local value = tonumber(element.text)
         if not value then value = 0 end
+        local player = Gui.get_player(event)
         local clamped = math.clamp(value, 0, 1000)
         local item_name = element.parent.tooltip
         local entity_name = element.parent.parent.parent.name
@@ -183,7 +192,7 @@ local amount_textfield =
         if not item then return end
         item.amount = clamped
         if clamped ~= value then
-            element.text = clamped
+            element.text = tostring(clamped)
             player.print{ "autofill.invalid", item.amount, rich_img("item", item.name), rich_img("entity", entity_name) }
             return
         end
@@ -191,8 +200,8 @@ local amount_textfield =
 
 --- Autofill setting, contains a button and a textbox
 -- @element add_autofill_setting
-local add_autofill_setting =
-    Gui.element(function(_, parent, item)
+local add_autofill_setting = Gui.element("add_autofill_setting")
+    :draw(function(_, parent, item)
         local toggle_flow = parent.add{ type = "flow", name = "toggle-setting-" .. item.name, tooltip = item.name }
         local amount_flow = parent.add{ type = "flow", name = "amount-setting-" .. item.name, tooltip = item.name }
         toggle_flow.style.padding = 0
@@ -203,8 +212,8 @@ local add_autofill_setting =
 
 --- Autofill setting empty, contains filler button and textfield gui elements
 -- @element add_empty_autofill_setting
-local add_empty_autofill_setting =
-    Gui.element(function(_, parent)
+local add_empty_autofill_setting = Gui.element("add_empty_autofill_setting")
+    :draw(function(_, parent)
         local toggle_element = parent.add{
             type = "sprite-button",
         }
@@ -223,19 +232,19 @@ local add_empty_autofill_setting =
 
 --- Main gui container for the left flow
 -- @element autofill_container
-autofill_container =
-    Gui.element(function(definition, parent)
+autofill_container = Gui.element("autofill_container")
+    :draw(function(def, parent)
         -- Draw the internal container
-        local container = Gui.container(parent, definition.name)
+        local container = Gui.elements.container(parent)
         -- Draw the scroll container
-        local scroll_table = Gui.scroll_table(container, 400, 1, "autofill-scroll-table")
+        local scroll_table = Gui.elements.scroll_table(container, 400, 1, "autofill-scroll-table")
         -- Set the scroll panel to always show the scrollbar (not doing this will result in a changing gui size)
         scroll_table.parent.vertical_scroll_policy = "always"
         -- Scroll panel has by default padding
         scroll_table.parent.style.padding = 0
         -- Remove the default gap that is added in a table between elements
         scroll_table.style.vertical_spacing = 0
-        -- Center the first collumn in the table
+        -- Center the first column in the table
         scroll_table.style.column_alignments[1] = "center"
         -- Loop over each default entity config
         for _, setting in pairs(config.default_entities) do
@@ -245,7 +254,7 @@ autofill_container =
             local entity_table = section(scroll_table, setting.entity, 3)
             -- Add some padding around the table
             entity_table.style.padding = 3
-            -- Make sure each collumn is alignment top center
+            -- Make sure each column is alignment top center
             entity_table.style.column_alignments[1] = "top-center"
             entity_table.style.column_alignments[2] = "top-center"
             entity_table.style.column_alignments[3] = "top-center"
@@ -284,14 +293,18 @@ autofill_container =
         -- Return the external container
         return container.parent
     end)
-    :static_name(Gui.unique_static_name)
-    :add_to_left_flow()
 
---- Button on the top flow used to toggle autofill container
--- @element autofill_toggle
-Gui.left_toolbar_button(config.icon, { "autofill.main-tooltip" }, autofill_container, function(player)
-    return Roles.player_allowed(player, "gui/autofill")
-end)
+--- Add the element to the left flow with a toolbar button
+Gui.add_left_element(autofill_container, false)
+Gui.create_toolbar_button{
+    name = "autofill_toggle",
+    left_element = autofill_container,
+    sprite = config.icon,
+    tooltip = { "autofill.main-tooltip" },
+    visible = function(player, element)
+        return Roles.player_allowed(player, "gui/autofill")
+    end
+}
 
 --- When a player is created make sure they have the default autofill settings
 Event.add(defines.events.on_player_created, function(event)
@@ -321,6 +334,7 @@ local function entity_build(event)
     -- Get the inventory of the player
     local player_inventory = player.get_main_inventory() --- @cast player_inventory -nil
 
+    local offset = { x = 0, y = 0 }
     -- Loop over all possible items to insert into the entity
     for _, item in pairs(entity_settings.items) do
         -- Check if the item is enabled or goto next item
@@ -330,28 +344,30 @@ local function entity_build(event)
         local entity_inventory = entity.get_inventory(item.inv)
         if not entity_inventory then goto end_item end
 
-        local preferd_amount = item.amount
+        local preferred_amount = item.amount
         local item_amount = player_inventory.get_item_count(item.name)
         if item_amount ~= 0 then
             local inserted
-            local color = { r = 0, g = 255, b = 0, a = 1 }
-            if item_amount >= preferd_amount then
+            local color = { r = 0, g = 255, b = 0, a = 255 }
+            if item_amount >= preferred_amount then
                 -- Can item be inserted? no, goto next item!
-                if not entity_inventory.can_insert{ name = item.name, count = preferd_amount } then
+                if not entity_inventory.can_insert{ name = item.name, count = preferred_amount } then
                     goto end_item
                 end
-                inserted = entity_inventory.insert{ name = item.name, count = preferd_amount }
+                inserted = entity_inventory.insert{ name = item.name, count = preferred_amount }
             else
                 inserted = entity_inventory.insert{ name = item.name, count = item_amount }
-                color = { r = 255, g = 165, b = 0, a = 1 }
+                color = { r = 255, g = 165, b = 0, a = 255 }
             end
             player_inventory.remove{ name = item.name, count = inserted }
             FlyingText.create_above_entity{
                 target_entity = entity,
                 text = { "autofill.inserted", inserted, rich_img("item", item.name), rich_img("entity", entity.name) },
+                offset = offset,
                 player = player,
                 color = color,
             }
+            offset.y = offset.y - 0.33
         end
         ::end_item::
     end
diff --git a/exp_legacy/module/modules/gui/readme.lua b/exp_legacy/module/modules/gui/readme.lua
index a563310a..b5657aaa 100644
--- a/exp_legacy/module/modules/gui/readme.lua
+++ b/exp_legacy/module/modules/gui/readme.lua
@@ -441,11 +441,11 @@ local readme = Gui.element("readme")
         local button = Gui.get_top_element(readme_toggle, player)
         Gui.set_toolbar_button_style(button, true)
     end)
-    :on_closed(function(def, event)
+    :on_closed(function(def, event, element)
         local player = Gui.get_player(event)
         local button = Gui.get_top_element(readme_toggle, player)
         Gui.set_toolbar_button_style(button, false)
-        Gui.destroy_if_valid(event.element)
+        Gui.destroy_if_valid(element)
     end)
 
 --- Toggle button for the readme gui
diff --git a/exp_legacy/module/modules/gui/rocket-info.lua b/exp_legacy/module/modules/gui/rocket-info.lua
index 3be8db3f..b543b2c2 100644
--- a/exp_legacy/module/modules/gui/rocket-info.lua
+++ b/exp_legacy/module/modules/gui/rocket-info.lua
@@ -5,7 +5,7 @@
 ]]
 
 local ExpUtil = require("modules/exp_util")
-local Gui = require("modules.exp_legacy.expcore.gui") --- @dep expcore.gui
+local Gui = require("modules/exp_gui")
 local Roles = require("modules.exp_legacy.expcore.roles") --- @dep expcore.roles
 local Event = require("modules/exp_legacy/utils/event") --- @dep utils.event
 local config = require("modules.exp_legacy.config.gui.rockets") --- @dep config.gui.rockets
@@ -39,15 +39,17 @@ end
 
 --- Button to toggle the auto launch on a rocket silo
 -- @element toggle_launch
-local toggle_launch =
-    Gui.element{
+local toggle_launch = Gui.element("toggle_launch")
+    :draw{
         type = "sprite-button",
         sprite = "utility/play",
         tooltip = { "rocket-info.toggle-rocket-tooltip" },
-        name = Gui.unique_static_name,
+        name = Gui.property_from_name,
     }
-    :style(Gui.sprite_style(16))
-    :on_click(function(_, element, _)
+    :style(Gui.styles.sprite{
+        size = 16,
+    })
+    :on_click(function(def, event, element)
         local rocket_silo_name = element.parent.name:sub(8)
         local rocket_silo = Rockets.get_silo_entity(rocket_silo_name)
         if rocket_silo.auto_launch then
@@ -61,30 +63,10 @@ local toggle_launch =
         end
     end)
 
---- Button to remotely launch a rocket from a silo
--- @element launch_rocket
-local launch_rocket =
-    Gui.element{
-        type = "sprite-button",
-        sprite = "utility/center",
-        tooltip = { "rocket-info.launch-tooltip" },
-        name = Gui.unique_static_name,
-    }
-    :style(Gui.sprite_style(16, -1))
-    :on_click(function(player, element, _)
-        local rocket_silo_name = element.parent.name:sub(8)
-        local silo_data = Rockets.get_silo_data_by_name(rocket_silo_name)
-        if silo_data.entity.launch_rocket() then
-            element.enabled = false
-        else
-            player.print({ "rocket-info.launch-failed" }, Colors.orange_red)
-        end
-    end)
-
 --- XY cords that allow zoom to map when pressed
 -- @element silo_cords
-local silo_cords =
-    Gui.element(function(definition, parent, silo_data)
+local silo_cords = Gui.element("silo_cords")
+    :draw(function(definition, parent, silo_data)
         local silo_name = silo_data.silo_name
         local pos = silo_data.position
         local tooltip = config.progress.allow_zoom_to_map and { "rocket-info.progress-label-tooltip" } or nil
@@ -120,11 +102,12 @@ local silo_cords =
         }
 
         if config.progress.allow_zoom_to_map then
-            definition:triggers_events(label_x)
-            definition:triggers_events(label_y)
+            definition:link_element(label_x)
+            definition:link_element(label_y)
         end
     end)
-    :on_click(function(player, element, _)
+    :on_click(function(def, event, element)
+        local player = Gui.get_player(event)
         local rocket_silo_name = element.parent.caption
         local rocket_silo = Rockets.get_silo_entity(rocket_silo_name)
         player.set_controller{ type = defines.controllers.remote, position = rocket_silo.position, surface = rocket_silo.surface }
@@ -132,10 +115,10 @@ local silo_cords =
 
 --- Base element for each rocket in the progress list
 -- @element rocket_entry
-local rocket_entry =
-    Gui.element(function(_, parent, silo_data)
+local rocket_entry = Gui.element("rocket_entry")
+    :draw(function(_, parent, silo_data)
         local silo_name = silo_data.silo_name
-        local player = Gui.get_player_from_element(parent)
+        local player = Gui.get_player(parent)
 
         -- Add the toggle auto launch if the player is allowed it
         -- Auto launch was removed from the api and no 2.0 equivalent was added
@@ -148,18 +131,11 @@ local rocket_entry =
             button.sprite = silo_data.toggle_sprite]]
         end
 
-        -- Add the remote launch if the player is allowed it
-        if check_player_permissions(player, "remote_launch") then
-            local flow = parent.add{ type = "flow", name = "launch-" .. silo_name }
-            local button = launch_rocket(flow)
-            button.enabled = silo_data.allow_launch
-        end
-
         -- Draw the silo cords element
         silo_cords(parent, silo_data)
 
         -- Add a progress label
-        local alignment = Gui.alignment(parent, silo_name)
+        local alignment = Gui.elements.aligned_flow(parent, { name = silo_name })
         local element =
             alignment.add{
                 type = "label",
@@ -174,8 +150,8 @@ local rocket_entry =
 
 --- Data label which contains a name and a value label pair
 -- @element data_label
-local data_label =
-    Gui.element(function(_, parent, label_data)
+local data_label = Gui.element("data_label")
+    :draw(function(_, parent, label_data)
         local data_name = label_data.name
         local data_subname = label_data.subname
         local data_fullname = data_subname and data_name .. data_subname or data_name
@@ -190,7 +166,7 @@ local data_label =
         name_label.style.padding = { 0, 2 }
 
         --- Right aligned label to store the data
-        local alignment = Gui.alignment(parent, data_fullname)
+        local alignment = Gui.elements.aligned_flow(parent, { name = data_fullname })
         local element =
             alignment.add{
                 type = "label",
@@ -305,13 +281,6 @@ local function update_build_progress(parent, progress_data)
                 toggle_button.tooltip = silo_data.toggle_tooltip
                 toggle_button.sprite = silo_data.toggle_sprite
             end
-
-            -- Update the launch button
-            local launch_button = parent["launch-" .. silo_name]
-            if launch_button then
-                launch_button = launch_button[launch_rocket.name]
-                launch_button.enabled = silo_data.allow_launch
-            end
         end
     end
 
@@ -424,18 +393,20 @@ end
 
 -- Button to toggle a section dropdown
 -- @element toggle_section
-local toggle_section =
-    Gui.element{
+local toggle_section = Gui.element("rocket_info_toggle_section")
+    :draw{
         type = "sprite-button",
         sprite = "utility/expand",
         hovered_sprite = "utility/expand",
         tooltip = { "rocket-info.toggle-section-tooltip" },
         style = "frame_action_button",
-        name = Gui.unique_static_name,
+        name = Gui.property_from_name,
     }
-    :style(Gui.sprite_style(20))
-    :on_click(function(_, element, _)
-        local header_flow = element.parent
+    :style(Gui.styles.sprite{
+        size = 20,
+    })
+    :on_click(function(def, event, element)
+        local header_flow = assert(element.parent)
         local flow_name = header_flow.caption
         local flow = header_flow.parent.parent[flow_name]
         if Gui.toggle_visible_state(flow) then
@@ -449,46 +420,46 @@ local toggle_section =
 
 -- Draw a section header and main scroll
 -- @element rocket_list_container
-local section =
-    Gui.element(function(definition, parent, section_name, table_size)
+local section = Gui.element("rocket_info_section")
+    :draw(function(definition, parent, section_name, table_size)
         -- Draw the header for the section
-        local header = Gui.header(
-            parent,
-            { "rocket-info.section-caption-" .. section_name },
-            { "rocket-info.section-tooltip-" .. section_name },
-            true,
-            section_name .. "-header"
-        )
-        definition:triggers_events(header.parent.header_label)
+        local header = Gui.elements.header(parent, {
+            name = section_name .. "-header",
+            caption = { "rocket-info.section-caption-" .. section_name },
+            tooltip = { "rocket-info.section-tooltip-" .. section_name },
+            label_name = "label",
+        })
+
+        definition:link_element(header.parent.label)
 
         -- Right aligned button to toggle the section
         header.caption = section_name
         toggle_section(header)
 
         -- Table used to store the data
-        local scroll_table = Gui.scroll_table(parent, 215, table_size, section_name)
+        local scroll_table = Gui.elements.scroll_table(parent, 215, table_size, section_name)
         scroll_table.parent.visible = false
 
         -- Return the flow table
-        return definition:no_events(scroll_table)
+        return definition:unlink_element(scroll_table)
     end)
-    :on_click(function(_, element, event)
+    :on_click(function(def, event, element)
         event.element = element.parent.alignment[toggle_section.name]
         toggle_section:raise_event(event)
     end)
 
 --- Main gui container for the left flow
 -- @element rocket_list_container
-local rocket_list_container =
-    Gui.element(function(definition, parent)
+local rocket_list_container = Gui.element("rocket_list_container")
+    :draw(function(definition, parent)
         -- Draw the internal container
-        local container = Gui.container(parent, definition.name, 200)
+        local container = Gui.elements.container(parent, 200)
 
         -- Set the container style
         local style = container.style
         style.padding = 0
 
-        local player = Gui.get_player_from_element(parent)
+        local player = Gui.get_player(parent)
         local force_name = player.force.name
         -- Draw stats section
         if config.stats.show_stats then
@@ -503,7 +474,6 @@ local rocket_list_container =
         -- Draw build progress list
         if config.progress.show_progress then
             local col_count = 3
-            if check_player_permissions(player, "remote_launch") then col_count = col_count + 1 end
             if check_player_permissions(player, "toggle_active") then col_count = col_count + 1 end
             local progress = section(container, "progress", col_count)
             -- Label used when there are no active silos
@@ -516,19 +486,23 @@ local rocket_list_container =
             update_build_progress(progress, get_progress_data(force_name))
         end
 
-        -- Return the exteral container
+        -- Return the external container
         return container.parent
     end)
-    :static_name(Gui.unique_static_name)
-    :add_to_left_flow(function(player)
-        return player.force.rockets_launched > 0 and Roles.player_allowed(player, "gui/rocket-info")
-    end)
 
---- Button on the top flow used to toggle the container
--- @element toggle_rocket_info
-Gui.left_toolbar_button("item/rocket-silo", { "rocket-info.main-tooltip" }, rocket_list_container, function(player)
-    return Roles.player_allowed(player, "gui/rocket-info")
+--- Add the element to the left flow with a toolbar button
+Gui.add_left_element(rocket_list_container, function(player, element)
+    return player.force.rockets_launched > 0 and Roles.player_allowed(player, "gui/rocket-info")
 end)
+Gui.create_toolbar_button{
+    name = "rocket_list_toggle",
+    left_element = rocket_list_container,
+    sprite = "item/rocket-silo",
+    tooltip = { "rocket-info.main-tooltip" },
+    visible = function(player, element)
+        return Roles.player_allowed(player, "gui/rocket-info")
+    end
+}
 
 --- Update the gui for all players on a force
 local function update_rocket_gui_all(force_name)
@@ -536,11 +510,11 @@ local function update_rocket_gui_all(force_name)
     local milestones = get_milestone_data(force_name)
     local progress = get_progress_data(force_name)
     for _, player in pairs(game.forces[force_name].players) do
-        local frame = Gui.get_left_element(player, rocket_list_container)
-        local container = frame.container
-        update_data_labels(container.stats.table, stats)
-        update_data_labels(container.milestones.table, milestones)
-        update_build_progress(container.progress.table, progress)
+        local container = Gui.get_left_element(rocket_list_container, player)
+        local frame = container.frame
+        update_data_labels(frame.stats.table, stats)
+        update_data_labels(frame.milestones.table, milestones)
+        update_build_progress(frame.progress.table, progress)
     end
 end
 
@@ -553,10 +527,10 @@ end)
 --- Update only the progress gui for a force
 local function update_rocket_gui_progress(force_name)
     local progress = get_progress_data(force_name)
-    for _, player in pairs(game.forces[force_name].players) do
-        local frame = Gui.get_left_element(player, rocket_list_container)
-        local container = frame.container
-        update_build_progress(container.progress.table, progress)
+    for _, player in pairs(game.forces[force_name].connected_players) do
+        local container = Gui.get_left_element(rocket_list_container, player)
+        local frame = container.frame
+        update_build_progress(frame.progress.table, progress)
     end
 end
 
@@ -590,12 +564,11 @@ Event.add(defines.events.on_robot_built_entity, on_built)
 local function role_update_event(event)
     if not config.progress.show_progress then return end
     local player = game.players[event.player_index]
-    local container = Gui.get_left_element(player, rocket_list_container).container
-    local progress_scroll = container.progress
+    local container = Gui.get_left_element(rocket_list_container, player)
+    local progress_scroll = container.frame.progress
     Gui.destroy_if_valid(progress_scroll.table)
 
     local col_count = 3
-    if check_player_permissions(player, "remote_launch") then col_count = col_count + 1 end
     if check_player_permissions(player, "toggle_active") then col_count = col_count + 1 end
     local progress = progress_scroll.add{
         type = "table",
diff --git a/exp_util/module/flying_text.lua b/exp_util/module/flying_text.lua
index 3a1bc43f..f7ecaec3 100644
--- a/exp_util/module/flying_text.lua
+++ b/exp_util/module/flying_text.lua
@@ -36,16 +36,18 @@ end
 
 --- @class FlyingText.create_above_entity_param:FlyingText.create_param
 --- @field target_entity? LuaEntity The entity to create the text above
+--- @field offset? { x: number, y: number } Offset to move the text by
 
 --- Create flying above an entity, overrides the position option of FlyingText.create
 --- @param options FlyingText.create_above_entity_param
 function FlyingText.create_above_entity(options)
     local entity = assert(options.target_entity, "A target entity is required")
     local size_y = entity.bounding_box.left_top.y - entity.bounding_box.right_bottom.y
+    local offset = options.offset or { x = 0, y = 0 }
 
     options.position = {
-        x = entity.position.x,
-        y = entity.position.y - size_y * 0.25,
+        x = offset.x + entity.position.x,
+        y = offset.y + entity.position.y + size_y * 0.25,
     }
 
     FlyingText.create(options)
@@ -53,6 +55,7 @@ end
 
 --- @class FlyingText.create_above_player_param:FlyingText.create_param
 --- @field target_player? LuaPlayer The player to create the text above
+--- @field offset? { x: number, y: number } Offset to move the text by
 
 --- Create flying above a player, overrides the position option of FlyingText.create
 --- @param options FlyingText.create_above_player_param
@@ -60,10 +63,11 @@ function FlyingText.create_above_player(options)
     local player = assert(options.target_player, "A target player is required")
     local entity = player.character; if not entity then return end
     local size_y = entity.bounding_box.left_top.y - entity.bounding_box.right_bottom.y
+    local offset = options.offset or { x = 0, y = 0 }
 
     options.position = {
-        x = entity.position.x,
-        y = entity.position.y - size_y * 0.25,
+        x = offset.x + entity.position.x,
+        y = offset.y + entity.position.y + size_y * 0.25,
     }
 
     FlyingText.create(options)
@@ -71,6 +75,7 @@ end
 
 --- @class FlyingText.create_as_player_param:FlyingText.create_param
 --- @field target_player? LuaPlayer The player to create the text above
+--- @field offset? { x: number, y: number } Offset to move the text by
 
 --- Create flying above a player, overrides the position and color option of FlyingText.create
 --- @param options FlyingText.create_as_player_param
@@ -78,11 +83,12 @@ function FlyingText.create_as_player(options)
     local player = assert(options.target_player, "A target player is required")
     local entity = player.character; if not entity then return end
     local size_y = entity.bounding_box.left_top.y - entity.bounding_box.right_bottom.y
+    local offset = options.offset or { x = 0, y = 0 }
 
     options.color = player.chat_color
     options.position = {
-        x = entity.position.x,
-        y = entity.position.y - size_y * 0.25,
+        x = offset.x + entity.position.x,
+        y = offset.y + entity.position.y + size_y * 0.25,
     }
 
     FlyingText.create(options)