generated from projects/testosmaximus
fix: update version to 1.2.0 in package.json and package-lock.json; refactor RickPanel to RickGamePanel with enhanced game mechanics
This commit is contained in:
parent
ea6619d7fa
commit
a897853426
4
source/package-lock.json
generated
4
source/package-lock.json
generated
@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "@funky-flask-test/funky-flask-test",
|
||||
"version": "1.1.4",
|
||||
"version": "1.2.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@funky-flask-test/funky-flask-test",
|
||||
"version": "1.1.4",
|
||||
"version": "1.2.0",
|
||||
"dependencies": {
|
||||
"nano-jsx": "^0.1.0"
|
||||
},
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@funky-flask-test/funky-flask-test",
|
||||
"version": "1.1.4",
|
||||
"version": "1.2.0",
|
||||
"type": "module",
|
||||
"main": "./dist/index.jsx",
|
||||
"exports": {
|
||||
|
||||
@ -1,28 +1,69 @@
|
||||
import { h, render, Component } from 'nano-jsx'
|
||||
|
||||
class RickPanel extends Component {
|
||||
count = 0
|
||||
stayFocused = true
|
||||
class RickGamePanel extends Component {
|
||||
canvas?: HTMLCanvasElement
|
||||
ctx?: CanvasRenderingContext2D
|
||||
x = 20
|
||||
y = 180
|
||||
vy = 0
|
||||
onGround = false
|
||||
gravity = 0.7
|
||||
jumpPower = -12
|
||||
isGameOver = false
|
||||
|
||||
handleClick = () => {
|
||||
this.count++
|
||||
frame() {
|
||||
if (!this.ctx || this.isGameOver) return
|
||||
|
||||
const win = window.open('https://www.youtube.com/watch?v=dQw4w9WgXcQ', '_blank')
|
||||
this.vy += this.gravity
|
||||
this.y += this.vy
|
||||
|
||||
if (!this.stayFocused && win) {
|
||||
win.focus()
|
||||
if (this.y >= 180) {
|
||||
this.y = 180
|
||||
this.vy = 0
|
||||
this.onGround = true
|
||||
}
|
||||
|
||||
this.update?.()
|
||||
if (this.x > 250 && this.y > 160) {
|
||||
// Loss condition (simple hazard)
|
||||
this.isGameOver = true
|
||||
window.open('https://www.youtube.com/watch?v=dQw4w9WgXcQ', '_blank')
|
||||
return
|
||||
}
|
||||
|
||||
this.draw()
|
||||
requestAnimationFrame(() => this.frame())
|
||||
}
|
||||
|
||||
handleCheckbox = (e: Event) => {
|
||||
const input = e.target as HTMLInputElement
|
||||
this.stayFocused = input.checked
|
||||
draw() {
|
||||
if (!this.ctx) return
|
||||
this.ctx.clearRect(0, 0, 300, 200)
|
||||
|
||||
// Ground
|
||||
this.ctx.fillStyle = '#ccc'
|
||||
this.ctx.fillRect(0, 190, 300, 10)
|
||||
|
||||
// Hazard block
|
||||
this.ctx.fillStyle = '#f33'
|
||||
this.ctx.fillRect(250, 180, 20, 10)
|
||||
|
||||
// Player
|
||||
this.ctx.fillStyle = '#007bff'
|
||||
this.ctx.fillRect(this.x, this.y, 10, 10)
|
||||
}
|
||||
|
||||
handleSansClick = () => {
|
||||
window.open('https://www.youtube.com/watch?v=ZcoqR9Bwx1Y', '_blank') // Megalovania 🎶
|
||||
handleJump = () => {
|
||||
if (this.onGround) {
|
||||
this.vy = this.jumpPower
|
||||
this.onGround = false
|
||||
}
|
||||
}
|
||||
|
||||
mounted() {
|
||||
this.canvas = this.ref('game') as HTMLCanvasElement
|
||||
this.ctx = this.canvas?.getContext('2d') || undefined
|
||||
|
||||
this.canvas?.addEventListener('click', this.handleJump)
|
||||
this.frame()
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -40,30 +81,20 @@ class RickPanel extends Component {
|
||||
"
|
||||
>
|
||||
<div style="margin-bottom: 10px;">
|
||||
<strong>🔥 Rickroll Panel</strong>
|
||||
<strong>🎮 Rickjump Game</strong>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onclick={this.handleClick}
|
||||
style="padding: 6px 12px; border: none; background: #007bff; color: white; border-radius: 5px; cursor: pointer;"
|
||||
>
|
||||
Rickroll Me ({this.count})
|
||||
</button>
|
||||
|
||||
<div style="margin-top: 10px; font-size: 0.9em;">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
onchange={this.handleCheckbox}
|
||||
checked={this.stayFocused}
|
||||
style="margin-right: 6px;"
|
||||
/>
|
||||
Stay in new tab
|
||||
</label>
|
||||
</div>
|
||||
<canvas
|
||||
width="300"
|
||||
height="200"
|
||||
ref="game"
|
||||
style="border: 1px solid #aaa; background: #fff;"
|
||||
></canvas>
|
||||
|
||||
<div
|
||||
onclick={this.handleSansClick}
|
||||
onclick={() =>
|
||||
window.open('https://www.youtube.com/watch?v=ZcoqR9Bwx1Y', '_blank')
|
||||
}
|
||||
style="margin-top: 14px; color: #666; font-size: 0.8em; cursor: pointer; text-decoration: underline;"
|
||||
>
|
||||
sans.
|
||||
@ -79,6 +110,6 @@ export function insertRickPanel(target: HTMLElement | string = document.body): v
|
||||
: target
|
||||
|
||||
if (container instanceof HTMLElement) {
|
||||
render(<RickPanel />, container)
|
||||
render(<RickGamePanel />, container)
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user