App page

core/dashboard/appCard.lua

@@ -0,0 +1,69 @@
+return function(app)
+    local appGui = teverse.construct("guiFrame", {
+        strokeRadius = 2,
+        dropShadowAlpha = 0.15,
+        strokeAlpha = 0.05
+    })
+
+    teverse.guiHelper.hoverColour(appGui, colour.rgb(247, 247, 247))
+
+    teverse.construct("guiTextBox", {
+        parent = appGui,
+        size = guiCoord(1.0, -20, 0, 22),
+        position = guiCoord(0, 10, 0, 5),
+        backgroundAlpha = 0,
+        text = app.name,
+        textSize = 22,
+        textAlign = "middleLeft",
+        textFont = "tevurl:fonts/openSansBold.ttf",
+        active = false
+    })
+
+    teverse.construct("guiTextBox", {
+        parent = appGui,
+        size = guiCoord(1.0, -20, 0, 16),
+        position = guiCoord(0, 10, 0, 24),
+        backgroundAlpha = 0,
+        textAlpha = 0.5,
+        text = "by " .. app.owner.username,
+        textSize = 16,
+        active = false
+    })
+
+    local img = teverse.construct("guiImage", {
+        size = guiCoord(1, 0, 1, 0),
+        parent = appGui,
+        active = false, 
+        zIndex = -1
+    })
+
+    local launch = teverse.construct("guiTextBox", {
+        parent = appGui,
+        size = guiCoord(0, 80, 0, 24),
+        position = guiCoord(1, -90, 1, -34),
+        backgroundColour = colour.rgb(61, 164, 54),
+        text = "LAUNCH",
+        textAlign = "middle",
+        textColour = colour(1, 1, 1),
+        textFont = "tevurl:fonts/openSansBold.ttf",
+        textSize = 18,
+        strokeRadius = 12,
+        dropShadowAlpha = 0.1
+    })
+
+    launch:on("mouseEnter", function()
+        launch.backgroundColour = colour.rgb(81, 184, 64)
+        launch.dropShadowAlpha = 0.0
+        launch:waitFor("mouseExit")
+        launch.backgroundColour = colour.rgb(61, 164, 54)
+        launch.dropShadowAlpha = 0.1
+    end)
+
+    if (app.iconUrl and app.iconUrl ~= "") then
+        img.image = app.iconUrl
+    else
+        img.image = "tevurl:img/tevapp.png"
+    end
+
+    return appGui, launch
+end

core/dashboard/pages/apps.lua

@@ -1,55 +1,10 @@
-local function createApp(app)
-    local appGui = teverse.construct("guiFrame", {
-        strokeRadius = 2,
-        dropShadowAlpha = 0.15,
-        strokeAlpha = 0.05
-    })
-
-    teverse.guiHelper.hoverColour(appGui, colour.rgb(247, 247, 247))
-
-    teverse.construct("guiTextBox", {
-        parent = appGui,
-        size = guiCoord(1.0, -20, 0, 22),
-        position = guiCoord(0, 10, 0, 5),
-        backgroundAlpha = 0,
-        text = app.name,
-        textSize = 22,
-        textAlign = "middleLeft",
-        textFont = "tevurl:fonts/openSansBold.ttf",
-        active = false
-    })
-
-    teverse.construct("guiTextBox", {
-        parent = appGui,
-        size = guiCoord(1.0, -20, 0, 16),
-        position = guiCoord(0, 10, 0, 24),
-        backgroundAlpha = 0,
-        textAlpha = 0.5,
-        text = "by " .. app.owner.username,
-        textSize = 16,
-        active = false
-    })
-
-    local img = teverse.construct("guiImage", {
-        size = guiCoord(1, 0, 1, 0),
-        parent = appGui,
-        active = false, 
-        zIndex = -1
-    })
-
-    if (app.iconUrl and app.iconUrl ~= "") then
-        img.image = app.iconUrl
-    else
-        img.image = "tevurl:img/tevapp.png"
-    end
-
-    return appGui
-end
+local createApp = require("tevgit:core/dashboard/appCard.lua")
 
 return {
     name = "Apps",
     iconId = "shapes",
     iconType = "faSolid",
+    scrollView = true,
     setup = function(page)
         local loading = teverse.construct("guiTextBox", {
             parent = page,
@@ -105,7 +60,7 @@ return {
         end
 
         if _DEVICE:sub(0, 6) ~= "iPhone" then
-            local appGui = createApp({
+            local appGui, button = createApp({
                 id = "",
                 name = "Learn Code",
                 owner = {
@@ -114,7 +69,7 @@ return {
             })
             appGui.name = "a"
             appGui.parent = appsContainer
-            appGui:on("mouseLeftUp", function()
+            button:on("mouseLeftUp", function()
                 if not loading.visible then
                     loading.visible = false
                     teverse.apps:loadString("require('tevgit:core/tutorials/main.lua')")
@@ -129,9 +84,9 @@ return {
                 local apps = teverse.json:decode(body)
                 subtitle.text = "Found " .. #apps .. " public apps:"
                 for _,app in pairs(apps) do
-                    local appGui = createApp(app)
+                    local appGui, button = createApp(app)
                     appGui.parent = appsContainer
-                    appGui:on("mouseLeftUp", function()
+                    button:on("mouseLeftUp", function()
                         if not loading.visible then
                             loading.text = "Loading App " .. (app.packageNetworked and "Online" or "Offline")
                             loading.visible = true
@@ -149,5 +104,18 @@ return {
                 subtitle.text = "Server error."
             end
         end)
+
+        local function calculateScrollHeight()
+            local y = 0
+            for _,v in pairs(appsContainer.children) do
+                y = math.max(y, v.absolutePosition.y + 320)
+            end
+
+            page.canvasSize = guiCoord(1, 0, 0, y - appsContainer.absolutePosition.y)
+        end
+
+        calculateScrollHeight()
+        appsContainer:on("childAdded", calculateScrollHeight)
+        teverse.input:on("screenResized", calculateScrollHeight)
     end
 }

core/dashboard/pages/developDesktop.lua

@@ -1,44 +1,10 @@
-local function createApp(app)
-    local appGui = teverse.construct("guiFrame", {
-        strokeRadius = 2,
-        dropShadowAlpha = 0.15,
-        strokeAlpha = 0.05
-    })
-
-    teverse.guiHelper.hoverColour(appGui, colour.rgb(247, 247, 247))
-
-    teverse.construct("guiTextBox", {
-        parent = appGui,
-        size = guiCoord(1.0, -20, 0, 22),
-        position = guiCoord(0, 10, 0, 5),
-        backgroundAlpha = 0,
-        text = app.name,
-        textSize = 22,
-        textAlign = "middleLeft",
-        textFont = "tevurl:fonts/openSansBold.ttf",
-        active = false
-    })
-
-    local img = teverse.construct("guiImage", {
-        size = guiCoord(1, 0, 1, 0),
-        parent = appGui,
-        active = false, 
-        zIndex = -1
-    })
-
-    if (app.iconUrl and app.iconUrl ~= "") then
-        img.image = app.iconUrl
-    else
-        img.image = "tevurl:img/tevapp.png"
-    end
-
-    return appGui
-end
+local createApp = require("tevgit:core/dashboard/appCard.lua")
 
 return {
     name = "Develop",
     iconId = "layer-group",
     iconType = "faSolid",
+    scrollView = true,
     setup = function(page)
         local loading = teverse.construct("guiTextBox", {
             parent = page,
@@ -154,15 +120,25 @@ return {
                 cellMargin = guiCoord(0, 15, 0, 25)
             })
 
+        teverse.guiHelper
+            .bind(appsContainer, "xs", {
+                size = guiCoord(1, -20, 1, -330),
+                position = guiCoord(0, 10, 0, 330)
+            })
+            .bind(appsContainer, "lg", {
+                size = guiCoord(1, 0, 1, -150),
+                position = guiCoord(0, 0, 0, 150)
+            })
+
         teverse.http:get("https://teverse.com/api/users/" .. teverse.networking.localClient.id .. "/apps", {
             ["Authorization"] = "BEARER " .. teverse.userToken
         }, function(code, body)
             if code == 200 then
                 local apps = teverse.json:decode(body)
                 for _,app in pairs(apps) do
-                    local appGui = createApp(app)
+                    local appGui, launchButton = createApp(app)
                     appGui.parent = appsContainer
-                    appGui:on("mouseLeftUp", function()
+                    launchButton:on("mouseLeftUp", function()
                         if not loading.visible then
                             loading.text = "Loading App " .. (app.packageNetworked and "Online" or "Offline")
                             loading.visible = true
@@ -181,5 +157,17 @@ return {
             end
         end)
 
+        local function calculateScrollHeight()
+            local y = 0
+            for _,v in pairs(appsContainer.children) do
+                y = math.max(y, v.absolutePosition.y + 320)
+            end
+
+            page.canvasSize = guiCoord(1, 0, 0, y - appsContainer.absolutePosition.y)
+        end
+
+        calculateScrollHeight()
+        appsContainer:on("childAdded", calculateScrollHeight)
+        teverse.input:on("screenResized", calculateScrollHeight)
     end
 }

core/dashboard/ui.lua

@@ -81,7 +81,7 @@ controller.setup = function()
     local pages = {}
 
     local function setupPage(page)
-        local container = teverse.construct("guiFrame", {
+        local container = teverse.construct(page.scrollView and "guiScrollView" or "guiFrame", {
             parent = body,
             size = guiCoord(1, -40, 1, -80),
             position = guiCoord(0, 10, 0, 80),
@@ -90,6 +90,10 @@ controller.setup = function()
             visible = false
         })
 
+        if page.scrollView then
+            container.scrollbarWidth = 4
+        end
+
         teverse.guiHelper
             .bind(container, "xs", {
                 size = guiCoord(1, -120, 1, -80),