NonverBlaster: Simple videoPlayer with fullscreenMode
Warning! I don’t support this version any more!
Go here to get my player and support and all the rest.
My main aim was to make the videoPlayer easy to adjust without opening Flash. Therefor, I made it possible to change the size, the source and all colors of the controller in the javascript-snippet used to embed it into the »container.html« file.
For the video source you can use *.flv and *mov (h.264 codec) files.
The code for the video source
player.addVariable("videoSource", "http://www.yourdomain.com/yourmovie.flv");
Code for setting autoplay (default: true) and allowSmoothing (default: true) to true or false
player.addVariable("autoplay", "true");
player.addVariable("allowSmoothing", "true");
The code for the colors
player.addVariable("normColor", "000000");
player.addVariable("loaderColor", "cccccc");
player.addVariable("specialColor", "ffffff");
player.addVariable("backGroundColor", "ff3399");
player.addVariable("fullSrceenSpecialColor", "ffffff");
You just choose your colors for example in Photoshop and copy/paste the HEX-Codes, so for example red would be »ff0000«. The codes in the example above would make the controls look like this:
This player is open source, you can use it in every kind of project you like. The only thing I’d like you to do for me is to post a link from your project to this post saying something like »Videoplayer powered by NonverBlaster« and post a link to the project in the comments of this entry, so that I can see, what your favourite color scheme is ;)
If you have any questions or suggestions, just ask me…
P.s.: Thanks to André Michelle for the simpleMouseEvent class!
Updates since the first Upload
- 30.06.08: I fixed two bugs: If searching the video close to the end it used to hide the navigation bar and show the restart button, fixed. Moreover the sound was not muting when searching, I think this was a bug in the new flash player release, fixed now as well.
- 30.06.08: All code commenting is written in english now
- 28.03.08: Today I added a custom ContextMenu with functions like toggle FullScreen, toggle Sound, toggle Smoothing and a nice link to this post ;)
- 27.03.08: New function added to set allowSmoothing to true / false
- 14.01.08: Since today there is a VolumeControl included. I’m not sure if I should make it possible to activate/deactivate the VolumeControl in the javascript snippet, if you think so, please drop me a line!
- 09.12.07: New function added to set autoplay to true / false
 |
