search

sugarlabs / musicblocks

Music Blocks -- A musical microworld
https://musicblocks.sugarlabs.org/
GNU Affero General Public License v3.0
565 stars 762 forks source link

MusicBlocks is not starting in Safari #1021

Closed EmilyOng closed 6 years ago

EmilyOng commented 6 years ago

screen shot 2017-12-31 at 5 25 18 pm

Version 9.1.2 (11601.7.7)

walterbender commented 6 years ago

Are there any errors prior to this in the console output?

EmilyOng commented 6 years ago

Sorry I couldn't have a proper look at my console output until now:

[Warning] Unexpected CSS token: $ (activity.css, line 904)
[Warning] Invalid CSS property declaration at: & (activity.css, line 914)
[Log] ["samples/violin", "samples/cello", "samples/flute", "samples/guitar", "samples/basse", "samples/bottle", "samples/clap", "samples/darbuka", "samples/hihat", "samples/splash", …] (28) (manifest.js, line 48)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Log] On platform:  – {android: false, FF: false, mobile: false, …} (platformstyle.js, line 29)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Error] ReferenceError: Can't find variable: module
    global code (dsp.js:2303)
[Error] SyntaxError: Unexpected token '>'
    (anonymous function) (samplesviewer.js:518)
[Log] insideSugarizer? false (sugarizer-compatibility.js, line 66)
[Log] initing i18n for music terms (activity.js, line 216)
[Log] poly (default) (custom) (synthutils.js, line 399)
[Error] ReferenceError: Can't find variable: SamplesViewer
    init (activity.js:915)
    domReady (activity.js:755)
    (anonymous function) (activity.js:79)
    execCb (require.js:1604)
    check (require.js:844)
    (anonymous function) (require.js:1084)
    (anonymous function) (require.js:129)
    (anonymous function) (require.js:1127)
    each (require.js:57)
    emit (require.js:1126)
    check (require.js:898)
    enable (require.js:1114)
    init (require.js:757)
    (anonymous function) (require.js:939)
    (anonymous function) (require.js:129)
    (anonymous function) (require.js:1127)
    each (require.js:57)
    emit (require.js:1126)
    check (require.js:898)
    enable (require.js:1114)
    init (require.js:757)
    (anonymous function) (require.js:963)
    (anonymous function) (require.js:129)
    domReady (domReady.js:106)
    load (domReady.js:122)
    (anonymous function) (require.js:1044)
    (anonymous function) (require.js:129)
    on (require.js:494)
    callPlugin (require.js:915)
    fetch (require.js:793)
    check (require.js:823)
    enable (require.js:1114)
    (anonymous function) (require.js:956)
    (anonymous function) (require.js:129)
    (anonymous function) (require.js:1127)
    each (require.js:57)
    emit (require.js:1126)
    check (require.js:898)
    enable (require.js:1114)
    init (require.js:757)
    callGetModule (require.js:1141)
    completeLoad (require.js:1498)
    onScriptLoad (require.js:1625)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/emptybox.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/emptyheap.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/negroot.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/noinput.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/zerodivide.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/notanumber.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/nostack.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/notastring.svg (activity.js, line 1404)
[Log] creating error message artwork for https://walterbender.github.io/musicblocks/images/nomicrophone.svg (activity.js, line 1404)
[Error] TypeError: null is not an object (evaluating 'stopTurtleContainer.visible')
    onStopTurtle (activity.js:2133)
    doStopTurtle (logo.js:553)
    doHardStopButton (activity.js:557)
    onblur (activity.js:228)
walterbender commented 6 years ago

Not sure when it snuck in, but ES2015 syntax in sampesviewer.js is breaking Safari.

walterbender commented 6 years ago

Pushed a patch to samplesviewer.js that should hopefully fix this.

kipply commented 6 years ago

I'm getting a different error when trying this in Safari; 


[Error] XMLHttpRequest cannot load file:///Users/kipply/code/codein/musicblocks/localization.ini. Cross origin requests are only supported for HTTP.
    xhrLoadText (webL10n.js:144)
    parseResource (webL10n.js:257)
    load (webL10n.js:331)
    loadLocale (webL10n.js:341)
    l10nStartup (webL10n.js:982)
[Error] Not allowed to load local resource: file:///favicon.ico
[Error] XMLHttpRequest cannot load file:///Users/kipply/code/codein/musicblocks/localization.ini. Cross origin requests are only supported for HTTP.
    xhrLoadText (webL10n.js:144)
    parseResource (webL10n.js:257)
    load (webL10n.js:331)
    loadLocale (webL10n.js:341)
    setLanguage (webL10n.js:1120)
    Global Code (activity.js:56)
[Error] ReferenceError: Can't find variable: module
    Global Code (dsp.js:2303)
[Error] XMLHttpRequest cannot load file:///Users/kipply/code/codein/musicblocks/css/activity.css. Cross origin requests are only supported for HTTP.
    link (prefixfree.min.js:5:1272)
    forEach
    (anonymous function) (prefixfree.min.js:5:2331)
[Error] XMLHttpRequest cannot load file:///Users/kipply/code/codein/musicblocks/css/style.css. Cross origin requests are only supported for HTTP.
    link (prefixfree.min.js:5:1272)
    forEach
    (anonymous function) (prefixfree.min.js:5:2331)
