A!leys Galerie

# QuantumLeapPlayer.gd
extends CharacterBody2D

@export var quantum_states: Array[Node2D] = [] # Empty array for UI setup
@export var quantum_leap_distance: float = 300.0
@export var quantum_leap_duration: float = 0.3
@export var state_switch_cooldown: float = 0.5
@export var debug_visualization: bool = false

var current_quantum_state: int = 0
var quantum_cooldown: float = 0.0
var leap_animation: AnimationPlayer
var state_visualizer: Sprite2D
var is_grounded: bool = false
var gravity_scale: float = 2.0
var jump_force: float = -500.0
var acceleration: float = 1000.0
var friction: float = 500.0

func _ready():
	leap_animation = $LeapAnimation
	state_visualizer = $StateVisualizer
	# Set up quantum state connections
	for state_idx in quantum_states:
		state_idx.connect("body_entered", Callable(self, "_on_body_entered"))
	# Setup visual feedback
	state_visualizer.visible = debug_visualization

func _process(delta):
	# Update cooldown
	if quantum_cooldown > 0:
		quantum_cooldown -= delta
	# Handle quantum state switching based on physics
	is_grounded = _is_on_floor()
	_handle_quantum_switch(delta)
	_handle_movement(delta)

func _handle_quantum_switch(delta):
	# Check if player is on top of platform to activate next quantum state
	if is_grounded and quantum_cooldown <= 0 and quantum_states.size() > 1:
		var next_state = current_quantum_state + 1
		if next_state < quantum_states.size():
			var target_platform = quantum_states[current_quantum_state + 1]
			var distance_to_next = target_platform.global_position.distance_to(global_position)

			if distance_to_next < 50 and global_position.y > target_platform.global_position.y:
				QuantumLeap(next_state)
				return

	# Check if player is falling to activate previous quantum state
	if not is_grounded and quantum_cooldown <= 0 and quantum_states.size() > 1:
		var prev_state = current_quantum_state - 1
		if prev_state >= 0:
			var distance_to_prev = quantum_states[prev_state].global_position.distance_to(global_position)
			if distance_to_prev < 100:
				QuantumLeap(prev_state)
				return

func _handle_movement(delta):
	var input direction = Vector2(INPUT_RIGHT - INPUT_LEFT, -INPUT_UP)
	var velocity = velocity
	velocity.x = direction.x * acceleration
	apply_gravity()

	if Input.is_action_just_pressed("jump") and is_grounded:
		velocity.y = jump_force

	if abs(direction.x) > 0.1:
		quantum_cooldown = state_switch_cooldown
		velocity.x = direction.x * acceleration
	else:
		velocity.x = move_toward(velocity.x, 0, friction)

	move_and_slide(velocity)

	# Update animation based on movement
	if direction.x != 0:
		leap_animation.play("run")
		visible_on_left = (direction.x < 0)
	else:
		leap_animation.play("idle")

func _is_on_floor() -> bool:
	return is_on_floor() or (velocity.y >= 0 and is_on_floor() is false and velocity.y < 10)

func QuantumLeap(target_state: int):
	if target_state >= 0 and target_state < quantum_states.size() and current_quantum_state != target_state:
		var target_platform = quantum_states[target_state]
		var new_position = target_platform.global_position + Vector2(0, target_platform.rect_size.y)

		# Store current position for potential bounce-back
		leap_animation.play("leap")
		leap_animation.explore_animation()
		leap_animation.start("leap")

		# Update position with animation
		leap_animation.connect("animation_finished", Callable(self, "_leap_animation_finished").bind(target_state, global_position))

		current_quantum_state = target_state
		quantum_cooldown = state_switch_cooldown

		# Update visual state
		if debug_visualization:
			state_visualizer.position = global_position
			state_visualizer.visible = true

func _leap_animation_finished(state_idx: int, original_position: Vector2):
	global_position = quantum_states[state_idx].global_position + Vector2(0, quantum_states[state_idx].rect_size.y)
	velocity = Vector2(0, 0)
	quantum_cooldown = state_switch_cooldown

	# Bounce effect
	leap_animation.play("bounce")
	velocity.y = -200

	# Update visual state
	if debug_visualization:
		state_visualizer.visible = false

func _on_body_entered(body):
	if body.is_in_group("platform"):
		is_grounded = true
	else:
		is_grounded = false

