settings menu update + UINode 'enabled' property

res/layouts/pages/settings.xml

@@ -1,8 +1,11 @@
-<panel size='400' color='0' interval='1' context='menu'>
-    <panel id='settings_panel' color='0'>
+<container size='658,404' color='#20202020' context='menu'>
+    <panel pos='2' size='250' color='0' interval='1'>
+        <button onclick='menu.page="languages"' id='langs_btn'>-</button>
+        <button id='s_aud' onclick='set_page("s_aud", "settings_audio")'>@Audio</button>
+        <button id='s_gfx' onclick='set_page("s_gfx", "settings_graphics")'>@Graphics</button>
+        <button id='s_ctl' onclick='set_page("s_ctl", "settings_controls")'>@Controls</button>
+        <button onclick='menu:back()'>@Back</button>
     </panel>
-    <button onclick='menu.page="languages"' id='langs_btn'>-</button>
-    <button onclick='menu.page="settings_audio"'>@Audio</button>
-    <button onclick='menu.page="controls"'>@Controls</button>
-    <button onclick='menu:back()'>@Back</button>
-</panel>
+    <pagebox id='menu' pos='254,0' size='400'>
+    </pagebox>
+</container>

res/layouts/pages/settings.xml.lua

@@ -1,43 +1,15 @@
-function create_setting(id, name, step, postfix)
-    local info = core.get_setting_info(id)
-    document.settings_panel:add(gui.template("track_setting", {
-        id=id,
-        name=gui.str(name, "settings"),
-        value=core.get_setting(id),
-        min=info.min,
-        max=info.max,
-        step=step,
-        postfix=postfix or ""
-    }))
-end
-
-function update_setting(x, id, name, postfix)
-    core.set_setting(id, x)
-    -- updating label
-    document[id..".L"].text = string.format(
-        "%s: %s%s", name, core.str_setting(id), postfix
-    )
-end
-
-function create_checkbox(id, name)
-    document.settings_panel:add(string.format(
-        "<checkbox consumer='function(x) core.set_setting(\"%s\", x) end' checked='%s'>%s</checkbox>", 
-        id, core.str_setting(id), gui.str(name, "settings")
-    ))
-end
-
 function on_open()
-    create_setting("chunks.load-distance", "Load Distance", 1)
-    create_setting("chunks.load-speed", "Load Speed", 1)
-    create_setting("graphics.fog-curve", "Fog Curve", 0.1)
-    create_setting("graphics.gamma", "Gamma", 0.05)
-    create_setting("camera.fov", "FOV", 1, "°")
-    create_checkbox("display.fullscreen", "Fullscreen")
-    create_checkbox("display.vsync", "V-Sync")
-    create_checkbox("graphics.backlight", "Backlight")
-    create_checkbox("camera.shaking", "Camera Shaking")
     document.langs_btn.text = string.format(
         "%s: %s", gui.str("Language", "settings"),
         gui.get_locales_info()[core.get_setting("ui.language")].name
     )
+    set_page("s_gfx", "settings_graphics")
+end
+
+function set_page(btn, page)
+    document.s_aud.enabled = true
+    document.s_gfx.enabled = true
+    document.s_ctl.enabled = true
+    document[btn].enabled = false
+    document.menu.page = page
 end

res/layouts/pages/settings_audio.xml

@@ -1,6 +1,2 @@
 <panel size='400' color='0' interval='1'>
-    <panel id='tracks_panel' size='400' color='0' interval='1'>
-        <!-- content is generated in script -->
-    </panel>
-    <button onclick='menu:back()'>@Back</button>
 </panel>

res/layouts/pages/settings_audio.xml.lua

@@ -1,34 +1,33 @@
-function on_open()
-    new_volume_control("audio.volume-master", "master", "Master Volume")
-    new_volume_control("audio.volume-regular", "regular", "Regular Sounds")
-    new_volume_control("audio.volume-ui", "ui", "UI Sounds")
-    new_volume_control("audio.volume-ambient", "ambient", "Ambient")
-    new_volume_control("audio.volume-music", "music", "Music")
+function create_setting(id, name, step, postfix)
+    local info = core.get_setting_info(id)
+    postfix = postfix or ""
+    document.root:add(gui.template("track_setting", {
+        id=id,
+        name=gui.str(name, "settings"),
+        value=core.get_setting(id),
+        min=info.min,
+        max=info.max,
+        step=step,
+        postfix=postfix
+    }))
+    update_setting(core.get_setting(id), id, name, postfix)
 end
 
