From 917c404a5a584b75c292ac446b3165bd04dd63f0 Mon Sep 17 00:00:00 2001 From: Michal Moskal Date: Sat, 31 Aug 2019 19:13:34 -0700 Subject: [PATCH 01/10] Add proof of concept cloud-compiled share page --- docfiles/leanscript.html | 148 +++++++++++++++++++++++++++++++++++++++ pxtarget.json | 3 +- 2 files changed, 150 insertions(+), 1 deletion(-) create mode 100644 docfiles/leanscript.html diff --git a/docfiles/leanscript.html b/docfiles/leanscript.html new file mode 100644 index 00000000000..68a8ef510d3 --- /dev/null +++ b/docfiles/leanscript.html @@ -0,0 +1,148 @@ + + + + + + @name@ + + + + + + + + + + + + + + + + + + + +
+
+
+ +
+
+ + + +
+ + + + + \ No newline at end of file diff --git a/pxtarget.json b/pxtarget.json index 7cc428f5d17..8f302c8f1f2 100644 --- a/pxtarget.json +++ b/pxtarget.json @@ -266,7 +266,8 @@ "autoRunLight": false, "emptyRunCode": "pxsim.pxtcore.updateScreen(new pxsim.RefImage(160, 120, 4))", "aspectRatio": 0.85, - "dynamicBoardDefinition": true + "dynamicBoardDefinition": true, + "leanShare": true }, "appTheme": { "logoUrl": "https://github.com/Microsoft/pxt-arcade", From 0189d8fed45fd9fa4fca09e988e1903452b9a005 Mon Sep 17 00:00:00 2001 From: Michal Moskal Date: Sun, 1 Sep 2019 11:13:05 -0700 Subject: [PATCH 02/10] Add splash screen --- docfiles/leanscript.html | 128 +++++++++++++++++++++++++++++++++++++-- 1 file changed, 123 insertions(+), 5 deletions(-) diff --git a/docfiles/leanscript.html b/docfiles/leanscript.html index 68a8ef510d3..09321c4eb37 100644 --- a/docfiles/leanscript.html +++ b/docfiles/leanscript.html @@ -45,16 +45,106 @@ width: 100%; height: 100%; } + + #splash { + text-align: center; + position: relative; + } + + #loading { + background: rgba(255, 255, 255, 0.9); + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + display: none; + } + + #loading h2 { + font-size: 3em; + margin: 5em 0; + } + + [data-state="loading"] #loading { + display: block; + } + + [data-state="run"] #splash { + display: none; + } + + #wrap { + display: none; + } + + [data-state="run"] #wrap { + display: block; + } + + #play { + border: none; + background: #f00; + color: white; + font-size: 2em; + padding: 0.2em 1em; + margin: 1em; + } + + #thumb { + width: 320px; + height: 240px; + image-rendering: pixelated; + } - +
+
+

@name@

+

@description@

+
+ +
+
+ +
+
+ Edit code +
+
+

+ The content above is provided by a user, and is not endorsed by Microsoft. + Report abuse if you think it's not + appropriate. +

+
+ +
+
+ +
+ + Privacy & Cookies + + Terms Of Use + Trademarks +
© 2019 Microsoft
+
+
+
+
+

loading...

+
+
-
-
- - - -
- - + + +
+
+

@name@

+

@description@

+
+ +
+
+ +
+
+ Edit code +
+
+ Read code +
+
+

+ The content above is provided by a user, and is not endorsed by Microsoft. + Report abuse if you think it's not + appropriate. +

+
+ +
+
+ +
+ + Privacy & Cookies + + Terms Of Use + Trademarks +
© 2019 Microsoft
+
+
+
+
+

loading...

+
+
+
+
+ +
+
+ + + +
+ + \ No newline at end of file From d32df4ab72d44fb9ad63e2da24674d3bd3b44971 Mon Sep 17 00:00:00 2001 From: Michal Moskal Date: Mon, 2 Sep 2019 19:39:51 -0700 Subject: [PATCH 08/10] Add report abuse modal --- docfiles/leanscript.html | 89 +++++++++++++++++++++++++++++++------- docs/static/leanscript.css | 19 +++++++- 2 files changed, 91 insertions(+), 17 deletions(-) diff --git a/docfiles/leanscript.html b/docfiles/leanscript.html index 5c8b80c6745..f881d4cd314 100644 --- a/docfiles/leanscript.html +++ b/docfiles/leanscript.html @@ -63,6 +63,20 @@

@name@

+ +
+

Report abuse

+
+ + + +
+ + +
+
+
+

loading...

@@ -85,15 +99,28 @@

loading...