# Helper function for movement toward
func move_toward(current: float, target: float, max_step: float) -> float:
	if abs(target - current) < max_step:
		return target
	var step = math.sign(target - current) * max_step
	return current + step

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Neon Glow Text Effect Generator</title>
  <style>
    :root {
      --neon-orange: #ff8c00;
      --neon-pink: #ff4785;
      --neon-teal: #00f294;
      --neon-purple: #6a0dad;
      --neon-glow: rgba(255, 255, 255, 0.3);
      --bg-dark: #0a0a1a;
      --bg-lines: linear-gradient(45deg, rgba(10, 10, 26, 0.1) 25%, transparent 25%),
                   linear-gradient(-45deg, rgba(10, 10, 26, 0.1) 25%, transparent 25%),
                   linear-gradient(45deg, transparent 75%, rgba(10, 10, 26, 0.1) 75%),
                   linear-gradient(-45deg, transparent 75%, rgba(10, 10, 26, 0.1) 75%);
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Courier New', monospace;
    }

    body {
      background-color: var(--bg-dark);
      color: var(--neon-white);
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      background-image: var(--bg-lines);
      background-size: 20px 20px;
      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
      animation: scanlines 0.1s linear infinite;
    }

    @keyframes scanlines {
      0% { background-image: var(--bg-lines); }
      50% { background-image: linear-gradient(45deg, rgba(10, 10, 26, 0.2) 25%, transparent 25%),
                   linear-gradient(-45deg, rgba(10, 10, 26, 0.2) 25%, transparent 25%),
                   linear-gradient(45deg, transparent 75%, rgba(10, 10, 26, 0.2) 75%),
                   linear-gradient(-45deg, transparent 75%, rgba(10, 10, 26, 0.2) 75%); }
      100% { background-image: var(--bg-lines); }
    }

    h1 {
      font-size: 2.5rem;
      margin-bottom: 1.5rem;
      text-align: center;
      background: linear-gradient(to right, var(--neon-orange), var(--neon-pink));
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      text-shadow: 0 0 5px var(--neon-glow);
    }

    .container {
      width: 90%;
      max-width: 800px;
      margin: 2rem auto;
      padding: 1.5rem;
      background-color: rgba(0, 0, 0, 0.3);
      border-radius: 8px;
      border: 1px solid rgba(10, 10, 26, 0.3);
      box-shadow: 0 0 20px var(--neon-glow);
      backdrop-filter: blur(5px);
    }

    .controls {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 1rem;
      margin-bottom: 2rem;
    }

    label {
      display: block;
      margin-bottom: 0.5rem;
      font-weight: bold;
      color: var(--neon-teal);
    }

    input, select {
      width: 100%;
      padding: 0.5rem;
      background-color: rgba(0, 0, 0, 0.2);
      border: 1px solid var(--neon-glow);
      border-radius: 4px;
      color: var(--neon-white);
      font-family: inherit;
    }

    input[type="range"] {
      width: 100%;
    }

    .preview-container {
      position: relative;
      margin: 2rem 0;
      text-align: center;
    }

    .preview-text {
      font-size: 4rem;
      font-weight: bold;
      color: var(--neon-white);
      text-shadow: 0 0 10px var(--neon-glow);
      text-transform: uppercase;
      letter-spacing: 2px;
      padding: 1rem;
      background-color: rgba(0, 0, 0, 0.1);
      border-radius: 4px;
    }

    .neon-glow {
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, var(--neon-glow) 0%, rgba(0, 0, 0, 0) 70%);
      animation: neon-pulse 2s infinite alternate;
      pointer-events: none;
    }

    @keyframes neon-pulse {
      0% { transform: scale(1); opacity: 0.3; }
      100% { transform: scale(1.1); opacity: 0.6; }
    }

    button {
      background: linear-gradient(to right, var(--neon-orange), var(--neon-pink));
      color: white;
      border: none;
      padding: 0.7rem 1.5rem;
      font-size: 1rem;
      cursor: pointer;
      border-radius: 4px;
      margin: 0.5rem 0;
      transition: all 0.3s ease;
      box-shadow: 0 0 10px var(--neon-glow);
    }

    button:hover {
      transform: translateY(-2px);
      box-shadow: 0 0 20px var(--neon-glow);
    }

    .random-btn {
      grid-column: span 2;
      justify-self: center;
      margin-top: 1rem;
    }

    .example-texts {
      display: flex;
      justify-content: center;
      gap: 1rem;
      margin: 1rem 0;
    }

    .example-btn {
      flex: 1;
      min-width: 120px;
    }

    .export-btn {
      grid-column: span 2;
      justify-self: center;
      margin-top: 1rem;
    }

    .export-container {
      margin-top: 1rem;
      text-align: center;
    }

    #export-output {
      margin-top: 1rem;
      padding: 0.5rem;
      background-color: rgba(0, 0, 0, 0.2);
      border-radius: 4px;
      word-break: break-all;
    }
  </style>
