Implement ASCIIEffect

[vanruesc]

Description

Related: #683, #684

Implement an ASCIIEffect.

Tasks

• Create ASCIITexture.
• Create ASCIIEffect.
• Create ascii demo under special-effects.
• Add unit test.

Implementation Details

• The implementation from v6 can be ported mostly as-is.

[LucaArgentieri]

I’m working on it!

Do I have to wait for the effect in the package to be published before creating the demo/unit test?

[vanruesc]

Do I have to wait

No, you can go ahead 👌

FYI: there are some relevant notes in #600 for the PR workflow.

[LucaArgentieri]

@vanruesc How can I test the effect if I cannot import it in the demo?
Forgive me if I ask for banalities 🙇‍♂️

[vanruesc]

I'm not sure I understand the question 🤔

My approach would be like this:

1. Check out the v7 branch.
2. Create ASCIITexture in src/textures and ASCIIEffect in src/effects (using the v6 implementation as reference).
3. Update the index.js files in those folders to re-export the new classes.
4. Create ascii.js in manual/assets/js/src/demos/ (copying an existing demo such as color-depth).
5. Create a new manual demo page ascii.en.md in manual/content/demos/special-effects/.
6. Use npm run watch to build and run the manual locally.
7. ???
8. profit

It's also a good idea to run npm test before creating a PR to auto-fix formatting issues.

If anything is unclear feel free to ask 👍

[LucaArgentieri]

Hi @vanruesc,
I got this error:

• Could not find a valid mainImage or mainUv function (ASCIIEffect) , something seems to be broken in the ascii.frag

This test fail:

• ✘ [fail]: effects › ASCIIEffect › can be created and destroyed Error thrown in test
  
  ReferenceError {
    message: 'document is not defined',
  }
  
  

I also commented setSize because I can’t access this.resolution and don’t know if this function is useful.

Is it better for you to review the PR so that you understand the errors?

I hope I didn’t create problems and complicated the task

[vanruesc]

FYI: I've updated the demos to make them look a bit more interesting.

You can get some pretty cool visuals when blending the ASCII effect with the original image: