continue updating ui and start pagination

app/content/main.tscn

@@ -79,7 +79,7 @@ xr_origin = NodePath("../XROrigin3D")
 transform = Transform3D(0.999999, -1.39633e-11, 0, 1.60657e-10, 1, -4.54747e-13, 0, 0, 0.999999, -0.0165677, 0.766337, -0.634317)
 
 [node name="Keyboard" parent="." instance=ExtResource("9_e5n3p")]
-transform = Transform3D(0.5, -0.000139169, -6.50202e-05, 5.2431e-05, 0.353553, -0.353553, 0.000144384, 0.353553, 0.353553, -0.0199266, 0.550784, -0.47368)
+transform = Transform3D(0.5, 5.24309e-05, 0.000144384, -0.000139169, 0.353553, 0.353553, -6.50204e-05, -0.353553, 0.353553, -0.0199266, 0.550784, -0.47368)
 
 [node name="Rooms" type="Node3D" parent="."]
 

app/content/ui/components/button/button.tscn

@@ -4,6 +4,7 @@
 [ext_resource type="Shader" path="res://assets/materials/glass.gdshader" id="4_2xlpt"]
 
 [sub_resource type="ShaderMaterial" id="ShaderMaterial_oqan0"]
+resource_local_to_scene = true
 render_priority = -1
 shader = ExtResource("4_2xlpt")
 shader_parameter/color = Color(1, 1, 1, 0.3)
@@ -18,12 +19,15 @@ shader_parameter/roughness = 0.3
 shader_parameter/grain_amount = 0.02
 
 [sub_resource type="QuadMesh" id="QuadMesh_bt05p"]
+resource_local_to_scene = true
 size = Vector2(0.05, 0.05)
 
 [sub_resource type="BoxShape3D" id="BoxShape3D_xwopm"]
+resource_local_to_scene = true
 size = Vector3(0.05, 0.05, 0.01)
 
 [sub_resource type="BoxShape3D" id="BoxShape3D_bqjii"]
+resource_local_to_scene = true
 size = Vector3(0.05, 0.05, 0.03)
 
 [node name="Button" type="Node3D" groups=["ui_focus"]]

app/content/ui/components/pagination/pagination.gd

@@ -0,0 +1,74 @@
+@tool
+extends FlexContainer3D
+
+const ButtonScene = preload ("res://content/ui/components/button/button.tscn")
+
+@onready var prev_button = $Prev
+@onready var next_button = $Next
+
+@export var page: int = 0:
+	set(value):
+		page = clamp(value, 0, pages - 1)
+
+		if !is_inside_tree(): return
+
+		_update()
+@export var pages: int = 5:
+	set(value):
+		pages = max(1, value)
+		
+		if !is_inside_tree(): return
+
+		_update()
+@export var visible_pages: int = 5:
+	set(value):
+		visible_pages = max(1, value)
+
+		if !is_inside_tree(): return
+
+		_update()
+
+func _ready():
+	_update()
+
+func _update():
+	for child in get_children():
+		if child != prev_button&&child != next_button:
+			print("queue_free", child)
+			child.queue_free()
+			await child.tree_exited
+
+	var display_pages = min(pages, visible_pages)
+	var start_dots = pages > visible_pages&&page > visible_pages - 3
+	var end_dots = pages > visible_pages&&page < pages - visible_pages + 2
+	var center_pos = floor(display_pages / 2)
+
+	prev_button.size = Vector3(size.y, size.y, size.z)
+
+	for i in range(display_pages):
+		if (start_dots&&i == 1)||(end_dots&&i == display_pages - 2):
+			var dots = Label3D.new()
+			dots.text = "..."
+			add_child(dots)
+			move_child(dots, -2)
+			continue
+		
+		var button = ButtonScene.instantiate()
+		button.size = Vector3(size.y, size.y, size.z)
+
+		if i == 0:
+			button.label = "1"
+		elif i == display_pages - 1:
+			button.label = str(pages)
+		else:
+			button.label = str(clamp(page - center_pos + i + 1, 2, pages - 2))
+
+		button.on_button_up.connect(func(_arg):
+			page=int(button.label) - 1
+		)
+
+		add_child(button)
+		move_child(button, -2)
+
+	super._update()
+	

app/content/ui/components/pagination/pagination.tscn