var started = false; function fetchCode() { + sendReq("@cdnUrl@/api/@id@/js?v=@simversion@", null, function (c, status) { + if (status != 200) + return; + code = c; + startSim(); + }) + } + + function sendReq(url, data, cb) { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function () { - if (xhttp.readyState == 4 && xhttp.status == 200) { - code = xhttp.responseText; - startSim(); + if (xhttp.readyState == 4) { + cb(xhttp.status == 200, xhttp.responseText) } }; - xhttp.open("GET", "@cdnUrl@/api/@id@/js?v=@simversion@", true); - xhttp.send(); + xhttp.open(data ? "POST" : "GET", url, true); + if (data) { + xhttp.setRequestHeader("Content-Type", "application/json"); + xhttp.send(JSON.stringify(data)) + } else { + xhttp.send(); + } } function startSim() { @@ -144,18 +171,50 @@

loading...

// document.location.hash = "#" + st } - function setPlay(id) { - document.getElementById(id).addEventListener("click", function () { - started = true; - setState("loading"); - // for testing "loading..." screen - //setTimeout(startSim, 1000); - startSim(); - }) + function setClick(id, fn) { + document.getElementById(id).addEventListener("click", fn) } - setPlay("play"); - setPlay("thumb"); + function playBtn() { + started = true; + setState("loading"); + // for testing "loading..." screen + //setTimeout(startSim, 1000); + startSim(); + } + + setClick("play", playBtn); + setClick("thumb", playBtn); + + var abusemodal = document.getElementById("abusemodal"); + + function abuseMsg(msg) { + document.getElementById("abusecontent").textContent = msg; + } + var submitting = false; + setClick("abuse", function () { + abusemodal.style.display = "block"; + }) + setClick("abuse-cancel", function () { + abusemodal.style.display = "none"; + }) + setClick("abuse-submit", function () { + var reason = document.getElementById("abusetext").value; + if (!reason || reason.length < 5) { + alert("You have to give a reason.") + return; + } + abuseMsg("Submitting..."); + sendReq("/api/@id@/abusereports", { + text: reason + }, function (resp, code) { + if (code == 200) { + abuseMsg("Thank you for helping keep Microsoft MakeCode a friendly place!") + } else { + abuseMsg("Submission failed: " + resp) + } + }) + }) window.addEventListener('message', function (ev) { var d = ev.data diff --git a/docs/static/leanscript.css b/docs/static/leanscript.css index 7d74c099619..af0c3e565dd 100644 --- a/docs/static/leanscript.css +++ b/docs/static/leanscript.css @@ -52,8 +52,8 @@ body { position: relative; } -#loading { - background: rgba(255, 255, 255, 0.9); +#loading, #abusemodal { + background: rgba(255, 255, 255, 0.95); position: absolute; left: 0; right: 0; @@ -67,6 +67,21 @@ body { margin: 5em 0; } +#abusemodal { + text-align: center; + padding: 3em 0; +} + +#abusemodal label { + display: block; + margin: 0.5em 0; +} + +#abusemodal textarea { + width: 30em; + height: 5em; +} + [data-state="loading"] #loading { display: block; } From 180698cafe5f9aecaca30d4d494bc36b0162680b Mon Sep 17 00:00:00 2001 From: Michal Moskal Date: Mon, 2 Sep 2019 19:43:41 -0700 Subject: [PATCH 09/10] http req fix --- docfiles/leanscript.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docfiles/leanscript.html b/docfiles/leanscript.html index f881d4cd314..bc40521d830 100644 --- a/docfiles/leanscript.html +++ b/docfiles/leanscript.html @@ -111,7 +111,7 @@

loading...

var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function () { if (xhttp.readyState == 4) { - cb(xhttp.status == 200, xhttp.responseText) + cb(xhttp.responseText, xhttp.status) } }; xhttp.open(data ? "POST" : "GET", url, true); From e32a9db530bb81aafbc2a8d2efabb3b0933154f6 Mon Sep 17 00:00:00 2001 From: Michal Moskal Date: Wed, 4 Sep 2019 16:24:21 -0700 Subject: [PATCH 10/10] Delay-load sim iframe --- docfiles/leanscript.html | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docfiles/leanscript.html b/docfiles/leanscript.html index bc40521d830..325ac38b729 100644 --- a/docfiles/leanscript.html +++ b/docfiles/leanscript.html @@ -84,7 +84,7 @@

loading...

@@ -241,6 +241,9 @@

loading...

console.log(d) } }, false); + + // only load the iframe once we've set up the message listener + document.getElementById("simframe").setAttribute("src", "/sim/simulator.html"); })()