[Error] SecurityError (DOM Exception 18): The operation is insecure.
    isSugarizer (env.js:74)
    (anonymous function) (bus.js:7)
    execCb (require.js:1604)
    check (require.js:844)
    (anonymous function) (require.js:1084)
    (anonymous function) (require.js:129)
    (anonymous function) (require.js:1127)
    each (require.js:57)
    emit (require.js:1126)
    check (require.js:898)
    enable (require.js:1114)
    init (require.js:757)
    callGetModule (require.js:1141)
    completeLoad (require.js:1498)
    onScriptLoad (require.js:1625)
[Error] XMLHttpRequest cannot load file:///Users/kipply/code/codein/musicblocks/lib/sugar-web/graphics/activitypalette.html. Cross origin requests are only supported for HTTP.
    get (text.js:303)
    load (text.js:187)
    (anonymous function) (require.js:1044)
    (anonymous function) (require.js:129)
    on (require.js:494)
    callPlugin (require.js:915)
    fetch (require.js:793)
    check (require.js:823)
    enable (require.js:1114)
    (anonymous function) (require.js:956)
    (anonymous function) (require.js:129)
    (anonymous function) (require.js:1127)
    each (require.js:57)
    emit (require.js:1126)
    check (require.js:898)
    enable (require.js:1114)
    init (require.js:757)
    callGetModule (require.js:1141)
    completeLoad (require.js:1498)
    onScriptLoad (require.js:1625)

This is preventing me from even getting into the app, though could probably be fixed through a security setting.

kipply commented 6 years ago

To disable Cross-Origin Restrictions, the Safari user will need to enable the Develop menu (Preferences/Advanced)

image

@walterbender This should be added to installation instructions somewhere

EmilyOng commented 6 years ago

Not sure why I am still getting some errors, but it is working now.

[Warning] Invalid CSS property declaration at: / (activity.css, line 904)
[Warning] Invalid CSS property declaration at: * (activity.css, line 904)
[Warning] Invalid CSS property declaration at: : (activity.css, line 914)
[Log] Array (28) (manifest.js, line 48)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Log] On platform:  – Object (platformstyle.js, line 29)
[Error] ReferenceError: Can't find variable: module
    global code (dsp.js:2303)
[Log] insideSugarizer? false (sugarizer-compatibility.js, line 66)
[Log] initing i18n for music terms (activity.js, line 216)
[Log] poly (default) (custom) (synthutils.js, line 399)
[Log] hard stop turtle (activity.js, line 3191)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/emptybox.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/negroot.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/emptyheap.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/noinput.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/zerodivide.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/nostack.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/notastring.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/notanumber.svg (activity.js, line 1404)
[Log] creating error message artwork for http://rawgit.com/walterbender/musicblocks/master/images/nomicrophone.svg (activity.js, line 1404)
[Log] LOAD START (activity.js, line 2682)
[Log] loading start and a matrix (activity.js, line 2684)
[Log] 1.2 (activity.js, line 3388)
[Log] hard stop turtle (activity.js, line 3191)
[Log] adding a new turtle start (turtle.js, line 1151)
[Log] Finished block loading (blocks.js, line 4137)
kipply commented 6 years ago

@EmilyOng what version of Safari are you on?

EmilyOng commented 6 years ago

This is what I get when I disable cross origin restrictions:

[Warning] Invalid CSS property declaration at: / (activity.css, line 904)
[Warning] Invalid CSS property declaration at: * (activity.css, line 904)
[Warning] Invalid CSS property declaration at: : (activity.css, line 914)
[Log] Array (28) (manifest.js, line 48)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Log]  * Tone.js r10 *  (Tone.min.js, line 7)
[Log] On platform:  – Object (platformstyle.js, line 29)
[Error] ReferenceError: Can't find variable: module
    global code (dsp.js:2303)
[Log] Did you just try to use p5.js's triangle() function? If so, you may want to move it into your sketch's setup() function. (p5.min.js, line 5)

For more details, see: https://github.com/processing/p5.js/wiki/Frequently-Asked-Questions#why-cant-i-assign-variables-using-p5-functions-and-variables-before-setup
[Error] Error: Load timeout for modules: samples/triangle,samples/cricket,samples/fingercymbal,samples/slap,samples/clang,samples/cup,samples/floortom,samples/snare,sugar-web/env,sugar-web/activity/activity,sugar-web/datastore
http://requirejs.org/docs/errors.html#timeout
    onError (require.js:1765)
    onError (require.js:521)
    checkLoaded (require.js:669)
    completeLoad (require.js:1522)
    onScriptLoad (require.js:1625)
walterbender commented 6 years ago

Apparently whatever version of Safari you are running doesn't know how to parse comments in CSS. Safari is getting to be more trouble than its worth.

kipply commented 6 years ago

@EmilyOng Those might just be because you're on an older version of Safari. The most up to date version will run a hosted MB just fine, and requires disable cross origin restrictions to be disabled if run locally.

pikurasa commented 6 years ago

I just tested on safari 10.1.2 (10603.3.8) on OS X Yosemite (10.10.5) and everything seems to work. I tested with walterbender.github.io/musicblocks

It should be noted that performance does seem to affect the rhythm with this combo of hardware and software... which is making my current computer feel less inferior :p

I will close the issue as I do not see the problem described in original issue.