-function new_volume_control(setting, id, name)
-    -- value text label
-    document.tracks_panel:add("<label id='l_"..id.."'>-</label>")
-    -- value track-bar
-    document.tracks_panel:add(string.format(
-        "<trackbar id='t_%s' min='0' max='1' value='%s' step='0.01' "..
-        " consumer='function(x) on_volume_change(%q, %q, %q, x) end'/>"
-    , id, core.get_setting(setting), setting, id, name))
-    refresh_label(setting, id, name)
-end
-
-function refresh_label(setting, id, name)
-    document["l_"..id].text = (
-        gui.str(name, "settings")..": "..
-        core.str_setting(setting)
+function update_setting(x, id, name, postfix)
+    core.set_setting(id, x)
+    -- updating label
+    document[id..".L"].text = string.format(
+        "%s: %s%s", 
+        gui.str(name, "settings"), 
+        core.str_setting(id), 
+        postfix
     )
 end
 
-function on_volume_change(setting, id, name, val)
-    if val ~= nil then
-        core.set_setting(setting, val)
-    else
-        document["t_"..id].value = core.get_setting(setting, val)
-    end
-    refresh_label(setting, id, name)
+function on_open()
+    create_setting("audio.volume-master", "Master Volume", 0.01)
+    create_setting("audio.volume-regular", "Regular Sounds", 0.01)
+    create_setting("audio.volume-ui", "UI Sounds", 0.01)
+    create_setting("audio.volume-ambient", "Ambient", 0.01)
+    create_setting("audio.volume-music", "Music", 0.01)
 end

res/layouts/pages/settings_controls.xml

@@ -1,11 +1,10 @@
-<panel size='400' color='0' padding='8'>
+<panel size='400' color='0'>
     <label id='sensitivity_label'>-</label>
     <trackbar id='sensitivity_track' 
               min='0.1' max='10' value='2' step='0.1'
               consumer='change_sensitivity'>
     </trackbar>
-    <panel id='bindings_panel' size='380,200' padding='2' interval='1' max-length='400' color='#0000004C'>
+    <panel id='bindings_panel' size='380,200' padding='2' interval='1' max-length='350' color='#0000004C'>
         <!-- content is generated in script -->
     </panel>
-    <button onclick='menu:back()'>@Back</button>
 </panel>

res/layouts/pages/settings_graphics.xml

@@ -0,0 +1,2 @@
+<panel size='400' color='0' interval='1' context='menu'>
+</panel>

res/layouts/pages/settings_graphics.xml.lua

@@ -0,0 +1,44 @@
+function create_setting(id, name, step, postfix)
+    local info = core.get_setting_info(id)
+    postfix = postfix or ""
+    document.root:add(gui.template("track_setting", {
+        id=id,
+        name=gui.str(name, "settings"),
+        value=core.get_setting(id),
+        min=info.min,
+        max=info.max,
+        step=step,
+        postfix=postfix
+    }))
+    update_setting(core.get_setting(id), id, name, postfix)
+end
+
+function update_setting(x, id, name, postfix)
+    core.set_setting(id, x)
+    -- updating label
+    document[id..".L"].text = string.format(
+        "%s: %s%s", 
+        gui.str(name, "settings"), 
+        core.str_setting(id), 
+        postfix
+    )
+end
+
+function create_checkbox(id, name)
+    document.root:add(string.format(
+        "<checkbox consumer='function(x) core.set_setting(\"%s\", x) end' checked='%s'>%s</checkbox>", 
+        id, core.str_setting(id), gui.str(name, "settings")
+    ))
+end
+
+function on_open()
+    create_setting("chunks.load-distance", "Load Distance", 1)
+    create_setting("chunks.load-speed", "Load Speed", 1)
+    create_setting("graphics.fog-curve", "Fog Curve", 0.1)
+    create_setting("graphics.gamma", "Gamma", 0.05)
+    create_setting("camera.fov", "FOV", 1, "°")
+    create_checkbox("display.fullscreen", "Fullscreen")
+    create_checkbox("display.vsync", "V-Sync")
+    create_checkbox("graphics.backlight", "Backlight")
+    create_checkbox("camera.shaking", "Camera Shaking")
+end

res/texts/ru_RU.txt

@@ -21,6 +21,7 @@ menu.missing-content=Отсутствует Контент!
 menu.Page does not exists=Страница не существует
 menu.Content Error=Ошибка Контента
 menu.Controls=Управление
+menu.Graphics=Графика
 menu.Back to Main Menu=Вернуться в Меню
 menu.Settings=Настройки
 menu.Content=Контент

src/graphics/ui/elements/Button.cpp

@@ -79,7 +79,11 @@ void Button::drawBackground(const DrawContext* pctx, Assets* assets) {
     glm::vec2 pos = calcPos();
     auto batch = pctx->getBatch2D();
     batch->texture(nullptr);
-    batch->setColor(isPressed() ? pressedColor : (hover ? hoverColor : color));
+    if (enabled) {
+        batch->setColor(isPressed() ? pressedColor : (hover ? hoverColor : color));
+    } else {
+        batch->setColor({color.r, color.g, color.b, color.a * 0.5f});
+    }
     batch->rect(pos.x, pos.y, size.x, size.y);
 }
 

src/graphics/ui/elements/Container.cpp

@@ -11,7 +11,7 @@ Container::Container(glm::vec2 size) : UINode(size) {
 }
 
 std::shared_ptr<UINode> Container::getAt(glm::vec2 pos, std::shared_ptr<UINode> self) {
-    if (!interactive) {
+    if (!interactive || !enabled) {
         return nullptr;
     }
     if (!isInside(pos)) return nullptr;

src/graphics/ui/elements/UINode.cpp

@@ -20,6 +20,18 @@ void UINode::setVisible(bool flag) {
     visible = flag;
 }
 
+void UINode::setEnabled(bool flag) {
+    enabled = flag;
+    if (!flag) {
+        defocus();
+        hover = false;
+    }
+}
+
+bool UINode::isEnabled() const {
+    return enabled;
+}
+
 Align UINode::getAlign() const {
     return align;
 }
@@ -82,7 +94,7 @@ bool UINode::isInside(glm::vec2 point) {
 }
 
 std::shared_ptr<UINode> UINode::getAt(glm::vec2 point, std::shared_ptr<UINode> self) {
-    if (!interactive) {
+    if (!interactive || !enabled) {
         return nullptr;
     }
     return isInside(point) ? self : nullptr;

src/graphics/ui/elements/UINode.hpp

@@ -1,14 +1,15 @@
 #ifndef GRAPHICS_UI_ELEMENTS_UINODE_H_
 #define GRAPHICS_UI_ELEMENTS_UINODE_H_
 
+#include "../../../delegates.h"
+#include "../../../window/input.h"
+
 #include <glm/glm.hpp>
 #include <vector>
 #include <memory>
 #include <string>
 #include <functional>
 #include <unordered_map>
-#include "../../../delegates.h"
-#include "../../../window/input.h"
 
 class DrawContext;
 class Assets;
@@ -60,6 +61,8 @@ namespace gui {
         glm::vec4 pressedColor {1.0f};
         /// @brief element margin (only supported for Panel sub-nodes)
         glm::vec4 margin {1.0f};
+        /// @brief element enabled state
+        bool enabled = true;
         /// @brief is element visible
         bool visible = true;
         /// @brief is mouse over the element
@@ -95,6 +98,9 @@ namespace gui {
         virtual void setVisible(bool flag);
         bool isVisible() const;
 
+        virtual void setEnabled(bool flag);
+        bool isEnabled() const;
+
         virtual void setAlign(Align align);
         Align getAlign() const;
 

src/graphics/ui/gui_xml.cpp

@@ -87,6 +87,9 @@ static void _readUINode(UiXmlReader& reader, xml::xmlelement element, UINode& no
     if (element->has("visible")) {
         node.setVisible(element->attr("visible").asBool());
     }
+    if (element->has("enabled")) {
+        node.setEnabled(element->attr("enabled").asBool());
+    }
     if (element->has("position-func")) {
         node.setPositionFunc(scripting::create_vec2_supplier(
             reader.getEnvironment(),

src/logic/scripting/lua/libgui.cpp

@@ -304,6 +304,9 @@ static int l_gui_getattr(lua_State* L) {
     } else if (attr == "visible") {
         lua_pushboolean(L, node->isVisible());
         return 1;
+    } else if (attr == "enabled") {
+        lua_pushboolean(L, node->isEnabled());
+        return 1;
     }
 
     if (getattr(L, dynamic_cast<Container*>(node), attr))
@@ -350,6 +353,8 @@ static int l_gui_setattr(lua_State* L) {
         node->setInteractive(lua_toboolean(L, 4));
     } else if (attr == "visible") {
         node->setVisible(lua_toboolean(L, 4));
+    } else if (attr == "enabled") {
+        node->setEnabled(lua_toboolean(L, 4));
     } else {
         if (setattr(L, dynamic_cast<Button*>(node), attr))
             return 0;