Wrap up

Blog entry December 13

I felt sick on Saturday and needed to spend that day to get some rest though I spent Sunday and Monday working on Milestone 4.   My goal for the milestone was to clean up my code and perhaps get started on the unit tests.  Unfortunately, the cleaning up of the code took longer than planned and with exams to prepare for at the end of the week, work on the unit tests had to be scrapped.   Getting rid of the left over Vimeo code turned out to be a lot more time consuming than anticipated and in the end I could only manage to remove the bits of code that handled functionality for the Vimeo player that would be of no use to my slideshow player such as methods for controlling volume, play, pause, etc… as removing more than that would break either or both the slideshow player and the popcorn event manager.   My entire process of cleaning up the code thus consisted of make my edits and then checking if either the slideshow itself or any of the popcorn event handlers broke.  So far everything seems to be working.    The cleaned up code has been uploaded to my github repo.
I’ve also gotten started on the wiki for the slideshow player.    Because this is a totally new project my wiki was started from scratch.  I used the project wiki example posted on the instructor’s website for an idea on how to set it up.   Hopefully this will provide the next person who picks up this project (or maybe myself since I plan on picking this up over the summer should I not wind up in co-op)

http://zenit.senecac.on.ca/wiki/index.php/Popcorn_slideshow_player#Project_Leader.28s.29

While working on this, I also worked on my student wiki on Monday.

http://zenit.senecac.on.ca/wiki/index.php/User:Dennis_Villasenor

I'm not sure if it will be appropriate to post the project wiki link to the lighthouse ticket for this though it does make some sense as that will be the first place anyone who picks up this project will look.  I'll ask around first and try to see if that is ok or if there is someplace where I should post a link to the project wiki.

 As an aside, here is a link to a demo of the slideshow player in my matrix account.   It may or may not ask you for a password however (I really should talk to helpdesk over fixing whatever I probably broke in my matrix account over the summer during BTI220)

http://matrix.senecac.on.ca/~dvillase/decairos/players/slideshow/popcorn.slideshow.html

My many mistakes in my effort at testing mouselock

I didn’t get far at all in my work at debugging mouselock, I just ran into a massive stumbling block right at the very start of my attempt which could have been avoided by asking a few very simple questions on IRC.

So I got assigned to work on developing a test that would handle whether or not the mouse cursor was disappearing/ reappearing depending on whether or not mouselock was activated.  Sounded simple enough.   Because there was no way that anybody currently knew how to test for the visibility of the cursor it was going to be a litmus test.  So I think to myself, OK, I’ll work on a js that will call up mouselock with a button the user can

After reading through the instructions I realized that I needed to do a rebuild of Firefox, and that’s where my misadventure with testing mouselock began.  For some stupid reason I kept trying to build it not from the mozilla build shell but from Git and the windows command line with the predictable failure to compile.   I could have asked on IRC but I just didn’t because it felt like I was asking an incredibly stupid question.  Something I was supposed to have known from weeks ago, after all I did manage to get a build up and running mid November.  There’s also the fact that I was pretty convinced that what I was doing was the correct way of doing things and that it was probably something else causing the problem. (a necessary executable like gmake missing or autoconf).  It wasn’t until Diogo gave me a good swift kick in the butt on Skype while talking about our BTS assignment that I finally got on IRC and after managing to talk with Humph finally figured out that I needed.   Unfortunately though, it had been almost a week since and my test component was by that point long overdue.   So four wasted days of me scratching my head and essentially being clueless about how to rebuild mozilla-central could have been averted had I asked early on for assistance.

I hope this blog entry doesn’t come off as whiny or sound like I’m  trying to excuse my utter lack of progress on the testing work that I volunteered to do.  I’m not,, I just want to have this entry as a reminder to myself of the glaring flaw in how I’ve been approaching my work that I should learn to overcome.

Moral of the story is, not asking that stupid question can often times end up making you seem like a much bigger idiot.

Finally, my player is playing a slideshow

I finally managed to get a slideshow playing.  It took me damn near three weeks to do it but I finally manged to get it done.

The mistake I've been doing for the past few weeks had been trying to shoehorn the following swfobject statement into into my slideshow application.

