item menu example

modules/core/constants.lua

@@ -130,4 +130,9 @@ KeyF12 = 140
 KeyboardNoModifier = 0
 KeyboardCtrlModifier = 1
 KeyboardAltModifier = 2
-KeyboardShiftModifier = 4
+KeyboardShiftModifier = 4
+
+MouseNoButton = 0
+MouseLeftButton = 1
+MouseRightButton = 2
+MouseMidButton = 3

modules/core_styles/styles/buttons.otui

@@ -48,4 +48,19 @@ TopButton < UIButton
       border: 3
 
   state.disabled:
-    background-color: #ffffff66
+    background-color: #ffffff66
+
+MenuButton < UIButton
+  color: white
+  size: 40 18
+  align: center
+  border-image:
+    source: /core_styles/images/menu.png
+    size: 64 24
+
+  state.hover:
+    border-image:
+      source: /core_styles/images/menu.png
+      offset: 0 24
+      size: 64 24
+    color: black

modules/core_styles/styles/items.otui

@@ -1,6 +1,6 @@
 Item < UIItem
   size: 34 34
-  item margin: 1 
+  item margin: 1
   border-image:
     source: /core_styles/images/panel_flat.png
     border: 4

modules/inventory/inventory.otui

@@ -4,67 +4,68 @@ UIWindow
   margin.left: 6
   margin.right: 6
   move policy: free updated
-  
+
   Item
     id: head
     anchors.top: parent.top
     anchors.horizontalCenter: parent.horizontalCenter
-    
+    popup menu: /inventory/itempopupmenu.otui
+
   Item
     id: armor
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: legs
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: feet
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: necklace
     anchors.top: parent.top
     anchors.right: head.left
     margin.top: 15
     margin.right: 10
-    
+
   Item
     id: left
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: ring
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: backpack
     anchors.top: parent.top
     anchors.left: head.right
     margin.top: 15
     margin.left: 10
-    
+
   Item
     id: right
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-    
+
   Item
     id: ammo
     anchors.top: prev.bottom
     anchors.horizontalCenter: prev.horizontalCenter
     margin.top: 10
-  
+
 
 

modules/inventory/itempopupmenu.otui

@@ -3,7 +3,7 @@ Panel
   size: 64 48
 
   MenuButton
-    text: New
+    text: Foo
 
   MenuButton
     text: Quit

modules/playground/menubar.otui

@@ -1,29 +0,0 @@
-MenuButton < UIButton
-  color: white
-  size: 40 18
-  align: center
-  border-image:
-    source: /core_styles/images/menu.png
-    size: 64 24
-
-  state.hover:
-    border-image:
-      source: /core_styles/images/menu.png
-      offset: 0 24
-      size: 64 24
-    color: black
-
-TopMenuButton < MenuButton
-  onMousePress: |
-    function(self, mousePos, mouseButton)
-      local popupMenu = UI.loadAndDisplay(self:getStyle()['popup menu'])
-      if popupMenu then
-        popupMenu:moveTo({ x = self:getX(), y = self:getY() + self:getHeight()})
-        popupMenu.onMouseRelease = function(self) self:destroy() end
-      end
-    end
-
-TopMenuButton
-  text: File
-  position: 80 0
-  popup menu: /playground/filemenu.otui

modules/playground/playground.lua

@@ -1,10 +1,24 @@
 -- place any code for testing purposes here
 
-function displayMenuPopup(file, parent)
+function UIItem.onMouseRelease(self, mousePos, mouseButton)
+  if mouseButton ~= MouseRightButton then return end
+  local top = self:getY()
+  local bottom = self:getY() + self:getHeight()
+  local left = self:getX()
+  local right = self:getX() + self:getWidth()
+  if not (mousePos.y >= top and mousePos.y <= bottom and mousePos.x >= left and mousePos.x <= right) then return end
+
+  local menuFile = self:getStyle()['popup menu']
+  if not menuFile then return end
+
+  local popupMenu = UI.loadAndDisplay(menuFile)
+  if not popupMenu then return end
+
+  popupMenu:moveTo(mousePos)
+  popupMenu.onMouseRelease = function(self) self:destroy() end
 end
 
 local function init()
-  UI.loadAndDisplay('/playground/menubar.otui')
 end
 
 addEvent(init)