@@ -0,0 +1,18 @@
+[gd_scene load_steps=3 format=3 uid="uid://bef3gamrm6at2"]
+
+[ext_resource type="Script" path="res://content/ui/components/pagination/pagination.gd" id="1_3ylfj"]
+[ext_resource type="PackedScene" uid="uid://bsjqdvkt0u87c" path="res://content/ui/components/button/button.tscn" id="2_lsc4w"]
+
+[node name="Pagination" type="Node3D"]
+script = ExtResource("1_3ylfj")
+gap = 0.01
+size = Vector3(10, 0.05, 0.01)
+
+[node name="Prev" parent="." instance=ExtResource("2_lsc4w")]
+label = "navigate_before"
+icon = true
+
+[node name="Next" parent="." instance=ExtResource("2_lsc4w")]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.36, 0, 0)
+label = "navigate_next"
+icon = true

app/content/ui/menu/edit/device/device.gd

@@ -1,8 +0,0 @@
-extends Node3D
-
-@onready var button = $Button
-@export var id: String = "0"
-
-func set_device_name(text):
-	assert(button != null, "Device has to be added to the scene tree")
-	button.label = text

app/content/ui/menu/edit/device/device.tscn

@@ -1,14 +0,0 @@
-[gd_scene load_steps=4 format=3 uid="uid://dbe8slnyhro2n"]
-
-[ext_resource type="Script" path="res://content/ui/menu/edit/device/device.gd" id="1_rbo86"]
-[ext_resource type="PackedScene" uid="uid://bsjqdvkt0u87c" path="res://content/ui/components/button/button.tscn" id="2_go2es"]
-[ext_resource type="Script" path="res://content/functions/clickable.gd" id="3_6wicx"]
-
-[node name="Device" type="Node3D"]
-script = ExtResource("1_rbo86")
-
-[node name="Button" parent="." instance=ExtResource("2_go2es")]
-focusable = true
-
-[node name="Clickable" type="Node" parent="."]
-script = ExtResource("3_6wicx")

app/content/ui/menu/edit/edit_menu.gd

@@ -6,8 +6,8 @@ const ButtonScene = preload ("res://content/ui/components/button/button.tscn")
 @onready var next_page_button = $Buttons/NextPageButton
 @onready var previous_page_button = $Buttons/PreviousPageButton
 @onready var page_number_label = $PageNumberLabel
-var devices = []
+
-var page = 0
+var page = R.state(0)
 var last_device_page = 0
 var page_size = 20
 var pages = 0

app/content/ui/menu/edit/edit_menu.tscn

@@ -1,33 +1,53 @@
-[gd_scene load_steps=4 format=3 uid="uid://crrb0l3ekuotj"]
+[gd_scene load_steps=7 format=3 uid="uid://crrb0l3ekuotj"]
 
 [ext_resource type="Script" path="res://content/ui/menu/edit/edit_menu.gd" id="1_34cbn"]
 [ext_resource type="Script" path="res://content/ui/components/grid_container/grid_container.gd" id="3_0xvyw"]
-[ext_resource type="PackedScene" uid="uid://bsjqdvkt0u87c" path="res://content/ui/components/button/button.tscn" id="4_tvimg"]
+[ext_resource type="PackedScene" uid="uid://bef3gamrm6at2" path="res://content/ui/components/pagination/pagination.tscn" id="4_4jiu6"]
+[ext_resource type="Shader" path="res://assets/materials/glass.gdshader" id="4_xunmy"]
+
+[sub_resource type="ShaderMaterial" id="ShaderMaterial_hstwo"]
+render_priority = -3
+shader = ExtResource("4_xunmy")
+shader_parameter/color = Color(1, 1, 1, 0.3)
+shader_parameter/border_color = Color(1, 1, 1, 1)
+shader_parameter/edge_color = Color(0, 0, 0, 1)
+shader_parameter/size = Vector2(0.42, 0.32)
+shader_parameter/border_size = 0.001
+shader_parameter/border_fade_in = 0.005
+shader_parameter/border_fade_out = 0.0
+shader_parameter/corner_radius = 0.02
+shader_parameter/roughness = 0.3
+shader_parameter/grain_amount = 0.02
+
+[sub_resource type="QuadMesh" id="QuadMesh_4pj6f"]
+size = Vector2(0.42, 0.32)
 
 [node name="EditMenu" type="Node3D"]
 script = ExtResource("1_34cbn")
 
 [node name="Devices" type="Node3D" parent="."]
-transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.015, -0.015, 0.01)
+
+[node name="Devices" type="Node3D" parent="Devices"]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.045, -0.045, 0.01)
 script = ExtResource("3_0xvyw")
 gaps = Vector2(0.01, 0.01)
 size = Vector3(0.24, 0.1, 0.1)
 