swfobject.embedSWF("http://static.slidesharecdn.com/swf/ssplayer2.swf" ,"player","598","480","8",null,flashvarsabc,paramsabc, attsabc);

This was from the API documentation provided by slideshare here http://www.slideshare.net/developers/playerapi.  Unfortunately, it turns out that what I was supposed to have been using was the way the embedSWF was being invoked in the vimeo and youtube players, the only difference being that the player definition defined in the first parameter of the function call points to the slideshare player http://static.slidesharecdn.com/swf/ssplayer2.swf and instead of using clip_id: I would be using doc since the slideshow is a document not a video.

so my call to swfobject embed should have looked like this

     flashvars = {
        doc : vidId,
         show_portrait: 1,
        show_byline: 1,
        show_title: 1,
        js_api: 1,
           js_onLoad: 'Popcorn.slideshow.onLoad',
         js_swf_id: containerId
      };
      params = {
        allowscriptaccess: 'always',
        allowfullscreen: 'true',
        wmode: 'transparent'
      };
     
      alert("vidId " + vidId);
        swfobject.embedSWF( "http://static.slidesharecdn.com/swf/ssplayer2.swf", containerId, self.offsetWidth, self.offsetHeight, "9.0.0", "expressInstall.swf", flashvars, params, attributes );


In order to play a slideshow via a javascript, you cannot use the http uri to embed it but instead must use the doc id which can be obtained by going into slideshare, opening the slide you wish to embed and clicking on the embed options and then copying the line of code that lets you embed onto wordpress blogs.  See Screenshots below on how to do this

 So instead of the url of the slideshow you would enter a line similar to the one below


[slideshare id=602208&doc=thirst-1221628161155588-8]

The only snag I have right now is that my player, which really is just a modified version of the vimeo player, only works if a url is passed to it.   So the above line of code won't work but

http://www.slideshare.net/andrearsya/thirst-upload-800x600-1215534320518707-8-1864524

will work.  However as you can probably notice there is a significant difference between how the url and embed script versions identifies the slideshow.  To bypass this I'm passing a hybrid of the two that essentially puts the embed doc ID and combines it with an http url to slideshare like so:

http://www.slideshare.net/slideshow/thirst-1221628161155588-8

I'm not sure if this is acceptable or not and right now is serving as an interim solution to get the player to play a sldieshow  A better solution would be one that lets the user just copy the embed code like I specified in the above two slides, take the entire string (ie: slideshare id=602208&doc=thirst-1221628161155588-8) and pass the ID string at the end to parameter doc: in the params definition.   I'll need to talk with one of the popcorn developers on how to do this.