</head>
<body>
  <h1>Neon Glow Text Effect Generator</h1>

  <div class="container">
    <div class="controls">
      <div>
        <label for="text-input">Text</label>
        <input type="text" id="text-input" placeholder="Enter your text">
      </div>

      <div>
        <label for="font-select">Font</label>
        <select id="font-select">
          <option value="'Arial', sans-serif">Arial</option>
          <option value="'Courier New', monospace">Courier New</option>
          <option value="'Comic Sans MS', cursive">Comic Sans MS</option>
          <option value="'Impact', sans-serif">Impact</option>
          <option value="'Verdana', sans-serif">Verdana</option>
        </select>
      </div>

      <div>
        <label for="text-size">Size (px)</label>
        <input type="range" id="text-size" min="20" max="100" value="50">
        <span id="size-value">50</span>
      </div>

      <div>
        <label for="glow-color">Glow Color</label>
        <input type="color" id="glow-color" value="#ff8c00">
      </div>

      <div>
        <label for="glow-intensity">Glow Intensity</label>
        <input type="range" id="glow-intensity" min="0.1" max="1" step="0.1" value="0.5">
        <span id="intensity-value">0.5</span>
      </div>

      <div>
        <label for="animation-speed">Animation Speed</label>
        <input type="range" id="animation-speed" min="1" max="5" value="3">
        <span id="speed-value">3</span>
      </div>

      <div>
        <label for="text-transform">Text Transform</label>
        <select id="text-transform">
          <option value="none">None</option>
          <option value="uppercase">Uppercase</option>
          <option value="lowercase">Lowercase</option>
          <option value="capitalize">Capitalize</option>
        </select>
      </div>
    </div>

    <div class="example-texts">
      <button class="example-btn" data-text="NEON CYBER WORLD">Cyber World</button>
      <button class="example-btn" data-text="RETROWAVE SYNTH">Retrowave Synth</button>
      <button class="example-btn" data-text="8-BIT DREAM">8-Bit Dream</button>
      <button class="example-btn" data-text="QUANTUM GLOW">Quantum Glow</button>
    </div>

    <button class="random-btn" id="random-btn">Randomize All</button>

    <div class="preview-container">
      <div class="neon-glow" id="neon-glow"></div>
      <div class="preview-text" id="preview-text">NEON GLOW EFFECT</div>
    </div>

    <button class="export-btn" id="export-btn">Export as HTML</button>

    <div class="export-container">
      <button id="copy-btn">Copy HTML to Clipboard</button>
      <div id="export-output">Your generated HTML will appear here...</div>
    </div>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', function() {
      // DOM Elements
      const textInput = document.getElementById('text-input');
      const fontSelect = document.getElementById('font-select');
      const textSize = document.getElementById('text-size');
      const glowColor = document.getElementById('glow-color');
      const glowIntensity = document.getElementById('glow-intensity');
      const animationSpeed = document.getElementById('animation-speed');
      const textTransform = document.getElementById('text-transform');
      const previewText = document.getElementById('preview-text');
      const neonGlow = document.getElementById('neon-glow');
      const randomBtn = document.getElementById('random-btn');
      const exportBtn = document.getElementById('export-btn');
      const copyBtn = document.getElementById('copy-btn');
      const exportOutput = document.getElementById('export-output');

      // Example text buttons
      const exampleBtns = document.querySelectorAll('.example-btn');

      // Update size display
      textSize.addEventListener('input', function() {
        document.getElementById('size-value').textContent = this.value;
        updatePreview();
      });

      // Update intensity display
      glowIntensity.addEventListener('input', function() {
        document.getElementById('intensity-value').textContent = this.value;
        updatePreview();
      });

      // Update speed display
      animationSpeed.addEventListener('input', function() {
        document.getElementById('speed-value').textContent = this.value;
        updatePreview();
      });

      // Example text buttons
      exampleBtns.forEach(btn => {
        btn.addEventListener('click', function() {
          textInput.value = this.dataset.text;
          updatePreview();
        });
      });

      // Randomize all parameters
      randomBtn.addEventListener('click', function() {
        textInput.value = generateRandomText(5, 15);

        const fonts = ['Arial', 'Courier New', 'Comic Sans MS', 'Impact', 'Verdana'];
        fontSelect.value = fonts[Math.floor(Math.random() * fonts.length)];

        textSize.value = Math.floor(Math.random() * (100 - 20 + 1)) + 20;
        document.getElementById('size-value').textContent = textSize.value;

        const colors = ['#ff8c00', '#ff4785', '#00f294', '#6a0dad', '#00a2ff'];
        glowColor.value = colors[Math.floor(Math.random() * colors.length)];

        glowIntensity.value = (Math.random() * 0.9 + 0.1).toFixed(1);
        document.getElementById('intensity-value').textContent = glowIntensity.value;

        animationSpeed.value = Math.floor(Math.random() * (5 - 1 + 1)) + 1;
        document.getElementById('speed-value').textContent = animationSpeed.value;

        const transforms = ['none', 'uppercase', 'lowercase', 'capitalize'];
        textTransform.value = transforms[Math.floor(Math.random() * transforms.length)];

        updatePreview();
      });

      // Export as HTML
      exportBtn.addEventListener('click', function() {
        const htmlTemplate = `
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Neon Glow Text</title>
  <style>
    body {
      background-color: #0a0a1a;
      color: white;
      font-family: ${fontSelect.value};
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      margin: 0;
      overflow: hidden;
    }

    .neon-text {
      font-size: ${textSize.value}px;
      color: white;
      text-shadow: 0 0 10px ${getComputedStyle(glowColor).backgroundColor},
                   0 0 20px ${getComputedStyle(glowColor).backgroundColor};
      text-transform: ${textTransform.value};
      animation: neonPulse ${animationSpeed.value}s infinite alternate;
    }

    @keyframes neonPulse {
      0% { text-shadow: 0 0 10px ${getComputedStyle(glowColor).backgroundColor}, 0 0 20px ${getComputedStyle(glowColor).backgroundColor}; }
      100% { text-shadow: 0 0 20px ${getComputedStyle(glowColor).backgroundColor}, 0 0 30px ${getComputedStyle(glowColor).backgroundColor}; }
    }
  </style>
</head>
<body>
  <div class="neon-text">
    ${textInput.value}
  </div>
</body>
</html>
        `;

        exportOutput.textContent = htmlTemplate;
      });

      // Copy to clipboard
      copyBtn.addEventListener('click', function() {
        exportOutput.select();
        document.execCommand('copy');
        copyBtn.textContent = 'Copied!';
        setTimeout(() => {
          copyBtn.textContent = 'Copy HTML to Clipboard';
        }, 2000);
      });

      // Main update function
      function updatePreview() {
        previewText.textContent = textInput.value;
        previewText.style.fontFamily = fontSelect.value;
        previewText.style.fontSize = `${textSize.value}px`;
        previewText.style.textTransform = textTransform.value;

        const glowColorValue = getComputedStyle(glowColor).backgroundColor;
        previewText.style.textShadow = `0 0 10px ${glowColorValue}, 0 0 20px ${glowColorValue}`;

        const intensity = glowIntensity.value;
        neonGlow.style.background = `radial-gradient(circle, rgba(255, 255, 255, ${intensity}) 0%, rgba(0, 0, 0, 0) 70%)`;
        neonGlow.style.animationDuration = `${animationSpeed.value}s`;
      }

      // Helper function for random text
      function generateRandomText(min, max) {
        const length = Math.floor(Math.random() * (max - min + 1)) + min;
        const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
        let text = '';

        for (let i = 0; i < length; i++) {
          text += chars.charAt(Math.floor(Math.random() * chars.length));
        }

        return text;
      }

      // Initial setup
      updatePreview();
    });
  </script>
</body>
</html>
```