added icons and popup menus

data/layout.xml

@@ -11,7 +11,7 @@
     </button-custom>
   </layout>
   <layout id="multi-button">
-    <node width="50" margin="0 5 0 0" dir="row" wrap="1">
+    <node width="50" margin="0 5 0 0" dir="row" wrap="1" flood-events="1">
       <ref id="multi-button-item"/>
       <ref id="multi-button-item"/>
       <ref id="multi-button-item"/>
@@ -64,7 +64,7 @@
               </button-custom>
             </node>
             <!--settings tab-->
-            <border color=".2" width="100%"></border>
+            <border color=".2" width="100%" height="200"></border>
           </node>
           <!--footer buttons-->
           <node height="40" grow="1" dir="row" align="flex-end" justify="flex-end">
@@ -77,25 +77,104 @@
   </layout>
   <!--popup menu-->
   <layout id="popup-menu">
-    <popup-menu positioning="absolute" position="100 100" width="100" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
+    <popup-menu positioning="absolute" position="100 100" width="150" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
-      <button text="Menu" height="25"/>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
-      <button text="Menu" height="25"/>
+        <icon icon="camera" width="20"/>
-      <button text="Menu" height="25"/>
+        <text text="Snapshot" margin="0 0 0 5" font-face="arial" font-size="11"/>
-      <button text="Menu" height="25"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="layers" width="20"/>
+        <text text="Layers" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_white" width="20"/>
+        <text text="New Layer" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_white_paste" width="20"/>
+        <text text="Paste" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_white_stack" width="20"/>
+        <text text="Copy" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+    </popup-menu>
+  </layout>
+  <!--popup menu-->
+  <layout id="file-menu">
+    <popup-menu positioning="absolute" position="100 100" width="150" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_add" width="20"/>
+        <text text="New Panodoc" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk" width="20"/>
+        <text text="Save" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk_multiple" width="20"/>
+        <text text="Save as.." margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="add" width="20"/>
+        <text text="Add reference" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon width="20"/>
+        <text text="Quit" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+    </popup-menu>
+  </layout>
+  <!--edit menu-->
+  <layout id="edit-menu">
+    <popup-menu positioning="absolute" position="100 100" width="150" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_add" width="20"/>
+        <text text="New Panodoc" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk" width="20"/>
+        <text text="Save" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk_multiple" width="20"/>
+        <text text="Save as.." margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+    </popup-menu>
+  </layout>
+  <!--layers menu-->
+  <layout id="layers-menu">
+    <popup-menu positioning="absolute" position="100 100" width="150" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="page_add" width="20"/>
+        <text text="New Panodoc" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk" width="20"/>
+        <text text="Save" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="disk_multiple" width="20"/>
+        <text text="Save as.." margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
+      <button-custom text="Menu" height="30" align="center" color=".2" pad="0 0 0 10" dir="row">
+        <icon icon="add" width="20"/>
+        <text text="Add reference" margin="0 0 0 5" font-face="arial" font-size="11"/>
+      </button-custom>
     </popup-menu>
   </layout>
   <!--main-->
   <layout id="main">
     <node dir="col" wrap="0" width="100%" height="100%" pad="5">
       <!-- menu bar -->
-      <border flood-events="1" margin="0 0 5 0" pad="3 0 3 3" color=".3" width="100%" height="25" dir="row" align="center">
+      <border flood-events="1" margin="0 0 5 0" pad="0 0 0 0" color=".1" width="100%" height="25" dir="row" align="center">
-        <button-custom id="menu-file" height="100%" margin="0 5 0 0" justify="center" align="center" pad="8">
+        <button-custom id="menu-file" height="100%" margin="0 0 0 0" justify="center" align="center" pad="8">
           <text text="File" font-face="arial" font-size="11"/>
         </button-custom>
-        <button-custom id="menu-edit" height="100%" margin="0 5 0 0" justify="center" align="center" pad="8">
+        <button-custom id="menu-edit" height="100%" margin="0 0 0 0" justify="center" align="center" pad="8">
           <text text="Edit" font-face="arial" font-size="11"/>
         </button-custom>
