Moving Settings to window.Settings

.eslintrc

@@ -19,11 +19,10 @@
         "browser": true
     },
     "globals": {
+        "MediaLib": true,
         "AndroidInterface": true,
         "window": true,
         "WebKitCSSMatrix": true,
-        "Settings": true,
-        "MediaLib": true,
         "webkitAudioContext": true,
         "require": true
     },

src/editor/ScratchJr.js

@@ -33,8 +33,8 @@ let inFullscreen = false;
 let keypad = undefined;
 let textForm = undefined;
 let editfirst = false;
-let stagecolor = Settings.stageColor;
+let stagecolor;
-let defaultSprite = Settings.defaultSprite;
+let defaultSprite;
 
 ///////////////////////////////////////////
 //Layers definitions for the whole site
@@ -176,6 +176,8 @@ export default class ScratchJr {
     }
 
     static appinit (v) {
+        stagecolor = window.Settings.stageColor;
+        defaultSprite = window.Settings.defaultSprite;
         version = v;
         document.body.scrollTop = 0;
         time = (new Date()) - 0;
@@ -202,14 +204,14 @@ export default class ScratchJr {
         ScratchJr.editorEvents();
         Project.load(currentProject);
         Events.init();
-        if (Settings.autoSaveInterval > 0) {
+        if (window.Settings.autoSaveInterval > 0) {
             autoSaveSetInterval = window.setInterval(function () {
                 if (autoSaveEnabled) {
                     ScratchJr.saveProject(null, function () {
                         Alert.close();
                     });
                 }
-            }, Settings.autoSaveInterval);
+            }, window.Settings.autoSaveInterval);
         }
     }
 
@@ -349,7 +351,7 @@ export default class ScratchJr {
                     Alert.close();
                 });
             }