This player is licensed under a Creative Commons License. |
November 14th, 2007
NonverBlaster: Open Source FLV-Player mit Fullscreen Modus…
Über einen Link im Flashforum bin ich auf einen hübschen FLV Player gestoßen. Er ist sehr einfach einzubinden, da er mithilfe von Javascript-Parametern gesteuert wird. Folgende Optionen werden angeboten:
Name der Videodatei
Größe des Players
die …
November 30th, 2007
How do I make sure that the video will not autoplay?
December 8th, 2007
Hey Lars,
I will include a function for autoplay true/false very soon, how could I forget this???
Greatings, Rasso
December 8th, 2007
Hi,
thanks for the great Player!!! It even works with H.264 content. I put up a test here:
http://www.navision-blog.de/2007/12/07/h264-video-mit-fullscreen-flv-player-2/
Click: “Hier Testen” (German)
P.S. The Autoplay Feature would be cool :)
December 9th, 2007
OK, the newest version has a built in autoplay function. Hopefully it works fine, I didn’t test it too extensively…
December 30th, 2007
is there a way to show/include a preview jpeg?
LG; Thomas
December 31st, 2007
Hey Thomas,
no, since I wanted the implementation of the player as simple as possible, I didn’t include a feature for a preview-image. But you could include a .jpg as a background-image for the div using CSS.
I haven’t tried this yet, but maybe… ;)
January 14th, 2008
Since today the player features a sound control. I’m still not shure if this is necessary… What do you think?
January 15th, 2008
Hi, gratz for the player. it’s simple and looks very nice. I’m trying to run it and I have a problem.. the player do not load the video (flv) that I put in the videoSource… always shows the loading icon.
here you can see a test:
http://www.flashgamesbox.com/video/NonverBlaster/container.html
What I can make?
Thanks. and sorry for my english.
January 15th, 2008
Hey MrReview,
I tested your file and it seems to be a problem with your .flv-file maybe re-render it, the source movie should NOT use the h.264 codec…
Maybe try to use another file first?
Good Luck, Rasso
January 15th, 2008
Hey, tested it, Works like a charm great stuff. Thanks for Sharing
January 17th, 2008
Hi Nonverbla,
great player. I used in a client’s project to show film trailers, animations and music videos (http://www.ish.fm/). Works fine also in fullscreen. Thank you!
Sincerely,
Eric
February 6th, 2008
Hello
Hi Nonverbla
I like your player very much in this simple designe. But i wonder how to put it in in my web-site, I build with iweb8, can i do it with an iframe, or with an html snipet. I’m a very beginner in doing my web-sites, so i’m not used to do it. There are similar players i managed it with the html snipet, but here i dosn’t work.
Do you have an adwise please, thanks and
greatings, H.G. Marx
February 6th, 2008
Hey Horst Günter,
since my player is ment to be XHTML-valid, it uses the javascript file SWFObject to embed the .swf in the html-document.
There is a file called »container.html« in the download folder, there you can see how to embed the player using swfobject. Don’t forget to include the file swfobject.js in the header of your html-file, otherwise it won’t work.
good luck, Rasso
February 6th, 2008
Hi, great player !
but just question how to use with FMS3 server ?
it’s possible ?
Great work again !
February 9th, 2008
Hi!
I wanna just your player on my webpage. Now I have a problem, because i want a menu with a div which is hidden and when i hoover the button for the menu the div gets visible. But this div is under the video player -.- i have tried everything with z-index and so on.
i have found a solution for this problem here:
http://www.dmxzone.com/forum/topic.asp?topic_id=31232
how i can i make it work with your player?
thank you!
Ralph
February 9th, 2008
Hey Ralph,
just add this in the javascript-snippet:
player.addParam("wmode", "transparent");this should work in combination with z-index (hopefully..;)
February 9th, 2008
yeees :)) thank you!
works perfectly :D
February 12th, 2008
[...] nonverbla.de – OpenSource Player [...]
February 17th, 2008
Hi Nonverbla,
thanks for your reply, now i managed my problems with your player, i will use it in an i Frame. The most important experience for me was, that you only can convert the video files to flv with the original Adobe Flash CS3 Video Encoder, otherwise the the player doesn’t play the flv-files. I tried it with some converters like ffmpegX and others, but it didn’t work. Finely i used the Adobe Video Encoder and all Problems are gone.
Now I wonder, what is the best rendering for the Videos, i didn’t find the best solution jet.
My videos are not as brilliant as on your friends Site http://www.freisprung.com and this http://www.ish.fm/ site. Do you have an advise how to render the Videos best.
I used as source an DV file and tried quite a lot different solutions, but I’m not pleased jet.
Thanks for your advise,
all the best Horst G.
February 19th, 2008
HI, nice Player so far. But how do i set the Scale Param? A API or some sort of Documentation about all you accepted Params would be nice, didn’t you think?
Thanks
February 19th, 2008
Hey Dr Reich, until now, it was just possible to embed the .flv file in it’s original size into the browser.
If you want it to be scalable, just tell me and I will do something about it, as soon as I’ve got some spare time!
February 19th, 2008
@ Horst Günter:
If you encode your .flv file, don’t use one of the encoding-presets, but the »advanced settings« You need a data rate of circa 1000 kilobits/sec to get results like in the example above.
February 19th, 2008
Ok, thanks.
then i recode my movies in the right size ;)
BTW: Its DrDeich not DrReich, even if i am a german :) :)
March 5th, 2008
Hey Rasso –
your stylish but simple player is a dream come true – we’re glad we can use it on our freelance website.
Thanks for this great piece of work!
Cheers,
Philipp
March 5th, 2008
http://www.doernerbielefeldt.com
(in case you wanna take a look…)
March 5th, 2008
Hey Philipp, looks nice!
I’m always happy to get some new fun jobs, so don’t hesitate and talk about me! ;)
March 5th, 2008
Hey Nonverbla,
thank you for your great video player! But although it is very easy to embed in a website, on a server it is a mass. I have to load up all the flash files (Source, DS Store,..), the swfobject and the video in the same folder.
So I want to know: It is possible to save the video, swfobject and flash files in different directions?
Sorry for my bad english. ;^)
Yours sincerely,
Granner
March 5th, 2008
Hey Peter, You just need to upload the .swf file and the swfobject.js, no need for the source or the DS.Store (Which is just a file for MACs).
The mess shouldn’t be to big, especially because you can use the same swf every time you embed a video.
March 5th, 2008
Thank you, for that quick reply Nonverbla. You see, I’m a n00b in ActionScript 3^^.
But what is if a Mac OS visit my Homepage – or is it because of Apple’s Safari – can’t he see my video? I’m not a friend of Browser Hacks (most time not valid). And what is with Linux
Hope you have an idea.
BTW: I send you my websiteadress when it’s ready!!
Yours sincerely,
Granner
March 5th, 2008
it should work on every machine and OS, thanks to swfobject!
March 9th, 2008
Here is my link. http://tpb.kilu.de/home/tpb/html/test.html
How you can see it didn’t work, but I don’t know why. I think I embed the code correctly, didn’t I?!?
Please help me!!
Yours sincerely,
Granner
March 9th, 2008
@ Peter:
you should read what you use! replace the Line
player.addVariable("videoSource", "src="http://tpb.kilu.de/home/tpb/media/videos/why.flv");withplayer.addVariable("videoSource", "http://tpb.kilu.de/home/tpb/media/videos/why.flv");(see the difference?) Moreover, the link to your flv is dead, you should use one that works ;)
March 9th, 2008
Okay^^!
I think I shouldn’t work so late any more! :)
March 11th, 2008
Glad you like our site and your player in it! Sure we’ll think of you, though we’re just getting started… same vice versa would be great…
Cheers & thanks again for sharing the player,
Philipp
http://www.doernerbielefeldt.com
March 24th, 2008
is this written with new video hardware acceleration thingy?
http://www.adobe.com/devnet/flashplayer/articles/hd_video_flash_player_print.html
March 24th, 2008
@dim:
yes, I think so…? Can’t find the difference. If you do find something, please inform me;)
March 24th, 2008
unfortunately flash and action-script is all greek to me :), ill see if i can figure out something with staring at cpu usage using different clips in fullscreen mode.
March 24th, 2008
i have done a version of my php script which uses your player btw;
http://somestuff.org/flashAVC/flvplayer_alt.php
what exactly are the licensing issues? (noncommercial use, commercial use?)
March 24th, 2008
Hey dim, my player is free to use for everyone, but I’d love to see a link to this post on the sites who are using it, saying »VideoPlayer: NonverBlaster«
March 24th, 2008
no problem, fixed.
March 24th, 2008
is there a way to stop the videos with javascript?
it’s because i have div’s which i hide with javascript. and now the video runs also when the div is hidden. so it would be could if i could stop them with javascript.
March 25th, 2008
Hey Ralph, yes, it would be possible. Since I want to keep the player as simple as possible, I don’t know if I should include features like that, but maybe I will upload another version containing your javascript-fun in the next days (I want to clean up the sources anyway ;)
March 25th, 2008
feature request for new flashvar:
smoothing: true or false
http://www.adobe.com/support/flash/action_scripts/actionscript_dictionary/actionscript_dictionary822.html
i believe it is true now by default? (by staring at cpu usage)
—
about hardware acceleration of display in fullscreen mode, i can’t see any difference when comparing with some other player that is known not to use it, but like i wrote flash/action script is greek to me, so i can be wrong…
March 25th, 2008
i think this is better explanation of full screen mode:
http://www.adobe.com/devnet/flashplayer/articles/hd_video_flash_player_05.html ?
March 25th, 2008
but i guess this is it, isn’t it?
// Fullscreen an / aus
private function toggleFullscreen() {
if(stage.displayState == StageDisplayState.NORMAL){
stage.displayState = StageDisplayState.FULL_SCREEN;
} else {
stage.displayState = StageDisplayState.NORMAL;
}
}
sorry, i will stop spamming now ;)
March 25th, 2008
Hello again –
sth seems to be wrong with your notifications – I’m not getting mail if someone replies to MY comment, but a new mail for EVERY new entry…
Could you fix this, pls?
Cheers,
Philipp
March 26th, 2008
@ dim: Yes, you found it ;) Maybe I should rewrite the documentation in english…
March 27th, 2008
@dim: I’ve included a flashVar for setting allowSmoothing of the video to true / false.
March 27th, 2008
nonverbla: tnx, very nice, but thinking about it, would it be the correct place to switch smoothing on/off by using the player itself? the right-mouse-button menu entry?
(with flashvar you have to either switch this via server-side somehow – which brings unwanted effect of reloading the movie…)
p.s. sorry i figured that only now.
March 27th, 2008
depends on you, what preset you want to provide to the users…
March 27th, 2008
yes, exactly, but instead that should be user-selected, since i can’t tell if their cpu/fpu can handle things.
March 28th, 2008
hello dim, OK, you got your feature… Check out the new sources, I added functions to toggle FullScreen, Sound and Smoothing
March 28th, 2008
thanks, ill check it up,
about linking to your site, that is not something a webmaster would want to do on commercial site, so maybe consider about commercial license of some sort (just a thought)?
April 10th, 2008
ok, a detail pretty much, instead of ‘toggle smoothing’, wouldn’t it be better either:
smoothing is off
or
smoothing is on
depending on the state of things?
April 21st, 2008
Thank you for the very easy to install player.
http://www.ekkehard-tischendorf.de/Presse.html
Alex
April 23rd, 2008
hi all,
very cute player, thanks a lot!
one single question: how can i include a flash player detection, perhaps with an automatic direction to adobe’s download site when the flash player 9 misses?
thanks in forward,
ozan
April 23rd, 2008
Hi Ozan,
The most easy way is to use the »expressinstall.swf« by swfobject. It should be well documented at the deconcept home page.
June 2nd, 2008
hi.
let me just say: great player.
i just have one question. i am a complete idiot to flash and embedding. but i found out, that the swfobject has been updated to a new version (2.0) and this one does not work with the code on your website, that i used.
could you point in the right direction. i want to use the player and have problems submitting the flashvars in the new swfobject.
thanks
markus
June 2nd, 2008
hey markus, do you have a link to your project, so that I can take a look at your source code?
June 3rd, 2008
Hi Rasso
Thank you for your great player. It runs on my homepage great. Only under Windows Vista with Internet Explorer 7, there is a bug. After the second film is selected, you can only re-activate a link if the entire film is downloaded. All links during the loading process is blocked and will only be executed after loading the film. I found this bug on other pages in the player is being used.
Can you please help me? Do you have a new version of the player? Thanks Stefan
June 6th, 2008
Hallo Rosso
Vielen Dank für deinen Player. Er läuft auf meiner Homepage super. Einzig unter Windows Vista mit Internet Explorer 7 gibt es einen Bug. Nachdem man einen zweiten Film angewählt hat, kann man erst wieder irgendeinen Link anwählen, wenn der Film fertig runtergeladen wurde. Die ganze Homepage ist blockiert. Ich fand dieses Problem auch auf anderen Homepages bei, denen dein Player eingesetzt wurde. Kannst Du mir bitte helfen? Hast Du eine neue Version des Players?
Danke Stefan
June 6th, 2008
Hey Stefan, sorry for not replying, I’m very busy at the moment. As soon as I have time I’ll check for your bug, but it seems to be a local problem… Have you checked on other mashines, as well?
June 15th, 2008
Hi Rosso
You hatest right, the problem was temporary.
I have the player on other VISTA-computers tested,
all OK. Thank you again for the player and your help.
Stefan
June 18th, 2008
Hallo der Rasso,
here is one more link where your player makes someone happy. http://www.i-am-bernhard.com
thx for that plain way to show videos.
Bernhard
July 30th, 2008
Hi nonverbla! Great job here! There was this comment by Ralph end of March: “is there a way to stop the videos with javascript?” etc…
I wonder whether you happened to Ul a version capable of stoping videos with javascript! THAT’LL BE SO COOL!
Thanks, H@nnes
August 4th, 2008
Hey H@nnes,
I’m pretty busy these days, but maybe I will do something about that if I have some spare time some day in the future. Just stay subscribed to this post.
cheers, Rasso
August 12th, 2008
its a really great player.
player.addParam("wmode", "transparent");but this not working. I tryed it in different versions. Still not works
August 12th, 2008
Hey Mark,
this doesn’t work because you can’t use the fullscreen-feature with wmode transparent. It’s a security issue because otherwise all these annoying overlay-flash-banners could start in fullScreen as well…
Soon I will release a version with hover-navigation, so nobody has to think about this any more.
stay tuned.
August 12th, 2008
feature request: http php/lighttpd streaming.
August 20th, 2008
@ dim: whats this? ;) I’m a designer…
September 4th, 2008
thank you for this great player
September 9th, 2008
nice player. good work :)
what would be really nice would be a watermark feature (for example a png file or something similar).
September 15th, 2008
[...] NonverBlaster:hover is a mod of my Flash-based Video-Player »NonverBlaster«. It was developed for the IT-news portal golem.de. Good on them, they allowed me to provide a [...]
January 27th, 2009
hey nonverbla,
thank you very much for this wonderfull and simple player.
i’d like to use it for a single-page portfolio to show several videos on one page. but if i just copy and paste your script a few times, it only shows the first video file. is it posible to change an id and extract the file url?
January 27th, 2009
Hey monsieur monkey,
thanks for your compliments!
If you want to have more than one player at one page you just have to change the names of the divs containing the players and print every player into it’s own div:
html:
div id="videoPlayer1"div id="videoPlayer2"
div id="videoPlayer3" ...
javascript:
player.write("videoPlayer1");player.write("videoPlayer2");
player.write("videoPlayer3");...
I hope this helps.
January 27th, 2009
oh no, it’s me again.
thanks for the quick response!
that’s so easy and of course it works. but i have to copy the whole javascript block for every video, right!?!
is there a simple posibility to use just one javascript for the player and extract the video and preview url to the div?
i know, i should be happy that it’s already working, but i’d like to clean up the html-file as much as possible.
another answer would be very nice!
thanks a lot!
February 13th, 2009
looks awesome…any way to use a different preloader?
April 20th, 2009
[...] NonverBlaster:hover is a mod of my Flash-based Video-Player »NonverBlaster«. It was developed for the IT-news portal golem.de. Good on them, they allowed me to provide a [...]
May 12th, 2009
Thank you for these explanations. I will try.
May 12th, 2009
how to improve your player to support rtmp streaming?please help me!
I’ve tried to add a new var named ‘streamer’ and user nc.connect(streamer) ,but then I got a failure also.