Clever! Use of `i--` in loop for condition check wasn't intuitive at first. Apparently `i--` will return the current value of i (before decrementing).
Not intuitive? What do you think a post-decrement does do if not that?
An HTML/CSS/JS code editor in 230+ bytes
11–20 of 57 posts
Re: An HTML/CSS/JS code editor in 230+ bytes
#12Awesome. I love small things. In fact, I created a CSS library, min, that's 995 bytes - http://minfwk.com/ .
I like it small, but this also looks a bit cheap :\
Re: An HTML/CSS/JS code editor in 230+ bytes
#13Clever! Use of `i--` in loop for condition check wasn't intuitive at first. Apparently `i--` will return the current value of i (before decrementing).
i-- returns the value before, --i returns the value after decrementing
Re: An HTML/CSS/JS code editor in 230+ bytes
#14Copy & paste this in the address bar of your browser in order to use it as inline resource (it's data URI format):
data:text/html,%20for(i=4;i--;)e.innerHTML+=(i?'"+t1[v]+""+t2[v])\'>'
Re: An HTML/CSS/JS code editor in 230+ bytes
#15========== Wow! This topic is successful! You can also take a look at this 512b project that didn't live long on HN yesterday: A minesweeper game https://news.ycombinator.com/item?id=6853868 And my other code golfing projects: http://xem.github.io/?golfing ==========
Very impressive work, however, your "Keys Pressed" code could let a keypress position in the array on "true" if a key is pressed more than 1 second. I think you should set up a timeout to ensure a keypress position state is returned to false after the user interaction.
Re: An HTML/CSS/JS code editor in 230+ bytes
#16Clever! Use of `i--` in loop for condition check wasn't intuitive at first. Apparently `i--` will return the current value of i (before decrementing).
Not intuitive? What do you think a post-decrement does do if not that?
The clever part here is that it's defined as:
for(i=4;i--;)
instead of the more common (off by one?)
for(i=4; i > 0; i--) syntax
Re: An HTML/CSS/JS code editor in 230+ bytes
#17Copy & paste this in the address bar of your browser in order to use it as inline resource (it's data URI format): data:text/html,%20 for(i=4;i--;)e.innerHTML+=(i?' "+t1[v]+" "+t2[v])\'>' Taken from this: https://coderwall.com/p/lhsrcq
Thanks for mentioning this!
I also thought of this approach this morning, but didn't mention it because I thought people would just add the editor in their bookmarks.
Re: An HTML/CSS/JS code editor in 230+ bytes
#18Clever! Use of `i--` in loop for condition check wasn't intuitive at first. Apparently `i--` will return the current value of i (before decrementing).
There's pre-increment (++i), post-increment (i++), pre-decrement (--i), post-decrement (i--). The pre-ops operate on the variable and resolve to the new value. The post-ops resolve to the current value, and then operate on the variable.
Re: An HTML/CSS/JS code editor in 230+ bytes
#19Re: An HTML/CSS/JS code editor in 230+ bytes
#20Nice and you could probably make it save in under 512 bytes. Just persist everything to localStorage like the tiny spreadsheet http://jsfiddle.net/ondras/hYfN3/ Or save everything on the URL so it can be bookmarked too.
Yes, saving to URL would make this also shareable, so it would become real 'self contained Codepen' :]
I've made something in this manner recently: http://tinyurl.com/selfcontained-editable-datauri