-        }, Settings.autoSaveInterval);
+        }, window.Settings.autoSaveInterval);
     }
 
     static onPause () {

src/editor/blocks/Block.js

@@ -99,7 +99,7 @@ export default class Block {
             position: 'absolute',
             left: '1px',
             top: '4px',
-            opacity: this.inpalette ? Settings.paletteBlockShadowOpacity : 1,
+            opacity: this.inpalette ? window.Settings.paletteBlockShadowOpacity : 1,
             visibility: 'hidden',
             webkitTransform: 'translate(' + (-this.blockshape.width / 2) + 'px, ' +
                 (-this.blockshape.height / 2) + 'px) ' +

src/editor/blocks/BlockArg.js

@@ -158,7 +158,7 @@ export default class BlockArg {
                 'translate(' + (w * window.devicePixelRatio / 2) + 'px, ' + (h * window.devicePixelRatio / 2) + 'px)'
         });
         ctx = cnv.getContext('2d');
-        var font = (12 * window.devicePixelRatio) + 'px ' + Settings.blockArgFont;
+        var font = (12 * window.devicePixelRatio) + 'px ' + window.Settings.blockArgFont;
         var lsize = getStringSize(ctx, font, str).width;
         writeText(ctx, font, '#77787b', str, h * window.devicePixelRatio - 3,
             Math.round((w * window.devicePixelRatio - lsize) / 2));
@@ -448,7 +448,8 @@ export default class BlockArg {
         ictx.closePath();
         ictx.stroke();
         ictx.fill();
-        writeText(ictx, 'bold ' + (12 * dpr) + 'px ' + Settings.blockArgFont, 'white', page.num, 26 * dpr, 58 * dpr);
+        writeText(ictx, 'bold ' + (12 * dpr) + 'px ' +
+            window.Settings.blockArgFont, 'white', page.num, 26 * dpr, 58 * dpr);
         return icon;
     }
 

src/editor/blocks/BlockSpecs.js

@@ -55,12 +55,12 @@ export default class BlockSpecs {
         BlockSpecs.defs = BlockSpecs.setupBlocksSpecs();
         BlockSpecs.palettes = BlockSpecs.setupPalettesDef();
         BlockSpecs.categories = BlockSpecs.setupCategories();
-        if (Settings.edition == 'PBS') {
+        if (window.Settings.edition == 'PBS') {
             BlockSpecs.canvasMask = BlockSpecs.getImageFrom('assets/ui/canvasmask', 'svg');
         } else {
             BlockSpecs.canvasMask = BlockSpecs.getImageFrom('assets/ui/canvasmask');
         }
-        if (Settings.edition != 'PBS') {
+        if (window.Settings.edition != 'PBS') {
             BlockSpecs.projectThumb = BlockSpecs.getImageFrom('assets/lobby/pmask');
         }
         IO.requestFromServer('assets/balloon.svg', BlockSpecs.setBalloon);
@@ -143,32 +143,32 @@ export default class BlockSpecs {
             [
                 BlockSpecs.getImageFrom('assets/categories/StartOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/StartOff', 'svg'),
-                Settings.categoryStartColor
+                window.Settings.categoryStartColor
             ],
             [
                 BlockSpecs.getImageFrom('assets/categories/MotionOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/MotionOff', 'svg'),
-                Settings.categoryMotionColor
+                window.Settings.categoryMotionColor
             ],
             [
                 BlockSpecs.getImageFrom('assets/categories/LooksOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/LooksOff', 'svg'),
-                Settings.categoryLooksColor
+                window.Settings.categoryLooksColor
             ],
             [
                 BlockSpecs.getImageFrom('assets/categories/SoundOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/SoundOff', 'svg'),
-                Settings.categorySoundColor
+                window.Settings.categorySoundColor
             ],
             [
                 BlockSpecs.getImageFrom('assets/categories/FlowOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/FlowOff', 'svg'),
-                Settings.categoryFlowColor
+                window.Settings.categoryFlowColor
             ],
             [
                 BlockSpecs.getImageFrom('assets/categories/StopOn', 'svg'),
                 BlockSpecs.getImageFrom('assets/categories/StopOff', 'svg'),
-                Settings.categoryStopColor
+                window.Settings.categoryStopColor
             ]
         );
     }

src/editor/engine/Page.js

@@ -249,7 +249,7 @@ export default class Page {
 
     setPageThumb (c) {
         var w0, h0;
-        if (Settings.edition == 'PBS') {
+        if (window.Settings.edition == 'PBS') {
             w0 = 136;
             h0 = 101;
         } else {
@@ -261,7 +261,7 @@ export default class Page {
         var h = c.height;
         var ctx = c.getContext('2d');
 
-        if (Settings.edition == 'PBS') {
+        if (window.Settings.edition == 'PBS') {
 
             ctx.rect(0, 0, w, h);
             ctx.fillStyle = '#fff';
@@ -283,7 +283,7 @@ export default class Page {
             }
             this.stampSpriteAt(ctx, spr, scale);
         }
-        if (Settings.edition != 'PBS') {
+        if (window.Settings.edition != 'PBS') {
             ctx.save();
             ctx.globalCompositeOperation = 'destination-in';
             ctx.drawImage(BlockSpecs.canvasMask, 0, 0, w, h);

src/editor/engine/Sprite.js

@@ -703,7 +703,7 @@ export default class Sprite {
         setProps(this.div.style, {
             fontSize: this.fontsize + 'px',
             color: this.color,
-            fontFamily: Settings.textSpriteFont
+            fontFamily: window.Settings.textSpriteFont
         });
         this.div.owner = this;
         this.div.id = this.id;
@@ -998,7 +998,7 @@ export default class Sprite {
         this.div.style.fontSize = this.fontsize + 'px';
         this.div.textContent = this.str;
         var ctx = this.outline.getContext('2d');
-        ctx.font = 'bold ' + this.fontsize + 'px ' + Settings.textSpriteFont;
+        ctx.font = 'bold ' + this.fontsize + 'px ' + window.Settings.textSpriteFont;
         var w = ctx.measureText(this.str).width;
         this.w = (Math.round(w) + 1);
         this.div.style.width = (this.w * 2) + 'px';
@@ -1007,7 +1007,7 @@ export default class Sprite {
         this.cy = this.h / 2;
         setCanvasSize(this.outline, this.w, this.h);
         ctx.clearRect(0, 0, this.outline.width, this.outline.height);
-        ctx.font = 'bold ' + this.fontsize + 'px ' + Settings.textSpriteFont;
+        ctx.font = 'bold ' + this.fontsize + 'px ' + window.Settings.textSpriteFont;
         ctx.fillStyle = this.color;
         ctx.textAlign = 'left';
         ctx.textBaseline = 'top';

src/editor/ui/Palette.js

@@ -199,7 +199,7 @@ export default class Palette {
         helpballoon.icon = obj;
         var ctx = helpballoon.getContext('2d');
         w = 16 * window.devicePixelRatio * scaleMultiplier +
-            getStringSize(ctx, 'bold ' + fontSize + 'px ' + Settings.paletteBalloonFont, label).width;
+            getStringSize(ctx, 'bold ' + fontSize + 'px ' + window.Settings.paletteBalloonFont, label).width;
         if (w < 36 * scaleMultiplier) {
             w = 36 * scaleMultiplier;
         }
@@ -211,7 +211,7 @@ export default class Palette {
                 'scale(' + (1 / window.devicePixelRatio) + ') translate(' + (dx + (w / 2)) + 'px, ' + (h / 2) + 'px)'
         });
         Palette.drawBalloon(helpballoon.getContext('2d'), w, h);
-        writeText(ctx, 'bold ' + fontSize + 'px ' + Settings.paletteBalloonFont, 'white', label,
+        writeText(ctx, 'bold ' + fontSize + 'px ' + window.Settings.paletteBalloonFont, 'white', label,
             21 * window.devicePixelRatio * scaleMultiplier, 8 * window.devicePixelRatio * scaleMultiplier);
     }
 

src/editor/ui/Project.js

@@ -544,7 +544,7 @@ export default class Project {
         setCanvasSize(c, w, h);
         var ctx = c.getContext('2d');
         var md5 = page.md5;
-        ctx.fillStyle = Settings.stageColor;
+        ctx.fillStyle = window.Settings.stageColor;
         ctx.fillRect(0, 0, w, h);
         if (!md5) {
             Project.drawSprites(page, scale, c, w, h, fcn);
@@ -581,7 +581,7 @@ export default class Project {
     static maskBorders (ctx, w, h) {
         ctx.save();
         ctx.globalCompositeOperation = 'destination-in';
-        if (Settings.edition != 'PBS') {
+        if (window.Settings.edition != 'PBS') {
             ctx.drawImage(BlockSpecs.projectThumb, 0, 0, w, h);
         }
         ctx.restore();

src/editor/ui/Thumbs.js

@@ -342,7 +342,7 @@ export default class Thumbs {
         var tb = newHTML('div', 'pagethumb', p);
         var c = newHTML('div', 'empty', tb);
         var img;
-        if (Settings.edition == 'PBS') {
+        if (window.Settings.edition == 'PBS') {
             img = newImage(c, 'assets/ui/newpage.svg');
         } else {
             img = newImage(c, 'assets/ui/newpage.png', {

src/editor/ui/UI.js

@@ -111,7 +111,7 @@ export default class UI {
         var author = newHTML('div', 'infolabel', staticinfo);
         author.setAttribute('id', 'deviceName');
 
-        if (Settings.shareEnabled) {
+        if (window.Settings.shareEnabled) {
             // Sharing
             var shareButtons = newHTML('div', 'infoboxShareButtons', infobox);
 

src/lobby/Lobby.js

@@ -186,9 +186,9 @@ export default class Lobby {
         var languageButtons = newHTML('div', 'languagebuttons', div);
 
         var languageButton;
-        for (var l in Settings.supportedLocales) {
+        for (var l in window.Settings.supportedLocales) {
             var selected = '';
-            if (Settings.supportedLocales[l] == Localization.currentLocale) {
+            if (window.Settings.supportedLocales[l] == Localization.currentLocale) {
                 selected = ' selected';
             }
             languageButton = newHTML('div', 'localizationselect' + selected, languageButtons);
@@ -196,7 +196,7 @@ export default class Lobby {
 
             languageButton.ontouchstart = function (e) {
                 ScratchAudio.sndFX('tap.wav');
-                Cookie.set('localization', Settings.supportedLocales[e.target.textContent]);
+                Cookie.set('localization', window.Settings.supportedLocales[e.target.textContent]);
                 window.location = '?place=gear';
             };
         }

src/lobby/Samples.js

@@ -12,7 +12,7 @@ import {gn, newHTML} from '../utils/lib';
 let frame;
 // Should ScratchJr projects be saved when the sample project is changed?
 // Enabled for the PBS version; disabled for the ScratchJr version
-const storyStarters = Settings.useStoryStarters;
+// window.Settings.useStoryStarters
 
 export default class Samples {
     static init () {
@@ -77,7 +77,7 @@ export default class Samples {
         iOS.analyticsEvent('samples', 'sample_opened', mt.textContent);
         var md5 = mt.md5;
         window.location.href = 'editor.html?pmd5=' + md5 + '&mode='
-            + ((storyStarters) ? 'storyStarter' : 'look');
+            + ((window.Settings.useStoryStarters) ? 'storyStarter' : 'look');
     }
 
     static insertThumbnail (img, data) {

src/utils/SVG2Canvas.js

@@ -156,11 +156,12 @@ export default class SVG2Canvas {
             return;
         }
         if (elem.id.indexOf('pathborder_image') > -1) {
-            ctx.fillStyle = Settings.spriteOutlineColor;
+            ctx.fillStyle = window.Settings.spriteOutlineColor;
         } else {
-            ctx.fillStyle = (elem.getAttribute('fill') == 'none') ? 'rgba(0, 0, 0,0)' : Settings.spriteOutlineColor;
+            ctx.fillStyle = (elem.getAttribute('fill') == 'none') ?
+                'rgba(0, 0, 0,0)' : window.Settings.spriteOutlineColor;
         }
-        ctx.strokeStyle = Settings.spriteOutlineColor;
+        ctx.strokeStyle = window.Settings.spriteOutlineColor;
         ctx.lineCap = 'round';
         ctx.lineWidth = elem.getAttribute('stroke-width') ? Number(elem.getAttribute('stroke-width')) + 12 : 12;
         ctx.miterLimit = 2;