EzDevInfo.com

Is it possible to export video with comments on overlay of video using popcorn JS?

I am using porpcorn JS for adding annotations on video, I have created overlay on video and all annotations are rendered on video. Is there any way so that I can export video with embedded html content inside an .mp4-file. So I can play that video in any native player like VLC?

Popcorn changing source

I'm trying to make one instance of a popcorn player that I can pass around to different parts of the page. My goal is to change the source of the videos but maintain the same triggers bound to the video element.

I've created a fiddle demonstrating the situation, on 'ended' I change the src in the source tag. Then, I trigger the video to play again, but instead of it playing the new video in the updated source, it plays the previos video.

How to make Popcorn.js work with Video.js on iPad

I can't use the native video player on the iPad because it steals all touch events and I need show interactive elements over the video. Using Video.js works for this purpose but, strangely, it stops Popcorn.js events from firing on iPad.

Install popcorn maker developer on windows

I'm a pure nooby in this but I would really need to install popcorn maker developer to be able to modify it a bit and use it on a website as a webapp.

Here is the git hub link to it: popcorn webmaker

I tried to follow their guide but it does not seem to work I install node, and think I install make-valet, I think it worked but I'm not sure. But when I try to $npm install I get this error:

$ npm install
npm WARN engine sqlite3@2.1.17: wanted: {"node":">= 0.6.13 < 0.11.0"}       (current: {"node":"0.12.0","npm":"2.5.1"})
npm WARN deprecated extend@1.1.3: Please update to the latest version.
npm WARN deprecated tap-consumer@0.0.1: this is merged into the 'tap' module now
npm WARN deprecated tap-results@0.0.2: this is merged into the 'tap' module now

> dtrace-provider@0.2.8 install C:\cygwin64\home\Me   \popcorn.webmaker.org\node_modules\messina\node_modules\bunyan\node_modules\dtra    ce-provider
> node-gyp rebuild


C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\messina\node_modules\bunyan\node_modules\dtrace-provider>node "C:\Program Files (x86)\nodejs\node_modules\npm\bin\node-gyp-bin\\..\..\node_modules\node-    gyp\bin\node-gyp.js" rebuild
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the  PYTHON env variable.
gyp ERR! stack     at failNoPython (C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:103:14)
gyp ERR! stack     at C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:64:11
gyp ERR! stack     at FSReqWrap.oncomplete (evalmachine.<anonymous>:99:15)
gyp ERR! System Windows_NT 6.3.9600
gyp ERR! command "node" "C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\messina\node_modules\bunyan\node_modules\dtrace-provider
gyp ERR! node -v v0.12.0
gyp ERR! node-gyp -v v1.0.2
gyp ERR! not ok
npm WARN optional dep failed, continuing dtrace-provider@0.2.8

> sqlite3@2.1.17 install C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\sqlite3
> node build.js

[sqlite3]: Checking for http://node- sqlite3.s3.amazonaws.com/Release/node_sqlite3-v2.1.a-node-v14-win32-ia32.tar.gz
[sqlite3]: http://node-sqlite3.s3.amazonaws.com/Release/node_sqlite3-v2.1.a-node-v14-win32-ia32.tar.gz not found, falling back to source compile (Error: Server returned 404)

C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\sqlite3>node "C:\Program Files (x86)\nodejs\node_modules\npm\bin\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild
Build failed
[sqlite3]: 1

> node-expat@2.0.0 install C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\webmaker-download-locales\node_modules\xml2json\node_modules\node-expat
> node-gyp rebuild


C:\cygwin64\home\Mee\popcorn.webmaker.org\node_modules\webmaker-download-locales\node_modules\xml2json\node_modules\node-expat>node "C:\Program Files (x86)\nodejs\node_modules\npm\bin\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at failNoPython (C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:103:14)
gyp ERR! stack     at C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:64:11
gyp ERR! stack     at FSReqWrap.oncomplete (evalmachine.<anonymous>:99:15)
gyp ERR! System Windows_NT 6.3.9600
gyp ERR! command "node" "C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd C:\cygwin64\home\Me\popcorn.webmaker.org\node_modules\webmaker-download-locales\node_modules\xml2json\node_modules\node-expat
gyp ERR! node -v v0.12.0
gyp ERR! node-gyp -v v1.0.2
gyp ERR! not ok
npm WARN optional dep failed, continuing sqlite3@2.1.17
npm WARN deprecated lingo@0.0.5: This project is abandoned
npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\\Program Files (x86)\\nodejs\\node.exe" "C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v0.12.0
npm ERR! npm  v2.5.1
npm ERR! code ELIFECYCLE

npm ERR! node-expat@2.0.0 install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the node-expat@2.0.0 install script 'node-gyp rebuild'.
npm ERR! This is most likely a problem with the node-expat package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node-gyp rebuild
npm ERR! You can get their info via:
npm ERR!     npm owner ls node-expat
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\cygwin64\home\Me\popcorn.webmaker.org\npm-debug.log

I really don't understand where the error is coming from. I installed node using the .exe file and when I $ node -v I get the 0.12.1 so it has worked but I'm not sure how to check the rest. This would help me so much !

Popcorn.js : Create a sequence of Vimeo videos

I'd like to use the popcorn.js API to create a sequence of multiple Vimeo files. As soon as a video ends, the next video as to load & play.

I have troubles figuring out how to do this. I wanted to use the "ended" event, but apparently, it doesn't work with Vimeo... So right now, I don't really know how to do, I'm not even sure I should use the popcorn.js API, that I chose only because of its footnote feature.