-        <button-custom id="menu-layers" height="100%" margin="0 5 0 0" justify="center" align="center" pad="8">
+        <button-custom id="menu-layers" height="100%" margin="0 0 0 0" justify="center" align="center" pad="8">
           <text text="Layers" font-face="arial" font-size="11"/>
         </button-custom>
       </border>
@@ -218,5 +297,6 @@
       </border>
     </node>
     <!--<ref id="settings"/>-->
+    <!--<ref id="popup-menu"/>-->
 </layout>
 </root>

engine/app.cpp

@@ -156,7 +156,29 @@ void App::init()
         {
             menu_file->on_click = [=] { 
                 glm::vec2 pos = menu_file->m_pos + glm::vec2(0, menu_file->m_size.y);
-                popup = (NodePopupMenu*)layout[const_hash("popup-menu")].m_children[0]->clone();
+                popup = (NodePopupMenu*)layout[const_hash("file-menu")].m_children[0]->clone();
+                popup->SetPositioning(YGPositionTypeAbsolute);
+                popup->SetPosition(pos.x, pos.y);
+                layout[main_id].add_child(popup);
+                layout[main_id].update();
+            };
+        }
+        if (auto* menu_file = layout[main_id].find<NodeButtonCustom>("menu-edit"))
+        {
+            menu_file->on_click = [=] {
+                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->SetPositioning(YGPositionTypeAbsolute);
+                popup->SetPosition(pos.x, pos.y);
+                layout[main_id].add_child(popup);
+                layout[main_id].update();
+            };
+        }
+        if (auto* menu_file = layout[main_id].find<NodeButtonCustom>("menu-layers"))
+        {
+            menu_file->on_click = [=] {
+                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->SetPositioning(YGPositionTypeAbsolute);
                 popup->SetPosition(pos.x, pos.y);
                 layout[main_id].add_child(popup);

engine/app.h

@@ -14,6 +14,9 @@ class App
     NodeMessageBox* msgbox;
     NodeSettings* settings;
     NodePopupMenu* popup = nullptr;
+    NodePopupMenu* menu_file = nullptr;
+    NodePopupMenu* menu_edit = nullptr;
+    NodePopupMenu* menu_layers = nullptr;
     const uint16_t main_id = const_hash("main");
 public:
     static App I;

engine/layout.cpp

@@ -72,12 +72,12 @@ void Node::add_child(Node* n)
 
 void Node::remove_child(Node* n)
 {
-    auto i = std::find_if(m_children.begin(), m_children.end(), [=](std::unique_ptr<Node>& ptr) 
+    auto i = std::find_if(m_children.begin(), m_children.end(), [=](std::unique_ptr<Node>& ptr) { return ptr.get() == n; });
+    if (i != m_children.end())
     {
-        return ptr.get() == n; 
+        m_children.erase(i);
-    });
+        YGNodeRemoveChild(y_node, n->y_node);
-    m_children.erase(i);
+    }
-    YGNodeRemoveChild(y_node, n->y_node);
 }
 
 void Node::update(float width, float height)

engine/layout.h

@@ -652,7 +652,7 @@ public:
     virtual Node* clone_instantiate() const override { return new NodeButtonCustom(); }
     virtual void clone_copy(Node* dest) const override
     {
-        Node::clone_copy(dest);
+        NodeBorder::clone_copy(dest);
         NodeButtonCustom* n = static_cast<NodeButtonCustom*>(dest);
         n->color_normal = color_normal;
         n->color_hover = color_hover;
@@ -660,12 +660,14 @@ public:
     }
     virtual void loaded() override
     {
+        NodeBorder::loaded();
         //m_thinkness = 1;
         //m_border_color = glm::vec4(0, 0, 0, 1);
         m_color = color_normal;
     }
     virtual kEventResult handle_event(Event* e) override
     {
+        NodeBorder::handle_event(e);
         switch (e->m_type)
         {
         case kEventType::MouseEnter: