search

OpenNewsLabs / autoEdit_2

Fast text based video editing, node Electron Os X desktop app, with Backbone front end.
https://opennewslabs.github.io/autoEdit_2/
MIT License
421 stars 56 forks source link

Windows Version of autoEdit #44

Closed pietrop closed 6 years ago

pietrop commented 6 years ago

After @probonopd help in making a Linux version, see issue https://github.com/OpenNewsLabs/autoEdit_2/issues/36, for 1.0.8 release, and @sedubois, @jsdephillips, @sqr interest in a Windows version, thought I'd open a separate issue to see what it would take to make a Windows version.

Reporting here things that might need to be done to do Windows version

sqr commented 6 years ago

Hello, thanks for listening to our requests! As a Windows user, is there any way in which I can help or test the software?

pietrop commented 6 years ago

Hi @sqr, How comfortable are you with node js and electron?

Do you have a windows machine?

Would you be ok compiling a build for the app on Windows and checking that it all works fine? If Not, I can give you more detailed instructions on the steps to follow.

sqr commented 6 years ago

Hi @pietrop

I do have a windows machine. As far as node.js, I have it in a separate machine that I use as a server, but don't really know that well about it. In any case, let me do some research on how to actually use node.js and install electron/compile an app, any helpful links are appreciated :)

sqr commented 6 years ago

quick update @pietrop

Managed to download 1.0.9 and compile it using electron packager on Windows

capture

The four first links don't work, as well as the "Toggle Navigation". Anything under "Donate" and "Help" works. My guess is that I should compile a specific build designed for Windows instead of the one I compiled. Is that right?

Let me know if I can assist you with anything else and thanks again!

pietrop commented 6 years ago

That's great, thanks @sqr !

Try this

Let me know if that makes sense, or any of that is not clear.

If that works, first thing to try is

Since bootstrap is not showing my best guess is that, it is one of the path issues I was referring to in previous posts. os x and linux use / and windows uses \. We can use the path module ( official docs ) to delegate that logic to path.join (official docs path.join).

You could you try and change this line, in the index.html line 13 to be 

  if (window.process !== undefined) {
    // we are in the browser, eg in the demo page
    document.write('<link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">');
  } else {
    // we are in electron, node environment, as `.process` is defined.
    var path = require('path');
    var bootstrapPath = path.join('..','node_modules','bootstrap','dist','css','bootstrap.css');
    document.write(`<link rel="stylesheet" href="${bootstrapPath}">`);
  }

from line 13 to 17 can replace the all block.

Let me know if you have a chance to try this out, and if you have any questions on any of this. Thanks for your help, much appreciated!

sqr commented 6 years ago

hello @pietrop I just wanted to update you a bit on this.

I have managed to fix the display of the CSS, so now it looks like this

capture

However now i get this error

capture2

Instead of packaging the way you told me to, I've done it using the electron-packager module, do you know if this will affect in some way?

I will download the linvodb3 module and try again tonight and let you know how it goes.

pietrop commented 6 years ago

That’s awesome! Thanks @sqr,

So in theory every module that has been added autoEdit should install when you run npm install, so you shouldn't need to install separately. (As you can see it's here in the list of dependencies in package.json -124)

If it doesn’t find it, it could be the module, in this case linvodb3 might not be compatible with Windows.

Having had a look in the repo of original module and under issues, it seems like it should work whith windows. See these instrucitons.

Let me know when you have a chance to try that out.

I am not familiar with the  electron-packager module but for development, it's pretty inefficient to have to package the app everytime you want to check if something works especially if there's quiet a bit of debugging to do. So it might be much more preferable to run npm start.

Then when you are done build it with npm run build:win, this will create the .exe file in the dist folder.

The build step this way follows a bunch of setup instructions in the package.json that add the right version of the ffmpeg and ffprobe (two dependencies for video editing) that might be missed out if simply use electron packages.

could you try in terminal from the folder of this project's repository

and then let me know if you get the same console errors? with another screenshot

Also let me know if any of this is not clear, happy to explain in more details.

sqr commented 6 years ago

Hello @pietrop, quick update.

I realized there were several things I was doing wrong, in regards to the dev environment in general and dependencies. With that out of the way and the CSS issues fixed, as far as look&feel and interaction, it seems to work!