Can someone here help me?

Thanks a lot in advance !!

Use of Popcorn + jQuery for animations

I would like to use Popcorn.js which seems very handy for managing videos. I am now using the footnote method, everything is working fine.

     example.footnote({
       start: 2,
       end: 6,
       text: "Pop!",
       target: "layer"
     });

I want to animate the footnote created with jQuery (I would want the footnote to fadeIn/fadeOut, for example).

How would you manage that? I'm not sure if I can mix jQuery and Popcorn and I can't manage to find that much documentation... My only idea is to check with jQuery if there is some text inside my #layer div and then animate it but I'm not sure if it is the good way.

Thank you!

Popcorn was not injected in your file

While staging with grunt (grunt serve) I am getting:

Running "bower-install:app" (bower-install) task

popcornjs was not injected in your file.
Please go take a look in "app\bower_components\popcornjs" for the file you need, then manually include it in your file.

I have added Popcorn.js to bower.json:

{
    "name": "NAME",
    "version": "0.0.0",
    "dependencies": {
        "angular": "1.2.6",
        .
        "popcornjs": "~1.3.0",
        .
        "angular-slugify": "1.0.0"
    },
    "devDependencies": {
        "angular-mocks": "1.2.6",
        "angular-scenario": "1.2.6"
    }
}

So as to my index.html:

<s_cript src="bower_components/popcornjs/popcorn.js"></script>
<s_cript src="bower_components/popcornjs/modules/player/popcorn.player.js"></script>
<s_cript src="bower_components/popcornjs/players/youtube/popcorn.youtube.js"></script>
<s_cript src="bower_components/popcornjs/plugins/code/popcorn.code.js"></script>

.'.'

Am I doing missing something? The other libraries working fine.

popcorn.js start and stop times

Just started having a look at popcorn.js but having some trouble.

I've got a 30 second track,

however I'd like the file to start playing from 2 seconds in, and stop playing 3 seconds before the end.

Does anybody know if this is possible as I couldn't find it in the documentation?

Either that or is there a command to jump to a point in the timeline, so almost like

pop.playAt('2 second');

something like that?

Thanks

How to lock controls on

I want to pause the video being played at a particular instant till a question that pops up has been answered. The user should not be able to go ahead and forward the video till a particular question that has just poppped up has been answered.

So I can pause the video using JS at that particular instant. How can I ensure the video's controls are unlocked or the video plays again only after answering the question that pops up?

Change a Cue start time in Popcorn.js?

I need to change a Cue point in a video using Popcorn.js. Is there a way to edit the time of a Cue event already sent to he Popcorn player via the Cue() method?

Thanks!

Can Popcorn.js be used to add subtitles to a YouTube video?

Let's say we embed a YouTube video on a web page.

Underneath the video player, could we display subtitles synched to the video using a media framework like Popcorn.js?

Popcorn.js - How do I remove a cue?

I have added several cues to a video using popcorn JS. My question is, how do I remove or modify a specific cue?

Thanks!

How to select a track in popcorn.js using a string and play it?

So, here's the skinny:

Running popcorn.js on a youtube video and separate audio loops. Each one is a track like 'video' and 'audio1' etc.

I have user interaction over a sockets that is sending commands to the window as strings like "Play_audio1". This string is then parsed using split.

so we get:

var messageArray = message.split("_");

thus messageArray[0] is my command, and messageArray[1] is what track to do it to.

THE PROBLEM

I'm trying to execute the code to select the track using window, and run the popcorn function play() on it, but it aint working. Shoots back undefined.

case 'Play':
   window[messageArray[1]][play]();
break;

Where's my mistake here?

eval() works, but I heard it was the devil.

EDIT:

To help add to this, I'll include a popcorn.js track code:

var audio1 = Popcorn.smart( "#audio1", "audiofile1.wav",{
        frameAnimation: true
     });

and in your html you have

<audio id="audio1"></audio>

popcorn.js fills it with your selected file, and to play, you normally just use

audio1.play();

Open pop-up window while HTML5 video is playing

I'm using popcorn.js to provide some interactions with HTML5 video. While the video is playing, I'm trying to get another window (with another video) to open at a certain time point and then close x number of seconds later. Basically, I'm trying to recreate the functionality seen here: http://thewildernessdowntown.com

The issue I'm having is that my pop up window is being blocked by Firefox's pop-up blocker. How can I get around this? Again, I'll refer back to http://thewildernessdowntown.com because their windows open up fine, but I can't figure out what they're doing.

Here's some pretty basic code that I have:

document.addEventListener('DOMContentLoaded', function() {

    var $popcorn = Popcorn('#video');

    $popcorn.code({
        start: 6,
        end: 12,
        onStart: function() {
            window.open('window.html','window','width=400,height=200');
        },
        onEnd: function() {
            window.close();
        }
    });

}, false );

Any help would be greatly appreciated. Thanks!

Popcorn constructor syntax

Any idea why this is not firing autoplay? It's my first time using this plugin but I thought I had the syntax right...?

<html lang="en">
<head>

    <script src="support/jquery-2.0.3.min.js"></script>
    <script src="support/popcorn-complete.min.js"></script>

    <script>

    $(document).ready( function() {

        var popClip = Popcorn("#sampleClip", {
            autoplay: true
        });

    });

    </script>

</head>
<body>

    <video id="sampleClip">
        <source src="..sample.mp4">
        <source src="..sample.ogv">
        <source src="..sample.webm">    
    </video>

</body>
</html>