Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Share Sandcastle code using URL instead of gists. #6342

Merged
merged 4 commits into from Mar 17, 2018
Merged

Conversation

shunter
Copy link
Contributor

@shunter shunter commented Mar 16, 2018

Anonymous gist creation will be removed - #6232

Instead of publishing gists, when we share we now encode the code into
the URL fragment, in compressed Base64 encoded form. (see code comments
for the exact format)

Existing gists still load as before.

I also tried to fix some of the existing "Sandcastle Insanity" in the code, such as making src and label parameters truly optional (previously we desperately hardcoded src=Hello%20World.html&label=Showcases all over the place when building URLs), and copying the gist parameter to gistId because different sections of the code couldn't agree on what the variable name should be called.

Example URLs:

loading existing gists:

http://localhost:8080/Apps/Sandcastle/?gist=661c0a1fc177d1cc07fdd30c9be1f971

@mramato 's previous code query param still works:

http://localhost:8080/Apps/Sandcastle/?code=eyJjb2RlIjoiLy9JIHdhcyBhIHF1ZXJ5IHBhcmFtISFcbnZhciB2aWV3ZXIgPSBuZXcgQ2VzaXVtLlZpZXdlcignY2VzaXVtQ29udGFpbmVyJyk7IiwiaHRtbCI6IjxzdHlsZT5cbkBpbXBvcnQgdXJsKC4uL3RlbXBsYXRlcy9idWNrZXQuY3NzKTtcbjwvc3R5bGU+XG48ZGl2IGlkPVwiY2VzaXVtQ29udGFpbmVyXCIgY2xhc3M9XCJmdWxsU2l6ZVwiPjwvZGl2PlxuPGRpdiBpZD1cImxvYWRpbmdPdmVybGF5XCI+PGgxPkxvYWRpbmcuLi48L2gxPjwvZGl2PlxuPGRpdiBpZD1cInRvb2xiYXJcIj48L2Rpdj5cbiJ9

New format using fragment/hash:

http://localhost:8080/Apps/Sandcastle/#c=ZY/NCgIxDIRfJfSigrR4ti6CV0FQ9NRL7Ua3mG2l6a7o01sVwZ/cZjLfwCgFLoaMITNQtDXWcEixhe16CY3lxoTeJug9XjDBDAJeYIHsu1bunt5w4J5yUUqsD5gGo6kYC835SliZAOXmvj3HlKFLNJRSZWzPZDOy2nfuhFk65tHUBK3ekK59D76eGfFTbgQ4sszlc+iINv6GRlRalfwX9ljiw3HVYyJ7fUSaSbV8mVJKrYr8p3KMtLfpo/EO

fixes #6232

Anonymous gist creation will be removed - #6232

Instead of publishing gists, when we share we now encode the code into
the URL fragment, in compressed Base64 encoded form.  (see code comments
for the exact format)

Existing gists still load as before.
@shunter shunter requested a review from mramato March 16, 2018 19:41
@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

Our largest existing Sandcastle example loads correctly from a URL in Chrome and Firefox. Edge not so much - it seems to truncate the hash at around 2000 characters of original text. I won't paste the URL here because it's 28KB.

For extreme sharing, you can still create gists manually under your own account as long as they exactly match the expected format: two files in the gist, named exactly Cesium-Sandcastle.js and Cesium-Sandcastle.html.

) {
'use strict';

// attach clipboard handling to our Copy button
var clipboardjs = new ClipboardJS('.copyButton');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The styling of the copy button needs better styling to actually be 👍. As it is it's merely 😐.

It should look like the clipboard.js example:
image

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The fact that Sandcastle uses an ancient version of Dojo probably doesn't help. @emackey you are probably the only one that actually knows dojo well enough to improve this. Feel free to open a PR into master if you want to take a stab at fixing it.

One day we'll get to rewrite Sandcastle.

@mramato
Copy link
Member

mramato commented Mar 16, 2018

This cleanup was long overdue, I'm sure @emackey will be very happy to see it as I know the HelloWorld thing irked him.

Functionality all works as promised, does anyone else want to review this?

@mramato
Copy link
Member

mramato commented Mar 16, 2018

@mramato 's previous code query param still works:

Not sure what I as thinking when I used a query param instead of hash for this (though it's probably because I lazily copied/pasted the gist code.

@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

when I used a query param instead of hash for this

Well from recent experience, if you had tried to use the hash you would have immediately ran into all the problems I had to fix to make it work.

@mramato
Copy link
Member

mramato commented Mar 16, 2018

Like I said, lazy 😄

@lilleyse
Copy link
Contributor

Would it be possible to save the html code too? I liked how we did that with gists.

But maybe it's better to save space on the fragment length.

@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

It does save both the JS and HTML tab contents.

@lilleyse
Copy link
Contributor

Oh hm.. maybe I am doing something wrong? When I open the new link the html is the original html.

@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

Actually, it's supposed to be but it seems like it's not working. Pretty sure it saves the contents but it isn't loading them. I'll debug it.

@mramato
Copy link
Member

mramato commented Mar 16, 2018

Nice catch @lilleyse, thanks.

@mramato
Copy link
Member

mramato commented Mar 16, 2018

Random though, should we also update the browser url when you hit share? This way that url actually works?

Hell, we could just update it as you type (or on a timer) so that hitting F5 keeps your code.

The code path for loading a demo from the gallery was still being run
after we loaded from the URL, clobbering the URL data.  The gist
codepath only worked because the jsonp request made it so the gallery
demo load was then overwritten by the correct data.

Now we only parse and load from the demo if we actually need it.
@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

The HTML loading should be fixed. There was still some remaining Sandcastle Insanity left - the code to load from the gallery always ran after loading from gist, for no reason. It only worked for gists because the JSONP load happened async so the correct content from gist clobbered the gallery content. Loading from the URL is sync so it loaded from there then immediately clobbered it with the gallery content. (also @mramato's query string code had the same bug for the same reason)

@shunter
Copy link
Contributor Author

shunter commented Mar 16, 2018

Here's a gist with custom HTML:

http://cesium-dev.s3-website-us-east-1.amazonaws.com/cesium/sandcastleFromUrl/Apps/Sandcastle/?gist=de670c37e4f576aee0ff052eb49a03af

and the same content in the URL:

http://cesium-dev.s3-website-us-east-1.amazonaws.com/cesium/sandcastleFromUrl/Apps/Sandcastle/#c=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

@mramato
Copy link
Member

mramato commented Mar 17, 2018

Random though, should we also update the browser url when you hit share? This way that url actually works?

Hell, we could just update it as you type (or on a timer) so that hitting F5 keeps your code.

I realized this is a bad idea since Edge/IE have issues with very long urls.

@mramato
Copy link
Member

mramato commented Mar 17, 2018

Thanks @shunter

@ggetz please deploy this by Monday morning at the latest, we have until Monday 1pm before anonymous gists are shut down.

@mramato mramato merged commit 9a27b44 into master Mar 17, 2018
@mramato mramato deleted the sandcastleFromUrl branch March 17, 2018 14:14
@ggetz
Copy link
Contributor

ggetz commented Mar 19, 2018

Deployed!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Will Sandcastle gist creation break because of this?
4 participants