Code Sketch

// --- Mouse Hover Box Open + Letter-by-Letter Raksha Bandhan Animation ---
clear()
setBackground(Color(15, 10, 30))

// -------------------------------------------------------------
// ?? ???? ??????? ??????? ??? ???? (Change Sister Name Here):
val sisterName = "??????"
// -------------------------------------------------------------

var isOpened = false
var fireworkRadius = 0.0
var fireworkMax = 130.0

val fullMessage = "HAPPY RAKSHABANDHAN"
var currentCharIndex = 0
var animationTimer = 0

def drawMagicScene(): Unit = {
  erasePictures()

  if (!isOpened) {
    // --- 1. ??? ????? ????? ---
    val cardBox = Picture.rectangle(200, 140)
    cardBox.setFillColor(Color(220, 20, 60))
    cardBox.setPenColor(Color(255, 215, 0))
    cardBox.setPenThickness(2)
    cardBox.setPosition(-100, -80)
    draw(cardBox)

    // ???? (Ribbon)
    val ribbonV = Picture.rectangle(30, 140)
    ribbonV.setFillColor(Color(255, 215, 0))
    ribbonV.setPosition(-15, -80)
    draw(ribbonV)

    val ribbonH = Picture.rectangle(200, 30)
    ribbonH.setFillColor(Color(255, 215, 0))
    ribbonH.setPosition(-100, -20)
    draw(ribbonH)

    // ??????? ???? (Lid)
    val lid = Picture.rectangle(220, 40)
    lid.setFillColor(Color(180, 10, 40))
    lid.setPenColor(Color(255, 215, 0))
    lid.setPosition(-110, 60)
    draw(lid)

    // ?????
    val clickMsg = Picture.text("? ???? ????? ??????? ???? ?? ????? (Move Up)! ?", 15)
    clickMsg.setPenColor(Color(255, 215, 0))
    clickMsg.setPosition(-190, -140)
    draw(clickMsg)

  } else {
    // --- 2. ???????? (Fireworks) ---
    val particleCount = 18
    for (i <- 0 until particleCount) {
      val angle = (360.0 / particleCount) * i
      val rad = Math.toRadians(angle)
      val px = fireworkRadius * Math.cos(rad)
      val py = fireworkRadius * Math.sin(rad)

      val spark = Picture.circle(6)
      if (i % 3 == 0) spark.setFillColor(Color(255, 215, 0))
      else if (i % 3 == 1) spark.setFillColor(Color(255, 50, 150))
      else spark.setFillColor(Color(0, 230, 255))
      
      spark.setPosition(px, py + 30)
      draw(spark)
    }

    // ????? ????? ??????????
    val border = Picture.rectangle(520, 340)
    border.setPenColor(Color(255, 215, 0))
    border.setPenThickness(3)
    border.setFillColor(Color(35, 15, 50))
    border.setPosition(-260, -170)
    draw(border)

    // ?????? ????
    val stringLeft = Picture.rectangle(150, 5)
    stringLeft.setFillColor(Color(255, 50, 80))
    stringLeft.setPosition(-190, 40)
    draw(stringLeft)

    val stringRight = Picture.rectangle(150, 5)
    stringRight.setFillColor(Color(255, 50, 80))
    stringRight.setPosition(40, 40)
    draw(stringRight)

    // ????? ????
    val outerCircle = Picture.circle(35)
    outerCircle.setFillColor(Color(220, 20, 60))
    outerCircle.setPosition(0, 40)
    draw(outerCircle)

    val midCircle = Picture.circle(22)
    midCircle.setFillColor(Color(255, 215, 0))
    midCircle.setPosition(0, 40)
    draw(midCircle)

    val innerCircle = Picture.circle(10)
    innerCircle.setFillColor(Color(0, 180, 216))
    innerCircle.setPosition(0, 40)
    draw(innerCircle)

    // --- 3. ?????? ??????????? ????? (Letter by Letter Animation) ---
    val animatedText = fullMessage.substring(0, currentCharIndex)
    val mainTitle = Picture.text(s"? $animatedText ?", 22)
    mainTitle.setPenColor(Color(255, 215, 0))
    mainTitle.setPosition(-180, 110)
    draw(mainTitle)

    // ?? ????? ????? ????? ???? ??? ??????? ??? ?????
    if (currentCharIndex >= fullMessage.length) {
      val nameText = Picture.text(s"????? ????: $sisterName ?", 20)
      nameText.setPenColor(Color(255, 105, 180))
      nameText.setPosition(-110, -50)
      draw(nameText)

      val subMsg = Picture.text("???? ????? ??? ???? ????! ?", 14)
      subMsg.setPenColor(Color(240, 240, 240))
      subMsg.setPosition(-110, -90)
      draw(subMsg)
    }
  }
}

drawMagicScene()

// ????????? ???
animateWithState(0.0) { frame =>
  if (isOpened) {
    // ?. ?????????? ?????
    if (fireworkRadius < fireworkMax) {
      fireworkRadius += 5.0
    }

    // ?. ?????? ?????????? ?? ???????? ????? (Typing Animation)
    animationTimer += 1
    if (animationTimer % 6 == 0 && currentCharIndex < fullMessage.length) {
      currentCharIndex += 1
    }

    drawMagicScene()
  }
  frame + 1.0
}

// ???? ????? ????????? ?? (Y > 0) ???????? ????? ?????
onMouseMove { (x, y) =>
  if (!isOpened) {
    // ???? ????????? ??????? ??????? ?????
    if (x >= -110 && x <= 110 && y >= -50 && y <= 120) {
      isOpened = true
      fireworkRadius = 10.0
    }
  }
}