@robotical/martyblocksjr 4.0.5 → 4.0.8

package/editions/free/src/css/editorleftpanel.css

@@ -247,6 +247,59 @@
     margin: 0px ${css_vh(2.34)} 0px;
 }
 
+#library.marty-mode-library .addsprite {
+    display: none;
+}
+
+.marty-mode-card {
+    background: url('../assets/ui/viewOn.png') no-repeat left top;
+    background-size: 100%;
+    position: relative;
+    display: inline-block;
+    width: ${css_vh(29.95)};
+    height: ${css_vh(10.16)};
+    margin: 0px;
+    margin-bottom: ${css_vh(-0.39)};
+    padding: 0px;
+}
+
+.marty-mode-card-icon {
+    position: absolute;
+    top: ${css_vh(0.65)};
+    left: ${css_vh(1.04)};
+    width: ${css_vh(8.33)};
+    height: ${css_vh(8.33)};
+    margin: ${css_vh(0.00)};
+    padding: ${css_vh(0.00)};
+    overflow: hidden;
+}
+
+.marty-mode-card-canvas,
+.marty-mode-card-image {
+    width: 100%;
+    height: 100%;
+    display: block;
+}
+
+.marty-mode-card-label {
+    position: absolute;
+    text-align: center;
+    top: ${css_vh(3.91)};
+    left: ${css_vh(8.46)};
+    margin: 0px;
+    padding: 0px;
+    line-height: ${css_vh(2.60)};
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    font-family: 'Lato Regular';
+    font-weight: bold;
+    font-size: ${css_vh(1.69)};
+    width: ${css_vh(13.54)};
+    cursor: default;
+    color: #F9A737;
+}
+
 
 /* sprites thumbnails */
 .spritethumb {

package/package.json

@@ -1,7 +1,11 @@
 {
   "name": "@robotical/martyblocksjr",
-  "version": "4.0.5",
+  "version": "4.0.8",
   "description": "ScratchJr",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/robotical/scratchjr"
+  },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"

package/tests/e2e/marty-connection-ui.e2e.test.js

@@ -0,0 +1,259 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+
+vi.mock('@/editor/ScratchJr', () => ({
+    default: {
+        isMartyModeEnabled: false,
+        stage: {
+            currentPage: {}
+        }
+    }
+}));
+vi.mock('@/editor/blocks/BlockSpecs', () => ({ default: {} }));
+vi.mock('@/editor/ui/Alert', () => ({ default: {} }));
+vi.mock('@/editor/ui/Project', () => ({ default: {} }));
+vi.mock('@/editor/ProjectCloud', () => ({ default: {} }));
+vi.mock('@/editor/ui/Thumbs', () => ({ default: {} }));
+vi.mock('@/editor/ui/Palette', () => ({ default: {} }));
+vi.mock('@/editor/ui/Grid', () => ({ default: {} }));
+vi.mock('@/editor/engine/Stage', () => ({ default: {} }));
+vi.mock('@/editor/ui/ScriptsPane', () => ({ default: {} }));
+vi.mock('@/editor/ui/Undo', () => ({ default: {} }));
+vi.mock('@/editor/ui/Library', () => ({ default: {} }));
+vi.mock('@/tablet/OS', () => ({ default: {} }));
+vi.mock('@/tablet/IO', () => ({ default: {} }));
+vi.mock('@/tablet/MediaLib', () => ({ default: {} }));
+vi.mock('@/painteditor/Paint', () => ({ default: {} }));
+vi.mock('@/utils/Events', () => ({ default: {} }));
+vi.mock('@/utils/Localization', () => ({
+    default: {
+        localize: key => key
+    }
+}));
+vi.mock('@/utils/ScratchAudio', () => ({ default: {} }));
+vi.mock('@/utils/cloudLocalStore', () => ({
+    addStoredCloudId: vi.fn(),
+    getStoredCloudIds: vi.fn(() => []),
+    removeStoredCloudId: vi.fn(),
+    touchStoredCloudId: vi.fn()
+}));
+vi.mock('@/utils/goToLink', () => ({ default: vi.fn() }));
+vi.mock('@/utils/lib', () => ({
+    frame: null,
+    gn: vi.fn(),
+    CSSTransition: vi.fn(),
+    localx: vi.fn(),
+    newHTML: vi.fn(),
+    newButton: vi.fn(),
+    scaleMultiplier: 1,
+    fullscreenScaleMultiplier: 1,
+    getIdFor: vi.fn(),
+    isTablet: false,
+    newDiv: vi.fn(),
+    newTextInput: vi.fn(),
+    isAndroid: false,
+    getDocumentWidth: vi.fn(() => 1024),
+    getDocumentHeight: vi.fn(() => 768),
+    setProps: vi.fn(),
+    globalx: vi.fn()
+}));
+vi.mock('@/utils/accessibility', () => ({
+    closeDialog: vi.fn(),
+    openDialog: vi.fn(),
+    registerDialog: vi.fn(),
+    setMainLandmark: vi.fn(),
+    setPressedState: vi.fn(),
+    setSelectedState: vi.fn()
+}));
+vi.mock('@/html-svgs/cog', () => ({ cogSvg: '<svg></svg>' }));
+vi.mock('@/html-svgs/sprite', () => ({ spriteSvg: '<svg></svg>' }));
+vi.mock('@/html-svgs/marty', () => ({ martySvg: '<svg></svg>' }));
+vi.mock('@/html-svgs/sprite-deselected', () => ({ spriteDeselectedSvg: '<svg></svg>' }));
+vi.mock('@/html-svgs/marty-deselected', () => ({ martyDeselectedSvg: '<svg></svg>' }));
+vi.mock('@/html-svgs/marty_toggle_on', () => ({ martyToggleOn: '<svg></svg>' }));
+vi.mock('@/html-svgs/sprite_toggle_on', () => ({ spriteToggleOn: '<svg></svg>' }));
+vi.mock('@/html-svgs/battery-svg', () => ({ batterySvg: () => '<svg id="battery"></svg>' }));
+vi.mock('@/html-svgs/signal-svg', () => ({ signalSvg: () => '<svg id="signal"></svg>' }));
+vi.mock('@/utils/raft-subscription-helpers', () => ({
+    createRaftConnectionIssueDetectedHelper: () => ({
+        subscribe: vi.fn(),
+        unsubscribe: vi.fn()
+    }),
+    createRaftConnectionIssueResolvedHelper: () => ({
+        subscribe: vi.fn(),
+        unsubscribe: vi.fn()
+    }),
+    raftVerifiedSubscriptionHelper: () => ({
+        subscribe: vi.fn(),
+        unsubscribe: vi.fn()
+    }),
+    raftDisconnectedSubscriptionHelper: raft => {
+        const helper = {
+            subscribe: vi.fn(callback => {
+                raft.__disconnectCallback = callback;
+            }),
+            unsubscribe: vi.fn(() => {
+                raft.__disconnectedUnsubscribed = true;
+            })
+        };
+        return helper;
+    }
+}));
+vi.mock('@/utils/truncate-string', () => ({ truncateString: value => value }));
+vi.mock('@/editor/ui/Trace', () => ({
+    default: {
+        clear: vi.fn()
+    }
+}));
+
+describe('Marty connection UI', () => {
+    let UI;
+    let ScratchJr;
+    let warnSpy;
+
+    beforeEach(async () => {
+        vi.useFakeTimers();
+        vi.clearAllMocks();
+        global.window = {
+            applicationManager: {
+                disconnectGeneric: vi.fn(raft => {
+                    raft.__disconnectCallback();
+                })
+            },
+            martyManager: {
+                addMarty: vi.fn(),
+                wireMartyWithBlocks: vi.fn(() => {
+                    throw new Error('metadata not ready');
+                }),
+                removeMarty: vi.fn(),
+                setMartySensorAvailability: vi.fn()
+            }
+        };
+        warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
+        const [uiModule, scratchJrModule] = await Promise.all([
+            import('@/editor/ui/UI.js'),
+            import('@/editor/ScratchJr')
+        ]);
+        UI = uiModule.default;
+        ScratchJr = scratchJrModule.default;
+        ScratchJr.isMartyModeEnabled = false;
+        ScratchJr.stage = {
+            currentPage: {}
+        };
+    });
+
+    afterEach(() => {
+        warnSpy.mockRestore();
+        vi.runOnlyPendingTimers();
+        vi.useRealTimers();
+        delete global.window;
+    });
+
+    it('installs the Marty disconnect action before sensor and block metadata are ready', () => {
+        const button = createConnectionButton();
+        const oldOnClick = vi.fn();
+        button.onclick = oldOnClick;
+        const raft = createMartyRaft();
+
+        UI.setupMartyConnectionButton(button, raft);
+
+        button.onclick();
+        vi.advanceTimersByTime(1000);
+
+        expect(window.applicationManager.disconnectGeneric).toHaveBeenCalledWith(raft);
+        expect(window.martyManager.removeMarty).toHaveBeenCalledWith(raft);
+        expect(button.onclick).toBe(oldOnClick);
+        expect(button.classList.contains('connectButtonConnected')).toBe(false);
+        expect(button.querySelector('.iconButtonContainer').classList.contains('notConnectedButtonContainer')).toBe(true);
+        expect(raft.__disconnectedUnsubscribed).toBe(true);
+    });
+
+    it('switches from Sprite mode to Marty mode after Marty connects', () => {
+        const button = createConnectionButton();
+        button.onclick = vi.fn();
+        const raft = createMartyRaft();
+
+        UI.setupMartyConnectionButton(button, raft);
+
+        expect(ScratchJr.isMartyModeEnabled).toBe(true);
+    });
+
+    it('still disconnects Marty after switching back to Sprite mode', () => {
+        const button = createConnectionButton();
+        const oldOnClick = vi.fn();
+        button.onclick = oldOnClick;
+        const raft = createMartyRaft();
+
+        UI.setupMartyConnectionButton(button, raft);
+        UI.setMartyModeEnabled(false);
+
+        expect(ScratchJr.isMartyModeEnabled).toBe(false);
+
+        button.onclick();
+        vi.advanceTimersByTime(1000);
+
+        expect(window.applicationManager.disconnectGeneric).toHaveBeenCalledWith(raft);
+        expect(window.martyManager.removeMarty).toHaveBeenCalledWith(raft);
+        expect(button.onclick).toBe(oldOnClick);
+        expect(button.classList.contains('connectButtonConnected')).toBe(false);
+        expect(button.querySelector('.iconButtonContainer').classList.contains('notConnectedButtonContainer')).toBe(true);
+    });
+});
+
+function createMartyRaft() {
+    return {
+        id: 'marty-1',
+        getFriendlyName: () => 'Marty One',
+        getBatteryStrength: () => 70,
+        getRSSI: () => -45,
+        publishedDataAnalyser: {
+            connectedSensors: undefined
+        }
+    };
+}
+
+function createConnectionButton() {
+    const button = new FakeElement();
+    button.children['.iconButtonContainer'] = new FakeElement(['iconButtonContainer', 'notConnectedButtonContainer']);
+    button.children['.batteryIndicatorContainer'] = new FakeElement(['batteryIndicatorContainer']);
+    button.children['.signalIndicatorContainer'] = new FakeElement(['signalIndicatorContainer']);
+    button.children['.raftNameConnectButton'] = new FakeElement(['raftNameConnectButton']);
+    return button;
+}
+
+class FakeElement {
+    constructor(classes = []) {
+        this.classList = new FakeClassList(classes);
+        this.children = {};
+        this.style = {};
+        this.attributes = {};
+        this.textContent = '';
+        this.innerHTML = '';
+        this.onclick = null;
+    }
+
+    querySelector(selector) {
+        return this.children[selector] || null;
+    }
+
+    setAttribute(name, value) {
+        this.attributes[name] = value;
+    }
+}
+
+class FakeClassList {
+    constructor(classes = []) {
+        this.classes = new Set(classes);
+    }
+
+    add(...classes) {
+        classes.forEach(className => this.classes.add(className));
+    }
+
+    remove(...classes) {
+        classes.forEach(className => this.classes.delete(className));
+    }
+
+    contains(className) {
+        return this.classes.has(className);
+    }
+}

package/android/README.md

@@ -1 +0,0 @@
-ScratchJr - Android Studio project containing Android build of Scratch Jr.

package/bin/readme.md

@@ -1,3 +0,0 @@
-Uses python2 and needs librsvg2-bin installed in the system (not python)
-Sometimes the version of librsvg2-bin changes (after updates etc) so make sure you update the path in convert-svg-to-png.py
-```