I'm hoping to be able to push this through sometime this week, next week at the latest.   There's still quite a bit that needs to get done.  Now that I've managed to get the slideshow playing I'll need to define the method that will let the user jump to a specific slide via popcorn.  I'll also need to clean up my code as well as define the unit tests.  Those items I'm planning to work on for my 0.4 release (although the version I would be pushing this week after cleaning the code up and doing some minor tweaks and fixes would technically really be a 01 release wouldn't it?)

Hopefully the stuff I've posted makes some sense,  it's 3AM as I post this and I'm starting to fade out.   Anyways, I'm just glad I finally managed to get this thing showing a slideshow.  I know I was supposed to be working on the mouselock functionality for firefox as well but after my instructor showed me how to properly run swfobject (apparently it has to be run via http:// and not from file:// like I've been doing for the past few weeks) everything began to come together and I just had to spend the past few days working on this thing.

I've built it, now it's time to break it

...and modify it with the mousetracking stuff, provided I can figure out how to do it.  I'm probably the last one in my class to finally do it but I've finally managed to build firefox.  Huzzah!

   Now if only I could get the same level of success with getting my slideshow player running.

Catching up with my blog posts

In all the chaos that's been going on I just realized that I've been missing posting my blogs for the past 2 weeks now.  Anyways, a quick recap of what's been happening since.

Over the break I looked into how slideshow implements slides and it is done by a flash embedder called swfObject.js.  At first I thought that this is what actually implements the slideshow and is what I should be editing to get the wrap the baseplayer features for the slideshow but after looking at the youtube and vimeo players and doing some tests and experimentation I later found out that this file just embeds the flashplayer that plays the slideshow.   In fact I don't even need this file as I can do what the other players are doing and call this .js file through "//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"" using the popcorn.getScript method.

Now the snag that's been causing be grief for the past week and a half.  I still can't get it to run.  More specifically I seem to be getting a problem getting swfobjects to properly embed and play flash via a .js file.  Neither the youtube, vimeo nor my slideshow player are displaying their contents.  At first I thought that this might be due to me using an older none functioning version of the players, but after cloning again from the develop branch of the repo I'm still not getting any output from any of those players.   I suspect it could be a configuration issue on my laptop where I do most of my work but my lack of success in getting any of the players to also display their flash content on any of the school computers and my desktop at home undoubtedly means that I'll need to seek some clarification from either David or Chris on how to properly  run these players.

I'm sure there's more things that I've done and discovered with this player but I haven't had much sleep in the past few days and I'm drawing a blank right now, if anything comes up I'll add it in another blog post later this week.    I still need to do another recompile and debug of firefox which I'll be posting about sometime this week anyways.

One other thing I still need to do but ended up neglecting is my wiki.  For some silly reason I totally forgot that we had to create a wiki for this course, I'll be working on that if I get the chance tomorrow afternoon during the break in between my classes.  If not then then by the evening for sure as well as do an update of the ticket for the slideshow player.

Couldn't successfully build Firefox

My attempt to build firefox took me around 8hrs, the bulk of it spent downloading all the materials from mozilla's Mercurial repository and the actual installation itself.   Judging from the error message it appears that the installation failed due to it missing a couple of files.  I'm not sure though if this was due to an incomplete or erroneous download of the repository or caused by an error with the build itself.  I do suspect the former as I did mistakenly stop the download earlier due to it taking so long that I thought that the download had hanged.

I'll make another attempt tomorrow evening starting with a redownload of the repo and try to figure out what went wrong. 

Charging ahead

After a few missteps and misunderstandings it looks like I now have a handle on what to do for slideshow.js, hopefully I'll have enough time to get something ready for 0.2.  It appears that my initial understanding of how slideshow will operate was totally off;  as it stands I will only need to work on one file called popcorn.slideshow.js that will be responsible for playing the slides created by the user using slideshare; with the slideshow itself being provided to my application via a link from the slideshare site.   All the events such as the time interval to pass between each slide or if the slideshow is manual or auto will be set when the slideshow is created in slideshare. Slideshow is only responsible for playing the slide and attaching popcorn events with Baseplayer.js handling the video events (play, pause, mute, etc..) that  the user may wish to include with their slideshow.


I've looked at the different players and plugins for ideas on how to implement this and off the players currently in popcorn, it looks like the Vimeo and Youtube players are the closest to what I'm doing for slideshow.js.    Both are embedding videos from an external sources and adding in additional functionality via the plugins.  Of course mine will be embedding a slideshow with some video elements (which makes looking at how these players run a pretty good idea).  The Vimeo player itself has an anonymous constructor that accepts up to three parameters that relate to how the vimeo video will be played as well as the link to the video iteslf

(ie: from an html page creating an instance of the Vimeo player -->var player = Popcorn( Popcorn.slideshow( "player_1", "http://player.vimeo.com/video/11127501")

This won't be unlike how slideshow will work(intially anyway).   The html page will create an instance of slideshow.js which will contain point to a link to a slideshare slideshow which will in this case contain a link to a slideshow which will be embedded into the html page.   When I last looked at the slideshow site, they do provide you with the javascript to add to your website to show a slideshow in your website so there's another resource I can use.


I'm currently going through the vimeo player code right now and cutting and pasting bits of it to see how it works as well as the html file that runs it so I have an idea on how to create my own html file to test if my slideshow player is running.   I have yet to create a unit test, I'll work on one soon enough right now I'd like to play around with cutting and pasting code from the vimeo and youtube players onto slideshow.js and slideshow.html and try to see if I can figure out how to load a slideshare slideshow.