Ui enhancements 2.0 (#31)

* canvas overhaul * minor tweaks * list mode for overview * bugfixes + tweaks for editor 2.0 * minor tweaks * more editor work * refactor + new transitions * use layout() where appropriate and cleanup * mouse triple click + textEntry scroll ind * cleanup * cleanup + theme editor * color rework + cleanup * changes for deprecated ui methods * can now use named colors
2020-04-21 22:40:59 -06:00
parent cdd0b6c4d2
commit 7224d441ca
92 changed files with 2471 additions and 1773 deletions
--- a/sys/apps/system/theme.lua
+++ b/sys/apps/system/theme.lua
@@ -0,0 +1,89 @@
+local Config = require('opus.config')
+local UI     = require('opus.ui')
+local Util   = require('opus.util')
+
+local colors = _G.colors
+
+local allColors = { }
+for k,v in pairs(colors) do
+	if type(v) == 'number' then
+		table.insert(allColors, { name = k, value = v })
+	end
+end
+
+local allSettings = { }
+for k,v in pairs(UI.colors) do
+	allSettings[k] = { name = k, value = v }
+end
+
+return UI.Tab {
+	tabTitle = 'Theme',
+	description = 'Theme colors',
+	grid1 = UI.ScrollingGrid {
+		y = 2, ey = -10, x = 2, ex = -17,
+		disableHeader = true,
+		columns = { { key = 'name' } },
+		values = allSettings,
+		sortColumn = 'name',
+	},
+	grid2 = UI.ScrollingGrid {
+		y = 2, ey = -10, x = -14, ex = -2,
+		disableHeader = true,
+		columns = { { key = 'name' } },
+		values = allColors,
+		sortColumn = 'name',
+		getRowTextColor = function(self, row)
+			local selected = self.parent.grid1:getSelected()
+			if selected.value == row.value then
+				return colors.yellow
+			end
+			return UI.Grid.getRowTextColor(self, row)
+		end
+	},
+	button = UI.Button {
+		x = -9, y = -2,
+		text = 'Update',
+		event = 'update',
+	},
+	display = UI.Window {
+		x = 2, ex = -2, y = -8, height = 5,
+		textColor = colors.black,
+		backgroundColor = colors.black,
+		draw = function(self)
+			self:clear()
+
+			self:write(1, 1, Util.widthify(' Local  Global  Device', self.width),
+				allSettings.secondary.value)
+
+			self:write(2, 2, 'enter command ',
+				colors.black, colors.gray)
+
+			self:write(1, 3, ' Formatted ',
+				allSettings.primary.value)
+
+			self:write(12, 3, Util.widthify(' Output ', self.width - 11),
+				allSettings.tertiary.value)
+
+			self:write(1, 4, Util.widthify(' Key', self.width),
+				allSettings.primary.value)
+		end,
+	},
+	eventHandler = function(self, event)
+		if event.type == 'grid_focus_row' and event.element == self.grid1 then
+			self.grid2:draw()
+
+		elseif event.type == 'grid_select' and event.element == self.grid2 then
+			self.grid1:getSelected().value = event.selected.value
+			self.display:draw()
+			self.grid2:draw()
+
+		elseif event.type == 'update' then
+			local config = Config.load('ui.theme', { colors = { } })
+			for k,v in pairs(allSettings) do
+				config.colors[k] = v.value
+			end
+			Config.update('ui.theme', config)
+		end
+		return UI.Tab.eventHandler(self, event)
+	end
+}