An ADVANCED effects menu for Drawaria.online Canvas, with many options and libraries!
Drawaria.online Canvas Effects:
**Effects and Functions**
The script provides several functions to create different effects:
1. `createText3D(text, options)`: Creates a 3D text object using Three.js. You can customize the text's appearance, position, and animation using the `options` object.
2. `createMovingText(text, options)`: Creates a moving text element using GSAP. You can customize the text's movement, rotation, and animation using the `options` object.
3. `createParticleExplosion(options)`: Creates a particle explosion effect using Matter.js. You can customize the explosion's appearance and behavior using the `options` object.
**Options and Customization**
Each effect function takes an `options` object that allows you to customize the effect's appearance and behavior. Here are some examples of options you can use:
* `text`: The text to display for the 3D text or moving text.
* `size`, `height`, `curveSegments`, `bevelEnabled`, `bevelThickness`, `bevelSize`, `bevelOffset`, `bevelSegments`: Options for the 3D text geometry.
* `color`, `x`, `y`, `z`, `rotationX`, `rotationY`, `rotationZ`: Options for the 3D text position and rotation.
* `animate`, `duration`, `toY`, `repeat`, `yoyo`, `ease`: Options for the 3D text animation.
* `x`, `y`, `toX`, `toY`, `rotation`, `repeat`, `yoyo`, `ease`: Options for the moving text movement and rotation.
* `removeOnComplete`: Option to remove the moving text element after the animation completes.
**Playing with the Script**
To play with the script, you can try the following:
1. Open the Drawaria.online platform and create a new canvas.
2. Open the browser console and paste the script into it.
3. Use the `createText3D` function to create a 3D text object. For example: `createText3D('Hello World', { size: 1, color: 0xff0000 });`
4. Use the `createMovingText` function to create a moving text element. For example: `createMovingText('Hello World', { x: 100, y: 100, color: 0xff0000, duration: 3, repeat: -1 });`
5. Use the `createParticleExplosion` function to create a particle explosion effect. For example: `createParticleExplosion({ x: 100, y: 100, color: 0xff0000, radius: 10 });`
Remember to customize the options to suit your needs and experiment with different values to achieve the desired effect.
**Tips and Variations**
Here are some tips and variations to help you get the most out of the script:
* Use the `initThreeJS` and `initMatterJS` functions to initialize the Three.js and Matter.js engines, respectively.
* Use the `animateThreeJS` function to animate the 3D text objects.
* Use the `getCanvas` function to get a reference to the Drawaria canvas.
* Experiment with different options and values to achieve unique effects.
* Try combining multiple effects to create complex animations.
* Use the browser console to debug and inspect the effects.
