Mike/FlexLove
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleanup stale tests, profiling reports

Browse Source
This commit is contained in:
Michael Freno
2025-11-20 11:36:41 -05:00
parent 32009185e9
commit d0357672db
31 changed files with 994 additions and 446 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
profiling/__profiles__/animation_stress_profile.lua
View File

@@ -34,17 +34,19 @@ function profile.buildLayout()
profile.root = FlexLove.new({
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
-- Create animated elements container
local animationContainer = FlexLove.new({
width = "100%",
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
flexWrap = "wrap",
gap = 10,
marginBottom = 20,
@@ -55,12 +57,12 @@ function profile.buildLayout()
for i = 1, profile.animationCount do
local hue = (i / profile.animationCount) * 360
local baseColor = {
local baseColor = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 120) * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 240) * math.pi / 180),
1
}
)
-- Choose random easing function
local easingFunc = profile.easingFunctions[math.random(#profile.easingFunctions)]
@@ -70,7 +72,7 @@ function profile.buildLayout()
height = 60,
backgroundColor = baseColor,
borderRadius = 8,
margin = 5,
margin = { horizontal = 5, vertical = 5 },
})
-- Store base values for animation
@@ -120,35 +122,36 @@ function profile.buildLayout()
-- Info panel
local infoPanel = FlexLove.new({
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 5,
})
infoPanel:addChild(FlexLove.new({
textContent = string.format("Animated Elements: %d (Press +/- to adjust)", profile.animationCount),
text = string.format("Animated Elements: %d (Press +/- to adjust)", profile.animationCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
infoPanel:addChild(FlexLove.new({
textContent = string.format("Active Animations: %d", #profile.animations),
text = string.format("Active Animations: %d", #profile.animations),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
infoPanel:addChild(FlexLove.new({
textContent = "Animating: position, opacity, borderRadius",
text = "Animating: position, opacity, borderRadius",
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
infoPanel:addChild(FlexLove.new({
textContent = string.format("Easing Functions: %d variations", #profile.easingFunctions),
text = string.format("Easing Functions: %d variations", #profile.easingFunctions),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
profile.root:addChild(infoPanel)

66
profiling/__profiles__/event_stress_profile.lua
View File

@@ -29,17 +29,19 @@ function profile.buildLayout()
profile.root = FlexLove.new({
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
-- Interactive elements container
local interactiveContainer = FlexLove.new({
width = "100%",
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
flexWrap = "wrap",
gap = 5,
marginBottom = 20,
@@ -47,12 +49,12 @@ function profile.buildLayout()
for i = 1, profile.elementCount do
local hue = (i / profile.elementCount) * 360
local baseColor = {
local baseColor = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 120) * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 240) * math.pi / 180),
1
}
)
-- Create nested interactive hierarchy
local outerBox = FlexLove.new({
@@ -60,19 +62,20 @@ function profile.buildLayout()
height = 60,
backgroundColor = baseColor,
borderRadius = 8,
margin = 2,
margin = { horizontal = 2, vertical = 2 },
positioning = "flex",
justifyContent = "center",
alignItems = "center",
onEvent = function(element, event)
if event.type == "hover" then
profile.eventMetrics.hoverCount = profile.eventMetrics.hoverCount + 1
profile.eventMetrics.eventsThisFrame = profile.eventMetrics.eventsThisFrame + 1
element.backgroundColor = {
math.min(1, baseColor[1] * 1.3),
math.min(1, baseColor[2] * 1.3),
math.min(1, baseColor[3] * 1.3),
element.backgroundColor = FlexLove.Color.new(
math.min(1, baseColor.r * 1.3),
math.min(1, baseColor.g * 1.3),
math.min(1, baseColor.b * 1.3),
1
}
)
elseif event.type == "unhover" then
element.backgroundColor = baseColor
elseif event.type == "press" then
@@ -89,19 +92,19 @@ function profile.buildLayout()
local innerBox = FlexLove.new({
width = "60%",
height = "60%",
backgroundColor = {baseColor[1] * 0.6, baseColor[2] * 0.6, baseColor[3] * 0.6, 1},
backgroundColor = FlexLove.Color.new(baseColor.r * 0.6, baseColor.g * 0.6, baseColor.b * 0.6, 1),
borderRadius = 5,
onEvent = function(element, event)
if event.type == "hover" then
profile.eventMetrics.eventsThisFrame = profile.eventMetrics.eventsThisFrame + 1
element.backgroundColor = {
math.min(1, baseColor[1] * 1.5),
math.min(1, baseColor[2] * 1.5),
math.min(1, baseColor[3] * 1.5),
element.backgroundColor = FlexLove.Color.new(
math.min(1, baseColor.r * 1.5),
math.min(1, baseColor.g * 1.5),
math.min(1, baseColor.b * 1.5),
1
}
)
elseif event.type == "unhover" then
element.backgroundColor = {baseColor[1] * 0.6, baseColor[2] * 0.6, baseColor[3] * 0.6, 1}
element.backgroundColor = FlexLove.Color.new(baseColor.r * 0.6, baseColor.g * 0.6, baseColor.b * 0.6, 1)
elseif event.type == "release" then
profile.eventMetrics.eventsThisFrame = profile.eventMetrics.eventsThisFrame + 1
end
@@ -117,35 +120,36 @@ function profile.buildLayout()
-- Metrics panel
local metricsPanel = FlexLove.new({
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 5,
})
metricsPanel:addChild(FlexLove.new({
textContent = string.format("Interactive Elements: %d (Press +/- to adjust)", profile.elementCount),
text = string.format("Interactive Elements: %d (Press +/- to adjust)", profile.elementCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
metricsPanel:addChild(FlexLove.new({
textContent = string.format("Total Hovers: %d", profile.eventMetrics.hoverCount),
text = string.format("Total Hovers: %d", profile.eventMetrics.hoverCount),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
metricsPanel:addChild(FlexLove.new({
textContent = string.format("Total Clicks: %d", profile.eventMetrics.clickCount),
text = string.format("Total Clicks: %d", profile.eventMetrics.clickCount),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
metricsPanel:addChild(FlexLove.new({
textContent = string.format("Events/Frame: %d", profile.eventMetrics.eventsThisFrame),
text = string.format("Events/Frame: %d", profile.eventMetrics.eventsThisFrame),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
profile.root:addChild(metricsPanel)

51
profiling/__profiles__/immediate_mode_profile.lua
View File

@@ -24,10 +24,11 @@ function profile.buildUI()
id = "root", -- ID required for state persistence
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
@@ -35,7 +36,8 @@ function profile.buildUI()
local content = FlexLove.new({
id = "content",
width = "100%",
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
flexWrap = "wrap",
gap = 5,
marginBottom = 20,
@@ -43,12 +45,12 @@ function profile.buildUI()
for i = 1, profile.elementCount do
local hue = (i / profile.elementCount) * 360
local baseColor = {
local baseColor = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 120) * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 240) * math.pi / 180),
1
}
)
-- Each element needs a unique ID for state persistence
local box = FlexLove.new({
@@ -57,15 +59,15 @@ function profile.buildUI()
height = 60,
backgroundColor = baseColor,
borderRadius = 8,
margin = 2,
margin = { horizontal = 2, vertical = 2 },
onEvent = function(element, event)
if event.type == "hover" then
element.backgroundColor = {
math.min(1, baseColor[1] * 1.3),
math.min(1, baseColor[2] * 1.3),
math.min(1, baseColor[3] * 1.3),
element.backgroundColor = FlexLove.Color.new(
math.min(1, baseColor.r * 1.3),
math.min(1, baseColor.g * 1.3),
math.min(1, baseColor.b * 1.3),
1
}
)
elseif event.type == "unhover" then
element.backgroundColor = baseColor
elseif event.type == "press" then
@@ -85,39 +87,40 @@ function profile.buildUI()
local infoPanel = FlexLove.new({
id = "infoPanel",
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 5,
})
infoPanel:addChild(FlexLove.new({
id = "info_title",
textContent = string.format("Immediate Mode: %d Elements", profile.elementCount),
text = string.format("Immediate Mode: %d Elements", profile.elementCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
infoPanel:addChild(FlexLove.new({
id = "info_frame",
textContent = string.format("Frame: %d", profile.frameCount),
text = string.format("Frame: %d", profile.frameCount),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
infoPanel:addChild(FlexLove.new({
id = "info_states",
textContent = string.format("Active States: %d", FlexLove.getStateCount()),
text = string.format("Active States: %d", FlexLove.getStateCount()),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
infoPanel:addChild(FlexLove.new({
id = "info_help",
textContent = "Press +/- to adjust element count",
text = "Press +/- to adjust element count",
fontSize = 12,
color = {0.7, 0.7, 0.7, 1},
textColor = FlexLove.Color.new(0.7, 0.7, 0.7, 1),
}))
root:addChild(infoPanel)

39
profiling/__profiles__/layout_stress_profile.lua
View File

@@ -26,10 +26,11 @@ function profile.buildLayout()
profile.root = FlexLove.new({
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
@@ -38,7 +39,8 @@ function profile.buildLayout()
for r = 1, rows do
local row = FlexLove.new({
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
gap = 10,
flexWrap = "wrap",
})
@@ -46,19 +48,20 @@ function profile.buildLayout()
local itemsInRow = math.min(elementsPerRow, profile.elementCount - (r - 1) * elementsPerRow)
for c = 1, itemsInRow do
local hue = ((r - 1) * elementsPerRow + c) / profile.elementCount
local color = {
local color = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi * 2),
0.3 + 0.5 * math.sin((hue + 0.33) * math.pi * 2),
0.3 + 0.5 * math.sin((hue + 0.66) * math.pi * 2),
1
}
)
local box = FlexLove.new({
width = 80,
height = 80,
backgroundColor = color,
borderRadius = 8,
justifyContent = "center",
positioning = "flex",
justifyContent = "center",
alignItems = "center",
})
@@ -67,9 +70,10 @@ function profile.buildLayout()
local innerBox = FlexLove.new({
width = "80%",
height = "80%",
backgroundColor = {color[1] * 0.8, color[2] * 0.8, color[3] * 0.8, color[4]},
backgroundColor = FlexLove.Color.new(color.r * 0.8, color.g * 0.8, color.b * 0.8, color.a),
borderRadius = 6,
justifyContent = "center",
positioning = "flex",
justifyContent = "center",
alignItems = "center",
})
nested:addChild(innerBox)
@@ -84,24 +88,25 @@ function profile.buildLayout()
local infoPanel = FlexLove.new({
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
marginTop = 20,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 5,
})
infoPanel:addChild(FlexLove.new({
textContent = string.format("Elements: %d (Press +/- to adjust)", profile.elementCount),
text = string.format("Elements: %d (Press +/- to adjust)", profile.elementCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
infoPanel:addChild(FlexLove.new({
textContent = string.format("Nesting Depth: %d", profile.nestingDepth),
text = string.format("Nesting Depth: %d", profile.nestingDepth),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
profile.root:addChild(infoPanel)

41
profiling/__profiles__/memory_profile.lua
View File

@@ -45,17 +45,19 @@ function profile.buildLayout()
profile.root = FlexLove.new({
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
-- Create elements container
local elementsContainer = FlexLove.new({
width = "100%",
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
flexWrap = "wrap",
gap = 5,
marginBottom = 20,
@@ -63,19 +65,19 @@ function profile.buildLayout()
for i = 1, profile.elementCount do
local hue = (i / profile.elementCount) * 360
local color = {
local color = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 120) * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 240) * math.pi / 180),
1
}
)
local box = FlexLove.new({
width = 50,
height = 50,
backgroundColor = color,
borderRadius = 8,
margin = 2,
margin = { horizontal = 2, vertical = 2 },
})
elementsContainer:addChild(box)
@@ -86,10 +88,11 @@ function profile.buildLayout()
-- Memory stats panel
local statsPanel = FlexLove.new({
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 5,
})
@@ -97,27 +100,27 @@ function profile.buildLayout()
local memGrowth = currentMem - profile.memoryStats.startMemory
statsPanel:addChild(FlexLove.new({
textContent = string.format("Memory Profile | Elements: %d", profile.elementCount),
text = string.format("Memory Profile | Elements: %d", profile.elementCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
statsPanel:addChild(FlexLove.new({
textContent = string.format("Current: %.2f MB | Peak: %.2f MB", currentMem, profile.memoryStats.peakMemory),
text = string.format("Current: %.2f MB | Peak: %.2f MB", currentMem, profile.memoryStats.peakMemory),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
statsPanel:addChild(FlexLove.new({
textContent = string.format("Growth: %.2f MB | GC Count: %d", memGrowth, profile.memoryStats.gcCount),
text = string.format("Growth: %.2f MB | GC Count: %d", memGrowth, profile.memoryStats.gcCount),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
statsPanel:addChild(FlexLove.new({
textContent = "Press G to force GC | Press +/- to adjust elements",
text = "Press G to force GC | Press +/- to adjust elements",
fontSize = 12,
color = {0.7, 0.7, 0.7, 1},
textColor = FlexLove.Color.new(0.7, 0.7, 0.7, 1),
}))
profile.root:addChild(statsPanel)

50
profiling/__profiles__/render_stress_profile.lua
View File

@@ -26,17 +26,19 @@ function profile.buildLayout()
profile.root = FlexLove.new({
width = "100%",
height = "100%",
backgroundColor = {0.05, 0.05, 0.1, 1},
flexDirection = "column",
overflow = "scroll",
padding = 20,
backgroundColor = FlexLove.Color.new(0.05, 0.05, 0.1, 1),
positioning = "flex",
flexDirection = "vertical",
overflowY = "scroll",
padding = { horizontal = 20, vertical = 20 },
gap = 10,
})
-- Render container
local renderContainer = FlexLove.new({
width = "100%",
flexDirection = "row",
positioning = "flex",
flexDirection = "horizontal",
flexWrap = "wrap",
gap = 5,
marginBottom = 20,
@@ -44,27 +46,27 @@ function profile.buildLayout()
for i = 1, profile.elementCount do
local hue = (i / profile.elementCount) * 360
local color = {
local color = FlexLove.Color.new(
0.3 + 0.5 * math.sin(hue * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 120) * math.pi / 180),
0.3 + 0.5 * math.sin((hue + 240) * math.pi / 180),
1
}
)
local box = FlexLove.new({
width = 50,
height = 50,
backgroundColor = color,
borderRadius = profile.showRounded and (5 + math.random(20)) or 0,
margin = 2,
margin = { horizontal = 2, vertical = 2 },
})
-- Add text rendering if enabled
if profile.showText then
box:addChild(FlexLove.new({
textContent = tostring(i),
text = tostring(i),
fontSize = 12,
color = {1, 1, 1, 0.8},
textColor = FlexLove.Color.new(1, 1, 1, 0.8),
}))
end
@@ -73,9 +75,10 @@ function profile.buildLayout()
local innerBox = FlexLove.new({
width = "80%",
height = "80%",
backgroundColor = {color[1] * 0.5, color[2] * 0.5, color[3] * 0.5, 0.7},
backgroundColor = FlexLove.Color.new(color.r * 0.5, color.g * 0.5, color.b * 0.5, 0.7),
borderRadius = profile.showRounded and 8 or 0,
justifyContent = "center",
positioning = "flex",
justifyContent = "center",
alignItems = "center",
})
box:addChild(innerBox)
@@ -89,35 +92,36 @@ function profile.buildLayout()
-- Controls panel
local controlsPanel = FlexLove.new({
width = "100%",
padding = 15,
backgroundColor = {0.1, 0.1, 0.2, 0.9},
padding = { horizontal = 15, vertical = 15 },
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.2, 0.9),
borderRadius = 8,
flexDirection = "column",
positioning = "flex",
flexDirection = "vertical",
gap = 8,
})
controlsPanel:addChild(FlexLove.new({
textContent = string.format("Render Elements: %d (Press +/- to adjust)", profile.elementCount),
text = string.format("Render Elements: %d (Press +/- to adjust)", profile.elementCount),
fontSize = 18,
color = {1, 1, 1, 1},
textColor = FlexLove.Color.new(1, 1, 1, 1),
}))
controlsPanel:addChild(FlexLove.new({
textContent = string.format("[R] Rounded Rectangles: %s", profile.showRounded and "ON" or "OFF"),
text = string.format("[R] Rounded Rectangles: %s", profile.showRounded and "ON" or "OFF"),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
controlsPanel:addChild(FlexLove.new({
textContent = string.format("[T] Text Rendering: %s", profile.showText and "ON" or "OFF"),
text = string.format("[T] Text Rendering: %s", profile.showText and "ON" or "OFF"),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
controlsPanel:addChild(FlexLove.new({
textContent = string.format("[L] Layering/Overdraw: %s", profile.showLayering and "ON" or "OFF"),
text = string.format("[L] Layering/Overdraw: %s", profile.showLayering and "ON" or "OFF"),
fontSize = 14,
color = {0.8, 0.8, 0.8, 1},
textColor = FlexLove.Color.new(0.8, 0.8, 0.8, 1),
}))
profile.root:addChild(controlsPanel)