I am waiting for my IBM Watson credentials so in the meantime I decided to try with Pocketsphinx. I get the following error, tried to find a workaround by myself but so far I haven't found a way.

capture

The transcriptions section show the name and it keeps spinning forever and wont let me delete it. However, files are created in transcription.db, paperedit.db and media folders.

Thanks!

pietrop commented 6 years ago

Thanks @sqr ! That's awesome, looks very promising!

Re-pocketsphinx, for background, I wouldn't expect it to work on windows, as the binaries it uses (and this bin) has been compiled for mac os x, and it would need for the app to be packaged with the windows binary for it to work. Which I don't have, and don't know how to make.

This was initially extracted as a component to add to autoEdit, from videogrep os x electron app, see http://saaaam.s3.amazonaws.com/VideoGrep.app.zip in readme.

However adding pocketsphinx as an opiton to autoEdit, was more of a prof of concept for offline local transcription, as it is not very accurate as is. With the thought that if one could change the language model for the pocketsphinx module with a better trained one it could become a valuable alternative.

I think the module could also be used in the future to help with alignment when adding existing plain texts without timecodes, if I get around adding that feature.

re-tests on windows, could you try with Speechmatics?

See the setup instructions for Speechmatics in the user manual, it's much easier to get credentials then with IBM.

Speechmatics also gives you 60 min for free when you sign up so that could be good for a quick test, to see what comes up in the console.log if it doesn't go through.

Let me know how it goes, or if you have any questions.

sqr commented 6 years ago

It is working with Speechmatics! And pretty accurate!

image

I am going to tinker with the different options and workflow and let you know of any weird stuff I find! It's amazing! If there is something specific you want me to look for let me know.

I also tried packaging it with the method you mention and no issues so far :)

pietrop commented 6 years ago

Fantastic! Thanks @sqr !

Ok, so it seems like now that we know it works on Windows. I'd like to package it and add it to the release section so that others interested in this can also use it on windows, such as @sedubois, @jsdephillips.

@sqr can we recap what are the steps you did to get it to work? And any other things you might have changed in the code base?

In development

And that was it? or did you change or do anything else to get it working in development on a windows machine?

In Production, to package it for windows as a .exe file

Ok, let me know if that all worked as expected or fi there's any other changes or tweaks that you did to get it working, so that I can look into @probonopd idea in issue https://github.com/OpenNewsLabs/autoEdit_2/issues/36 about setting up automatic continuous deployment using CircleCI.

jsdephillips commented 6 years ago

Great news! Thank you for making this happen.

Will we be able to use the same credentials we have for the Mac version?

