max-mapper / requirebin

write browser JavaScript programs using modules from NPM
requirebin.com
391 stars 80 forks source link

Alternative embed version #91

Closed mauriciopoppe closed 9 years ago

mauriciopoppe commented 9 years ago

90. The ui is kinda similar to the one used on the main page, to maintain compatibility with already embedded bins the new ui is accessed through requirebin.com/embed2?gist=..., tabs can be hidden using the tabs query param which is a comma delimited string with the visible tabs e.g. code,head,body,meta

Examples of new embedded urls:

// normal
requirebin.com/embed2?gist=maurizzzio/6c3976b49110acdfcbc1
// with all the tabs disabled
requirebin.com/embed2?gist=maurizzzio/6c3976b49110acdfcbc1&tabs=
// with the code tab enabled only
requirebin.com/embed2?gist=maurizzzio/6c3976b49110acdfcbc1&tabs=code

There's no way to get an embedv2 link as of now (it's like an easter egg) but it's a good start, what do you suggest guys?

embed-v2

mauriciopoppe commented 9 years ago

I'm gonna merge this since it doesn't have an impact on the existing embeds however let's discuss about making this the default option, is that ok with you guys? @maxogden @kumavis?

max-mapper commented 9 years ago

+1 from me. I think the share UI should show two copy paste fields, one with the top bar and one without. IMO default should be without top bar/tabs

On Wed, Apr 1, 2015 at 8:51 AM, Mauricio Poppe notifications@github.com wrote:

I'm gonna merge this since it doesn't have an impact on the existing embeds however let's discuss about making this the default option, is that ok with you guys?

— Reply to this email directly or view it on GitHub https://github.com/maxogden/requirebin/pull/91#issuecomment-88530408.

mauriciopoppe commented 9 years ago

something like this one for the default embed url?

screen shot 2015-04-01 at 12 12 01 pm

max-mapper commented 9 years ago

@maurizzzio I don't like the default top bar in the embed, IMO the users sketch should take up 100% of the height and width. The requirebin button should be a floating button in the top right

mauriciopoppe commented 9 years ago

yep I understand, however the badge icon on the existing embedded bins hid some content on the top right (for the image above the text was hidden), how about using an alternative way of showing the "edit on requirebin icon?" I'll come up with something later

mauriciopoppe commented 9 years ago

what about this?

embed-v2-plain

max-mapper commented 9 years ago

@maurizzzio Ah I understand now. Maybe a good tradeoff would be to make the requirebin icon semi-transparent by default? I don't wanna bikeshed too much though, I'm happy to go with whatever you think is simplest at this point

mauriciopoppe commented 9 years ago

I kinda like the one with transition from the top right, I'll update the PR then :)