Error : "It is impossible to load the stylesheets."

[phantez]

1. I set BGPLAY_PROJECT_URL in widget/bgplayjs-main-widget.js to point to file:///PATH/BGPlay.js/
2. And then went into my browser and typed the url : file:///PATH/BGPlay.js/run_bgplay.html

However it wait for 10 seconds and displays "It is impossible to load the stylesheets."

I tried to follow the code path with a javascript debugger but wasn't able to find out what was not loading correctly.

[phantez]

In main.js the line "if(environment.bgplayDom.css("margin-left") === "-10px")" is blocking to load. the value stays and remain 5px. Removing the if made the widget to appear.

[massimocandela]

Hi phantez,
That line of code prevents the widget to be loaded before the css is applied (not just loaded) to all the dom elements. This is because some initial graphical calculations are based on values declared in the css file.

Please, make sure that in your modules/css/bgplay.css the margin-top in 4th line (here: https://github.com/compunet/BGPlay.js/blob/master/modules/css/bgplay.css#L4) is what is checked in the if clause, and that there are no other declarations in your page involving bgplayjs dom elements. Alternatively you can change the css line checked.

However, I hope to find a more elegant and cross-browser way in the future to check the application of the css.

[phantez]

On my browsers (Firefox and Crome on MacOS) the value stays to 5px and never goes to -10px. However the animation works well if I skip that check.