pxt-core 8.3.1 → 8.3.3

package/react-common/components/share/ThumbnailRecorder.tsx

@@ -79,7 +79,16 @@ export const ThumbnailRecorder = (props: ThumbnailRecorderProps) => {
 
     const screenshotLabel = lf("Screenshot ({0})", targetTheme.simScreenshotKey);
     const startRecordingLabel = lf("Record ({0})", targetTheme.simGifKey);
-    const stopRecordingLabel = lf("Stop recording ({0})", targetTheme.simGifKey) ;
+    const stopRecordingLabel = lf("Stop recording ({0})", targetTheme.simGifKey);
+    const renderingLabel = lf("Rendering...");
+
+    let recordLabel: string;
+
+    switch (recorderState) {
+        case "default": recordLabel = startRecordingLabel; break;
+        case "recording": recordLabel = stopRecordingLabel; break;
+        case "rendering": recordLabel = renderingLabel; break;
+    }
 
     const thumbnailLabel = uri ? lf("New Thumbnail") : lf("Current Thumbnail");
     const classes = classList(
@@ -95,14 +104,17 @@ export const ThumbnailRecorder = (props: ThumbnailRecorderProps) => {
                 </div>
                 <div className="gif-recorder">
                     <div className="gif-recorder-actions">
+                        {recorderState === "default" &&
+                            <Button className="teal inverted"
+                                title={screenshotLabel}
+                                label={screenshotLabel}
+                                leftIcon="fas fa-camera"
+                                onClick={handleScreenshotClick} />
+                        }
                         <Button className="teal inverted"
-                            title={screenshotLabel}
-                            label={screenshotLabel}
-                            leftIcon="fas fa-camera"
-                            onClick={handleScreenshotClick} />
-                        <Button className="teal inverted"
-                            title={recorderState === "recording" ? stopRecordingLabel : startRecordingLabel}
-                            label={recorderState === "recording" ? stopRecordingLabel : startRecordingLabel}
+                            disabled={recorderState === "rendering"}
+                            title={recordLabel}
+                            label={recordLabel}
                             leftIcon={`fas fa-${recorderState === "recording" ? "square" : "circle"}`}
                             onClick={handleRecordClick} />
                         <div className="spacer mobile-only" />
@@ -124,24 +136,33 @@ export const ThumbnailRecorder = (props: ThumbnailRecorderProps) => {
                                 label={lf("Try again?")}
                                 onClick={() => setUri(undefined)} />
                         </div>
-                        <div className="thumbnail-image">
-                            {(uri || initialUri)
+                        <div className="project-share-thumbnail">
+                            {recorderState !== "default" &&
+                                <div className="project-thumbnail-placeholder">
+                                    <div className="common-spinner" />
+                                    <div className="project-thumbnail-label">
+                                        {recorderState === "recording" ? lf("Recording...") : lf("Rendering GIF...")}
+                                    </div>
+                                </div>
+                            }
+                            { recorderState === "default" &&
+                                ((uri || initialUri)
                                 ? <img src={uri || initialUri} />
-                                : <div className="thumbnail-placeholder" />
+                                : <div className="thumbnail-placeholder" />)
                             }
                         </div>
                     </div>
                 </div>
                 <div className="thumbnail-actions">
-                    {uri &&
+                    <Button title={lf("Cancel")}
+                        label={lf("Cancel")}
+                        onClick={onCancel} />
+                    {uri && recorderState === "default" &&
                         <Button className="primary"
                             title={lf("Apply")}
                             label={lf("Apply")}
                             onClick={handleApplyClick} />
                     }
-                    <Button title={lf("Cancel")}
-                        label={lf("Cancel")}
-                        onClick={onCancel} />
                 </div>
             </div>
         </div>

package/react-common/styles/react-common-authcode-core.less

@@ -1,5 +1,5 @@
 /**
- * This file is the same as react-common-authcode.less except it doesn't import any
+ * This file is the same as react-common-skillmap.less except it doesn't import any
  * variables from the target. This is used for pxt-core's css build
  */
 

package/react-common/styles/react-common-authcode.less

@@ -1,5 +1,5 @@
 /**
- * Used for building react-common-authcode.css
+ * Used for building react-common-skillmap.css
  */
 
 // Import variables from pxt-core

package/react-common/styles/share/share.less

@@ -77,6 +77,8 @@
         display: flex;
         align-items: center;
         justify-content: center;
+        flex-direction: column;
+        gap: 0.5rem;
 
         .common-spinner {
             width: 5rem;
@@ -231,6 +233,13 @@
 
 .gif-recorder-actions {
     display: flex;
+    width: 100%;
+
+    .common-button {
+        padding-left: 0;
+        padding-right: 0;
+        flex: 1;
+    }
 }
 
 .thumbnail-image,

package/theme/toolbox.less

@@ -135,6 +135,7 @@ span.blocklyTreeLabel, text.blocklyText {
     font-size: 1.2rem;
     padding: .5rem 1rem;
     border-bottom: 2px solid darken(desaturate(@editorToolsBackground, 60%), 10%);
+    user-select: none;
 }
 
 @media only screen and (max-width: @largestMobileScreen) {

package/theme/tutorial-sidebar.less

@@ -182,6 +182,7 @@
             background: @tutorialPrimaryColor;
             width: 2rem;
             height: 2rem;
+            user-select: none;
 
             ~ .circle-button {
                 // buttons after selected step
@@ -405,7 +406,6 @@
     padding: 1rem 0.5rem 1rem 1rem;
     overflow-x: hidden;
     overflow-y: scroll;
-
     &.ui.items { margin-top: 0; }
 }
 
@@ -531,6 +531,8 @@
 .tabTutorial {
     .immersive-reader-button.ui.item {
         float: right;
+        border: 2px solid @tutorialGrayOffset;
+        margin-left: 1.5rem;
     }
 }
 

package/webapp/public/skillmap.html

@@ -1 +1,32 @@
-<!doctype html><html lang="@locale@"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>MakeCode Skill Map</title><link rel="stylesheet" data-rtl="/blb/rtlsemantic.css" href="/blb/semantic.css"><link rel="stylesheet" href="/blb/icons.css"><link rel="stylesheet" href="/blb/react-common-skillmap.css"><script defer="defer" src="/blb/skillmap/js/main.f143771a.js"></script><link href="/blb/skillmap/css/main.242f7a98.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><script type="text/javascript" src="/blb/target.js"></script><script type="text/javascript" src="/blb/pxtlib.js"></script><div id="root"></div><script>var pxtConfig=null</script><script type="text/javascript">window.lightningjs||function(e){function n(n,i){return i&&(i+=(/\?/.test(i)?"&":"?")+"lv=1"),e[n]||function(){var a=window,r=document,o=n,d=r.location.protocol,s="load",l=0;!function(){function n(){c.P(s),c.w=1,e[o]("_load")}e[o]=function(){function n(){return n.id=i,e[o].apply(n,arguments)}var t,i=++l;return t=this&&this!=a&&this.id||0,(c.s=c.s||[]).push([i,t,arguments]),n.then=function(e,t,a){var r=c.fh[i]=c.fh[i]||[],o=c.eh[i]=c.eh[i]||[],d=c.ph[i]=c.ph[i]||[];return e&&r.push(e),t&&o.push(t),a&&d.push(a),n},n};var c=e[o]._={};c.fh={},c.eh={},c.ph={},c.l=i?i.replace(/^\/\//,("https:"==d?d:"http:")+"//"):i,c.p={0:+new Date},c.P=function(e){c.p[e]=new Date-c.p[0]},c.w&&n(),a.addEventListener?a.addEventListener(s,n,!1):a.attachEvent("on"+s,n);var u=function(){function e(){return["<head></head><",n,' onload="var d=',f,";d.getElementsByTagName('head')[0].",d,"(d.",s,"('script')).",l,"='",c.l,"'\"></",n,">"].join("")}var n="body",i=r[n];if(!i)return setTimeout(u,100);c.P(1);var a,d="appendChild",s="createElement",l="src",h=r[s]("div"),p=h[d](r[s]("div")),v=r[s]("iframe"),f="document";h.style.display="none",i.insertBefore(h,i.firstChild).id=t+"-"+o,v.frameBorder="0",v.id=t+"-frame-"+o,/MSIE[ ]+6/.test(navigator.userAgent)&&(v[l]="javascript:false"),v.allowTransparency="true",p[d](v);try{v.contentWindow[f].open()}catch(e){c.domain=r.domain,a="javascript:var d="+f+".open();d.domain='"+r.domain+"';",v[l]=a+"void(0);"}try{var w=v.contentWindow[f];w.write(e()),w.close()}catch(n){v[l]=a+'d.write("'+e().replace(/"/g,String.fromCharCode(92)+'"')+'");d.close();'}c.P(2)};c.l&&setTimeout(u,0)}()}(),e[n].lv="1",e[n]}var t="lightningjs",i=window[t]=n(t);i.require=n,i.modules=e}({}),window.usabilla_live=lightningjs.require("usabilla_live","//w.usabilla.com/1bba04d66c15.js")</script></body></html>
+<!doctype html>
+<html lang="@locale@">
+  <head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width,initial-scale=1"/>
+    <title>MakeCode Skill Map</title>
+    <link rel="stylesheet" data-rtl="/blb/rtlsemantic.css" href="/blb/semantic.css">
+    <link rel="stylesheet" href="/blb/icons.css">
+    <link rel="stylesheet" href="/blb/react-common-skillmap.css">
+  <link href="/blb/skillmap/css/main.3684f34d.chunk.css" rel="stylesheet"></head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+
+    <!-- @include tracking.html -->
+    <!-- @include tickevent.html -->
+
+    <!-- target.js is generated by the CLI -->
+    <script type="text/javascript" src="/blb/target.js"></script>
+    <script type="text/javascript" src="/blb/pxtlib.js"></script>
+
+    <div id="root"></div>
+
+
+    <script>var pxtConfig=null</script>
+
+    <!-- begin usabilla live embed code -->
+    <script type="text/javascript">window.lightningjs||function(e){function n(n,i){return i&&(i+=(/\?/.test(i)?"&":"?")+"lv=1"),e[n]||function(){var a=window,r=document,o=n,d=r.location.protocol,s="load",l=0;!function(){function n(){c.P(s),c.w=1,e[o]("_load")}e[o]=function(){function n(){return n.id=i,e[o].apply(n,arguments)}var t,i=++l;return t=this&&this!=a&&this.id||0,(c.s=c.s||[]).push([i,t,arguments]),n.then=function(e,t,a){var r=c.fh[i]=c.fh[i]||[],o=c.eh[i]=c.eh[i]||[],d=c.ph[i]=c.ph[i]||[];return e&&r.push(e),t&&o.push(t),a&&d.push(a),n},n};var c=e[o]._={};c.fh={},c.eh={},c.ph={},c.l=i?i.replace(/^\/\//,("https:"==d?d:"http:")+"//"):i,c.p={0:+new Date},c.P=function(e){c.p[e]=new Date-c.p[0]},c.w&&n(),a.addEventListener?a.addEventListener(s,n,!1):a.attachEvent("on"+s,n);var u=function(){function e(){return["<head></head><",n,' onload="var d=',f,";d.getElementsByTagName('head')[0].",d,"(d.",s,"('script')).",l,"='",c.l,"'\"></",n,">"].join("")}var n="body",i=r[n];if(!i)return setTimeout(u,100);c.P(1);var a,d="appendChild",s="createElement",l="src",h=r[s]("div"),p=h[d](r[s]("div")),v=r[s]("iframe"),f="document";h.style.display="none",i.insertBefore(h,i.firstChild).id=t+"-"+o,v.frameBorder="0",v.id=t+"-frame-"+o,/MSIE[ ]+6/.test(navigator.userAgent)&&(v[l]="javascript:false"),v.allowTransparency="true",p[d](v);try{v.contentWindow[f].open()}catch(e){c.domain=r.domain,a="javascript:var d="+f+".open();d.domain='"+r.domain+"';",v[l]=a+"void(0);"}try{var w=v.contentWindow[f];w.write(e()),w.close()}catch(n){v[l]=a+'d.write("'+e().replace(/"/g,String.fromCharCode(92)+'"')+'");d.close();'}c.P(2)};c.l&&setTimeout(u,0)}()}(),e[n].lv="1",e[n]}var t="lightningjs",i=window[t]=n(t);i.require=n,i.modules=e}({}),window.usabilla_live=lightningjs.require("usabilla_live","//w.usabilla.com/1bba04d66c15.js")</script>
+    <!-- end usabilla live embed code -->
+
+    <!-- @include thin-footer.html -->
+  <script>!function(e){function r(r){for(var n,l,i=r[0],a=r[1],p=r[2],c=0,s=[];c<i.length;c++)l=i[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,p||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++){var a=t[i];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={1:0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var i=this.webpackJsonpskillsmap=this.webpackJsonpskillsmap||[],a=i.push.bind(i);i.push=r,i=i.slice();for(var p=0;p<i.length;p++)r(i[p]);var f=a;t()}([])</script><script src="/blb/skillmap/js/2.d9c1cec5.chunk.js"></script><script src="/blb/skillmap/js/main.94faba64.chunk.js"></script></body>
+</html>

package/built/web/multiplayer/css/main.b0b14e9a.css

@@ -1,2 +0,0 @@
-:root{--black:#000;--white:#fff;--primary-color:#aa278f;--secondary-color:#eac6eb;--tertiary-color:#850a6b;--hover-color:var(--secondary-color);--active-color:var(--tertiary-color);--inactive-color:var(--secondary-color);--inactive-hover-color:#6e6e6e;--invert-active-color:#fff;--invert-hover-text-color:#850a6b;--body-background-color:#f9f9f9;--default-card-color:#ccc;--card-hover-color:#bfbfbf;--card-border-color:#e9eef2;--dropdown-hover-color:#ccc;--inverted-text-color:var(--white);--subtitle-text-color:#6e6e6e;--header-height:4rem;--header-padding-top:1rem;--body-font-family:"Share Tech Mono",Monaco,Menlo,"Ubuntu Mono",Consolas,source-code-pro,monospace;--feature-text-font:Segoe UI,Tahoma,Geneva,Verdana;--frame-loader-zindex:30;--above-frame-zindex:50;--modal-dimmer-zindex:100;--fullscreen-modal-zindex:90;--graph-backround-zindex:10;--above-graph-zindex:20;--high-contrast-text:var(--white);--high-contrast-background:var(--black);--high-contrast-highlight:#ff0;--high-contrast-focus-outline:2px solid var(--high-contrast-highlight);--high-contrast-hyperlink:#807fff}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f9f9f9;background-color:var(--body-background-color);font-family:Share Tech Mono,Monaco,Menlo,Ubuntu Mono,Consolas,source-code-pro,monospace;font-family:var(--body-font-family);margin:0;overflow:hidden;position:relative}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root,#root>div,.app-container{height:100%;width:100%}.app-content{gap:1rem;padding-top:3rem}.app-content,.content-row{align-items:center;display:flex;flex-direction:column}.auth-button,.motd-button{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}body{background:#fdf3e0}.arcade{--primary-color:#e77038;--secondary-color:#ffeb9a;--tertiary-color:#e77038;--hover-color:var(--secondary-color);--active-color:var(--tertiary-color);--inactive-color:#bfbfbf;--invert-active-color:#fff;--invert-hover-text-color:#e77038;--body-background-color:#fdf3e0;--card-hover-color:var(--default-card-color)}.arcade .banner{background:linear-gradient(90deg,#9feffd,#fd99c2)}.arcade .dropdown-menu,.arcade .modal{background-color:var(--white)}.arcade .carousel-arrow{color:var(--primary-color)}
-/*# sourceMappingURL=main.b0b14e9a.css.map*/