Closed Bug 1148743 Opened 6 years ago Closed 5 years ago
[meta] Add a "View in JSFiddle" link to live samples
V1: * A user in an approved group (admins? beta?) viewing a code sample on MDN will be able to open the code sample in a (tab? iframe?) that gives access to JSFiddle.net's editing/validation/testing features. * A product stakeholder will be able to learn how many viewers of the article on MDN used the feature. * A product stakeholder will be able to learn how long users of the features spent using it. V2: * (opened to more users) * An MDN contributor will be able to save their changes from JSFiddle into MDN's wiki. V3 & beyond: * (more use cases based on what we learn in V2)
What problems would this solve? =============================== This will let readers tinker with samples and experiment with them. It's also a first step toward eventually being able to edit samples in JSFiddle and save them back into MDN. Who would use this? =================== Everyone learning using MDN! What would users see? ===================== A button that will pop up a JSFiddle box with the CSS, HTML, and JS from the sample prepopulated. Maybe run the sample too automatically so the result is populated? What would users do? What would happen as a result? =================================================== Click the button and see the JSFiddle button. Is there anything else we should know? ====================================== A few pages that will be good tests: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Transformations https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Advanced_animations https://developer.mozilla.org/en-US/Apps/Design/Firefox_OS_building_blocks/Action_menu/2.0 https://developer.mozilla.org/en-US/Apps/Design/Firefox_OS_building_blocks/Dialog/2.0
Please use standard POST API for now http://doc.jsfiddle.net/api/post.html In the future (Monday) it's gonna be under this URL - https://jsfiddle.net/api/mdn/ Althought there are other fields I'd suggest to just use these: css - CSS code (base64 encoded) js - JS code (base64 encoded) html - HTML code (base64 encoded) This will create a standard HTML5 page with JS code after body
https://jsfiddle.net/api/mdn/ is ready for consumption
I've prepared https://jsfiddle.net/zalun/mk29ttc2/ for testing
We met during Hack on MDN in Berlin and charted a specific course for this feature that I want to maintain as a user story at the top of this bug.
User Story: (updated)
Summary: Add a "View in JSFiddle" link to live samples → [meta] Add a "View in JSFiddle" link to live samples
Commits pushed to master at https://github.com/mozilla/kuma https://github.com/mozilla/kuma/commit/1fe406aba7235905bdde64905962c9a4598f80ec Bug 1148743 - Open jsfiddle and CodePen for Samples https://github.com/mozilla/kuma/commit/e7db8a69d8610dbbb1cd4cfdf4b359d1e218c70a Merge pull request #3276 from darkwing/codepen-fiddle Bug 1148743 - Open jsfiddle and CodePen for Samples
Commits pushed to master at https://github.com/mozilla/kuma https://github.com/mozilla/kuma/commit/98acaf3e1a5f6750543964647d9078d2e98d5994 Bug 1148743 - Do cleanup on generated forms https://github.com/mozilla/kuma/commit/df4079242fbf9b5f03f08697c15de10d2fe4ef31 Merge pull request #3351 from darkwing/Bug-1148743 Bug 1148743 - Do cleanup on generated forms
Commits pushed to master at https://github.com/mozilla/kuma https://github.com/mozilla/kuma/commit/75acc5c985331996fb0870ec9f0b0bdfe71bb7a8 bug 1148743 - Enable JSFiddle https://github.com/mozilla/kuma/commit/ea8ee69ad177775b7ca0907c6d1567b9d42b9ae2 Merge pull request #3382 from darkwing/1148743-jsfiddle bug 1148743 - Enable JSFiddle
Status: NEW → RESOLVED
Closed: 5 years ago
Resolution: --- → FIXED
Oops, closed this based on the V1 user story. V2 hasn't been addressed but is tracked in bug 1156920.
Product: developer.mozilla.org → developer.mozilla.org Graveyard
You need to log in before you can comment on or make changes to this bug.