Jacquelyn On Sun, Apr 22, 2018 at 5:56am, Pietro < notifications@github.com [notifications@github.com] > wrote: Fantastic! Thanks @sqr [https://github.com/sqr] !

Ok, so it seems like now that we know it works on Windows. I'd like to package it and add it to the release section [https://github.com/OpenNewsLabs/autoEdit_2/releases] so that others interested in this can also use it on windows, such as @sedubois [https://github.com/sedubois] , @jsdephillips [https://github.com/jsdephillips] .

@sqr [https://github.com/sqr] can we recap what are the steps you did to get it to work? And any other things you might have changed in the code base?

IN DEVELOPMENT

And that was it? or did you change or do anything else to get it working in development on a windows machine?

IN PRODUCTION, TO PACKAGE IT FOR WINDOWS AS A .EXE FILE

Ok, let me know if that all worked as expected or fi there's any other changes or tweaks that you did to get it working, so that I can look into @probonopd [https://github.com/probonopd] idea in issue #36 [https://github.com/OpenNewsLabs/autoEdit_2/issues/36] about setting up automatic continuous deployment using CircleCI [https://circleci.com/] .

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub [https://github.com/OpenNewsLabs/autoEdit_2/issues/44#issuecomment-383369134] , or mute the thread [https://github.com/notifications/unsubscribe-auth/AkUjvfU5QOQYMwNyLfaBaYyaEkBeQRiUks5trFO6gaJpZM4TLF5a] .

sqr commented 6 years ago

Hello @pietrop sure, let's do a quick recap on the steps.

Finally, I didn't have to add the css fix you provided, it is working with the default index.html. I think in the beginning the CSS wasn't displaying because all sort of stuff was missing and my environment was not properly setup.

At the moment I have the app working with the css referenced like this capture

which if i'm not mistaken is the default way.

I basically just had to run npm install and then do an npm run start and the app is working without me having to modify the code. I had several issues but I think it was all me and dependencies and the environment, nothing code-related.

As far as packaging goes, the only thing I had to do was modify the default icon.ico on autoEdit_2-1.0.9\build , as running npm run build:win with the default icon returned an error.

After packaging and running the .exe i'm able to get it to work with speechmatics after running /dist/win-unpacked/autoEdit2.exe. However, if I try to run the installer (/dist/autoEdit2 Web Setup 1.0.9.exe) I get the following error

image

pietrop commented 6 years ago

@sqr that's great!

So

Next Up

sqr commented 6 years ago

Hello @pietrop

It works out of the box! you double click it and the app is loaded, the directory structure looks like this

capture

.ico files are not supported on github comments, I put together a quick icon you can use, you can access it here. It will be faster than doing a PR

I will keep testing in windows and let you know if I run into issues! Thank you very much again and let me know If I can help in anything else

pietrop commented 6 years ago

Thanks @sqr !

sqr commented 6 years ago

No problem @pietrop! I didn't realize you already had an icon for the software, so i've gone ahead and converted to .ico, you can find it here

I have tried moving the .exe to a different folder and the software doesn't run, it says it cannot find node.dll and ffmpeg.dll, so it seems like it is not standalone.

pietrop commented 6 years ago

Thanks @sqr !

In package.json L98 is where the type of windows application settings are specified. These are used when running npm run build. 

   "win": {
      "target": "nsis",
      "icon": "build/icon.ico",
        "files": [
        "node_modules/ffmpeg-static/bin/win/${arch}/ffmpeg",
        "!node_modules/ffmpeg-static/bin/win/ia32${/*}",
        "!node_modules/ffmpeg-static/bin/linux${/*}",
        "!node_modules/ffmpeg-static/bin/mac${/*}"
      ]
    },
    "nsis": {
      "perMachine": true,
      "oneClick": false
    }

At the moment it uses nsiswhich is supposed to be an Installer. It be good to try with portable option, which is described as a portable app without installation. 

   "win": {
      "target": "portable",
      "icon": "build/icon.ico",
        "files": [
        "node_modules/ffmpeg-static/bin/win/${arch}/ffmpeg",
        "!node_modules/ffmpeg-static/bin/win/ia32${/*}",
        "!node_modules/ffmpeg-static/bin/linux${/*}",
        "!node_modules/ffmpeg-static/bin/mac${/*}"
      ]
    },

More details on the electron builder options to package windows applications here

sqr commented 6 years ago

Hi @pietrop I tried to run npm run build but got an error. I have attached the log and the package.json file, maybe you can find why it fails! I tried to find a solution but didn't know exactly where the problem is.

Thanks! 2018-04-29T00_19_51_975Z-debug.log package - Copy.txt

pietrop commented 6 years ago

Ok, thanks @sqr , I had a look, and I think there's a trailing comma , that should not be there in package - Copy.txt on line 104, and that might be effecting the compiling

Try with this one package.json.txt (first remove the .txt extension) and that should work, or might give some other build errors. let me know.

sqr commented 6 years ago

That was it! Now I got a 120MB .exe file that I can move around and execute on its own from any directory and it works!

pietrop commented 6 years ago

Ok, I think I found a way to build/deploy/compile for windows, while being on Mac.

But can't check it it actually works.

@sqr could you download and try out this windows release I just uploaded ?

sqr commented 6 years ago

@pietrop doesn't work for me, it tries to locate node.dll and ffmpeg.dll

pietrop commented 6 years ago

ah, ok, thanks. I think it's coz it's not fully packed, I am trying repacking by changing 

"build:win": "build --win nsis-web --x64",

to 

"build:win": "build --win portable --x64",

in package.json but I get a file that is 77.8 mb which I uploaded to the previous release as autoEdit2-1.0.10.exe.zip you can try it but I don't think it's going to work. Need to have a better look into it.

Anyway, for now good to know it's possible to package it on windows for windows.

pietrop commented 6 years ago

Closing this for now in favour of #55