Issues with Electron about stretto HOT 43 CLOSED

Yep, we use head.js to load the resources. See: https://github.com/ohnx/node-music-player/blob/electron/views/base/main_base.html#L46

from stretto.

Best of luck testing it out with Electron. Would be pretty awesome to ship an Electron app version of node music player!

from stretto.

Those all are loading /static/js/player files.

Is there anywhere where /static/lib/js is being loaded, or am I missing something?

from stretto.

The errors appear to be caused by missing Backbone, Marionette, and jQuery libraries.

from stretto.

See line 47:

      "/static/lib/libs.min.js",

Grunt generates that file from all the bower components.

from stretto.

Strange, it doesn't seem to be working. I guess I'll try again.

from stretto.

Well, it works now.

I changed nothing.

._.

Thanks!

from stretto.

Nope wait. Looking at your errors in the console I can see what's causing it.

See that first error, it's originating from the libs.min.js file.
Fixing that error will fix the issue.

Did you happen to re-run grunt? Because I'm trying to work out how it could have fixed itself...

from stretto.

Well, now the page loads and looks like this:

There still are errors, but it's different compared to what it was like before.

I didn't change a thing.

from stretto.

Okay so it isn't loading the slider library... Might also still be libs/grunt related.

On another note, how would we let users set their music library in electron? Still through the setting screen, or should we have some kind of folder selection?

from stretto.

Actually, I believe I added an explicit <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> to fix the issue.

At the moment, it's the same application, just framed in an Electron window, so it's still the same setting screen.

I'm not sure if Electron implements a folder select screen. If it does, then I can try to use it.

from stretto.

I just re-ran grunt, it said no errors:

Running "bower:install" (bower) task
>> Installed bower packages
>> Copied packages to /Users/mason/Desktop/node-music-player/static/lib

Running "copy:fontawesome_fonts" (copy) task
Copied 6 files

Running "copy:fontawesome_css" (copy) task
Copied 1 file

Running "uglify:my_target" (uglify) task
>> 1 file created.

Running "cssmin:target" (cssmin) task
>> Ignoring remote @import of "//fonts.googleapis.com/css?family=Raleway:400" as no callback given.
>> 1 file created. 142.06 kB → 128.52 kB

Done, without errors.

The slider issue is still there.

from stretto.

Okay... so we'll have to fix that hack, but sure works for testing it out.

Yeah all good, I'm just getting a few ideas of how to do things differently for an Electron application.

Does:
static/lib/seiyria-bootstrap-slider/bootstrap-slider.js
that file exist for you? because that's the slider lib it should be pulling into the libs.min.js

from stretto.

It exists for me.

The problematic code seems to be around line 407 in player.js:

  this.setScubElem = function(elem){
    this.scrub = elem;
    this.scrub.slider()
      /* disable seeking as soon as slide / click starts.
      * this was added due to an issue causing the slider to update to the old
      * duration even when a click was triggered because of the delay for the
      * slideStop
      */
      .on('slideStart', function(){ player.isSeeking = true; })
      .on('slide', function(slideEvt){ player.scrub_value = slideEvt.value; player.scrubTimeout(); })
      .on('slideStop', function(slideEvt){ player.scrub_value = slideEvt.value; player.scrubTimeoutComplete(); });
  };

elem appears to not have any attributes

from stretto.

but the error says: this.scrub.slider() is not a function. That means it's failing to load the slider library (because that .slider() function comes from there).

As a result anything using the slider won't work.

from stretto.

Ah, okay. Do you want me to try to explicitly load static/lib/seiyria-bootstrap-slider/bootstrap-slider.js as well and see if that helps?

from stretto.

Yeah maybe.
If that fixes it then something in libs just isn't loading / being generated correctly.

from stretto.

Well, I just tried it.

Still doesn't work.

from stretto.

I think it could be calling that code before the slider library actually loads. And so it'll still fail because the slider library hasn't been loaded before it is used.

Check the network tab to see what order files are coming in. And maybe try re-execute the code with something along the lines of: player.scrub.slider() and see if it works after everything is loaded.

from stretto.

I checked the network tab, the explicitly loaded slider plugin is coming way before any other scripts.

from stretto.

If it helps, this isn't working when I just normally run it and go to localhost:2000 in my browser.

from stretto.

Weird, Safari works...

from stretto.

Huh. That is weird.

What is the other browser you were trying? Chrome?

from stretto.

Yep.

from stretto.

Funnily enough, http://music.kaiserapps.com/ works just fine in Chrome, it's just my local version that has issues.

from stretto.

Maybe nuke all the libs and stuff that bower installs and re-run grunt?

On Fri, 9 Oct 2015 12:33 pm Mason X [email protected] wrote:

Funnily enough, http://music.kaiserapps.com/ works just fine in Chrome,
it's just my local version that has issues.

—
Reply to this email directly or view it on GitHub
#63 (comment)
.

from stretto.

Maybe nuke all the libs and stuff that bower installs and re-run grunt?

Err, how would I do that?

from stretto.

Look in the gitignore, and remove any of the files that match those rules.
Think that should do it.

On Fri, 9 Oct 2015 12:43 pm Mason X [email protected] wrote:

Maybe nuke all the libs and stuff that bower installs and re-run grunt?

Err, how would I do that?

—
Reply to this email directly or view it on GitHub
#63 (comment)
.

from stretto.

Gosh darn, nope.

I removed everything (node_modules, static/lib, bower_components), and then reinstalled it.

Still the same error.

from stretto.

Since this only happens with the latest versions, I may try to download a zipped version of node music player that I know works (the one that runs on my server).

from stretto.

Yeah, not a bad idea.

from stretto.

So, I just tried it.

I downloaded the zip of everything from my server (that I know for sure works) and extracted it in a folder.

The error is still there.

from stretto.

This might actually be an issue with bootstrap-slider itself. I will try and investigate.

from stretto.

@ohnx did you end up getting anywhere with this?

from stretto.

Not at the moment, no.

I think I might have some more time in the next week or so to work on it.

from stretto.

All good @ohnx, no rush.

On Wed, 4 Nov 2015 at 14:11 Mason X [email protected] wrote:

Not at the moment, no.

I think I might have some more time in the next week or so to work on it.

—
Reply to this email directly or view it on GitHub
#63 (comment)
.

from stretto.

Just stumble across this thread... You might have a look at this thread. Apparently Electron (specifically) doesn't like slider
http://stackoverflow.com/questions/32414344/how-do-i-use-bootstrap-slider-in-electron

from stretto.

@steveostudios Ah, thanks for that link.

This makes a lot more sense.

I'll take a look at this and try to use the workaround suggested.

from stretto.

Yeah. Also I think if its specifically bootstrap-slider related, you should place an issue on their repo. I did a quick search and they had no issues logged for electron.

from stretto.

I'll add one later.

In the meantime, I'll try the workaround mentioned by @steveostudios.

from stretto.

Oh, I need to modify the minified code.

I think I need to try something else...

from stretto.

Hey @ohnx , I'm working off your changes now and building an electron build. No promises tho ;)

For future reference to people looking for how to solve the jquery and bootstrap slider issues, turns out because in Electron the module global variable is set in the browser, it messes up jquery (and hence slider, because it uses jquery). The solution for me, because I didn't care about node-integration in the browser was to add 'node-integration' = false in my BrowserWindow options like so:

mainWindow = new BrowserWindow({width: 800, height: 600, 'node-integration': false});

Alternatively you'll have to require jquery (and the slider... not 100% sure how to do that) into the browser window directly, see: electron/electron#254

from stretto.

Closing as electron binaries have now been shipped.

from stretto.