search

bgrins / ExpandingTextareas

jQuery plugin for elegant expanding textareas
http://bgrins.github.com/ExpandingTextareas/
MIT License
261 stars 73 forks source link

Swanky new demo page #43

Closed iamdanfox closed 10 years ago

iamdanfox commented 10 years ago

ExpandingTextareas' pre element is a really elegant solution to the expanding problem. I wanted to demonstrate how this works with a nice 3D demo. (It looks best in Chrome!)

screen shot 2014-04-18 at 19 05 18

Checkout a live demo

I appreciate that this PR isn't really an essential part of the plugin, but I thought I'd send it your way in case you were interested. Feedback and criticism welcome!

bgrins commented 10 years ago

Whoa, this is swanky! I'd love to have something showing it off like this as the home page. What do you think about adding a docs/index.html or something that has the same styling, but has most of the current home page content migrated there? cc:@domchristie, any thoughts?

bgrins commented 10 years ago

I'd also like if the main content was somehow visible without scrolling. Even if it still had some transparency, having something to indicate that there is more content on the page without requiring a scroll would be good.

iamdanfox commented 10 years ago

Yeah keeping the existing docs sounds like a good shout... I'll put up a separate PR for that one in a sec

domchristie commented 10 years ago

Nice work! It demonstrates the implementation very well.

A couple of minor points (and I’m nit-picking!):

There appears to be a bug when the textarea is in 3D mode and text is selected with the mouse. The default behaviour of arrow keys and backspacing appears to be broken (in Chrome, at least). Selecting with shift+arrow keys does not have the same effect.

The Toggle 3D button border-bottom remains grey on hover (should it go blue?)

Re: Docs. When contributing, I found it a bit of a chore to update both the index and the readme. Given that the API footprint is pretty small, would it be worth using just the readme for docs?

bgrins commented 10 years ago

Re: Docs. When contributing, I found it a bit of a chore to update both the index and the readme. Given that the API footprint is pretty small, would it be worth using just the readme for docs?

Good point, the docs should be in a single place only. I think the html docs are nice because you can see immediately what the setting does, so maybe we wipe out the README and just point to https://bgrins.github.io/ExpandingTextareas/docs instead. This isn't too strong of an opinion though, so if you think it would be better to maintain them in markdown let me know.

iamdanfox commented 10 years ago

Thanks for the feedback @domchristie, I've fixed the selection thing on the textarea. I honestly couldn't figure out why that bottom border wasn't blue, so I've ditched that entirely (even the Chrome inspector claimed that its computed style was blue).

http://iamdanfox.github.io/ExpandingTextareas/

I also switched in my own typing plugin so that the 3D twist happens just as the second line appears.

domchristie commented 10 years ago

Yes, that border bottom thing was very strange. The new version looks great.

Re: docs: I personally prefer docs to live in the README (fewer clicks for visiting developers to see the API, and no additional HTML/CSS to maintain). However, I feel it might be useful to display some implementation examples(?)

bgrins commented 10 years ago

I think we should also have a simple example on the home page in the Usage section that isn't 3D, just so people don't think that the plugin makes them 3D

bgrins commented 10 years ago

Re: docs: I personally prefer docs to live in the README (fewer clicks for visiting developers to see the API, and no additional HTML/CSS to maintain). However, I feel it might be useful to display some implementation examples(?)

OK, I've thought about this some more. Let's move the official docs to the README (the API is pretty simple anyway), then we can keep the "Example" section that is on the current home page since that is the part I think people care about. We could either append that onto this swanky new home page, or maybe onto an examples/index.html. I think we can roll with this change as-is, then add the examples in a new PR

bgrins commented 10 years ago

I'm going to make a couple of changes to the README and move the CSS into a separate file then merge this

iamdanfox commented 10 years ago

Sweet; let me know if there's anything you need from my end!

On Tuesday, 29 April 2014 at 00:01, Brian Grinstead wrote:

I'm going to make a couple of changes to the README and move the CSS into a separate file then merge this

— Reply to this email directly or view it on GitHub (https://github.com/bgrins/ExpandingTextareas/pull/43#issuecomment-41624900).

bgrins commented 10 years ago

OK, I have a version that is pretty much ready to go at https://github.com/bgrins/ExpandingTextareas/tree/new-home-page - I'm just trying to debug an issue I see in Firefox with the 3D transform: screenshot 2014-04-28 18 28 08

iamdanfox commented 10 years ago

That bug was killing me. Firefox handles 3D very happily on other sites.

On Tuesday, 29 April 2014 at 00:29, Brian Grinstead wrote:

OK, I have a version that is pretty much ready to go at https://github.com/bgrins/ExpandingTextareas/tree/new-home-page - I'm just trying to debug an issue I see in Firefox with the 3D transform:

— Reply to this email directly or view it on GitHub (https://github.com/bgrins/ExpandingTextareas/pull/43#issuecomment-41626843).

bgrins commented 10 years ago

@iamdanfox not sure if you will get notifications on the line notes I added here, but I was wanting you to take a look at a change I made for FF compat: https://github.com/bgrins/ExpandingTextareas/commit/ee557f67649bea20205d5d9c59773f242f27a78e.

bgrins commented 10 years ago

Yay, new page is live at https://bgrins.github.io/ExpandingTextareas/. Thanks @iamdanfox!