Changing the seed doesn't highlight the save button.

[kunal-mohta]

I think adding

document.getElementsByClassName('save-button')[0].classList.add('unsaved');

to the onNextSeed() and onPrevSeed() functions which can be seen here would do the job?

[stebanos]

It would but I think it would be more appropriate to provide a different visual cue when it's just the seed that has changed than when it's the code itself that has changed. As to what that visual cue should be (a different highlight color?), I'm not so sure.

[kunal-mohta]

Oh.. I think that is a matter for you to decide upon 😅 Though I feel it wouldn't be of much difference, because why would the user want to know if they are saving just after changing the seed?

Also, once decided upon the visual cue, it can be specified in a different CSS class and can be added to js as

document.getElementsByClassName('save-button')[0].classList.add('newClassName');

[stebanos]

Well, I think it's more important that the user notices the code needs saving than whether it's only the seed that has changed. But, if the user sees that it's only the seed that has changed, and they have an appealing variation, they can still choose if they want to save that particular variation or just let it be.

This is because saving creates a new version of the document every single time (with a new url).

[kunal-mohta]

Ohkay.. I think you are right. But then the highlight should be so significant that the user should notice the difference between saving with a code change and saving with just a seed change. Also you would need to mention it in the documentation. What do you think?

[stebanos]

Yes you are right :) Thanks.

[kunal-mohta]

On a side note, is there a documentation or something of the technology you are using for this project. I am trying to understand the code base.

[stebanos]

Sure. The code is pure ES6 javascript. To build the page layout we use preact: https://preactjs.com, which is a light-weight version of React: https://reactjs.org. To do the routing of the page addresses, we use preact-router: https://github.com/developit/preact-router. For our documentation we use markdown: https://github.com/chjj/marked. Then finally, to store the user's sketches, we use Firebase: https://firebase.google.com.

[kunal-mohta]

Okay, so the input micro-language that the user enters in the editors is manually handled?

[stebanos]

Yes, it's our own mini-language.

[kunal-mohta]

Wow! Cool. I am interested in this CLiPS' project for GSOC'18. Can you guide me?

[stebanos]

@tom-de-smedt @fdb Maybe it's best to contact us at info@emrg.be

[kunal-mohta]

Okay! Will do.

[TanviKumar]

Various sites have a small pop up that vanish after a few seconds giving users details like "Successfully Saved". I think this gives a suitable solution here as well. Once the user, clicks save, it need not have to fade or have a different highlight, a simple pop up near it will do.

[WVik]

One other way to do this is to change the shape of the 'Save' button momentarily. It can quickly pop out, like a 3D animation and go back to normal. This will catch the user's attention for sure. Something on the lines of this: https://codepen.io/WVik/pen/xYPwya

[stebanos]

Closing this issue for now because of #10. Thanks for all the input.