implement right-to-left

data/layout.xml

@@ -721,7 +721,7 @@
         -->
       </border>
       <!-- central row -->
-      <node grow="1" dir="row" wrap="1" height="0">
+      <node grow="1" dir="row" wrap="1" height="0" id="central-row">
         <border width="60" color=".2 .2 .2 .6" margin="0 0 0 0" dir="col" pad="4" flood-events="1" justify="center">
           <!--panel togglers-->
           <button-custom id="btn-stroke" width="50" height="50" margin="0 0 5 0" thickness="1" border-color=".1" pad="2">
@@ -752,8 +752,7 @@
           </scroll>
         </node>
         <!-- timeline -->
-        <!--
+        <node height="100%" width="1" grow="1" dir="col" justify="flex-start" rtl="ltr">
-        <node height="100%" width="1" grow="1" dir="col" justify="flex-start">
           <border color=".3 .3 .3 .4" height="50" width="100%" pad="10" dir="row">
             <text text="Timeline: " font-face="arial" font-size="11" margin="8 10 0 0"/>
             <slider-h id="frames-slider" width="1" grow="1" margin="0 10 0 0"></slider-h>
@@ -762,7 +761,6 @@
             </node>
           </border>
         </node>
-        -->
       </node>
       <!-- status bar -->
       <!--<border height="30" width="100%" color=".15" border-color=".3" dir="row" pad="0 0 0 10" align="center">

engine/app.cpp

@@ -348,7 +348,9 @@ void App::update(float dt)
             glm::ivec4 c = glm::vec4((int)box.x, (int)(height / zoom - box.y - box.w), (int)box.z, (int)box.w) * zoom;
             glScissor(c.x, c.y, c.z, c.w);
             n->draw();
+            return true;
         }
+        return false;
     };
     //glPolygonMode(GL_FRONT_AND_BACK, GL_FILL);
 #if __IOS__

engine/app_layout.cpp

@@ -344,6 +344,9 @@ void App::init_menu_file()
         menu_file->on_click = [=](Node*) {
             glm::vec2 pos = menu_file->m_pos + glm::vec2(0, menu_file->m_size.y);
             popup = (NodePopupMenu*)layout[const_hash("file-menu")]->m_children[0]->clone();
+            popup->update();
+            if (YGNodeStyleGetDirection(layout[main_id]->y_node) == YGDirectionRTL)
+                pos.x = pos.x - popup->m_size.x + menu_file->m_size.x;
             popup->SetPositioning(YGPositionTypeAbsolute);
             popup->SetPosition(pos.x, pos.y);
             layout[main_id]->add_child(popup);
@@ -428,6 +431,9 @@ void App::init_menu_edit()
         menu_file->on_click = [=](Node*) {
             glm::vec2 pos = menu_file->m_pos + glm::vec2(0, menu_file->m_size.y);
             popup = (NodePopupMenu*)layout[const_hash("edit-menu")]->m_children[0]->clone();
+            popup->update();
+            if (YGNodeStyleGetDirection(layout[main_id]->y_node) == YGDirectionRTL)
+                pos.x = pos.x - popup->m_size.x + menu_file->m_size.x;
             popup->SetPositioning(YGPositionTypeAbsolute);
             popup->SetPosition(pos.x, pos.y);
             layout[main_id]->add_child(popup);
@@ -447,6 +453,9 @@ void App::init_menu_timelapse()
         menu_file->on_click = [=](Node*) {
             glm::vec2 pos = menu_file->m_pos + glm::vec2(0, menu_file->m_size.y);
             popup = (NodePopupMenu*)layout[const_hash("timelapse-menu")]->m_children[0]->clone();
+            popup->update();
+            if (YGNodeStyleGetDirection(layout[main_id]->y_node) == YGDirectionRTL)
+                pos.x = pos.x - popup->m_size.x + menu_file->m_size.x;
             popup->SetPositioning(YGPositionTypeAbsolute);
             popup->SetPosition(pos.x, pos.y);
             layout[main_id]->add_child(popup);
@@ -498,6 +507,9 @@ void App::init_menu_layer()
         menu_file->on_click = [=](Node*) {
             glm::vec2 pos = menu_file->m_pos + glm::vec2(0, menu_file->m_size.y);
             popup = (NodePopupMenu*)layout[const_hash("layers-menu")]->m_children[0]->clone();
+            popup->update();
+            if (YGNodeStyleGetDirection(layout[main_id]->y_node) == YGDirectionRTL)
+                pos.x = pos.x - popup->m_size.x + menu_file->m_size.x;
             popup->SetPositioning(YGPositionTypeAbsolute);
             popup->SetPosition(pos.x, pos.y);
             layout[main_id]->add_child(popup);
@@ -634,13 +646,27 @@ void App::initLayout()
         NodeImage* n = new NodeImage;
         n->m_path = "data/ui/p-black.png";
         n->m_tex_id = const_hash("data/ui/p-black.png");
-        n->create();
-        n->SetPositioning(YGPositionTypeAbsolute);
-        //n->SetPosition(100, 100);
-        YGNodeStyleSetPosition(n->y_node, YGEdgeBottom, 8);
-        YGNodeStyleSetPosition(n->y_node, YGEdgeLeft, 15);
         n->SetSize(30, 45);
-        layout[main_id]->add_child(n);
+        n->create();
+
+        NodeButtonCustom* butt = new NodeButtonCustom;
+        butt->create();
+        butt->add_child(n);
+        butt->SetPositioning(YGPositionTypeAbsolute);
+        butt->set_color({ 0, 0, 0, 0 });
+        //n->SetPosition(100, 100);
+        YGNodeStyleSetPosition(butt->y_node, YGEdgeBottom, 8);
+        YGNodeStyleSetPosition(butt->y_node, YGEdgeLeft, 15);
+        //butt->SetSize(30, 45);
+        layout[main_id]->add_child(butt);
+
+        butt->on_click = [this](Node*){
+            static bool fullscreen = false;
+            auto m = layout[main_id]->m_children[0];
+            for (int i = 2; i < m->m_children.size(); i++)
+                m->m_children[i]->m_display = fullscreen;
+            fullscreen = !fullscreen;
+        };
 
         if (auto* slider = layout[main_id]->find<NodeSliderH>("frames-slider"))
         {

engine/node.cpp

@@ -46,11 +46,14 @@ void Node::async_end()
     App::I.async_end();
 }
 
-void Node::watch(std::function<void(Node*)> observer)
+void Node::watch(std::function<bool(Node*)> observer)
 {
-    observer(this);
+    bool cont = observer(this);
-    for (auto& c : m_children)
+    if (cont)
-        c->watch(observer);
+    {
+        for (auto& c : m_children)
+            c->watch(observer);
+    }
 }
 
 void Node::destroy()
@@ -532,6 +535,11 @@ void Node::SetAspectRatio(float ar)
     YGNodeStyleSetAspectRatio(y_node, ar);
 }
 
+void Node::SetRTL(YGDirection dir)
+{
+    YGNodeStyleSetDirection(y_node, dir);
+}
+
 glm::vec2 Node::GetPosition()
 {
     return{ YGNodeLayoutGetLeft(y_node), YGNodeLayoutGetTop(y_node) };
@@ -552,6 +560,11 @@ glm::vec2 Node::GetSize()
     return{ GetWidth(), GetHeight() };
 }
 
+YGDirection Node::GetRTL()
+{
+    return YGNodeStyleGetDirection(y_node);
+}
+
 void Node::restore_context()
 {
     for (auto& c : m_children)
@@ -809,6 +822,17 @@ void Node::parse_attributes(kAttribute ka, const tinyxml2::XMLAttribute* attr)
     case kAttribute::AspectRatio:
         YGNodeStyleSetAspectRatio(y_node, attr->FloatValue());
         break;
+    case kAttribute::RTL:
+        if (strcmp("rtl", attr->Value()) == 0)
+            SetRTL(YGDirectionRTL);
+        else if (strcmp("ltr", attr->Value()) == 0)
+            SetRTL(YGDirectionLTR);
+        else if (strcmp("inherit", attr->Value()) == 0)
+            SetRTL(YGDirectionInherit);
+        else
+        {
+            LOG("Attribute %s for RTL unrecognized", attr->Value());
+        }
     default:
         break;
     }

engine/node.h

@@ -41,6 +41,7 @@ enum class kAttribute : uint16_t
     AspectRatio = const_hash("aspect-ratio"),
     ComboList = const_hash("combo-list"),
     Default = const_hash("default"),
+    RTL = const_hash("rtl"),
 };
 
 enum class kWidget : uint16_t
@@ -143,11 +144,13 @@ public:
     void SetAlign(YGAlign value);
     void SetPositioning(YGPositionType value);
     void SetAspectRatio(float ar);
+    void SetRTL(YGDirection dir);
 
     glm::vec2 GetPosition();
     float GetWidth();
     float GetHeight();
     glm::vec2 GetSize();
+    YGDirection GetRTL();
 
     virtual void restore_context();;
     virtual void clear_context();
@@ -162,7 +165,7 @@ public:
     virtual void clone_copy(Node* dest) const;
     virtual void clone_children(Node* dest) const;
     virtual void clone_finalize(Node* dest) const;;
-    void watch(std::function<void(Node*)> observer);
+    void watch(std::function<bool(Node*)> observer);
     void destroy();
     Node* root();