Code Sketch
Bixuu02
Category: Programming
// ============================================================
// TMKOC FAMILIES & CHARACTERS GUIDE 2026 BY BIXUU
// ============================================================
cleari()
originBottomLeft()
// ============================================================
// APP STATES & VARIABLES
// ============================================================
var screen = 0 // 0: Welcome, 1: Main Families List, 2: Family Members View, 3: Member Details
var selectedFamilyHead = ""
var selectedMember = ""
// Background Star Animation Class
class Star(val x: Double, val y: Double, val size: Double) {
var phase = randomDouble(6.28)
def step() { phase += 0.04 }
def view(canvas: CanvasDraw) {
val brightness = 150 + (math.sin(phase) * 80).toInt
canvas.noStroke()
canvas.fill(200, 220, 255, brightness)
canvas.ellipse(x, y, size, size)
}
}
val stars = ArrayBuffer.empty[Star]
for (i <- 0 until 50) {
stars.append(new Star(randomDouble(cwidth), randomDouble(cheight), 1.0 + randomDouble(2.5)))
}
// ============================================================
// MAIN FAMILIES / CHARACTERS HEADS
// ============================================================
val familyHeads = Array(
"Jethalal Gada Family",
"Atmaram Bhide Family",
"Taarak Mehta Family",
"Dr. Hansraj Hathi Family",
"Krishnan Subramaniam Iyer",
"Patrakar Popatlal Pandey",
"Roshan Singh Sodhi Family",
"Abdul (Gokuldham Soda Shop)"
)
// ============================================================
// FAMILY MEMBERS MAPPING
// ============================================================
def getFamilyMembers(head: String): Array[String] = {
head match {
case "Jethalal Gada Family" => Array("Jethalal Gada (Dilip Joshi)", "Dayaben Gada (Disha Vakani)", "Tipendra 'Tapu' Gada", "Champaklal Gada (Dada Ji)")
case "Atmaram Bhide Family" => Array("Atmaram Bhide (Secretary)", "Madhavi Bhide (Aachari)", "Sonalika 'Sonu' Bhide", "Sakharam (The Scooter)")
case "Taarak Mehta Family" => Array("Taarak Mehta (Fire Brigade)", "Anjali Mehta (Diet Expert)")
case "Dr. Hansraj Hathi Family" => Array("Dr. Hansraj Hathi", "Komal Hathi", "Goli Hathi (Kush Shah)")
case "Krishnan Subramaniam Iyer" => Array("Krishnan Iyer (Scientist)", "Babita Iyer (Munmun Dutta)")
case "Patrakar Popatlal Pandey" => Array("Popatlal Pandey (Reporter)", "Durgawati (Future Bride in 2026!)", "Chhata (Umbrella)")
case "Roshan Singh Sodhi Family" => Array("Roshan Singh Sodhi", "Roshan Bhabhi", "Gogi Sodhi")
case _ => Array("Abdul (The Sole Backbone)", "Gokuldham Soda Shop Special")
}
}
// Detailed Information for Individual Member
def getMemberDetails(member: String): Array[String] = {
member match {
case "Jethalal Gada (Dilip Joshi)" => Array("Role: Electronics Shop Owner", "Real Name: Dilip Joshi", "2026 Status: Gokuldham's Star Troublemaker", "Key Trait: Afraid of Champaklal")
case "Dayaben Gada (Disha Vakani)" => Array("Role: Garba Queen & Homemaker", "Real Name: Disha Vakani", "2026 Status: Cultural Icon of Gokuldham", "Key Trait: Iconic Jethiya! Calling")
case "Tipendra 'Tapu' Gada" => Array("Role: Tapu Sena Leader", "Real Name: Nitish Bhardwaj / Raj Anadkat", "2026 Status: College Graduate & Entrepreneur", "Key Trait: Mastermind of Mischief")
case "Champaklal Gada (Dada Ji)" => Array("Role: Moral Guardian & Elder", "Real Name: Amit Bhatt", "2026 Status: Respected Society Senior", "Key Trait: Gandhian Principles")
case "Atmaram Bhide (Secretary)" => Array("Role: Tution Teacher & Secretary", "Real Name: Mandar Chandwadkar", "2026 Status: Ekmev Secretary of Society", "Key Trait: Proud of Sakharam Scooter")
case "Madhavi Bhide (Aachari)" => Array("Role: Pickles & Papad Business", "Real Name: Sonalika Joshi", "2026 Status: Independent Woman Entrepreneur", "Key Trait: Supports Bhide's Budget")
case "Sonalika 'Sonu' Bhide" => Array("Role: Brilliant Student / Tapu Sena", "Real Name: Jheel Mehta / Nidhi Bhanushali / Palak Sindhwani", "2026 Status: Higher Studies / Tech Professional", "Key Trait: Sensible Voice of Youth")
case "Krishnan Iyer (Scientist)" => Array("Role: Senior Scientist", "Real Name: Tanuj Mahashabde", "2026 Status: Leading Research Scientist", "Key Trait: Babita Ji's Caring Husband")
case "Babita Iyer (Munmun Dutta)" => Array("Role: Corporate Professional", "Real Name: Munmun Dutta", "2026 Status: Style Icon & Fashion Lead", "Key Trait: Jethalal's Ultimate Inspiration")
case "Popatlal Pandey (Reporter)" => Array("Role: Senior Journalist at Aakashvani", "Real Name: Shyam Pathak", "2026 Status: Ace Reporter & Bachelor Icon", "Key Trait: Duniya Hila Dunga!")
case "Abdul (The Sole Backbone)" => Array("Role: Soda Shop Owner & Caretaker", "Real Name: Sharad Sankla", "2026 Status: Heart of Gokuldham Society", "Key Trait: First to know every secret")
case _ => Array("Role: Gokuldham Resident Member", "Real Name: Renowned Television Actor", "2026 Status: Bringing Smiles to Millions", "Key Trait: Unity in Diversity")
}
}
// ============================================================
// SCREENS UI LOGIC
// ============================================================
def drawWelcomeScreen(canvas: CanvasDraw) {
canvas.background(20, 15, 35)
repeatFor(stars) { s => s.view(canvas) }
canvas.fill(255, 252, 245)
canvas.stroke(255, 140, 0)
canvas.strokeWeight(4)
canvas.rect(cwidth/2 - 250, cheight/2 - 190, 500, 380)
canvas.fill(220, 100, 0)
canvas.text("TMKOC FAMILIES & MEMBERS GUIDE 2026", cwidth/2 - 165, cheight/2 + 150)
canvas.fill(40, 40, 40)
canvas.text("Welcome to Gokuldham Society!", cwidth/2 - 220, cheight/2 + 110)
canvas.text("Click to explore Jethalal, Bhide, Iyer, Abdul,", cwidth/2 - 220, cheight/2 + 80)
canvas.text("Popatlal and their family members with real", cwidth/2 - 220, cheight/2 + 55)
canvas.text("actor names and 2026 updated statuses.", cwidth/2 - 220, cheight/2 + 30)
canvas.fill(0, 120, 0)
canvas.text("Click below to start exploring families.", cwidth/2 - 220, cheight/2 - 10)
canvas.fill(255, 140, 0)
canvas.noStroke()
canvas.rect(cwidth/2 - 150, cheight/2 - 110, 300, 50)
canvas.fill(255, 255, 255)
canvas.text("EXPLORE FAMILIES", cwidth/2 - 75, cheight/2 - 80)
}
def drawFamiliesListScreen(canvas: CanvasDraw) {
canvas.background(15, 25, 40)
repeatFor(stars) { s => s.view(canvas) }
canvas.fill(255, 215, 0)
canvas.text("SELECT A FAMILY / CHARACTER HEAD", cwidth/2 - 145, cheight - 30)
for (i <- 0 until familyHeads.length) {
val col = i % 2
val row = i / 2
val bx = if (col == 0) cwidth/2 - 235 else cwidth/2 + 10
val by = (cheight/2 + 130) - (row * 52)
canvas.fill(40, 80, 140)
canvas.stroke(255, 165, 0)
canvas.strokeWeight(2)
canvas.rect(bx, by, 225, 42)
canvas.fill(255, 255, 255)
canvas.noStroke()
canvas.text((i + 1) + ". " + familyHeads(i), bx + 10, by + 26)
}
canvas.fill(100, 100, 100)
canvas.noStroke()
canvas.rect(cwidth/2 - 80, 12, 160, 28)
canvas.fill(255, 255, 255)
canvas.text("BACK TO HOME", cwidth/2 - 45, 28)
}
def drawMembersScreen(canvas: CanvasDraw) {
canvas.background(15, 25, 40)
repeatFor(stars) { s => s.view(canvas) }
canvas.fill(255, 215, 0)
canvas.text(selectedFamilyHead + " - MEMBERS", cwidth/2 - 120, cheight - 30)
val members = getFamilyMembers(selectedFamilyHead)
for (i <- 0 until members.length) {
val my = (cheight/2 + 100) - (i * 50)
canvas.fill(50, 100, 80)
canvas.stroke(255, 215, 0)
canvas.strokeWeight(2)
canvas.rect(cwidth/2 - 220, my, 440, 38)
canvas.fill(255, 255, 255)
canvas.noStroke()
canvas.text((i + 1) + ". " + members(i), cwidth/2 - 200, my + 24)
}
canvas.fill(150, 50, 50)
canvas.rect(cwidth/2 - 110, 12, 220, 30)
canvas.fill(255, 255, 255)
canvas.text("BACK TO FAMILIES", cwidth/2 - 65, 28)
}
def drawMemberDetailsScreen(canvas: CanvasDraw) {
canvas.background(25, 15, 35)
repeatFor(stars) { s => s.view(canvas) }
canvas.fill(255, 215, 0)
canvas.text("MEMBER PROFILE: " + selectedMember, cwidth/2 - 130, cheight - 35)
canvas.fill(250, 248, 235)
canvas.stroke(255, 140, 0)
canvas.strokeWeight(3)
canvas.rect(cwidth/2 - 240, cheight/2 - 140, 480, 260)
canvas.fill(30, 30, 30)
canvas.noStroke()
val details = getMemberDetails(selectedMember)
for (i <- 0 until details.length) {
val dy = (cheight/2 + 65) - (i * 38)
canvas.fill(150, 60, 0)
canvas.text(details(i), cwidth/2 - 210, dy)
}
canvas.fill(0, 120, 150)
canvas.rect(cwidth/2 - 110, 15, 220, 32)
canvas.fill(255, 255, 255)
canvas.text("BACK TO MEMBERS", cwidth/2 - 65, 31)
}
// ============================================================
// CLICK HANDLER LOGIC
// ============================================================
def handleClick(x: Double, y: Double) {
if (screen == 0) {
if (x >= cwidth/2 - 150 && x <= cwidth/2 + 150 && y >= cheight/2 - 110 && y <= cheight/2 - 60) {
screen = 1
}
}
else if (screen == 1) {
if (x >= cwidth/2 - 80 && x <= cwidth/2 + 80 && y >= 12 && y <= 42) {
screen = 0
} else {
for (i <- 0 until familyHeads.length) {
val col = i % 2
val row = i / 2
val bx = if (col == 0) cwidth/2 - 235 else cwidth/2 + 10
val by = (cheight/2 + 130) - (row * 52)
if (x >= bx && x <= bx + 225 && y >= by && y <= by + 42) {
selectedFamilyHead = familyHeads(i)
screen = 2
}
}
}
}
else if (screen == 2) {
if (x >= cwidth/2 - 110 && x <= cwidth/2 + 110 && y >= 12 && y <= 42) {
screen = 1
} else {
val members = getFamilyMembers(selectedFamilyHead)
for (i <- 0 until members.length) {
val my = (cheight/2 + 100) - (i * 50)
if (x >= cwidth/2 - 220 && x <= cwidth/2 + 220 && y >= my && y <= my + 38) {
selectedMember = members(i)
screen = 3
}
}
}
}
else if (screen == 3) {
if (x >= cwidth/2 - 110 && x <= cwidth/2 + 110 && y >= 15 && y <= 47) {
screen = 2
}
}
}
onMouseClick { (x, y) => handleClick(x, y) }
// ============================================================
// MAIN ANIMATION LOOP
// ============================================================
animateWithCanvasDraw { canvas =>
repeatFor(stars) { s => s.step() }
if (screen == 0) drawWelcomeScreen(canvas)
else if (screen == 1) drawFamiliesListScreen(canvas)
else if (screen == 2) drawMembersScreen(canvas)
else if (screen == 3) drawMemberDetailsScreen(canvas)
}
