1- // Toyota Car Widget - Part 1: Setup & Fake Data
1+ // ─── Toyota Car Widget by @rushhiii ───
2+ // Displays a modern dashboard for your car in all widget sizes
3+ // Large widget includes car image, others show text details
4+ // ──────────────────────────────────────
5+
6+ // ── 1. Config & Mock Data ──
27const widgetSize = config . widgetFamily || 'large'
38
4- // Placeholder data
59const carInfo = {
610 brand : "Toyota" ,
711 model : "Corolla" ,
812 year : 2020 ,
913 mileage : "23,456 miles" ,
1014 fuel : "Gasoline" ,
1115 status : "Locked" ,
12- imageURL : "https://cdn.motor1.com/images/mgl/VVVg1/s1/2020-toyota-corolla.jpg" , // Replace with custom image if needed
16+ imageURL : "https://cdn.motor1.com/images/mgl/VVVg1/s1/2020-toyota-corolla.jpg"
1317}
1418
15- // Theme config
19+ // ── 2. Theme ──
1620const backgroundColor = new Color ( "#111111" )
1721const textColor = Color . white ( )
1822const secondaryTextColor = new Color ( "#AAAAAA" )
1923const accentColor = new Color ( "#F5F5F5" )
2024
21- // Toyota Car Widget - Part 3: Large Layout
25+ // ── 3. Create Widget ──
26+ const widget = new ListWidget ( )
27+ widget . backgroundColor = backgroundColor
28+
29+ if ( widgetSize === "large" ) {
30+ await buildLargeWidget ( widget )
31+ } else {
32+ buildCompactWidget ( widget )
33+ }
34+
35+ Script . setWidget ( widget )
36+ if ( config . runsInApp ) await widget . presentMedium ( )
37+ Script . complete ( )
38+
39+ // ── 4. Large Widget Layout ──
2240async function buildLargeWidget ( widget ) {
2341 const imgReq = new Request ( carInfo . imageURL )
2442 const carImage = await imgReq . loadImage ( )
@@ -47,7 +65,7 @@ async function buildLargeWidget(widget) {
4765 addDetailsGrid ( widget )
4866}
4967
50- // Toyota Car Widget - Part 4: Detail Grid for Large Widget
68+ // ── 5. Detail Grid for Large ──
5169function addDetailsGrid ( widget ) {
5270 const grid = widget . addStack ( )
5371 grid . layoutVertically ( )
@@ -65,7 +83,21 @@ function addDetailsGrid(widget) {
6583 addDetailBlock ( row2 , "Status" , carInfo . status )
6684}
6785
68- // Toyota Car Widget - Part 6: Text-only layout for small/medium
86+ // ── 6. Detail Block Renderer ──
87+ function addDetailBlock ( stack , label , value ) {
88+ const block = stack . addStack ( )
89+ block . layoutVertically ( )
90+
91+ const lbl = block . addText ( label )
92+ lbl . font = Font . mediumSystemFont ( 11 )
93+ lbl . textColor = secondaryTextColor
94+
95+ const val = block . addText ( value . toString ( ) )
96+ val . font = Font . boldSystemFont ( 14 )
97+ val . textColor = textColor
98+ }
99+
100+ // ── 7. Compact Widget Layout (Small/Medium) ──
69101function buildCompactWidget ( widget ) {
70102 widget . setPadding ( 12 , 14 , 12 , 14 )
71103
@@ -80,44 +112,13 @@ function buildCompactWidget(widget) {
80112 addDetailText ( widget , "Status" , carInfo . status )
81113}
82114
83-
84- // Toyota Car Widget - Part 5: Add key-value detail box
85- function addDetailBlock ( stack , label , value ) {
86- const block = stack . addStack ( )
87- block . layoutVertically ( )
88-
89- const lbl = block . addText ( label )
90- lbl . font = Font . mediumSystemFont ( 11 )
91- lbl . textColor = secondaryTextColor
92-
93- const val = block . addText ( value . toString ( ) )
94- val . font = Font . boldSystemFont ( 14 )
95- val . textColor = textColor
96- }
97-
98- // Toyota Car Widget - Part 7: Add label/value to compact view
115+ // ── 8. Compact Text Row ──
99116function addDetailText ( widget , label , value ) {
100117 const row = widget . addStack ( )
101118 const lbl = row . addText ( `${ label } : ` )
102119 lbl . textColor = secondaryTextColor
103120 lbl . font = Font . mediumSystemFont ( 12 )
104121
105122 const val = row . addText ( value . toString ( ) )
106- val . textColor = textColor
107- val . font = Font . mediumSystemFont ( 12 )
108- }
109-
110- // Toyota Car Widget - Part 8: Auto-preview fallback
111- if ( config . runsInApp ) {
112- await widget . presentMedium ( )
113- }
114-
115- if ( widgetSize === "large" ) {
116- await buildLargeWidget ( widget )
117- } else {
118- buildCompactWidget ( widget )
119- }
123+ val . te
120124
121- Script . setWidget ( widget )
122- widget . presentPreview ( )
123- Script . complete ( )
0 commit comments