-[node name="PageNumberLabel" type="Label3D" parent="."]
+[node name="Background" type="MeshInstance3D" parent="Devices"]
-transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.26, -0.27, 0.01)
+transform = Transform3D(1, 0, 0, 0, 1, 1.06581e-14, 0, -1.06581e-14, 1, 0.21, -0.16, 0)
+material_override = SubResource("ShaderMaterial_hstwo")
+mesh = SubResource("QuadMesh_4pj6f")
+skeleton = NodePath("../../..")
+
+[node name="Label3D" type="Label3D" parent="Devices"]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.02, -0.03, 0)
 pixel_size = 0.001
-text = "0 / 0"
+text = "Devices"
-font_size = 18
+font_size = 26
 outline_size = 0
+horizontal_alignment = 0
 
-[node name="Buttons" type="Node3D" parent="."]
+[node name="Entities" type="Node3D" parent="."]
-transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.16, -0.24, 0.01)
 
-[node name="NextPageButton" parent="Buttons" instance=ExtResource("4_tvimg")]
+[node name="Pagination" parent="." instance=ExtResource("4_4jiu6")]
-label = "navigate_next"
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.03, -0.27, 0)
-icon = true
-
-[node name="PreviousPageButton" parent="Buttons" instance=ExtResource("4_tvimg")]
-transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, -0.07, 0, 0)
-label = "navigate_before"
-icon = true

app/content/ui/menu/edit/entity/entity.gd

@@ -1,9 +0,0 @@
-extends StaticBody3D
-
-@onready var label: Label3D = $Label
-@export var text = "Default"
-
-func set_entity_name(text):
-	assert(label != null, "Entity has to be added to the scene tree")
-	label.text = text.replace(".", "\n")
-	self.text = text

app/content/ui/menu/edit/entity/entity.tscn

@@ -1,32 +0,0 @@
-[gd_scene load_steps=5 format=3 uid="uid://xo0o5nrfjl23"]
-
-[ext_resource type="Script" path="res://content/ui/menu/edit/entity/entity.gd" id="1_825oj"]
-[ext_resource type="Script" path="res://content/functions/clickable.gd" id="2_i054q"]
-
-[sub_resource type="BoxMesh" id="BoxMesh_aa3i4"]
-size = Vector3(0.05, 0.01, 0.05)
-
-[sub_resource type="BoxShape3D" id="BoxShape3D_28fjq"]
-size = Vector3(0.05, 0.01, 0.05)
-
-[node name="Entity" type="StaticBody3D"]
-script = ExtResource("1_825oj")
-
-[node name="MeshInstance3D" type="MeshInstance3D" parent="."]
-mesh = SubResource("BoxMesh_aa3i4")
-
-[node name="CollisionShape3D" type="CollisionShape3D" parent="."]
-shape = SubResource("BoxShape3D_28fjq")
-
-[node name="Label" type="Label3D" parent="."]
-transform = Transform3D(1, 0, 0, 0, -4.37114e-08, 1, 0, -1, -4.37114e-08, 0, 0.007, 0)
-pixel_size = 0.001
-modulate = Color(0, 0, 0, 1)
-text = "Text"
-font_size = 8
-outline_size = 0
-autowrap_mode = 3
-width = 50.0
-
-[node name="Clickable" type="Node" parent="."]
-script = ExtResource("2_i054q")

app/content/ui/menu/menu.tscn

@@ -258,7 +258,7 @@ icon = true
 toggleable = true
 
 [node name="TabsContent" type="Node3D" parent="AnimationContainer" node_paths=PackedStringArray("tabs")]
-transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.01, 0.00999999, 0)
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.01, 0.00999999, -0.01)
 script = ExtResource("6_7rntr")
 tabs = NodePath("../Tabs")
 

app/content/ui/onboarding/onboarding.tscn

@@ -63,12 +63,12 @@ autowrap_mode = 3
 width = 470.0
 
 [node name="GettingStartedButton" parent="." instance=ExtResource("3_hlpow")]
-transform = Transform3D(1, 0, 0, 0, -4.37114e-08, -1, 0, 1, -4.37114e-08, -0.05, -0.11, 0.001)
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, -0.05, -0.11, 0.001)
 label = "open_in_new"
 icon = true
 
 [node name="CloseButton" parent="." instance=ExtResource("3_hlpow")]
-transform = Transform3D(1, 0, 0, 0, -4.37114e-08, -1, 0, 1, -4.37114e-08, 0.21, -0.11, 0.001)
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.21, -0.11, 0.001)
 label = "done"
 icon = true
 

app/lib/stores/devices.gd

@@ -2,7 +2,13 @@ extends StoreClass
 const StoreClass = preload ("./store.gd")
 
 func _init():
-	self.state = R.state({})
+	self.state = R.state({
+		"devices": []
+	})
+
+	HomeApi.on_connect.connect(func():
+		self.state.devices=await HomeApi.get_devices()
+	)
 
 func clear():
 	pass