Update RFM 9.14.0 fin
4
core/vendor/filemanager/config/config.php
vendored
@ -8,7 +8,7 @@ mb_http_input('UTF-8');
|
|||||||
mb_language('uni');
|
mb_language('uni');
|
||||||
mb_regex_encoding('UTF-8');
|
mb_regex_encoding('UTF-8');
|
||||||
ob_start('mb_output_handler');
|
ob_start('mb_output_handler');
|
||||||
date_default_timezone_set('Europe/Rome');
|
date_default_timezone_set('Europe/Paris');
|
||||||
setlocale(LC_CTYPE, 'fr_FR'); //correct transliteration
|
setlocale(LC_CTYPE, 'fr_FR'); //correct transliteration
|
||||||
|
|
||||||
/*
|
/*
|
||||||
@ -30,7 +30,7 @@ setlocale(LC_CTYPE, 'fr_FR'); //correct transliteration
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
define('USE_ACCESS_KEYS', true); // TRUE or FALSE
|
define('USE_ACCESS_KEYS', true); // TRUE or FALSE
|
||||||
$privateKey = md5_file('../../../site/data/data.json');
|
$privateKey = md5_file('../../../site/data/core.json');
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|--------------------------------------------------------------------------
|
|--------------------------------------------------------------------------
|
||||||
|
@ -1,21 +0,0 @@
|
|||||||
Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
http://happyworm.com
|
|
||||||
http://jplayer.org
|
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
|
||||||
in the Software without restriction, including without limitation the rights
|
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
|
||||||
furnished to do so, subject to the following conditions:
|
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in
|
|
||||||
all copies or substantial portions of the Software.
|
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
||||||
THE SOFTWARE.
|
|
32
core/vendor/filemanager/js/jPlayer/README.md
vendored
@ -1,32 +0,0 @@
|
|||||||
# [jPlayer](http://jplayer.org/) : HTML5 Audio & Video for [jQuery](http://jquery.com/)
|
|
||||||
|
|
||||||
Support for [Zepto](http://zeptojs.com/) 1.0+ compiled with the data module.
|
|
||||||
|
|
||||||
## What is jPlayer?
|
|
||||||
|
|
||||||
### jPlayer is a jQuery/Zepto plugin that allows you to:
|
|
||||||
* **play and control media** files in your webpage.
|
|
||||||
* create a **consistent interface** and experience across all browsers.
|
|
||||||
* create and style a media player using **just HTML and CSS**.
|
|
||||||
* add **audio** and **video** to your jQuery/Zepto projects.
|
|
||||||
* support more devices using **HTML5**.
|
|
||||||
* support older browsers using a Flash _fall-back/forward_.
|
|
||||||
* control media on your website using a [JavaScript API](http://www.jplayer.org/latest/developer-guide/).
|
|
||||||
|
|
||||||
### jPlayer supports:
|
|
||||||
* HTML5: **mp3, m4a (AAC), m4v (H.264),** ogv*, oga*, wav*, webm*
|
|
||||||
* Flash: **mp3, m4a (AAC), m4v (H.264),** rtmp, flv.
|
|
||||||
|
|
||||||
_(*) Optional counterpart formats to increase HTML5 cross-browser support._
|
|
||||||
|
|
||||||
## License
|
|
||||||
[jPlayer](http://jplayer.org/) is licensed under the [MIT license](http://opensource.org/licenses/MIT).
|
|
||||||
|
|
||||||
## More information:
|
|
||||||
* [jPlayer.org](http://jplayer.org/)
|
|
||||||
* [Quick Start Guide](http://www.jplayer.org/latest/quick-start-guide/)
|
|
||||||
* [Developer Guide and API Reference](http://www.jplayer.org/latest/developer-guide/)
|
|
||||||
|
|
||||||
## Author:
|
|
||||||
Mark J Panaghiston [@thepag](http://twitter.com/thepag)
|
|
||||||
[happyworm.com](http://happyworm.com/)
|
|
@ -1,638 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 2.4.0
|
|
||||||
* Date: 5th June 2013
|
|
||||||
*
|
|
||||||
* FlashVars expected: (AS3 property of: loaderInfo.parameters)
|
|
||||||
* id: (URL Encoded: String) Id of jPlayer instance
|
|
||||||
* vol: (Number) Sets the initial volume
|
|
||||||
* muted: (Boolean in a String) Sets the initial muted state
|
|
||||||
* jQuery: (URL Encoded: String) Sets the jQuery var name. Used with: someVar = jQuery.noConflict(true); The someVar name must contain jQuery in it.
|
|
||||||
*
|
|
||||||
* Compiled using: Adobe Flex Compiler (mxmlc) Version 4.5.1 build 21328
|
|
||||||
*/
|
|
||||||
|
|
||||||
package {
|
|
||||||
import flash.system.Security;
|
|
||||||
import flash.external.ExternalInterface;
|
|
||||||
|
|
||||||
import flash.utils.Timer;
|
|
||||||
import flash.events.TimerEvent;
|
|
||||||
|
|
||||||
import flash.text.TextField;
|
|
||||||
import flash.text.TextFormat;
|
|
||||||
|
|
||||||
import flash.events.KeyboardEvent;
|
|
||||||
|
|
||||||
import flash.display.Sprite;
|
|
||||||
import happyworm.jPlayer.*;
|
|
||||||
|
|
||||||
import flash.display.StageAlign;
|
|
||||||
import flash.display.StageScaleMode;
|
|
||||||
import flash.events.Event;
|
|
||||||
import flash.net.LocalConnection;
|
|
||||||
import flash.events.StatusEvent;
|
|
||||||
|
|
||||||
import flash.events.MouseEvent;
|
|
||||||
|
|
||||||
import flash.ui.ContextMenu;
|
|
||||||
import flash.ui.ContextMenuItem;
|
|
||||||
import flash.events.ContextMenuEvent;
|
|
||||||
import flash.net.URLRequest;
|
|
||||||
import flash.net.navigateToURL;
|
|
||||||
import flash.media.Video;
|
|
||||||
|
|
||||||
public class Jplayer extends Sprite {
|
|
||||||
private var jQuery:String;
|
|
||||||
private var sentNumberFractionDigits:uint = 2;
|
|
||||||
|
|
||||||
public var commonStatus:JplayerStatus = new JplayerStatus(); // Used for inital ready event so volume is correct.
|
|
||||||
|
|
||||||
private var myInitTimer:Timer = new Timer(100, 0);
|
|
||||||
|
|
||||||
private var myMp3Player:JplayerMp3;
|
|
||||||
private var myMp4Player:JplayerMp4;
|
|
||||||
|
|
||||||
private var myRtmpPlayer:JplayerRtmp;
|
|
||||||
|
|
||||||
private var isRtmp:Boolean = false;
|
|
||||||
private var isMp4:Boolean = false;
|
|
||||||
|
|
||||||
private var isMp3:Boolean = false;
|
|
||||||
private var isVideo:Boolean = false;
|
|
||||||
|
|
||||||
private var securityIssue:Boolean = false; // On direct access and when SWF parameters contain illegal characters
|
|
||||||
|
|
||||||
private var contextMenuFix:Sprite = new Sprite(); // A sprite that will be on top and fix the content menu over video bug. (A Flash plugin bug.)
|
|
||||||
|
|
||||||
private var txLog:TextField;
|
|
||||||
private var debug:Boolean = false; // Set debug to false for release compile!
|
|
||||||
private var localAIRDebug:Boolean = false; // This is autodetermined by AIR app - leave false!
|
|
||||||
|
|
||||||
private var traceOut:TraceOut;
|
|
||||||
|
|
||||||
public function Jplayer() {
|
|
||||||
|
|
||||||
flash.system.Security.allowDomain("*");
|
|
||||||
traceOut = new TraceOut();
|
|
||||||
|
|
||||||
// Fix to the security exploit reported by Jason Calvert http://appsec.ws/
|
|
||||||
checkFlashVars(loaderInfo.parameters);
|
|
||||||
|
|
||||||
stage.scaleMode = StageScaleMode.NO_SCALE;
|
|
||||||
stage.align = StageAlign.TOP_LEFT;
|
|
||||||
|
|
||||||
if(!securityIssue) {
|
|
||||||
// The jQuery param is the primary cause of security concerns.
|
|
||||||
jQuery = loaderInfo.parameters.jQuery + "('#" + loaderInfo.parameters.id + "').jPlayer";
|
|
||||||
commonStatus.volume = Number(loaderInfo.parameters.vol);
|
|
||||||
commonStatus.muted = loaderInfo.parameters.muted == "true";
|
|
||||||
|
|
||||||
stage.addEventListener(Event.RESIZE, resizeHandler);
|
|
||||||
stage.addEventListener(MouseEvent.CLICK, clickHandler);
|
|
||||||
|
|
||||||
var initialVolume:Number = commonStatus.volume;
|
|
||||||
if(commonStatus.muted) {
|
|
||||||
initialVolume = 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
myMp3Player = new JplayerMp3(initialVolume);
|
|
||||||
addChild(myMp3Player);
|
|
||||||
|
|
||||||
myMp4Player = new JplayerMp4(initialVolume);
|
|
||||||
addChild(myMp4Player);
|
|
||||||
|
|
||||||
myRtmpPlayer = new JplayerRtmp(initialVolume);
|
|
||||||
addChild(myRtmpPlayer);
|
|
||||||
|
|
||||||
switchType("mp3"); // set default state to mp3
|
|
||||||
}
|
|
||||||
|
|
||||||
// The ContextMenu only partially works. The menu select events never occur.
|
|
||||||
// Investigated and it is something to do with the way jPlayer inserts the Flash on the page.
|
|
||||||
// A simple test inserting the Jplayer.swf on a page using: 1) SWFObject 2.2 works. 2) AC_FL_RunContent() works.
|
|
||||||
// jPlayer Flash insertion is based on SWFObject 2.2 and the resaon behind this failure is not clear. The Flash insertion HTML on the page looks similar.
|
|
||||||
var myContextMenu:ContextMenu = new ContextMenu();
|
|
||||||
myContextMenu.hideBuiltInItems();
|
|
||||||
var menuItem_jPlayer:ContextMenuItem = new ContextMenuItem("jPlayer " + JplayerStatus.VERSION);
|
|
||||||
var menuItem_happyworm:ContextMenuItem = new ContextMenuItem("© 2009-2013 Happyworm Ltd", true);
|
|
||||||
menuItem_jPlayer.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, menuSelectHandler_jPlayer);
|
|
||||||
menuItem_happyworm.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, menuSelectHandler_happyworm);
|
|
||||||
myContextMenu.customItems.push(menuItem_jPlayer, menuItem_happyworm);
|
|
||||||
contextMenu = myContextMenu;
|
|
||||||
|
|
||||||
// Log console for dev compile option: debug
|
|
||||||
if(debug || securityIssue) {
|
|
||||||
txLog = new TextField();
|
|
||||||
txLog.x = 5;
|
|
||||||
txLog.y = 5;
|
|
||||||
txLog.width = stage.stageWidth - 10;
|
|
||||||
txLog.height = stage.stageHeight - 10;
|
|
||||||
txLog.backgroundColor = 0xEEEEFF;
|
|
||||||
txLog.border = true;
|
|
||||||
txLog.background = true;
|
|
||||||
txLog.multiline = true;
|
|
||||||
txLog.text = "jPlayer " + JplayerStatus.VERSION;
|
|
||||||
|
|
||||||
if(securityIssue) {
|
|
||||||
txLog.visible = true;
|
|
||||||
} else if(debug) {
|
|
||||||
txLog.visible = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.addChild(txLog);
|
|
||||||
|
|
||||||
if(debug && !securityIssue) {
|
|
||||||
this.stage.addEventListener(KeyboardEvent.KEY_UP, keyboardHandler);
|
|
||||||
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.DEBUG_MSG, debugMsgHandler);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.DEBUG_MSG, debugMsgHandler);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.DEBUG_MSG, debugMsgHandler);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Known Flash problem with contextMenu over video player.
|
|
||||||
// Add a transparent rectangle into the sprite.
|
|
||||||
contextMenuFix.graphics.beginFill(0x000000, 0); // Transparent black
|
|
||||||
contextMenuFix.graphics.drawRect(0, 0, 10, 10); // Arbitary rectangle
|
|
||||||
contextMenuFix.graphics.endFill();
|
|
||||||
addChild(contextMenuFix); // Put the sprite on the top layer.
|
|
||||||
|
|
||||||
if(!securityIssue) {
|
|
||||||
// Delay init() because Firefox 3.5.7+ developed a bug with local testing in Firebug.
|
|
||||||
myInitTimer.addEventListener(TimerEvent.TIMER, init);
|
|
||||||
myInitTimer.start();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function switchType(playType:String):void {
|
|
||||||
switch(playType) {
|
|
||||||
case "rtmpa":
|
|
||||||
isRtmp=true;
|
|
||||||
isMp3=false;
|
|
||||||
isMp4=false;
|
|
||||||
isVideo=false;
|
|
||||||
break;
|
|
||||||
case "rtmpv":
|
|
||||||
isRtmp=true;
|
|
||||||
isMp3=false;
|
|
||||||
isMp4=false;
|
|
||||||
isVideo=true;
|
|
||||||
break;
|
|
||||||
case "mp3":
|
|
||||||
isRtmp=false;
|
|
||||||
isMp3=true;
|
|
||||||
isMp4=false;
|
|
||||||
isVideo=false;
|
|
||||||
break;
|
|
||||||
case "mp4":
|
|
||||||
isRtmp=false;
|
|
||||||
isMp3=false;
|
|
||||||
isMp4=true;
|
|
||||||
isVideo=false;
|
|
||||||
break;
|
|
||||||
case "m4v":
|
|
||||||
isRtmp=false;
|
|
||||||
isMp3=false;
|
|
||||||
isMp4=true;
|
|
||||||
isVideo=true;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
listenToMp3(isMp3);
|
|
||||||
listenToMp4(isMp4);
|
|
||||||
listenToRtmp(isRtmp);
|
|
||||||
}
|
|
||||||
|
|
||||||
private function init(e:TimerEvent):void {
|
|
||||||
myInitTimer.stop();
|
|
||||||
if(ExternalInterface.available && !securityIssue) {
|
|
||||||
ExternalInterface.addCallback("fl_setAudio_mp3", fl_setAudio_mp3);
|
|
||||||
ExternalInterface.addCallback("fl_setAudio_m4a", fl_setAudio_m4a);
|
|
||||||
ExternalInterface.addCallback("fl_setVideo_m4v", fl_setVideo_m4v);
|
|
||||||
ExternalInterface.addCallback("fl_setAudio_rtmp", fl_setAudio_rtmp);
|
|
||||||
ExternalInterface.addCallback("fl_setVideo_rtmp", fl_setVideo_rtmp);
|
|
||||||
ExternalInterface.addCallback("fl_clearMedia", fl_clearMedia);
|
|
||||||
ExternalInterface.addCallback("fl_load", fl_load);
|
|
||||||
ExternalInterface.addCallback("fl_play", fl_play);
|
|
||||||
ExternalInterface.addCallback("fl_pause", fl_pause);
|
|
||||||
ExternalInterface.addCallback("fl_play_head", fl_play_head);
|
|
||||||
ExternalInterface.addCallback("fl_volume", fl_volume);
|
|
||||||
ExternalInterface.addCallback("fl_mute", fl_mute);
|
|
||||||
|
|
||||||
ExternalInterface.call(jQuery, "jPlayerFlashEvent", JplayerEvent.JPLAYER_READY, extractStatusData(commonStatus)); // See JplayerStatus() class for version number.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function checkFlashVars(p:Object):void {
|
|
||||||
// Check for direct access. Inspired by mediaelement.js - Also added name to HTML object for non-IE browsers.
|
|
||||||
if(ExternalInterface.objectID != null && ExternalInterface.objectID.toString() != "") {
|
|
||||||
for each (var s:String in p) {
|
|
||||||
if(illegalChar(s)) {
|
|
||||||
securityIssue = true; // Found a security concern.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(!securityIssue) {
|
|
||||||
if(jQueryIllegal(p.jQuery)) {
|
|
||||||
securityIssue = true; // Found a security concern.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
securityIssue = true; // Direct access disables the callbacks, which were a security concern.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function illegalChar(s:String):Boolean {
|
|
||||||
// A whitelist of accepted chars.
|
|
||||||
var validParam:RegExp = /^[-A-Za-z0-9_.]+$/;
|
|
||||||
return !validParam.test(s);
|
|
||||||
}
|
|
||||||
private function jQueryIllegal(s:String):Boolean {
|
|
||||||
// Check param contains the term jQuery.
|
|
||||||
var validParam:RegExp = /(jQuery)/;
|
|
||||||
return !validParam.test(s);
|
|
||||||
}
|
|
||||||
// switchType() here
|
|
||||||
private function listenToMp3(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_WAITING, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_PLAYING, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_CANPLAY, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
myMp3Player.addEventListener(JplayerEvent.JPLAYER_CANPLAYTHROUGH, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
} else {
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_WAITING, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_PLAYING, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_CANPLAY, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
myMp3Player.removeEventListener(JplayerEvent.JPLAYER_CANPLAYTHROUGH, jPlayerFlashEvent); // only MP3 atm
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function listenToMp4(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.addEventListener(JplayerEvent.JPLAYER_LOADEDMETADATA, jPlayerMetaDataHandler); // Note the unique handler
|
|
||||||
} else {
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myMp4Player.removeEventListener(JplayerEvent.JPLAYER_LOADEDMETADATA, jPlayerMetaDataHandler); // Note the unique handler
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function listenToRtmp(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_CANPLAY, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_LOADEDMETADATA, jPlayerMetaDataHandler); // Note the unique handler
|
|
||||||
} else {
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_ERROR, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_PROGRESS, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_TIMEUPDATE, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_ENDED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_PLAY, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_PAUSE, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_LOADSTART, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.addEventListener(JplayerEvent.JPLAYER_CANPLAY, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_SEEKING, jPlayerFlashEvent);
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_SEEKED, jPlayerFlashEvent);
|
|
||||||
|
|
||||||
myRtmpPlayer.removeEventListener(JplayerEvent.JPLAYER_LOADEDMETADATA, jPlayerMetaDataHandler); // Note the unique handler
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function fl_setAudio_mp3(src:String):Boolean {
|
|
||||||
if (src != null) {
|
|
||||||
log("fl_setAudio_mp3: "+src);
|
|
||||||
switchType("mp3");
|
|
||||||
myMp4Player.clearFile();
|
|
||||||
myRtmpPlayer.clearFile();
|
|
||||||
myMp3Player.setFile(src);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
log("fl_setAudio_mp3: null");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function fl_setAudio_rtmp(src:String):Boolean {
|
|
||||||
tracer("SET RTMP: "+src);
|
|
||||||
if (src != null) {
|
|
||||||
log("fl_setAudio_rtmp: "+src);
|
|
||||||
switchType("rtmpa");
|
|
||||||
myMp4Player.clearFile();
|
|
||||||
myMp3Player.clearFile();
|
|
||||||
myRtmpPlayer.setFile(src,false);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
log("fl_setAudio_rtmp: null");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function fl_setVideo_rtmp(src:String):Boolean {
|
|
||||||
tracer("SET RTMP: "+src);
|
|
||||||
if (src != null) {
|
|
||||||
log("fl_setVideo_rtmp: "+src);
|
|
||||||
switchType("rtmpv");
|
|
||||||
myMp4Player.clearFile();
|
|
||||||
myMp3Player.clearFile();
|
|
||||||
myRtmpPlayer.setFile(src,true);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
log("fl_setVideo_rtmp: null");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function fl_setAudio_m4a(src:String):Boolean {
|
|
||||||
if (src != null) {
|
|
||||||
log("fl_setAudio_m4a: "+src);
|
|
||||||
switchType("mp4")
|
|
||||||
myMp3Player.clearFile();
|
|
||||||
myRtmpPlayer.clearFile();
|
|
||||||
myMp4Player.setFile(src);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
log("fl_setAudio_m4a: null");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function fl_setVideo_m4v(src:String):Boolean {
|
|
||||||
if (src != null) {
|
|
||||||
log("fl_setVideo_m4v: "+src);
|
|
||||||
switchType("m4v");
|
|
||||||
myMp3Player.clearFile();
|
|
||||||
myRtmpPlayer.clearFile();
|
|
||||||
myMp4Player.setFile(src);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
log("fl_setVideo_m4v: null");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function fl_clearMedia():void {
|
|
||||||
log("clearMedia.");
|
|
||||||
myMp3Player.clearFile();
|
|
||||||
myMp4Player.clearFile();
|
|
||||||
myRtmpPlayer.clearFile();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function getType():Object {
|
|
||||||
var returnType:Object;
|
|
||||||
if(isMp3) {
|
|
||||||
returnType=myMp3Player;
|
|
||||||
}
|
|
||||||
if(isRtmp) {
|
|
||||||
returnType=myRtmpPlayer;
|
|
||||||
}
|
|
||||||
if(isMp4) {
|
|
||||||
returnType=myMp4Player;
|
|
||||||
}
|
|
||||||
return returnType;
|
|
||||||
}
|
|
||||||
|
|
||||||
private function fl_load():Boolean {
|
|
||||||
log("load.");
|
|
||||||
var returnType:Object = getType();
|
|
||||||
return returnType.load();
|
|
||||||
}
|
|
||||||
private function fl_play(time:Number = NaN):Boolean {
|
|
||||||
log("play: time = " + time);
|
|
||||||
var returnType:Object = getType();
|
|
||||||
return returnType.play(time * 1000); // Flash uses milliseconds
|
|
||||||
}
|
|
||||||
private function fl_pause(time:Number = NaN):Boolean {
|
|
||||||
log("pause: time = " + time);
|
|
||||||
var returnType:Object = getType();
|
|
||||||
return returnType.pause(time * 1000); // Flash uses milliseconds
|
|
||||||
}
|
|
||||||
private function fl_play_head(percent:Number):Boolean {
|
|
||||||
log("play_head: "+percent+"%");
|
|
||||||
var returnType:Object = getType();
|
|
||||||
return returnType.playHead(percent);
|
|
||||||
}
|
|
||||||
private function fl_volume(v:Number):void {
|
|
||||||
log("volume: "+v);
|
|
||||||
commonStatus.volume = v;
|
|
||||||
if(!commonStatus.muted) {
|
|
||||||
myMp3Player.setVolume(v);
|
|
||||||
myMp4Player.setVolume(v);
|
|
||||||
myRtmpPlayer.setVolume(v);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function fl_mute(mute:Boolean):void {
|
|
||||||
log("mute: "+mute);
|
|
||||||
commonStatus.muted = mute;
|
|
||||||
if(mute) {
|
|
||||||
myMp3Player.setVolume(0);
|
|
||||||
myMp4Player.setVolume(0);
|
|
||||||
myRtmpPlayer.setVolume(0);
|
|
||||||
} else {
|
|
||||||
myMp3Player.setVolume(commonStatus.volume);
|
|
||||||
myMp4Player.setVolume(commonStatus.volume);
|
|
||||||
myRtmpPlayer.setVolume(commonStatus.volume);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function jPlayerFlashEvent(e:JplayerEvent):void {
|
|
||||||
log("jPlayer Flash Event: " + e.type + ": " + e.target);
|
|
||||||
//tracer("jPlayer Flash Event: " + e.type + ": " + e.target);
|
|
||||||
if(ExternalInterface.available && !securityIssue) {
|
|
||||||
ExternalInterface.call(jQuery, "jPlayerFlashEvent", e.type, extractStatusData(e.data));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function tracer(msg:String):void {
|
|
||||||
traceOut.tracer(msg);
|
|
||||||
}
|
|
||||||
|
|
||||||
private function extractStatusData(data:JplayerStatus):Object {
|
|
||||||
var myStatus:Object = {
|
|
||||||
version: JplayerStatus.VERSION,
|
|
||||||
src: data.src,
|
|
||||||
paused: !data.isPlaying, // Changing this name requires inverting all assignments and conditional statements.
|
|
||||||
srcSet: data.srcSet,
|
|
||||||
seekPercent: data.seekPercent,
|
|
||||||
currentPercentRelative: data.currentPercentRelative,
|
|
||||||
currentPercentAbsolute: data.currentPercentAbsolute,
|
|
||||||
currentTime: data.currentTime / 1000, // JavaScript uses seconds
|
|
||||||
duration: data.duration / 1000, // JavaScript uses seconds
|
|
||||||
videoWidth: data.videoWidth,
|
|
||||||
videoHeight: data.videoHeight,
|
|
||||||
volume: commonStatus.volume,
|
|
||||||
muted: commonStatus.muted
|
|
||||||
};
|
|
||||||
log("extractStatusData: sp="+myStatus.seekPercent+" cpr="+myStatus.currentPercentRelative+" cpa="+myStatus.currentPercentAbsolute+" ct="+myStatus.currentTime+" d="+myStatus.duration);
|
|
||||||
return myStatus;
|
|
||||||
}
|
|
||||||
private function jPlayerMetaDataHandler(e:JplayerEvent):void {
|
|
||||||
log("jPlayerMetaDataHandler:" + e.target);
|
|
||||||
if(ExternalInterface.available && !securityIssue) {
|
|
||||||
resizeHandler(new Event(Event.RESIZE));
|
|
||||||
ExternalInterface.call(jQuery, "jPlayerFlashEvent", e.type, extractStatusData(e.data));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function resizeHandler(e:Event):void {
|
|
||||||
log("resizeHandler: stageWidth = " + stage.stageWidth + " | stageHeight = " + stage.stageHeight);
|
|
||||||
|
|
||||||
var mediaX:Number = 0;
|
|
||||||
var mediaY:Number = 0;
|
|
||||||
var mediaWidth:Number = 0;
|
|
||||||
var mediaHeight:Number = 0;
|
|
||||||
|
|
||||||
var aspectRatioStage:Number = 0;
|
|
||||||
var aspectRatioVideo:Number = 0;
|
|
||||||
|
|
||||||
var videoItem:*;
|
|
||||||
|
|
||||||
if(isRtmp) {
|
|
||||||
videoItem = myRtmpPlayer;
|
|
||||||
}
|
|
||||||
if(isMp4) {
|
|
||||||
videoItem = myMp4Player;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(videoItem) {
|
|
||||||
if(stage.stageWidth > 0 && stage.stageHeight > 0 && videoItem.myVideo.width > 0 && videoItem.myVideo.height > 0) {
|
|
||||||
aspectRatioStage = stage.stageWidth / stage.stageHeight;
|
|
||||||
aspectRatioVideo = videoItem.myVideo.width / videoItem.myVideo.height;
|
|
||||||
if(aspectRatioStage < aspectRatioVideo) {
|
|
||||||
mediaWidth = stage.stageWidth;
|
|
||||||
mediaHeight = stage.stageWidth / aspectRatioVideo;
|
|
||||||
mediaX = 0;
|
|
||||||
mediaY = (stage.stageHeight - mediaHeight) / 2;
|
|
||||||
} else {
|
|
||||||
mediaWidth = stage.stageHeight * aspectRatioVideo;
|
|
||||||
mediaHeight = stage.stageHeight;
|
|
||||||
mediaX = (stage.stageWidth - mediaWidth) / 2;
|
|
||||||
mediaY = 0;
|
|
||||||
}
|
|
||||||
resizeEntity(videoItem, mediaX, mediaY, mediaWidth, mediaHeight);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if((debug || securityIssue) && stage.stageWidth > 20 && stage.stageHeight > 20) {
|
|
||||||
txLog.width = stage.stageWidth - 10;
|
|
||||||
txLog.height = stage.stageHeight - 10;
|
|
||||||
}
|
|
||||||
// Resize the sprite so it covers the entire stage area
|
|
||||||
contextMenuFix.x = 0;
|
|
||||||
contextMenuFix.y = 0;
|
|
||||||
contextMenuFix.width = stage.stageWidth;
|
|
||||||
contextMenuFix.height = stage.stageHeight;
|
|
||||||
}
|
|
||||||
private function resizeEntity(entity:Sprite, mediaX:Number, mediaY:Number, mediaWidth:Number, mediaHeight:Number):void {
|
|
||||||
entity.x = mediaX;
|
|
||||||
entity.y = mediaY;
|
|
||||||
entity.width = mediaWidth;
|
|
||||||
entity.height = mediaHeight;
|
|
||||||
}
|
|
||||||
private function clickHandler(e:MouseEvent):void {
|
|
||||||
// This needs to work with RTMP format too!
|
|
||||||
if(isMp3) {
|
|
||||||
jPlayerFlashEvent(new JplayerEvent(JplayerEvent.JPLAYER_CLICK, myMp3Player.myStatus, "click"))
|
|
||||||
} else {
|
|
||||||
jPlayerFlashEvent(new JplayerEvent(JplayerEvent.JPLAYER_CLICK, myMp4Player.myStatus, "click"))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// This event is never called. See comments in class constructor.
|
|
||||||
private function menuSelectHandler_jPlayer(e:ContextMenuEvent):void {
|
|
||||||
navigateToURL(new URLRequest("http://jplayer.org/"), "_blank");
|
|
||||||
}
|
|
||||||
// This event is never called. See comments in class constructor.
|
|
||||||
private function menuSelectHandler_happyworm(e:ContextMenuEvent):void {
|
|
||||||
navigateToURL(new URLRequest("http://happyworm.com/"), "_blank");
|
|
||||||
}
|
|
||||||
private function log(t:String):void {
|
|
||||||
if(debug) {
|
|
||||||
txLog.text = t + "\n" + txLog.text;
|
|
||||||
localAIRDebug = traceOut.localAIRDebug();
|
|
||||||
if(localAIRDebug) {
|
|
||||||
tracer(t);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(ExternalInterface.available && !securityIssue) {
|
|
||||||
ExternalInterface.call("console.log", t);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function debugMsgHandler(e:JplayerEvent):void {
|
|
||||||
log(e.msg);
|
|
||||||
}
|
|
||||||
private function keyboardHandler(e:KeyboardEvent):void {
|
|
||||||
log("keyboardHandler: e.keyCode = " + e.keyCode);
|
|
||||||
switch(e.keyCode) {
|
|
||||||
case 68 : // d
|
|
||||||
txLog.visible = !txLog.visible;
|
|
||||||
log("Toggled log display: " + txLog.visible);
|
|
||||||
break;
|
|
||||||
case 76 : // l
|
|
||||||
if(e.ctrlKey && e.shiftKey) {
|
|
||||||
txLog.text = "Cleared log.";
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,295 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Robert M. Hall
|
|
||||||
* Date: 7th August 2012
|
|
||||||
* Custom NetConnection Manager for more robust RTMP support
|
|
||||||
* Based in part on work by Will Law for the old Akamai NCManager.as
|
|
||||||
* and some of Will's new work in the OVP base classes (Open Video Player)
|
|
||||||
* as well as similar approaches by many other NetConnection managers
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
/*
|
|
||||||
TODO LIST 08/18/2011:
|
|
||||||
1. Wired up errors to dispatch events to Jplayer events to allow them to bubble up to JS
|
|
||||||
2. Rework event dispatch to handoff netconnection instead of a passed in reference
|
|
||||||
3. Allow a customizeable list of protocols and ports to be used instead of entire list
|
|
||||||
4. Allow a specific port/protocol (1 connect type) to be used first, and then optionally fallback on a custom list or the default list
|
|
||||||
5. Remove some traces and check a few other items below where I've made notes
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer {
|
|
||||||
|
|
||||||
import flash.events.*;
|
|
||||||
import flash.net.*;
|
|
||||||
|
|
||||||
import flash.utils.Timer;
|
|
||||||
import flash.utils.getTimer;
|
|
||||||
import flash.utils.clearInterval;
|
|
||||||
import flash.utils.setInterval;
|
|
||||||
|
|
||||||
public class ConnectManager extends Object {
|
|
||||||
|
|
||||||
private var protocols_arr:Array = new Array("rtmp","rtmpt","rtmpe","rtmpte","rtmps");
|
|
||||||
private var ports_arr:Array = new Array("",":1935",":80",":443");
|
|
||||||
private const protCount:Number = 5;
|
|
||||||
private const portCount:Number = 4;
|
|
||||||
|
|
||||||
private var _ncRef:Object;
|
|
||||||
|
|
||||||
private var _aNC:Array;
|
|
||||||
|
|
||||||
private var k_TIMEOUT:Number = 30000;
|
|
||||||
private var k_startConns:Number;
|
|
||||||
private var m_connList:Array = [];
|
|
||||||
private var m_serverName:String;
|
|
||||||
private var m_appName:String;
|
|
||||||
private var m_streamName:String;
|
|
||||||
private var m_connListCounter:Number;
|
|
||||||
private var m_flashComConnectTimeOut:Number;
|
|
||||||
private var m_validNetConnection:NetConnection;
|
|
||||||
|
|
||||||
private var connectSuccess:Boolean=false;
|
|
||||||
|
|
||||||
private var negotiating:Boolean=false;
|
|
||||||
private var idleTimeOut:Boolean=false;
|
|
||||||
|
|
||||||
public function ConnectManager() {
|
|
||||||
trace ("ConnectManager Initialized Version: 1.00 DT");
|
|
||||||
createPortsProtocolsArray();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function createPortsProtocolsArray():void {
|
|
||||||
var outerLoop:Number=0;
|
|
||||||
var innerLoop:Number=0;
|
|
||||||
for (outerLoop=0; outerLoop<protocols_arr.length; outerLoop++) {
|
|
||||||
|
|
||||||
for (innerLoop=0; innerLoop<ports_arr.length; innerLoop++) {
|
|
||||||
m_connList.push( { protocol: protocols_arr[outerLoop], port: ports_arr[innerLoop] } );
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public function negotiateConnect(ncRef:Object,p_serverName:String,p_appName:String):void
|
|
||||||
{
|
|
||||||
negotiating=true;
|
|
||||||
_ncRef=ncRef;
|
|
||||||
trace("*** SERVER NAME: "+p_serverName);
|
|
||||||
trace("*** APP NAME: "+p_serverName);
|
|
||||||
k_startConns = getTimer();
|
|
||||||
m_serverName = p_serverName;
|
|
||||||
m_appName = p_appName;
|
|
||||||
|
|
||||||
// Set a timeout function, just in case we never connect successfully
|
|
||||||
clearInterval(m_flashComConnectTimeOut);
|
|
||||||
m_flashComConnectTimeOut = setInterval(onFlashComConnectTimeOut,k_TIMEOUT,k_TIMEOUT);
|
|
||||||
|
|
||||||
// Createe a NetConnection for each of the protocols/ports listed in the m_connList list.
|
|
||||||
// Connection attempts occur at intervals of 1.5 seconds.
|
|
||||||
// The first connection to succeed will be used, all the others will be closed.
|
|
||||||
_aNC = new Array();
|
|
||||||
for (var i:uint = 0; i < m_connList.length; i++)
|
|
||||||
{
|
|
||||||
_aNC[i] = new NetConnection();
|
|
||||||
_aNC[i].addEventListener(NetStatusEvent.NET_STATUS,netStatus);
|
|
||||||
_aNC[i].addEventListener(SecurityErrorEvent.SECURITY_ERROR,netSecurityError);
|
|
||||||
_aNC[i].addEventListener(AsyncErrorEvent.ASYNC_ERROR,asyncError);
|
|
||||||
_aNC[i].client = new Object;
|
|
||||||
_aNC[i].client.owner = this;
|
|
||||||
_aNC[i].client.connIndex = i;
|
|
||||||
_aNC[i].client.id = i;
|
|
||||||
_aNC[i].client.pending = true;
|
|
||||||
|
|
||||||
/* Revisit this chunk - not needed at the moment as NC is handed off and this
|
|
||||||
// is handled elsewhere
|
|
||||||
// Need to put in some event dispatching as a more elegant solution and leave it here
|
|
||||||
|
|
||||||
_aNC[i].client.onBWDone = function (p_bw, deltaDown, deltaTime, latency) {
|
|
||||||
//this.owner.dispatchEvent ({type:"ncBandWidth", kbps:p_bw, latency:latency});
|
|
||||||
};
|
|
||||||
|
|
||||||
_aNC[i].client.onBWCheck = function (counter) {
|
|
||||||
return ++counter;
|
|
||||||
};
|
|
||||||
|
|
||||||
_aNC[i].client.onStatus = function (info) {
|
|
||||||
//
|
|
||||||
};
|
|
||||||
*/
|
|
||||||
|
|
||||||
}
|
|
||||||
m_connListCounter = 0;
|
|
||||||
nextConnect ();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function nextConnect():void
|
|
||||||
{
|
|
||||||
trace("*** Connection: "+ m_connListCounter + ": "+m_connList[m_connListCounter].protocol + "://" + m_serverName + m_connList[m_connListCounter].port + "/" + m_appName);
|
|
||||||
|
|
||||||
try {
|
|
||||||
_aNC[m_connListCounter].connect(m_connList[m_connListCounter].protocol + "://" + m_serverName + m_connList[m_connListCounter].port + "/" + m_appName);
|
|
||||||
|
|
||||||
} catch (error:Error) {
|
|
||||||
// statements
|
|
||||||
trace("*** Caught an error condition: "+error);
|
|
||||||
m_connListCounter = m_connList.length+1;
|
|
||||||
}
|
|
||||||
// statements
|
|
||||||
clearInterval(_aNC["ncInt" + m_connListCounter]);
|
|
||||||
|
|
||||||
if ((m_connListCounter < m_connList.length - 1))
|
|
||||||
{
|
|
||||||
m_connListCounter++;
|
|
||||||
_aNC["ncInt" + m_connListCounter] = setInterval(nextConnect,1500);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Cleans up all connections if none have succeeded by the timeout interval
|
|
||||||
private function onFlashComConnectTimeOut(timeout:Number):void
|
|
||||||
{
|
|
||||||
stopAll();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function handleGoodConnect(_nc:NetConnection):void {
|
|
||||||
negotiating=false;
|
|
||||||
trace("Handing OFF NetConnection");
|
|
||||||
clearInterval(m_flashComConnectTimeOut);
|
|
||||||
_ncRef.connectStream();
|
|
||||||
_ncRef.onBWDone(null,_nc);
|
|
||||||
//dispatchEvent(event);
|
|
||||||
// Need to enable and pass to Jplayer event system- revisit
|
|
||||||
// right now handing back a hardcoded reference that is passed in
|
|
||||||
// Should come up with a more loosely coupled way via event dispatch
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
public function getNegotiating():Boolean {
|
|
||||||
return negotiating;
|
|
||||||
}
|
|
||||||
|
|
||||||
public function setNegotiating(bool:Boolean):void {
|
|
||||||
negotiating=bool;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
public function stopAll(bool:Boolean=false):void {
|
|
||||||
|
|
||||||
//this.dispatchEvent ({type:"ncFailedToConnect", timeout:timeout});
|
|
||||||
// Need to enable and pass to Jplayer event system- revisit
|
|
||||||
// trace(_aNC+":"+m_flashComConnectTimeOut+":"+m_connList.length)
|
|
||||||
if(_aNC!=null && !isNaN(m_flashComConnectTimeOut) ) {
|
|
||||||
clearInterval(m_flashComConnectTimeOut);
|
|
||||||
for (var i:uint = 0; i < m_connList.length; i++)
|
|
||||||
{
|
|
||||||
if (_aNC[i]!=null)
|
|
||||||
{
|
|
||||||
clearInterval(_aNC["ncInt" + i]);
|
|
||||||
_aNC[i].close();
|
|
||||||
if(bool==false) {
|
|
||||||
_aNC[i].client = null;
|
|
||||||
}
|
|
||||||
_aNC[i] = null;
|
|
||||||
delete _aNC[i];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
private function netStatus(event:NetStatusEvent):void {
|
|
||||||
|
|
||||||
trace(event.info.code);
|
|
||||||
if(event.info.description != undefined) {
|
|
||||||
trace(event.info.description);
|
|
||||||
}
|
|
||||||
_aNC[event.target.client.id].client.pending = true;
|
|
||||||
|
|
||||||
// this.owner.m_validNetConnection = this.client.owner[this.client.connIndex];
|
|
||||||
// if (info.description == "[ License.Limit.Exceeded ]") {
|
|
||||||
|
|
||||||
switch (event.info.code) {
|
|
||||||
case "NetConnection.Connect.IdleTimeOut":
|
|
||||||
trace("IDLE TIMEOUT OCCURRED!")
|
|
||||||
negotiating=true;
|
|
||||||
idleTimeOut=true;
|
|
||||||
_ncRef.shutDownNcNs();
|
|
||||||
break;
|
|
||||||
case "NetConnection.Connect.Closed":
|
|
||||||
if(!negotiating && !idleTimeOut) {
|
|
||||||
idleTimeOut = false;
|
|
||||||
_ncRef.doneYet();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "NetConnection.Connect.InvalidApp":
|
|
||||||
case "NetConnection.Connect.Rejected":
|
|
||||||
//handleRejectedOrInvalid(event)
|
|
||||||
break;
|
|
||||||
case "NetConnection.Call.Failed":
|
|
||||||
/*
|
|
||||||
if (event.info.description.indexOf("_checkbw") != -1) {
|
|
||||||
event.target.expectBWDone = true;
|
|
||||||
event.target.call("checkBandwidth",null);
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
break;
|
|
||||||
case "NetConnection.Connect.Success":
|
|
||||||
var i:uint=0;
|
|
||||||
for ( i = 0; i<_aNC.length; i++) {
|
|
||||||
if (_aNC[i] && (i != event.target.client.id)) {
|
|
||||||
_aNC[i].close();
|
|
||||||
_aNC[i] = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
var _nc:NetConnection = NetConnection(event.target);
|
|
||||||
var connID:Number = event.target.client.id;
|
|
||||||
var _actualPort:String = m_connList[m_connListCounter].port;
|
|
||||||
var _actualProtocol:String = m_connList[m_connListCounter].protocol;
|
|
||||||
|
|
||||||
// See if we have version info
|
|
||||||
var _serverVersion:String = "UNKNOWN";
|
|
||||||
if (event.info.data && event.info.data.version) {
|
|
||||||
_serverVersion = event.info.data.version;
|
|
||||||
}
|
|
||||||
trace("Connect ID: "+connID+" - PORT: "+_actualPort+" - PROTOCOL: "+_actualProtocol+" - FMS Version: "+_serverVersion);
|
|
||||||
|
|
||||||
clearInterval(_aNC["ncInt" + connID]);
|
|
||||||
clearInterval(_aNC["ncInt" + m_connListCounter]);
|
|
||||||
|
|
||||||
handleGoodConnect(_nc);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/** Catches any netconnection net security errors
|
|
||||||
* @private
|
|
||||||
*/
|
|
||||||
private function netSecurityError(event:SecurityErrorEvent):void {
|
|
||||||
trace("SECURITY ERROR:"+event);
|
|
||||||
//dispatchEvent(event);
|
|
||||||
// Need to enable and pass to Jplayer event system- revisit
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Catches any async errors
|
|
||||||
* @private
|
|
||||||
*/
|
|
||||||
private function asyncError(event:AsyncErrorEvent):void {
|
|
||||||
trace("ASYNC ERROR:"+event.error);
|
|
||||||
//dispatchEvent(event);
|
|
||||||
// Need to enable and pass to Jplayer event system- revisit
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}// class
|
|
||||||
|
|
||||||
} //package
|
|
@ -1,68 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Date: 20th May 2013
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer {
|
|
||||||
import flash.events.Event;
|
|
||||||
|
|
||||||
public class JplayerEvent extends Event {
|
|
||||||
|
|
||||||
// The event strings must match those in the JavaScript's $.jPlayer.event object
|
|
||||||
|
|
||||||
public static const JPLAYER_READY:String = "jPlayer_ready";
|
|
||||||
public static const JPLAYER_FLASHRESET:String = "jPlayer_flashreset"; // Handled in JavaScript
|
|
||||||
public static const JPLAYER_RESIZE:String = "jPlayer_resize"; // Handled in JavaScript
|
|
||||||
public static const JPLAYER_REPEAT:String = "jPlayer_repeat"; // Handled in JavaScript
|
|
||||||
public static const JPLAYER_CLICK:String = "jPlayer_click";
|
|
||||||
public static const JPLAYER_ERROR:String = "jPlayer_error";
|
|
||||||
public static const JPLAYER_WARNING:String = "jPlayer_warning"; // Currently not used by the flash solution
|
|
||||||
|
|
||||||
public static const JPLAYER_LOADSTART:String = "jPlayer_loadstart";
|
|
||||||
public static const JPLAYER_PROGRESS:String = "jPlayer_progress";
|
|
||||||
public static const JPLAYER_SUSPEND:String = "jPlayer_suspend"; // Not implemented
|
|
||||||
public static const JPLAYER_ABORT:String = "jPlayer_abort"; // Not implemented
|
|
||||||
public static const JPLAYER_EMPTIED:String = "jPlayer_emptied"; // Not implemented
|
|
||||||
public static const JPLAYER_STALLED:String = "jPlayer_stalled"; // Not implemented
|
|
||||||
public static const JPLAYER_PLAY:String = "jPlayer_play";
|
|
||||||
public static const JPLAYER_PAUSE:String = "jPlayer_pause";
|
|
||||||
public static const JPLAYER_LOADEDMETADATA:String = "jPlayer_loadedmetadata"; // MP3 has no equivilent
|
|
||||||
public static const JPLAYER_LOADEDDATA:String = "jPlayer_loadeddata"; // Not implemented
|
|
||||||
public static const JPLAYER_WAITING:String = "jPlayer_waiting"; // Not implemented (Done in: MP3)
|
|
||||||
public static const JPLAYER_PLAYING:String = "jPlayer_playing"; // Not implemented (Done in: MP3)
|
|
||||||
public static const JPLAYER_CANPLAY:String = "jPlayer_canplay"; // Not implemented (Done in: MP3)
|
|
||||||
public static const JPLAYER_CANPLAYTHROUGH:String = "jPlayer_canplaythrough"; // Not implemented (Done in: MP3)
|
|
||||||
public static const JPLAYER_SEEKING:String = "jPlayer_seeking";
|
|
||||||
public static const JPLAYER_SEEKED:String = "jPlayer_seeked";
|
|
||||||
public static const JPLAYER_TIMEUPDATE:String = "jPlayer_timeupdate";
|
|
||||||
public static const JPLAYER_ENDED:String = "jPlayer_ended";
|
|
||||||
public static const JPLAYER_RATECHANGE:String = "jPlayer_ratechange"; // Not implemented
|
|
||||||
public static const JPLAYER_DURATIONCHANGE:String = "jPlayer_durationchange"; // Not implemented
|
|
||||||
public static const JPLAYER_VOLUMECHANGE:String = "jPlayer_volumechange"; // See JavaScript
|
|
||||||
|
|
||||||
// Events used internal to jPlayer's Flash.
|
|
||||||
public static const DEBUG_MSG:String = "debug_msg";
|
|
||||||
|
|
||||||
public var data:JplayerStatus;
|
|
||||||
public var msg:String = "";
|
|
||||||
|
|
||||||
public function JplayerEvent(type:String, data:JplayerStatus, msg:String = "", bubbles:Boolean = false, cancelable:Boolean = false) {
|
|
||||||
super(type, bubbles, cancelable);
|
|
||||||
this.data = data;
|
|
||||||
this.msg = msg;
|
|
||||||
}
|
|
||||||
public override function clone():Event {
|
|
||||||
return new JplayerEvent(type, data, msg, bubbles, cancelable);
|
|
||||||
}
|
|
||||||
public override function toString():String {
|
|
||||||
return formatToString("JplayerEvent", "type", "bubbles", "cancelable", "eventPhase", "data", "msg");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,367 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Date: 28th May 2013
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer {
|
|
||||||
import flash.display.Sprite;
|
|
||||||
|
|
||||||
import flash.media.Sound;
|
|
||||||
import flash.media.SoundChannel;
|
|
||||||
import flash.media.SoundLoaderContext;
|
|
||||||
import flash.media.SoundTransform;
|
|
||||||
import flash.net.URLRequest;
|
|
||||||
import flash.utils.Timer;
|
|
||||||
import flash.errors.IOError;
|
|
||||||
import flash.events.*;
|
|
||||||
|
|
||||||
public class JplayerMp3 extends Sprite {
|
|
||||||
private var mySound:Sound = new Sound();
|
|
||||||
private var myChannel:SoundChannel = new SoundChannel();
|
|
||||||
private var myContext:SoundLoaderContext = new SoundLoaderContext(3000, false);
|
|
||||||
private var myTransform:SoundTransform = new SoundTransform();
|
|
||||||
private var myRequest:URLRequest = new URLRequest();
|
|
||||||
|
|
||||||
private var timeUpdateTimer:Timer = new Timer(250, 0); // Matched to HTML event freq
|
|
||||||
private var progressTimer:Timer = new Timer(250, 0); // Matched to HTML event freq
|
|
||||||
private var seekingTimer:Timer = new Timer(100, 0); // Internal: How often seeking is checked to see if it is over.
|
|
||||||
private var playingTimer:Timer = new Timer(100, 0); // Internal: How often waiting/playing is checked.
|
|
||||||
private var waitingTimer:Timer = new Timer(3000, 0); // Internal: Check from loadstart to loadOpen. Generates a waiting event.
|
|
||||||
|
|
||||||
public var myStatus:JplayerStatus = new JplayerStatus();
|
|
||||||
|
|
||||||
public function JplayerMp3(volume:Number) {
|
|
||||||
timeUpdateTimer.addEventListener(TimerEvent.TIMER, timeUpdateHandler);
|
|
||||||
progressTimer.addEventListener(TimerEvent.TIMER, progressHandler);
|
|
||||||
seekingTimer.addEventListener(TimerEvent.TIMER, seekingHandler);
|
|
||||||
playingTimer.addEventListener(TimerEvent.TIMER, playingHandler);
|
|
||||||
waitingTimer.addEventListener(TimerEvent.TIMER, waitingHandler);
|
|
||||||
setVolume(volume);
|
|
||||||
}
|
|
||||||
public function setFile(src:String):void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "setFile: " + src));
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myChannel.stop();
|
|
||||||
}
|
|
||||||
progressUpdates(false);
|
|
||||||
timeUpdates(false);
|
|
||||||
waitingTimer.stop();
|
|
||||||
try {
|
|
||||||
mySound.close();
|
|
||||||
} catch (err:IOError) {
|
|
||||||
// Occurs if the file is either yet to be opened or has finished downloading.
|
|
||||||
}
|
|
||||||
mySound = null;
|
|
||||||
mySound = new Sound();
|
|
||||||
mySound.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);
|
|
||||||
mySound.addEventListener(Event.OPEN, loadOpen);
|
|
||||||
mySound.addEventListener(Event.COMPLETE, loadComplete);
|
|
||||||
myRequest = new URLRequest(src);
|
|
||||||
myStatus.reset();
|
|
||||||
myStatus.src = src;
|
|
||||||
myStatus.srcSet = true;
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
public function clearFile():void {
|
|
||||||
setFile("");
|
|
||||||
myStatus.srcSet = false;
|
|
||||||
}
|
|
||||||
private function errorHandler(err:IOErrorEvent):void {
|
|
||||||
// MP3 player needs to stop progress and timeupdate events as they are started before the error occurs.
|
|
||||||
// NB: The MP4 player works differently and the error occurs before they are started.
|
|
||||||
progressUpdates(false);
|
|
||||||
timeUpdates(false);
|
|
||||||
myStatus.error(); // Resets status except the src, and it sets srcError property.
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ERROR, myStatus));
|
|
||||||
}
|
|
||||||
private function loadOpen(e:Event):void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "loadOpen:"));
|
|
||||||
waitingTimer.stop();
|
|
||||||
myStatus.loading();
|
|
||||||
if(myStatus.playOnLoad) {
|
|
||||||
myStatus.playOnLoad = false; // Capture the flag
|
|
||||||
// this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADSTART, myStatus)); // So loadstart event happens before play event occurs.
|
|
||||||
play();
|
|
||||||
} else {
|
|
||||||
// this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADSTART, myStatus));
|
|
||||||
pause();
|
|
||||||
}
|
|
||||||
progressUpdates(true);
|
|
||||||
}
|
|
||||||
private function loadComplete(e:Event):void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "loadComplete:"));
|
|
||||||
myStatus.loaded();
|
|
||||||
progressUpdates(false);
|
|
||||||
progressEvent();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_CANPLAYTHROUGH, myStatus));
|
|
||||||
}
|
|
||||||
private function soundCompleteHandler(e:Event):void {
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
timeUpdates(false);
|
|
||||||
timeUpdateEvent();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ENDED, myStatus));
|
|
||||||
}
|
|
||||||
private function progressUpdates(active:Boolean):void {
|
|
||||||
// Using a timer rather than Flash's load progress event, because that event gave data at about 200Hz. The 10Hz timer is closer to HTML5 norm.
|
|
||||||
if(active) {
|
|
||||||
progressTimer.start();
|
|
||||||
} else {
|
|
||||||
progressTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function progressHandler(e:TimerEvent):void {
|
|
||||||
progressEvent();
|
|
||||||
}
|
|
||||||
private function progressEvent():void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "progressEvent:"));
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PROGRESS, myStatus));
|
|
||||||
}
|
|
||||||
private function timeUpdates(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
timeUpdateTimer.start();
|
|
||||||
playingTimer.start();
|
|
||||||
} else {
|
|
||||||
timeUpdateTimer.stop();
|
|
||||||
playingTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function timeUpdateHandler(e:TimerEvent):void {
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
private function timeUpdateEvent():void {
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_TIMEUPDATE, myStatus));
|
|
||||||
}
|
|
||||||
private function seeking(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
seekingEvent();
|
|
||||||
waitingEvent();
|
|
||||||
seekingTimer.start();
|
|
||||||
} else {
|
|
||||||
seekingTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingHandler(e:TimerEvent):void {
|
|
||||||
if(myStatus.pausePosition <= getDuration()) {
|
|
||||||
seekedEvent();
|
|
||||||
seeking(false);
|
|
||||||
if(myStatus.playOnSeek) {
|
|
||||||
myStatus.playOnSeek = false; // Capture the flag.
|
|
||||||
play();
|
|
||||||
}
|
|
||||||
} else if(myStatus.isLoaded && (myStatus.pausePosition > getDuration())) {
|
|
||||||
// Illegal seek time
|
|
||||||
seeking(false);
|
|
||||||
seekedEvent();
|
|
||||||
pause(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingEvent():void {
|
|
||||||
myStatus.isSeeking = true;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKING, myStatus));
|
|
||||||
}
|
|
||||||
private function seekedEvent():void {
|
|
||||||
myStatus.isSeeking = false;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKED, myStatus));
|
|
||||||
}
|
|
||||||
private function playingHandler(e:TimerEvent):void {
|
|
||||||
checkPlaying(false); // Without forcing playing event.
|
|
||||||
}
|
|
||||||
private function checkPlaying(force:Boolean):void {
|
|
||||||
if(mySound.isBuffering) {
|
|
||||||
if(!myStatus.isWaiting) {
|
|
||||||
waitingEvent();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if(myStatus.isWaiting || force) {
|
|
||||||
playingEvent();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function waitingEvent():void {
|
|
||||||
myStatus.isWaiting = true;
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_WAITING, myStatus));
|
|
||||||
}
|
|
||||||
private function playingEvent():void {
|
|
||||||
myStatus.isWaiting = false;
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_CANPLAY, myStatus));
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PLAYING, myStatus));
|
|
||||||
}
|
|
||||||
private function waitingHandler(e:TimerEvent):void {
|
|
||||||
waitingTimer.stop();
|
|
||||||
if(myStatus.playOnLoad) {
|
|
||||||
waitingEvent();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function load():Boolean {
|
|
||||||
if(myStatus.loadRequired()) {
|
|
||||||
myStatus.startingDownload();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADSTART, myStatus));
|
|
||||||
waitingTimer.start();
|
|
||||||
mySound.load(myRequest, myContext);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function play(time:Number = NaN):Boolean {
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
if(!isNaN(time) && myStatus.srcSet) {
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myChannel.stop();
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
}
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isStartingDownload) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in loadOpen()
|
|
||||||
return true;
|
|
||||||
} else if(myStatus.loadRequired()) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in loadOpen()
|
|
||||||
return load();
|
|
||||||
} else if((myStatus.isLoading || myStatus.isLoaded) && !myStatus.isPlaying) {
|
|
||||||
if(myStatus.isLoaded && myStatus.pausePosition > getDuration()) { // The time is invalid, ie., past the end.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
timeUpdates(false);
|
|
||||||
timeUpdateEvent();
|
|
||||||
if(wasPlaying) { // For when playing and then get a play(huge)
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE, myStatus));
|
|
||||||
}
|
|
||||||
} else if(myStatus.pausePosition > getDuration()) {
|
|
||||||
myStatus.playOnSeek = true;
|
|
||||||
seeking(true);
|
|
||||||
} else {
|
|
||||||
myStatus.isPlaying = true; // Set immediately before playing. Could affects events.
|
|
||||||
myChannel = mySound.play(myStatus.pausePosition);
|
|
||||||
myChannel.soundTransform = myTransform;
|
|
||||||
myChannel.addEventListener(Event.SOUND_COMPLETE, soundCompleteHandler);
|
|
||||||
timeUpdates(true);
|
|
||||||
if(!wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PLAY, myStatus));
|
|
||||||
}
|
|
||||||
checkPlaying(true); // Force the playing event unless waiting, which will be dealt with in the playingTimer.
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function pause(time:Number = NaN):Boolean {
|
|
||||||
myStatus.playOnLoad = false; // Reset flag in case load/play issued immediately before this command, ie., before loadOpen() event.
|
|
||||||
myStatus.playOnSeek = false; // Reset flag in case play(time) issued before the command and is still seeking to time set.
|
|
||||||
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
// To avoid possible loops with timeupdate and pause(time). A pause() does not have the problem.
|
|
||||||
var alreadyPausedAtTime:Boolean = false;
|
|
||||||
if(!isNaN(time) && myStatus.pausePosition == time) {
|
|
||||||
alreadyPausedAtTime = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
myChannel.stop();
|
|
||||||
if(myChannel.position > 0) { // Required otherwise a fast play then pause causes myChannel.position to equal zero and not the correct value. ie., When it happens leave pausePosition alone.
|
|
||||||
myStatus.pausePosition = myChannel.position;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!isNaN(time) && myStatus.srcSet) {
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE, myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isStartingDownload) {
|
|
||||||
return true;
|
|
||||||
} else if(myStatus.loadRequired()) {
|
|
||||||
if(time > 0) { // We do not want the stop() command, which does pause(0), causing a load operation.
|
|
||||||
return load();
|
|
||||||
} else {
|
|
||||||
return true; // Technically the pause(0) succeeded. ie., It did nothing, since nothing was required.
|
|
||||||
}
|
|
||||||
} else if(myStatus.isLoading || myStatus.isLoaded) {
|
|
||||||
if(myStatus.isLoaded && myStatus.pausePosition > getDuration()) { // The time is invalid, ie., past the end.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
} else if(myStatus.pausePosition > getDuration()) {
|
|
||||||
seeking(true);
|
|
||||||
}
|
|
||||||
timeUpdates(false);
|
|
||||||
// Need to be careful with timeupdate event, otherwise a pause in a timeupdate event can cause a loop.
|
|
||||||
// Neither pause() nor pause(time) will cause a timeupdate loop.
|
|
||||||
if(wasPlaying || !isNaN(time) && !alreadyPausedAtTime) {
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function playHead(percent:Number):Boolean {
|
|
||||||
var time:Number = percent * getDuration() / 100;
|
|
||||||
if(myStatus.isPlaying || myStatus.playOnLoad || myStatus.playOnSeek) {
|
|
||||||
return play(time);
|
|
||||||
} else {
|
|
||||||
return pause(time);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function setVolume(v:Number):void {
|
|
||||||
myStatus.volume = v;
|
|
||||||
myTransform.volume = v;
|
|
||||||
myChannel.soundTransform = myTransform;
|
|
||||||
}
|
|
||||||
private function updateStatusValues():void {
|
|
||||||
myStatus.seekPercent = 100 * getLoadRatio();
|
|
||||||
myStatus.currentTime = getCurrentTime();
|
|
||||||
myStatus.currentPercentRelative = 100 * getCurrentRatioRel();
|
|
||||||
myStatus.currentPercentAbsolute = 100 * getCurrentRatioAbs();
|
|
||||||
myStatus.duration = getDuration();
|
|
||||||
}
|
|
||||||
public function getLoadRatio():Number {
|
|
||||||
if((myStatus.isLoading || myStatus.isLoaded) && mySound.bytesTotal > 0) {
|
|
||||||
return mySound.bytesLoaded / mySound.bytesTotal;
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getDuration():Number {
|
|
||||||
if(mySound.length > 0) {
|
|
||||||
return mySound.length;
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentTime():Number {
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
return myChannel.position;
|
|
||||||
} else {
|
|
||||||
return myStatus.pausePosition;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioRel():Number {
|
|
||||||
if((getDuration() > 0) && (getCurrentTime() <= getDuration())) {
|
|
||||||
return getCurrentTime() / getDuration();
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioAbs():Number {
|
|
||||||
return getCurrentRatioRel() * getLoadRatio();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,412 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Date: 29th January 2013
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer {
|
|
||||||
import flash.display.Sprite;
|
|
||||||
|
|
||||||
import flash.media.Video;
|
|
||||||
import flash.media.SoundTransform;
|
|
||||||
|
|
||||||
import flash.net.NetConnection;
|
|
||||||
import flash.net.NetStream;
|
|
||||||
|
|
||||||
import flash.utils.Timer;
|
|
||||||
|
|
||||||
import flash.events.NetStatusEvent;
|
|
||||||
import flash.events.SecurityErrorEvent;
|
|
||||||
import flash.events.TimerEvent;
|
|
||||||
|
|
||||||
public class JplayerMp4 extends Sprite {
|
|
||||||
|
|
||||||
public var myVideo:Video = new Video();
|
|
||||||
private var myConnection:NetConnection;
|
|
||||||
private var myStream:NetStream;
|
|
||||||
|
|
||||||
private var myTransform:SoundTransform = new SoundTransform();
|
|
||||||
|
|
||||||
public var myStatus:JplayerStatus = new JplayerStatus();
|
|
||||||
|
|
||||||
private var timeUpdateTimer:Timer = new Timer(250, 0); // Matched to HTML event freq
|
|
||||||
private var progressTimer:Timer = new Timer(250, 0); // Matched to HTML event freq
|
|
||||||
private var seekingTimer:Timer = new Timer(100, 0); // Internal: How often seeking is checked to see if it is over.
|
|
||||||
|
|
||||||
public function JplayerMp4(volume:Number) {
|
|
||||||
myConnection = new NetConnection();
|
|
||||||
myConnection.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
|
|
||||||
myConnection.addEventListener(SecurityErrorEvent.SECURITY_ERROR, securityErrorHandler);
|
|
||||||
myVideo.smoothing = true;
|
|
||||||
this.addChild(myVideo);
|
|
||||||
|
|
||||||
timeUpdateTimer.addEventListener(TimerEvent.TIMER, timeUpdateHandler);
|
|
||||||
progressTimer.addEventListener(TimerEvent.TIMER, progressHandler);
|
|
||||||
seekingTimer.addEventListener(TimerEvent.TIMER, seekingHandler);
|
|
||||||
|
|
||||||
myStatus.volume = volume;
|
|
||||||
}
|
|
||||||
private function progressUpdates(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
progressTimer.start();
|
|
||||||
} else {
|
|
||||||
progressTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function progressHandler(e:TimerEvent):void {
|
|
||||||
if(myStatus.isLoading) {
|
|
||||||
if(getLoadRatio() == 1) { // Close as can get to a loadComplete event since client.onPlayStatus only works with FMS
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "progressHandler: loadComplete"));
|
|
||||||
myStatus.loaded();
|
|
||||||
progressUpdates(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
progressEvent();
|
|
||||||
}
|
|
||||||
private function progressEvent():void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "progressEvent:"));
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PROGRESS, myStatus));
|
|
||||||
}
|
|
||||||
private function timeUpdates(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
timeUpdateTimer.start();
|
|
||||||
} else {
|
|
||||||
timeUpdateTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function timeUpdateHandler(e:TimerEvent):void {
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
private function timeUpdateEvent():void {
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_TIMEUPDATE, myStatus));
|
|
||||||
}
|
|
||||||
private function seeking(active:Boolean):void {
|
|
||||||
if(active) {
|
|
||||||
if(!myStatus.isSeeking) {
|
|
||||||
seekingEvent();
|
|
||||||
}
|
|
||||||
seekingTimer.start();
|
|
||||||
} else {
|
|
||||||
if(myStatus.isSeeking) {
|
|
||||||
seekedEvent();
|
|
||||||
}
|
|
||||||
seekingTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingHandler(e:TimerEvent):void {
|
|
||||||
if(getSeekTimeRatio() <= getLoadRatio()) {
|
|
||||||
seeking(false);
|
|
||||||
if(myStatus.playOnSeek) {
|
|
||||||
myStatus.playOnSeek = false; // Capture the flag.
|
|
||||||
play(myStatus.pausePosition); // Must pass time or the seek time is never set.
|
|
||||||
} else {
|
|
||||||
pause(myStatus.pausePosition); // Must pass time or the stream.time is read.
|
|
||||||
}
|
|
||||||
} else if(myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration) {
|
|
||||||
// Illegal seek time
|
|
||||||
seeking(false);
|
|
||||||
pause(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingEvent():void {
|
|
||||||
myStatus.isSeeking = true;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKING, myStatus));
|
|
||||||
}
|
|
||||||
private function seekedEvent():void {
|
|
||||||
myStatus.isSeeking = false;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKED, myStatus));
|
|
||||||
}
|
|
||||||
private function netStatusHandler(e:NetStatusEvent):void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "netStatusHandler: '" + e.info.code + "'"));
|
|
||||||
switch(e.info.code) {
|
|
||||||
case "NetConnection.Connect.Success":
|
|
||||||
connectStream();
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.Start":
|
|
||||||
// This event code occurs once, when the media is opened. Equiv to loadOpen() in mp3 player.
|
|
||||||
myStatus.loading();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADSTART, myStatus));
|
|
||||||
progressUpdates(true);
|
|
||||||
// See onMetaDataHandler() for other condition, since duration is vital.
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.Stop":
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "NetStream.Play.Stop: getDuration() - getCurrentTime() = " + (getDuration() - getCurrentTime())));
|
|
||||||
|
|
||||||
// Check if media is at the end (or close) otherwise this was due to download bandwidth stopping playback. ie., Download is not fast enough.
|
|
||||||
if(Math.abs(getDuration() - getCurrentTime()) < 150) { // Testing found 150ms worked best for M4A files, where playHead(99.9) caused a stuck state due to firing with ~116ms left to play.
|
|
||||||
endedEvent();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "NetStream.Seek.InvalidTime":
|
|
||||||
// Used for capturing invalid set times and clicks on the end of the progress bar.
|
|
||||||
endedEvent();
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.StreamNotFound":
|
|
||||||
myStatus.error(); // Resets status except the src, and it sets srcError property.
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ERROR, myStatus));
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
// "NetStream.Seek.Notify" event code is not very useful. It occurs after every seek(t) command issued and does not appear to wait for the media to be ready.
|
|
||||||
}
|
|
||||||
private function endedEvent():void {
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
pause(0);
|
|
||||||
timeUpdates(false);
|
|
||||||
timeUpdateEvent();
|
|
||||||
if(wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ENDED, myStatus));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function securityErrorHandler(event:SecurityErrorEvent):void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "securityErrorHandler."));
|
|
||||||
}
|
|
||||||
private function connectStream():void {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "connectStream."));
|
|
||||||
var customClient:Object = new Object();
|
|
||||||
customClient.onMetaData = onMetaDataHandler;
|
|
||||||
// customClient.onPlayStatus = onPlayStatusHandler; // According to the forums and my tests, onPlayStatus only works with FMS (Flash Media Server).
|
|
||||||
myStream = null;
|
|
||||||
myStream = new NetStream(myConnection);
|
|
||||||
myStream.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
|
|
||||||
myStream.client = customClient;
|
|
||||||
myVideo.attachNetStream(myStream);
|
|
||||||
setVolume(myStatus.volume);
|
|
||||||
myStream.play(myStatus.src);
|
|
||||||
}
|
|
||||||
public function setFile(src:String):void {
|
|
||||||
if(myStream != null) {
|
|
||||||
myStream.close();
|
|
||||||
}
|
|
||||||
myVideo.clear();
|
|
||||||
progressUpdates(false);
|
|
||||||
timeUpdates(false);
|
|
||||||
|
|
||||||
myStatus.reset();
|
|
||||||
myStatus.src = src;
|
|
||||||
myStatus.srcSet = true;
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
public function clearFile():void {
|
|
||||||
setFile("");
|
|
||||||
myStatus.srcSet = false;
|
|
||||||
}
|
|
||||||
public function load():Boolean {
|
|
||||||
if(myStatus.loadRequired()) {
|
|
||||||
myStatus.startingDownload();
|
|
||||||
myConnection.connect(null);
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function play(time:Number = NaN):Boolean {
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
if(!isNaN(time) && myStatus.srcSet) {
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myStream.pause();
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
}
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isStartingDownload) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in onMetaDataHandler()
|
|
||||||
return true;
|
|
||||||
} else if(myStatus.loadRequired()) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in onMetaDataHandler()
|
|
||||||
return load();
|
|
||||||
} else if((myStatus.isLoading || myStatus.isLoaded) && !myStatus.isPlaying) {
|
|
||||||
if(myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration) { // The time is invalid, ie., past the end.
|
|
||||||
myStream.pause(); // Since it is playing by default at this point.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
myStream.seek(0);
|
|
||||||
timeUpdates(false);
|
|
||||||
timeUpdateEvent();
|
|
||||||
if(wasPlaying) { // For when playing and then get a play(huge)
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE, myStatus));
|
|
||||||
}
|
|
||||||
} else if(getSeekTimeRatio() > getLoadRatio()) { // Use an estimate based on the downloaded amount
|
|
||||||
myStatus.playOnSeek = true;
|
|
||||||
seeking(true);
|
|
||||||
myStream.pause(); // Since it is playing by default at this point.
|
|
||||||
} else {
|
|
||||||
if(!isNaN(time)) { // Avoid using seek() when it is already correct.
|
|
||||||
myStream.seek(myStatus.pausePosition/1000); // Since time is in ms and seek() takes seconds
|
|
||||||
}
|
|
||||||
myStatus.isPlaying = true; // Set immediately before playing. Could affects events.
|
|
||||||
myStream.resume();
|
|
||||||
timeUpdates(true);
|
|
||||||
if(!wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PLAY, myStatus));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function pause(time:Number = NaN):Boolean {
|
|
||||||
myStatus.playOnLoad = false; // Reset flag in case load/play issued immediately before this command, ie., before onMetadata() event.
|
|
||||||
myStatus.playOnSeek = false; // Reset flag in case play(time) issued before the command and is still seeking to time set.
|
|
||||||
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
// To avoid possible loops with timeupdate and pause(time). A pause() does not have the problem.
|
|
||||||
var alreadyPausedAtTime:Boolean = false;
|
|
||||||
if(!isNaN(time) && myStatus.pausePosition == time) {
|
|
||||||
alreadyPausedAtTime = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Need to wait for metadata to load before ever issuing a pause. The metadata handler will call this function if needed, when ready.
|
|
||||||
if(myStream != null && myStatus.metaDataReady) { // myStream is a null until the 1st media is loaded. ie., The 1st ever setMedia being followed by a pause() or pause(t).
|
|
||||||
myStream.pause();
|
|
||||||
}
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
myStatus.pausePosition = myStream.time * 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!isNaN(time) && myStatus.srcSet) {
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE, myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isStartingDownload) {
|
|
||||||
return true;
|
|
||||||
} else if(myStatus.loadRequired()) {
|
|
||||||
if(time > 0) { // We do not want the stop() command, which does pause(0), causing a load operation.
|
|
||||||
return load();
|
|
||||||
} else {
|
|
||||||
return true; // Technically the pause(0) succeeded. ie., It did nothing, since nothing was required.
|
|
||||||
}
|
|
||||||
} else if(myStatus.isLoading || myStatus.isLoaded) {
|
|
||||||
if(myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration) { // The time is invalid, ie., past the end.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
myStream.seek(0);
|
|
||||||
seekedEvent(); // Deals with seeking effect when using setMedia() then pause(huge). NB: There is no preceeding seeking event.
|
|
||||||
} else if(!isNaN(time)) {
|
|
||||||
if(getSeekTimeRatio() > getLoadRatio()) { // Use an estimate based on the downloaded amount
|
|
||||||
seeking(true);
|
|
||||||
} else {
|
|
||||||
if(myStatus.metaDataReady) { // Otherwise seek(0) will stop the metadata loading.
|
|
||||||
myStream.seek(myStatus.pausePosition/1000);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
timeUpdates(false);
|
|
||||||
// Need to be careful with timeupdate event, otherwise a pause in a timeupdate event can cause a loop.
|
|
||||||
// Neither pause() nor pause(time) will cause a timeupdate loop.
|
|
||||||
if(wasPlaying || !isNaN(time) && !alreadyPausedAtTime) {
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function playHead(percent:Number):Boolean {
|
|
||||||
var time:Number = percent * getDuration() * getLoadRatio() / 100;
|
|
||||||
if(myStatus.isPlaying || myStatus.playOnLoad || myStatus.playOnSeek) {
|
|
||||||
return play(time);
|
|
||||||
} else {
|
|
||||||
return pause(time);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function setVolume(v:Number):void {
|
|
||||||
myStatus.volume = v;
|
|
||||||
myTransform.volume = v;
|
|
||||||
if(myStream != null) {
|
|
||||||
myStream.soundTransform = myTransform;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function updateStatusValues():void {
|
|
||||||
myStatus.seekPercent = 100 * getLoadRatio();
|
|
||||||
myStatus.currentTime = getCurrentTime();
|
|
||||||
myStatus.currentPercentRelative = 100 * getCurrentRatioRel();
|
|
||||||
myStatus.currentPercentAbsolute = 100 * getCurrentRatioAbs();
|
|
||||||
myStatus.duration = getDuration();
|
|
||||||
}
|
|
||||||
public function getLoadRatio():Number {
|
|
||||||
if((myStatus.isLoading || myStatus.isLoaded) && myStream.bytesTotal > 0) {
|
|
||||||
return myStream.bytesLoaded / myStream.bytesTotal;
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getDuration():Number {
|
|
||||||
return myStatus.duration; // Set from meta data.
|
|
||||||
}
|
|
||||||
public function getCurrentTime():Number {
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
return myStream.time * 1000;
|
|
||||||
} else {
|
|
||||||
return myStatus.pausePosition;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioRel():Number {
|
|
||||||
if((getLoadRatio() > 0) && (getCurrentRatioAbs() <= getLoadRatio())) {
|
|
||||||
return getCurrentRatioAbs() / getLoadRatio();
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioAbs():Number {
|
|
||||||
if(getDuration() > 0) {
|
|
||||||
return getCurrentTime() / getDuration();
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getSeekTimeRatio():Number {
|
|
||||||
if(getDuration() > 0) {
|
|
||||||
return myStatus.pausePosition / getDuration();
|
|
||||||
} else {
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function onMetaDataHandler(info:Object):void { // Used in connectStream() in myStream.client object.
|
|
||||||
// This event occurs when jumping to the start of static files! ie., seek(0) will cause this event to occur.
|
|
||||||
if(!myStatus.metaDataReady) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "onMetaDataHandler: " + info.duration + " | " + info.width + "x" + info.height));
|
|
||||||
|
|
||||||
myStatus.metaDataReady = true; // Set flag so that this event only effects jPlayer the 1st time.
|
|
||||||
myStatus.metaData = info;
|
|
||||||
myStatus.duration = info.duration * 1000; // Only available via Meta Data.
|
|
||||||
if(info.width != undefined) {
|
|
||||||
myVideo.width = myStatus.videoWidth = info.width;
|
|
||||||
}
|
|
||||||
if(info.height != undefined) {
|
|
||||||
myVideo.height = myStatus.videoHeight = info.height;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.playOnLoad) {
|
|
||||||
myStatus.playOnLoad = false; // Capture the flag
|
|
||||||
if(myStatus.pausePosition > 0 ) { // Important for setMedia followed by play(time).
|
|
||||||
play(myStatus.pausePosition);
|
|
||||||
} else {
|
|
||||||
play(); // Not always sending pausePosition avoids the extra seek(0) for a normal play() command.
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
pause(myStatus.pausePosition); // Always send the pausePosition. Important for setMedia() followed by pause(time). Deals with not reading stream.time with setMedia() and play() immediately followed by stop() or pause(0)
|
|
||||||
}
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADEDMETADATA, myStatus));
|
|
||||||
} else {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG, myStatus, "onMetaDataHandler: Already read (NO EFFECT)"));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,983 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Robert M. Hall
|
|
||||||
* Date: 29th January 2013
|
|
||||||
* Based on JplayerMp4.as with modifications for rtmp
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer
|
|
||||||
{
|
|
||||||
import flash.display.Sprite;
|
|
||||||
|
|
||||||
import flash.media.Video;
|
|
||||||
import flash.media.SoundTransform;
|
|
||||||
|
|
||||||
import flash.net.NetConnection;
|
|
||||||
import flash.net.NetStream;
|
|
||||||
import flash.net.Responder;
|
|
||||||
|
|
||||||
import flash.utils.Timer;
|
|
||||||
import flash.utils.getTimer;
|
|
||||||
|
|
||||||
import flash.events.NetStatusEvent;
|
|
||||||
import flash.events.SecurityErrorEvent;
|
|
||||||
import flash.events.TimerEvent;
|
|
||||||
import flash.events.ErrorEvent;
|
|
||||||
import flash.events.UncaughtErrorEvent;
|
|
||||||
import flash.utils.clearInterval;
|
|
||||||
import flash.utils.setInterval;
|
|
||||||
import happyworm.jPlayer.ConnectManager;
|
|
||||||
|
|
||||||
public class JplayerRtmp extends Sprite
|
|
||||||
{
|
|
||||||
|
|
||||||
public var myVideo:Video = new Video;
|
|
||||||
private var myConnection:NetConnection;
|
|
||||||
private var myStream:NetStream;
|
|
||||||
|
|
||||||
public var responder:Responder;
|
|
||||||
|
|
||||||
private var streamName:String;
|
|
||||||
|
|
||||||
private var connectString:Object;
|
|
||||||
|
|
||||||
private var firstTime:Boolean = true;
|
|
||||||
|
|
||||||
private var myTransform:SoundTransform = new SoundTransform ;
|
|
||||||
|
|
||||||
public var myStatus:JplayerStatus = new JplayerStatus ;
|
|
||||||
|
|
||||||
private var ConnMgr:ConnectManager=new ConnectManager();
|
|
||||||
|
|
||||||
private var timeUpdateTimer:Timer = new Timer(250,0);// Matched to HTML event freq
|
|
||||||
private var progressTimer:Timer = new Timer(250,0);// Matched to HTML event freq
|
|
||||||
private var seekingTimer:Timer = new Timer(100,0);// Internal: How often seeking is checked to see if it is over.
|
|
||||||
|
|
||||||
private var startBuffer:Number = 3;
|
|
||||||
private var maxBuffer:Number = 12;
|
|
||||||
|
|
||||||
public function JplayerRtmp(volume:Number)
|
|
||||||
{
|
|
||||||
myConnection = new NetConnection ;
|
|
||||||
myConnection.client = this;
|
|
||||||
|
|
||||||
|
|
||||||
// Moved the netconnection negotiation into the ConnectManager.as class - not needed for initial connection
|
|
||||||
// may need to add eventHandler back in for errors only or just dispatch from the ConnectManager..revisit...
|
|
||||||
|
|
||||||
// myConnection.addEventListener(NetStatusEvent.NET_STATUS,netStatusHandler);
|
|
||||||
// myConnection.addEventListener(SecurityErrorEvent.SECURITY_ERROR,securityErrorHandler);
|
|
||||||
myVideo.smoothing = true;
|
|
||||||
this.addChild(myVideo);
|
|
||||||
|
|
||||||
timeUpdateTimer.addEventListener(TimerEvent.TIMER,timeUpdateHandler);
|
|
||||||
progressTimer.addEventListener(TimerEvent.TIMER,progressHandler);
|
|
||||||
seekingTimer.addEventListener(TimerEvent.TIMER,seekingHandler);
|
|
||||||
|
|
||||||
myStatus.volume = volume;
|
|
||||||
|
|
||||||
addEventListener(UncaughtErrorEvent.UNCAUGHT_ERROR, uncaughtErrorHandler);
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
private function uncaughtErrorHandler(event:UncaughtErrorEvent):void
|
|
||||||
{
|
|
||||||
trace("UNCAUGHT ERROR - try loading again");
|
|
||||||
|
|
||||||
if (event.error is Error)
|
|
||||||
{
|
|
||||||
var error:Error = event.error as Error;
|
|
||||||
trace(error);
|
|
||||||
// do something with the error
|
|
||||||
}
|
|
||||||
else if (event.error is ErrorEvent)
|
|
||||||
{
|
|
||||||
var errorEvent:ErrorEvent = event.error as ErrorEvent;
|
|
||||||
// do something with the error
|
|
||||||
trace(errorEvent);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
// a non-Error, non-ErrorEvent type was thrown and uncaught
|
|
||||||
}
|
|
||||||
load();
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
private function progressUpdates(active:Boolean):void
|
|
||||||
{
|
|
||||||
if (active)
|
|
||||||
{
|
|
||||||
progressTimer.start();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
progressTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function progressHandler(e:TimerEvent):void
|
|
||||||
{
|
|
||||||
if (myStatus.isLoading)
|
|
||||||
{
|
|
||||||
if ((getLoadRatio() == 1))
|
|
||||||
{// Close as can get to a loadComplete event since client.onPlayStatus only works with FMS
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"progressHandler: loadComplete"));
|
|
||||||
myStatus.loaded();
|
|
||||||
progressUpdates(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
progressEvent();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function progressEvent():void
|
|
||||||
{
|
|
||||||
// temporarily disabled progress event dispatching - not really needed for rtmp
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"progressEvent:"));
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PROGRESS,myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
private function timeUpdates(active:Boolean):void
|
|
||||||
{
|
|
||||||
if (active)
|
|
||||||
{
|
|
||||||
timeUpdateTimer.start();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
timeUpdateTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private function timeUpdateHandler(e:TimerEvent):void
|
|
||||||
{
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
|
|
||||||
private function timeUpdateEvent():void
|
|
||||||
{
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_TIMEUPDATE,myStatus));
|
|
||||||
}
|
|
||||||
private function seeking(active:Boolean):void
|
|
||||||
{
|
|
||||||
if (active)
|
|
||||||
{
|
|
||||||
if (! myStatus.isSeeking)
|
|
||||||
{
|
|
||||||
seekingEvent();
|
|
||||||
}
|
|
||||||
seekingTimer.start();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
if (myStatus.isSeeking)
|
|
||||||
{
|
|
||||||
seekedEvent();
|
|
||||||
}
|
|
||||||
seekingTimer.stop();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingHandler(e:TimerEvent):void
|
|
||||||
{
|
|
||||||
if ((getSeekTimeRatio() <= getLoadRatio()))
|
|
||||||
{
|
|
||||||
seeking(false);
|
|
||||||
if (myStatus.playOnSeek)
|
|
||||||
{
|
|
||||||
myStatus.playOnSeek = false;// Capture the flag.
|
|
||||||
play(myStatus.pausePosition);// Must pass time or the seek time is never set.
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
pause(myStatus.pausePosition);// Must pass time or the stream.time is read.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if (myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration)
|
|
||||||
{
|
|
||||||
// Illegal seek time
|
|
||||||
seeking(false);
|
|
||||||
pause(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function seekingEvent():void
|
|
||||||
{
|
|
||||||
myStatus.isSeeking = true;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKING,myStatus));
|
|
||||||
}
|
|
||||||
private function seekedEvent():void
|
|
||||||
{
|
|
||||||
myStatus.isSeeking = false;
|
|
||||||
updateStatusValues();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_SEEKED,myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
private function netStatusHandler(e:NetStatusEvent):void
|
|
||||||
{
|
|
||||||
trace(("netStatusHandler: " + e.info.code));
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"netStatusHandler: '" + e.info.code + "'"));
|
|
||||||
//trace("BEFORE: bufferTime: "+myStream.bufferTime+" - bufferTimeMax: "+myStream.bufferTimeMax);
|
|
||||||
switch (e.info.code)
|
|
||||||
{
|
|
||||||
case "NetConnection.Connect.Success" :
|
|
||||||
// connectStream(); // This method did not do anything sensible anyway.
|
|
||||||
// Do not think this case occurs. This was for the static file connection.
|
|
||||||
// Which now seems to be handled by the Connection Manager.
|
|
||||||
break;
|
|
||||||
case "NetStream.Buffer.Full":
|
|
||||||
if(connectString.streamTYPE == "LIVE") {
|
|
||||||
myStream.bufferTime = startBuffer;
|
|
||||||
} else {
|
|
||||||
myStream.bufferTime = maxBuffer;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "NetStream.Buffer.Flush":
|
|
||||||
myStream.bufferTime = startBuffer;
|
|
||||||
break;
|
|
||||||
case "NetStream.Buffer.Empty":
|
|
||||||
myStream.bufferTime = startBuffer;
|
|
||||||
break;
|
|
||||||
case "NetStream.Seek.Notify":
|
|
||||||
myStream.bufferTime = startBuffer;
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.Start" :
|
|
||||||
|
|
||||||
if (firstTime) {
|
|
||||||
firstTime = false; // Capture flag
|
|
||||||
|
|
||||||
myStatus.loading();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADSTART,myStatus));
|
|
||||||
|
|
||||||
// NB: With MP4 player both audio and video types get connected to myVideo.
|
|
||||||
// NB: Had believed it was important for the audio too, otherwise what plays it?
|
|
||||||
if(videoBinding) {
|
|
||||||
myVideo.attachNetStream(myStream);
|
|
||||||
}
|
|
||||||
|
|
||||||
setVolume(myStatus.volume);
|
|
||||||
|
|
||||||
// Really the progress event just needs to be generated once, and should probably happen before now.
|
|
||||||
progressUpdates(true);
|
|
||||||
|
|
||||||
// This is an ASSUMPTION! Made it so that the default GUI worked.
|
|
||||||
// Hence why this part should be refactored.
|
|
||||||
// Lots of commands sequences after setMedia would be corrupted by this assumption.
|
|
||||||
// Bascally, we assume that after a setMedia, you will play it.
|
|
||||||
// Doing setMedia and pause(15) cause the flag to be set incorrectly and the GUI locks up.
|
|
||||||
myStatus.isPlaying = true; // Should be handled elsewhere.
|
|
||||||
}
|
|
||||||
|
|
||||||
// Under RTMP, this event code occurs every time the media starts playing and when a new position is seeked to, even when paused.
|
|
||||||
|
|
||||||
// Since under RTMP the event behaviour is quite different, believe a refactor is best here.
|
|
||||||
// ie., Under RTMP we should be able to know a lot more info about the stream.
|
|
||||||
|
|
||||||
// See onMetaDataHandler() for other condition, since duration is vital.
|
|
||||||
// See onResult() response handler too.
|
|
||||||
// Appears to be some duplication between onMetaDataHandler() and onResult(), along with a race between them occuring.
|
|
||||||
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.UnpublishNotify":
|
|
||||||
myStream.bufferTime = startBuffer; // was 3
|
|
||||||
case "NetStream.Play.Stop" :
|
|
||||||
myStream.bufferTime = startBuffer; // was 3
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"NetStream.Play.Stop: getDuration() - getCurrentTime() = " + (getDuration() - getCurrentTime())));
|
|
||||||
|
|
||||||
// Check if media is at the end (or close) otherwise this was due to download bandwidth stopping playback. ie., Download is not fast enough.
|
|
||||||
if (Math.abs((getDuration() - getCurrentTime())) < 150)
|
|
||||||
{// Testing found 150ms worked best for M4A files, where playHead(99.9) caused a stuck state due to firing with ~116ms left to play.
|
|
||||||
//endedEvent();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "NetStream.Seek.InvalidTime" :
|
|
||||||
// Used for capturing invalid set times and clicks on the end of the progress bar.
|
|
||||||
endedEvent();
|
|
||||||
break;
|
|
||||||
case "NetStream.Play.StreamNotFound" :
|
|
||||||
myStatus.error();
|
|
||||||
// Resets status except the src, and it sets srcError property.;
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ERROR,myStatus));
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
//trace("AFTER: bufferTime: "+myStream.bufferTime+" - bufferTimeMax: "+myStream.bufferTimeMax);
|
|
||||||
// "NetStream.Seek.Notify" event code is not very useful. It occurs after every seek(t) command issued and does not appear to wait for the media to be ready.
|
|
||||||
}
|
|
||||||
private function endedEvent():void
|
|
||||||
{
|
|
||||||
trace("ENDED STREAM EVENT");
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
// timeUpdates(false);
|
|
||||||
// timeUpdateEvent();
|
|
||||||
pause(0);
|
|
||||||
|
|
||||||
if (wasPlaying)
|
|
||||||
{
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ENDED,myStatus));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function securityErrorHandler(event:SecurityErrorEvent):void
|
|
||||||
{
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"securityErrorHandler."));
|
|
||||||
}
|
|
||||||
public function connectStream():void
|
|
||||||
{
|
|
||||||
trace("CONNECTING");
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"connectStream."));
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_CANPLAY,myStatus));
|
|
||||||
|
|
||||||
timeUpdates(true);
|
|
||||||
progressUpdates(true);
|
|
||||||
//myVideo.attachNetStream(myStream);
|
|
||||||
//setVolume(myStatus.volume);
|
|
||||||
}
|
|
||||||
|
|
||||||
private function onResult(result:Object):void
|
|
||||||
{
|
|
||||||
trace("OnResult EVENT FIRED!");
|
|
||||||
myStatus.duration = parseFloat(result.toString()) * 1000;
|
|
||||||
trace((("The stream length is " + result) + " seconds"));
|
|
||||||
|
|
||||||
if(!myConnection.connected) {
|
|
||||||
load();
|
|
||||||
} else {
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_CANPLAY,myStatus,"Rockit!"));
|
|
||||||
|
|
||||||
//myStatus.loaded();
|
|
||||||
//myStatus.isPlaying=true;
|
|
||||||
if (! myStatus.metaDataReady)
|
|
||||||
{
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"onMetaDataHandler: " + myStatus.duration));
|
|
||||||
|
|
||||||
// Allow multiple onResult Handlers to affect size. As per PR #131 and #98.
|
|
||||||
// myStatus.metaDataReady = true;
|
|
||||||
|
|
||||||
/*var info:Object = new Object();
|
|
||||||
info.duration=myStatus.duration
|
|
||||||
info.width=undefined;
|
|
||||||
info.height=undefined;
|
|
||||||
myStatus.metaData = info;
|
|
||||||
*/
|
|
||||||
if (myStatus.playOnLoad)
|
|
||||||
{
|
|
||||||
myStatus.playOnLoad = false;// Capture the flag
|
|
||||||
if (myStatus.pausePosition > 0)
|
|
||||||
{// Important for setMedia followed by play(time).
|
|
||||||
play(myStatus.pausePosition);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
play();// Not always sending pausePosition avoids the extra seek(0) for a normal play() command.
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
pause(myStatus.pausePosition);// Always send the pausePosition. Important for setMedia() followed by pause(time). Deals with not reading stream.time with setMedia() and play() immediately followed by stop() or pause(0)
|
|
||||||
}
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADEDMETADATA,myStatus));
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"onMetaDataHandler: Already read (NO EFFECT)"));
|
|
||||||
}
|
|
||||||
|
|
||||||
myStream.play(streamName);
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PLAY,myStatus));
|
|
||||||
// timeUpdates(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
private var overRideConnect:Boolean=false;
|
|
||||||
public function doneYet():void {
|
|
||||||
if(!myConnection.connected) {
|
|
||||||
// try again
|
|
||||||
ConnMgr.stopAll(true);
|
|
||||||
overRideConnect=true;
|
|
||||||
trace("Connected: "+myConnection.connected+" - "+myStatus.loadRequired());
|
|
||||||
load();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
private var videoBinding:Boolean=false;
|
|
||||||
public function setFile(src:String,videoSupport:Boolean=false):void
|
|
||||||
{
|
|
||||||
// videoSupport turns on/off video - by default no video, audio only
|
|
||||||
videoBinding=videoSupport;
|
|
||||||
/* Dont close the stream or netconnection here anymore so we can recycle if host/appname are the same
|
|
||||||
if ((myStream != null))
|
|
||||||
{
|
|
||||||
myStream.close();
|
|
||||||
myConnection.close();
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
if(ConnMgr.getNegotiating() == true) {
|
|
||||||
//ConnMgr.stopAll();
|
|
||||||
ConnMgr.setNegotiating(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
myVideo.clear();
|
|
||||||
|
|
||||||
progressUpdates(false);
|
|
||||||
timeUpdates(false);
|
|
||||||
|
|
||||||
myStatus.reset();
|
|
||||||
myStatus.src = src;
|
|
||||||
myStatus.srcSet = true;
|
|
||||||
|
|
||||||
firstTime = true;
|
|
||||||
|
|
||||||
//myStatus.loaded();
|
|
||||||
|
|
||||||
if(src != "") {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_CANPLAY,myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
//timeUpdateEvent();
|
|
||||||
}
|
|
||||||
|
|
||||||
public function shutDownNcNs():void {
|
|
||||||
trace("Connections Closed");
|
|
||||||
timeUpdates(false);
|
|
||||||
progressUpdates(false);
|
|
||||||
myStream.close();
|
|
||||||
myConnection.close();
|
|
||||||
|
|
||||||
myStatus.reset();
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_ENDED,myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
public function clearFile():void
|
|
||||||
{
|
|
||||||
if (myStream != null)
|
|
||||||
{
|
|
||||||
myStream.close();
|
|
||||||
// Dont close the netConnection here any longer, as we may recycle it later
|
|
||||||
// may need an extra way to close manually if switching media types after an rtmp session - revisit
|
|
||||||
// myConnection.close();
|
|
||||||
myStatus.reset();
|
|
||||||
}
|
|
||||||
setFile("");
|
|
||||||
myStatus.srcSet = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
public function parseRTMPsrcConnect(rtmpSrc:String):Object
|
|
||||||
{
|
|
||||||
// rtmp://cp76372.live.edgefcs.net/live/Flash1Office@60204
|
|
||||||
var appName:String = "";
|
|
||||||
var streamFileName:String = "";
|
|
||||||
var startIndex:uint = 2 + rtmpSrc.indexOf("//");
|
|
||||||
var streamTYPE:String = "recorded";
|
|
||||||
var host:String = rtmpSrc.substr(startIndex);
|
|
||||||
var port:String = "";
|
|
||||||
host = host.substr(0,host.indexOf("/"));
|
|
||||||
var endHost:Number = startIndex + host.length + 1;
|
|
||||||
|
|
||||||
// See if there is a host port specified
|
|
||||||
if(host.indexOf(":") != -1) {
|
|
||||||
port = host.substr(host.indexOf(":")+1);
|
|
||||||
host = host.substr(0,host.indexOf(":"));
|
|
||||||
}
|
|
||||||
|
|
||||||
// Akamai specific live streams
|
|
||||||
if (rtmpSrc.lastIndexOf("/live/") != -1)
|
|
||||||
{
|
|
||||||
trace("LIVE!");
|
|
||||||
|
|
||||||
|
|
||||||
appName = rtmpSrc.substring(endHost,rtmpSrc.lastIndexOf("/live/") + 6);
|
|
||||||
streamFileName = rtmpSrc.substr(rtmpSrc.lastIndexOf("/live/") + 6);
|
|
||||||
streamTYPE="LIVE";
|
|
||||||
} else {
|
|
||||||
streamTYPE="RECORDED";
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Mp3 streams with standard appname/no instance name, mp3: prefix
|
|
||||||
if (rtmpSrc.indexOf(".mp3") != -1)
|
|
||||||
{
|
|
||||||
appName = rtmpSrc.substring(endHost,rtmpSrc.indexOf("mp3:"));
|
|
||||||
streamFileName = rtmpSrc.substr(rtmpSrc.indexOf("mp3:"));
|
|
||||||
streamFileName = streamFileName.substr(0,streamFileName.length - 4);
|
|
||||||
}
|
|
||||||
// rtmp://cp83813.edgefcs.net/ondemand/rob_hall/bruce_campbell_oldspice.flv
|
|
||||||
|
|
||||||
// Mp4 streams with standard appname/no instance name, mp4: prefix
|
|
||||||
if (rtmpSrc.indexOf("mp4:") != -1)
|
|
||||||
{
|
|
||||||
appName = rtmpSrc.substring(endHost,rtmpSrc.indexOf("mp4:"));
|
|
||||||
streamFileName = rtmpSrc.substr(rtmpSrc.indexOf("mp4:"));
|
|
||||||
streamFileName = streamFileName.substr(0,streamFileName.length - 4);
|
|
||||||
}
|
|
||||||
|
|
||||||
// .f4v streams with standard appname/no instance name, .flv extension
|
|
||||||
if (rtmpSrc.indexOf(".flv") != -1)
|
|
||||||
{
|
|
||||||
// allow use of ^ in rtmp string to indicate break point for an appname or instance name that
|
|
||||||
// contains a / in it where it would require multiple connection attempts or manual configuratiom
|
|
||||||
// of the appname/instancename
|
|
||||||
var endApp:Number=0;
|
|
||||||
if(rtmpSrc.indexOf("^") != -1) {
|
|
||||||
endApp=rtmpSrc.indexOf("^");
|
|
||||||
rtmpSrc.replace("^", "/");
|
|
||||||
} else {
|
|
||||||
endApp = rtmpSrc.indexOf("/",endHost);
|
|
||||||
}
|
|
||||||
appName = rtmpSrc.substring(endHost,endApp) + "/";
|
|
||||||
streamFileName = rtmpSrc.substr(endApp+1);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(port=="") {
|
|
||||||
port="MULTI";
|
|
||||||
}
|
|
||||||
//rtmp, rtmpt, rtmps, rtmpe, rtmpte
|
|
||||||
|
|
||||||
|
|
||||||
trace(("\n\n*** HOST: " + host));
|
|
||||||
trace(("*** PORT: " + port));
|
|
||||||
trace(("*** APPNAME: " + appName));
|
|
||||||
trace(("*** StreamName: " + streamFileName));
|
|
||||||
|
|
||||||
var streamParts:Object = new Object;
|
|
||||||
streamParts.streamTYPE=streamTYPE;
|
|
||||||
streamParts.appName = appName;
|
|
||||||
streamParts.streamFileName = streamFileName;
|
|
||||||
streamParts.hostName = host;
|
|
||||||
streamName = streamFileName;
|
|
||||||
|
|
||||||
return streamParts;
|
|
||||||
}
|
|
||||||
|
|
||||||
public function load():Boolean
|
|
||||||
{
|
|
||||||
//trace("LOAD: "+myStatus.src);
|
|
||||||
if (myStatus.loadRequired() || overRideConnect==true)
|
|
||||||
{
|
|
||||||
overRideConnect=false;
|
|
||||||
myStatus.startingDownload();
|
|
||||||
var lastAppName:String;
|
|
||||||
var lastHostName:String;
|
|
||||||
|
|
||||||
try{
|
|
||||||
// we do a try, as these properties might not exist yet
|
|
||||||
if(connectString.appName != "" && connectString.appName != undefined) {
|
|
||||||
trace("PREVIOUS APP/HOST INFO AVAILABLE");
|
|
||||||
lastAppName = connectString.appName;
|
|
||||||
lastHostName = connectString.hostName;
|
|
||||||
trace("LAST: "+lastAppName,lastHostName);
|
|
||||||
}
|
|
||||||
} catch (error:Error) {
|
|
||||||
//trace("*** Caught an error condition: "+error);
|
|
||||||
}
|
|
||||||
|
|
||||||
connectString = parseRTMPsrcConnect(myStatus.src);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
trace("**** LOAD :: CONNECT SOURCE: " +connectString.hostName +" "+ connectString.appName);
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_WAITING, myStatus));
|
|
||||||
|
|
||||||
if((connectString.appName == lastAppName && connectString.hostName == lastHostName) && (myConnection.connected)) {
|
|
||||||
// recycle the netConnection
|
|
||||||
trace("RECYCLING NETCONNECTION");
|
|
||||||
if ((myStream != null))
|
|
||||||
{
|
|
||||||
myStream.close();
|
|
||||||
}
|
|
||||||
connectStream();
|
|
||||||
onBWDone(null,myConnection);
|
|
||||||
} else {
|
|
||||||
// myConnection.connect(connectString.appName);
|
|
||||||
trace("NEW NetConnection Negotiation");
|
|
||||||
if ((myStream != null))
|
|
||||||
{
|
|
||||||
myStream.close();
|
|
||||||
myConnection.close();
|
|
||||||
}
|
|
||||||
|
|
||||||
ConnMgr.stopAll(true);
|
|
||||||
ConnMgr.negotiateConnect(this,connectString.hostName,connectString.appName);
|
|
||||||
}
|
|
||||||
|
|
||||||
trace("**** LOAD2 :: CONNECT SOURCE: " +connectString.hostName +" "+ connectString.appName);
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_WAITING, myStatus));
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
public function onFCUnsubscribe(info:Object):void
|
|
||||||
{
|
|
||||||
trace(("onFCUnSubscribe worked" + info));
|
|
||||||
}
|
|
||||||
|
|
||||||
public function onFCSubscribe(info:Object):void
|
|
||||||
{
|
|
||||||
trace(("onFCSubscribe worked" + info));
|
|
||||||
}
|
|
||||||
|
|
||||||
public function onBWDone(info:Object,nc:NetConnection):void
|
|
||||||
{
|
|
||||||
if(nc.connected) {
|
|
||||||
myConnection=nc;
|
|
||||||
trace(((("onBWDone " + info) + " :: ") + myStatus.src));
|
|
||||||
|
|
||||||
var customClient:Object = new Object ;
|
|
||||||
customClient.onMetaData = onMetaDataHandler;
|
|
||||||
customClient.onPlayStatus = onPlayStatusHandler;// According to the forums and my tests, onPlayStatus only works with FMS (Flash Media Server).
|
|
||||||
|
|
||||||
myStream = null;
|
|
||||||
myStream = new NetStream(myConnection);
|
|
||||||
myStream.addEventListener(NetStatusEvent.NET_STATUS,netStatusHandler);
|
|
||||||
myStream.client = customClient;
|
|
||||||
if(connectString.streamTYPE == "LIVE") {
|
|
||||||
myStream.bufferTime = 3; // was 3
|
|
||||||
myStream.bufferTimeMax = 24;
|
|
||||||
startBuffer = 3;
|
|
||||||
maxBuffer = 12;
|
|
||||||
|
|
||||||
} else {
|
|
||||||
myStream.bufferTime = .2; // was 3
|
|
||||||
myStream.bufferTimeMax = 0;
|
|
||||||
startBuffer = .2;
|
|
||||||
maxBuffer = 12;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
//streamName="";
|
|
||||||
//var connectString:Object = parseRTMPsrcConnect(myStatus.src);
|
|
||||||
//streamName=connectString.streamFileName;
|
|
||||||
|
|
||||||
responder = new Responder(onResult);
|
|
||||||
myConnection.call("getStreamLength",responder,streamName);
|
|
||||||
} else {
|
|
||||||
connectStream();
|
|
||||||
}
|
|
||||||
|
|
||||||
trace("PLAY SOURCE: "+connectString);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
public function play(time:Number = NaN):Boolean {
|
|
||||||
//trace("PLAY: "+time+" - isPlaying: "+myStatus.isPlaying +" - myStatus.isStartingDownload:"+myStatus.isStartingDownload);
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
if(!isNaN(time) && myStatus.srcSet) {
|
|
||||||
if(myStatus.isPlaying) {
|
|
||||||
myStream.pause();
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
}
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(myStatus.isStartingDownload) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in onMetaDataHandler()
|
|
||||||
return true;
|
|
||||||
} else if(myStatus.loadRequired()) {
|
|
||||||
myStatus.playOnLoad = true; // Raise flag, captured in onMetaDataHandler()
|
|
||||||
return load();
|
|
||||||
} else if((myStatus.isLoading || myStatus.isLoaded) && !myStatus.isPlaying) {
|
|
||||||
if(myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration && connectString.streamTYPE != "LIVE") { // The time is invalid, ie., past the end.
|
|
||||||
myStream.pause(); // Since it is playing by default at this point.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
trace("SEEKER!");
|
|
||||||
myStream.seek(0);
|
|
||||||
timeUpdates(false);
|
|
||||||
timeUpdateEvent();
|
|
||||||
if(wasPlaying) { // For when playing and then get a play(huge)
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE, myStatus));
|
|
||||||
}
|
|
||||||
} else if(getSeekTimeRatio() > getLoadRatio()) { // Use an estimate based on the downloaded amount
|
|
||||||
myStatus.playOnSeek = true;
|
|
||||||
seeking(true);
|
|
||||||
trace("SEEKER PAUSE!");
|
|
||||||
myStream.pause(); // Since it is playing by default at this point.
|
|
||||||
} else {
|
|
||||||
if(!isNaN(time)) { // Avoid using seek() when it is already correct.
|
|
||||||
trace("SEEKER3");
|
|
||||||
myStream.seek(myStatus.pausePosition/1000); // Since time is in ms and seek() takes seconds
|
|
||||||
}
|
|
||||||
myStatus.isPlaying = true; // Set immediately before playing. Could affects events.
|
|
||||||
trace("SHOULD GET RESUME!");
|
|
||||||
myStream.resume();
|
|
||||||
timeUpdates(true);
|
|
||||||
if(!wasPlaying) {
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PLAY, myStatus));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public function pause(time:Number=NaN):Boolean
|
|
||||||
{
|
|
||||||
//trace("PAUSE: "+time);
|
|
||||||
myStatus.playOnLoad = false;// Reset flag in case load/play issued immediately before this command, ie., before onMetadata() event.
|
|
||||||
myStatus.playOnSeek = false;// Reset flag in case play(time) issued before the command and is still seeking to time set.
|
|
||||||
|
|
||||||
var wasPlaying:Boolean = myStatus.isPlaying;
|
|
||||||
|
|
||||||
|
|
||||||
// To avoid possible loops with timeupdate and pause(time). A pause() does not have the problem.
|
|
||||||
var alreadyPausedAtTime:Boolean = false;
|
|
||||||
if(!isNaN(time) && myStatus.pausePosition == time) {
|
|
||||||
alreadyPausedAtTime = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
trace("!isNaN: "+!isNaN(time) +" isNaN: "+isNaN(time));
|
|
||||||
|
|
||||||
// Need to wait for metadata to load before ever issuing a pause. The metadata handler will call this function if needed, when ready.
|
|
||||||
if (((myStream != null) && myStatus.metaDataReady))
|
|
||||||
{// myStream is a null until the 1st media is loaded. ie., The 1st ever setMedia being followed by a pause() or pause(t).
|
|
||||||
|
|
||||||
if(connectString.streamTYPE == "LIVE") {
|
|
||||||
trace("PAUSING LIVE");
|
|
||||||
myStream.play(false)
|
|
||||||
} else {
|
|
||||||
trace("PAUSING RECORDED");
|
|
||||||
myStream.pause();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (myStatus.isPlaying)
|
|
||||||
{
|
|
||||||
myStatus.isPlaying = false;
|
|
||||||
myStatus.pausePosition = myStream.time * 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (! isNaN(time) && myStatus.srcSet)
|
|
||||||
{
|
|
||||||
myStatus.pausePosition = time;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (wasPlaying)
|
|
||||||
{
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_PAUSE,myStatus));
|
|
||||||
}
|
|
||||||
|
|
||||||
if (myStatus.isStartingDownload)
|
|
||||||
{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
else if (myStatus.loadRequired())
|
|
||||||
{
|
|
||||||
if ((time > 0))
|
|
||||||
{// We do not want the stop() command, which does pause(0), causing a load operation.
|
|
||||||
return load();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return true;// Technically the pause(0) succeeded. ie., It did nothing, since nothing was required.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if (myStatus.isLoading || myStatus.isLoaded)
|
|
||||||
{
|
|
||||||
if (myStatus.metaDataReady && myStatus.pausePosition > myStatus.duration && connectString.streamTYPE != "LIVE" )
|
|
||||||
{// The time is invalid, ie., past the end.
|
|
||||||
myStatus.pausePosition = 0;
|
|
||||||
|
|
||||||
trace("GOT HERE!");
|
|
||||||
myStream.seek(0);
|
|
||||||
seekedEvent();// Deals with seeking effect when using setMedia() then pause(huge). NB: There is no preceeding seeking event.
|
|
||||||
}
|
|
||||||
else if (! isNaN(time))
|
|
||||||
{
|
|
||||||
if ((getSeekTimeRatio() > getLoadRatio()))
|
|
||||||
{// Use an estimate based on the downloaded amount
|
|
||||||
seeking(true);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
if (myStatus.metaDataReady && connectString.streamTYPE != "LIVE")
|
|
||||||
{// Otherwise seek(0) will stop the metadata loading.
|
|
||||||
trace("GOT HERE TOO!");
|
|
||||||
myStream.seek(myStatus.pausePosition / 1000);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
timeUpdates(false);
|
|
||||||
// Need to be careful with timeupdate event, otherwise a pause in a timeupdate event can cause a loop.
|
|
||||||
// Neither pause() nor pause(time) will cause a timeupdate loop.
|
|
||||||
if(wasPlaying || !isNaN(time) && !alreadyPausedAtTime) {
|
|
||||||
timeUpdateEvent();
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function playHead(percent:Number):Boolean
|
|
||||||
{
|
|
||||||
var time:Number = percent * getDuration() * getLoadRatio() / 100;
|
|
||||||
if (myStatus.isPlaying || myStatus.playOnLoad || myStatus.playOnSeek)
|
|
||||||
{
|
|
||||||
return play(time);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return pause(time);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function setVolume(v:Number):void
|
|
||||||
{
|
|
||||||
myStatus.volume = v;
|
|
||||||
myTransform.volume = v;
|
|
||||||
if ((myStream != null))
|
|
||||||
{
|
|
||||||
myStream.soundTransform = myTransform;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
private function updateStatusValues():void
|
|
||||||
{
|
|
||||||
//myStatus.seekPercent = 100 * getLoadRatio();
|
|
||||||
myStatus.seekPercent = 100;
|
|
||||||
myStatus.currentTime = getCurrentTime();
|
|
||||||
myStatus.currentPercentRelative = 100 * getCurrentRatioRel();
|
|
||||||
myStatus.currentPercentAbsolute = 100 * getCurrentRatioAbs();
|
|
||||||
myStatus.duration = getDuration();
|
|
||||||
}
|
|
||||||
public function getLoadRatio():Number
|
|
||||||
{
|
|
||||||
return 1;
|
|
||||||
/*trace("LoadRatio:"+myStream.bytesLoaded, myStream.bytesTotal);
|
|
||||||
if((myStatus.isLoading || myStatus.isLoaded) && myStream.bytesTotal > 0) {
|
|
||||||
|
|
||||||
return myStream.bytesLoaded / myStream.bytesTotal;
|
|
||||||
} else {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
}
|
|
||||||
public function getDuration():Number
|
|
||||||
{
|
|
||||||
return myStatus.duration;// Set from meta data.
|
|
||||||
}
|
|
||||||
public function getCurrentTime():Number
|
|
||||||
{
|
|
||||||
if (myStatus.isPlaying)
|
|
||||||
{
|
|
||||||
//trace(myStream.time * 1000);
|
|
||||||
return myStream.time * 1000; // was +1000
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return myStatus.pausePosition;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioRel():Number
|
|
||||||
{
|
|
||||||
|
|
||||||
if ((getCurrentRatioAbs() <= getLoadRatio()))
|
|
||||||
{
|
|
||||||
//if((getLoadRatio() > 0) && (getCurrentRatioAbs() <= getLoadRatio())) {
|
|
||||||
return getCurrentRatioAbs() / getLoadRatio();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getCurrentRatioAbs():Number
|
|
||||||
{
|
|
||||||
if ((getDuration() > 0))
|
|
||||||
{
|
|
||||||
return getCurrentTime() / getDuration();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function getSeekTimeRatio():Number
|
|
||||||
{
|
|
||||||
if ((getDuration() > 0))
|
|
||||||
{
|
|
||||||
return myStatus.pausePosition / getDuration();
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
public function onPlayStatusHandler(infoObject:Object):void
|
|
||||||
{
|
|
||||||
trace((("OnPlayStatusHandler called: (" + getTimer()) + " ms)"));
|
|
||||||
for (var prop:* in infoObject)
|
|
||||||
{
|
|
||||||
trace(((("\t" + prop) + ":\t") + infoObject[prop]));
|
|
||||||
}
|
|
||||||
if (infoObject.code == "NetStream.Play.Complete")
|
|
||||||
{
|
|
||||||
endedEvent();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public function onMetaDataHandler(info:Object):void
|
|
||||||
{// Used in connectStream() in myStream.client object.
|
|
||||||
// This event occurs when jumping to the start of static files! ie., seek(0) will cause this event to occur.
|
|
||||||
|
|
||||||
if (! myStatus.metaDataReady)
|
|
||||||
{
|
|
||||||
trace("\n\n*** METADATA FIRED! ***\n\n");
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"onMetaDataHandler: " + info.duration + " | " + info.width + "x" + info.height));
|
|
||||||
|
|
||||||
myStatus.metaDataReady = true;// Set flag so that this event only effects jPlayer the 1st time.
|
|
||||||
myStatus.metaData = info;
|
|
||||||
myStatus.duration = info.duration * 1000;// Only available via Meta Data.
|
|
||||||
if (info.width != undefined)
|
|
||||||
{
|
|
||||||
myVideo.width = myStatus.videoWidth = info.width;
|
|
||||||
}
|
|
||||||
if (info.height != undefined)
|
|
||||||
{
|
|
||||||
myVideo.height = myStatus.videoHeight = info.height;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (myStatus.playOnLoad)
|
|
||||||
{
|
|
||||||
myStatus.playOnLoad = false;// Capture the flag
|
|
||||||
if (myStatus.pausePosition > 0)
|
|
||||||
{// Important for setMedia followed by play(time).
|
|
||||||
play(myStatus.pausePosition);
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
play();// Not always sending pausePosition avoids the extra seek(0) for a normal play() command.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
pause(myStatus.pausePosition);// Always send the pausePosition. Important for setMedia() followed by pause(time). Deals with not reading stream.time with setMedia() and play() immediately followed by stop() or pause(0)
|
|
||||||
}
|
|
||||||
this.dispatchEvent(new JplayerEvent(JplayerEvent.JPLAYER_LOADEDMETADATA,myStatus));
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
//this.dispatchEvent(new JplayerEvent(JplayerEvent.DEBUG_MSG,myStatus,"onMetaDataHandler: Already read (NO EFFECT)"));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,110 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Date: 5th June 2013
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer {
|
|
||||||
public class JplayerStatus {
|
|
||||||
|
|
||||||
public static const VERSION:String = "2.4.0"; // The version of the Flash jPlayer entity.
|
|
||||||
|
|
||||||
public var volume:Number = 0.5; // Not affected by reset()
|
|
||||||
public var muted:Boolean = false; // Not affected by reset()
|
|
||||||
|
|
||||||
public var src:String;
|
|
||||||
public var srcError:Boolean;
|
|
||||||
|
|
||||||
public var srcSet:Boolean;
|
|
||||||
public var isPlaying:Boolean;
|
|
||||||
public var isSeeking:Boolean;
|
|
||||||
|
|
||||||
public var isWaiting:Boolean;
|
|
||||||
|
|
||||||
public var playOnLoad:Boolean;
|
|
||||||
public var playOnSeek:Boolean;
|
|
||||||
|
|
||||||
public var isStartingDownload:Boolean;
|
|
||||||
public var isLoading:Boolean;
|
|
||||||
public var isLoaded:Boolean;
|
|
||||||
|
|
||||||
public var pausePosition:Number;
|
|
||||||
|
|
||||||
public var seekPercent:Number;
|
|
||||||
public var currentTime:Number;
|
|
||||||
public var currentPercentRelative:Number;
|
|
||||||
public var currentPercentAbsolute:Number;
|
|
||||||
public var duration:Number;
|
|
||||||
|
|
||||||
public var videoWidth:Number;
|
|
||||||
public var videoHeight:Number;
|
|
||||||
|
|
||||||
public var metaDataReady:Boolean;
|
|
||||||
public var metaData:Object;
|
|
||||||
|
|
||||||
public function JplayerStatus() {
|
|
||||||
reset();
|
|
||||||
}
|
|
||||||
public function reset():void {
|
|
||||||
src = "";
|
|
||||||
srcError = false;
|
|
||||||
|
|
||||||
srcSet = false;
|
|
||||||
isPlaying = false;
|
|
||||||
isSeeking = false;
|
|
||||||
|
|
||||||
isWaiting = false;
|
|
||||||
|
|
||||||
playOnLoad = false;
|
|
||||||
playOnSeek = false;
|
|
||||||
|
|
||||||
isStartingDownload = false;
|
|
||||||
isLoading = false;
|
|
||||||
isLoaded = false;
|
|
||||||
|
|
||||||
pausePosition = 0;
|
|
||||||
|
|
||||||
seekPercent = 0;
|
|
||||||
currentTime = 0;
|
|
||||||
currentPercentRelative = 0;
|
|
||||||
currentPercentAbsolute = 0;
|
|
||||||
duration = 0;
|
|
||||||
|
|
||||||
videoWidth = 0;
|
|
||||||
videoHeight = 0;
|
|
||||||
|
|
||||||
metaDataReady = false;
|
|
||||||
metaData = {};
|
|
||||||
}
|
|
||||||
public function error():void {
|
|
||||||
var srcSaved:String = src;
|
|
||||||
reset();
|
|
||||||
src = srcSaved;
|
|
||||||
srcError = true;
|
|
||||||
}
|
|
||||||
public function loadRequired():Boolean {
|
|
||||||
return (srcSet && !isStartingDownload && !isLoading && !isLoaded);
|
|
||||||
}
|
|
||||||
public function startingDownload():void {
|
|
||||||
isStartingDownload = true;
|
|
||||||
isLoading = false;
|
|
||||||
isLoaded = false;
|
|
||||||
}
|
|
||||||
public function loading():void {
|
|
||||||
isStartingDownload = false;
|
|
||||||
isLoading = true;
|
|
||||||
isLoaded = false;
|
|
||||||
}
|
|
||||||
public function loaded():void {
|
|
||||||
isStartingDownload = false;
|
|
||||||
isLoading = false;
|
|
||||||
isLoaded = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,62 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Robert M. Hall
|
|
||||||
* Date: 7th August 2012
|
|
||||||
*/
|
|
||||||
|
|
||||||
package happyworm.jPlayer
|
|
||||||
{
|
|
||||||
import flash.net.LocalConnection;
|
|
||||||
import flash.events.StatusEvent;
|
|
||||||
import flash.system.Capabilities;
|
|
||||||
import flash.utils.getTimer;
|
|
||||||
|
|
||||||
public class TraceOut
|
|
||||||
{
|
|
||||||
|
|
||||||
private var outgoing_lc:LocalConnection = new LocalConnection ();
|
|
||||||
private var firstEvent:Boolean = true;
|
|
||||||
private var _localAIRDebug:Boolean = false;
|
|
||||||
|
|
||||||
public function TraceOut()
|
|
||||||
{
|
|
||||||
outgoing_lc.addEventListener(StatusEvent.STATUS, lcListener);
|
|
||||||
outgoing_lc.send("_log_output","startLogging","");
|
|
||||||
}
|
|
||||||
|
|
||||||
private function lcListener(event:StatusEvent):void
|
|
||||||
{
|
|
||||||
// Must have this listener to avoid errors
|
|
||||||
if (event.level == "error")
|
|
||||||
{
|
|
||||||
_localAIRDebug = false;
|
|
||||||
}
|
|
||||||
else if(event.level =="status" && firstEvent==true)
|
|
||||||
{
|
|
||||||
firstEvent = false;
|
|
||||||
tracer("<< Successful Connection To Event Logger >>");
|
|
||||||
tracer("DEBUG INFO: \n<"+Capabilities.serverString + ">\nFlash Player Version: " + Capabilities.version + "\n");
|
|
||||||
_localAIRDebug = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public function localAIRDebug():Boolean
|
|
||||||
{
|
|
||||||
return _localAIRDebug;
|
|
||||||
}
|
|
||||||
|
|
||||||
public function tracer(msg:String):void
|
|
||||||
{
|
|
||||||
trace(msg);
|
|
||||||
var outMsg:String = "[" + getTimer() + "ms] " + msg;
|
|
||||||
outgoing_lc.send("_log_output","displayMsg",outMsg);
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,496 +0,0 @@
|
|||||||
/*
|
|
||||||
* Playlist Object for the jPlayer Plugin
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://www.opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 2.4.1
|
|
||||||
* Date: 19th November 2014
|
|
||||||
*
|
|
||||||
* Requires:
|
|
||||||
* - jQuery 1.7.0+
|
|
||||||
* - jPlayer 2.8.2+
|
|
||||||
*/
|
|
||||||
|
|
||||||
/*global jPlayerPlaylist:true */
|
|
||||||
|
|
||||||
(function($, undefined) {
|
|
||||||
|
|
||||||
jPlayerPlaylist = function(cssSelector, playlist, options) {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
this.current = 0;
|
|
||||||
this.loop = false; // Flag used with the jPlayer repeat event
|
|
||||||
this.shuffled = false;
|
|
||||||
this.removing = false; // Flag is true during remove animation, disabling the remove() method until complete.
|
|
||||||
|
|
||||||
this.cssSelector = $.extend({}, this._cssSelector, cssSelector); // Object: Containing the css selectors for jPlayer and its cssSelectorAncestor
|
|
||||||
this.options = $.extend(true, {
|
|
||||||
keyBindings: {
|
|
||||||
next: {
|
|
||||||
key: 221, // ]
|
|
||||||
fn: function() {
|
|
||||||
self.next();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
previous: {
|
|
||||||
key: 219, // [
|
|
||||||
fn: function() {
|
|
||||||
self.previous();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
shuffle: {
|
|
||||||
key: 83, // s
|
|
||||||
fn: function() {
|
|
||||||
self.shuffle();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
stateClass: {
|
|
||||||
shuffled: "jp-state-shuffled"
|
|
||||||
}
|
|
||||||
}, this._options, options); // Object: The jPlayer constructor options for this playlist and the playlist options
|
|
||||||
|
|
||||||
this.playlist = []; // Array of Objects: The current playlist displayed (Un-shuffled or Shuffled)
|
|
||||||
this.original = []; // Array of Objects: The original playlist
|
|
||||||
|
|
||||||
this._initPlaylist(playlist); // Copies playlist to this.original. Then mirrors this.original to this.playlist. Creating two arrays, where the element pointers match. (Enables pointer comparison.)
|
|
||||||
|
|
||||||
// Setup the css selectors for the extra interface items used by the playlist.
|
|
||||||
this.cssSelector.details = this.cssSelector.cssSelectorAncestor + " .jp-details"; // Note that jPlayer controls the text in the title element.
|
|
||||||
this.cssSelector.playlist = this.cssSelector.cssSelectorAncestor + " .jp-playlist";
|
|
||||||
this.cssSelector.next = this.cssSelector.cssSelectorAncestor + " .jp-next";
|
|
||||||
this.cssSelector.previous = this.cssSelector.cssSelectorAncestor + " .jp-previous";
|
|
||||||
this.cssSelector.shuffle = this.cssSelector.cssSelectorAncestor + " .jp-shuffle";
|
|
||||||
this.cssSelector.shuffleOff = this.cssSelector.cssSelectorAncestor + " .jp-shuffle-off";
|
|
||||||
|
|
||||||
// Override the cssSelectorAncestor given in options
|
|
||||||
this.options.cssSelectorAncestor = this.cssSelector.cssSelectorAncestor;
|
|
||||||
|
|
||||||
// Override the default repeat event handler
|
|
||||||
this.options.repeat = function(event) {
|
|
||||||
self.loop = event.jPlayer.options.loop;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Create a ready event handler to initialize the playlist
|
|
||||||
$(this.cssSelector.jPlayer).bind($.jPlayer.event.ready, function() {
|
|
||||||
self._init();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create an ended event handler to move to the next item
|
|
||||||
$(this.cssSelector.jPlayer).bind($.jPlayer.event.ended, function() {
|
|
||||||
self.next();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create a play event handler to pause other instances
|
|
||||||
$(this.cssSelector.jPlayer).bind($.jPlayer.event.play, function() {
|
|
||||||
$(this).jPlayer("pauseOthers");
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create a resize event handler to show the title in full screen mode.
|
|
||||||
$(this.cssSelector.jPlayer).bind($.jPlayer.event.resize, function(event) {
|
|
||||||
if(event.jPlayer.options.fullScreen) {
|
|
||||||
$(self.cssSelector.details).show();
|
|
||||||
} else {
|
|
||||||
$(self.cssSelector.details).hide();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create click handlers for the extra buttons that do playlist functions.
|
|
||||||
$(this.cssSelector.previous).click(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
self.previous();
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
$(this.cssSelector.next).click(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
self.next();
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
$(this.cssSelector.shuffle).click(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
if(self.shuffled && $(self.cssSelector.jPlayer).jPlayer("option", "useStateClassSkin")) {
|
|
||||||
self.shuffle(false);
|
|
||||||
} else {
|
|
||||||
self.shuffle(true);
|
|
||||||
}
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
$(this.cssSelector.shuffleOff).click(function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
self.shuffle(false);
|
|
||||||
self.blur(this);
|
|
||||||
}).hide();
|
|
||||||
|
|
||||||
// Put the title in its initial display state
|
|
||||||
if(!this.options.fullScreen) {
|
|
||||||
$(this.cssSelector.details).hide();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remove the empty <li> from the page HTML. Allows page to be valid HTML, while not interfereing with display animations
|
|
||||||
$(this.cssSelector.playlist + " ul").empty();
|
|
||||||
|
|
||||||
// Create .on() handlers for the playlist items along with the free media and remove controls.
|
|
||||||
this._createItemHandlers();
|
|
||||||
|
|
||||||
// Instance jPlayer
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer(this.options);
|
|
||||||
};
|
|
||||||
|
|
||||||
jPlayerPlaylist.prototype = {
|
|
||||||
_cssSelector: { // static object, instanced in constructor
|
|
||||||
jPlayer: "#jquery_jplayer_1",
|
|
||||||
cssSelectorAncestor: "#jp_container_1"
|
|
||||||
},
|
|
||||||
_options: { // static object, instanced in constructor
|
|
||||||
playlistOptions: {
|
|
||||||
autoPlay: false,
|
|
||||||
loopOnPrevious: false,
|
|
||||||
shuffleOnLoop: true,
|
|
||||||
enableRemoveControls: false,
|
|
||||||
displayTime: 'slow',
|
|
||||||
addTime: 'fast',
|
|
||||||
removeTime: 'fast',
|
|
||||||
shuffleTime: 'slow',
|
|
||||||
itemClass: "jp-playlist-item",
|
|
||||||
freeGroupClass: "jp-free-media",
|
|
||||||
freeItemClass: "jp-playlist-item-free",
|
|
||||||
removeItemClass: "jp-playlist-item-remove"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
option: function(option, value) { // For changing playlist options only
|
|
||||||
if(value === undefined) {
|
|
||||||
return this.options.playlistOptions[option];
|
|
||||||
}
|
|
||||||
|
|
||||||
this.options.playlistOptions[option] = value;
|
|
||||||
|
|
||||||
switch(option) {
|
|
||||||
case "enableRemoveControls":
|
|
||||||
this._updateControls();
|
|
||||||
break;
|
|
||||||
case "itemClass":
|
|
||||||
case "freeGroupClass":
|
|
||||||
case "freeItemClass":
|
|
||||||
case "removeItemClass":
|
|
||||||
this._refresh(true); // Instant
|
|
||||||
this._createItemHandlers();
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
_init: function() {
|
|
||||||
var self = this;
|
|
||||||
this._refresh(function() {
|
|
||||||
if(self.options.playlistOptions.autoPlay) {
|
|
||||||
self.play(self.current);
|
|
||||||
} else {
|
|
||||||
self.select(self.current);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
_initPlaylist: function(playlist) {
|
|
||||||
this.current = 0;
|
|
||||||
this.shuffled = false;
|
|
||||||
this.removing = false;
|
|
||||||
this.original = $.extend(true, [], playlist); // Copy the Array of Objects
|
|
||||||
this._originalPlaylist();
|
|
||||||
},
|
|
||||||
_originalPlaylist: function() {
|
|
||||||
var self = this;
|
|
||||||
this.playlist = [];
|
|
||||||
// Make both arrays point to the same object elements. Gives us 2 different arrays, each pointing to the same actual object. ie., Not copies of the object.
|
|
||||||
$.each(this.original, function(i) {
|
|
||||||
self.playlist[i] = self.original[i];
|
|
||||||
});
|
|
||||||
},
|
|
||||||
_refresh: function(instant) {
|
|
||||||
/* instant: Can be undefined, true or a function.
|
|
||||||
* undefined -> use animation timings
|
|
||||||
* true -> no animation
|
|
||||||
* function -> use animation timings and excute function at half way point.
|
|
||||||
*/
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
if(instant && !$.isFunction(instant)) {
|
|
||||||
$(this.cssSelector.playlist + " ul").empty();
|
|
||||||
$.each(this.playlist, function(i) {
|
|
||||||
$(self.cssSelector.playlist + " ul").append(self._createListItem(self.playlist[i]));
|
|
||||||
});
|
|
||||||
this._updateControls();
|
|
||||||
} else {
|
|
||||||
var displayTime = $(this.cssSelector.playlist + " ul").children().length ? this.options.playlistOptions.displayTime : 0;
|
|
||||||
|
|
||||||
$(this.cssSelector.playlist + " ul").slideUp(displayTime, function() {
|
|
||||||
var $this = $(this);
|
|
||||||
$(this).empty();
|
|
||||||
|
|
||||||
$.each(self.playlist, function(i) {
|
|
||||||
$this.append(self._createListItem(self.playlist[i]));
|
|
||||||
});
|
|
||||||
self._updateControls();
|
|
||||||
if($.isFunction(instant)) {
|
|
||||||
instant();
|
|
||||||
}
|
|
||||||
if(self.playlist.length) {
|
|
||||||
$(this).slideDown(self.options.playlistOptions.displayTime);
|
|
||||||
} else {
|
|
||||||
$(this).show();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_createListItem: function(media) {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
// Wrap the <li> contents in a <div>
|
|
||||||
var listItem = "<li><div>";
|
|
||||||
|
|
||||||
// Create remove control
|
|
||||||
listItem += "<a href='javascript:;' class='" + this.options.playlistOptions.removeItemClass + "'>×</a>";
|
|
||||||
|
|
||||||
// Create links to free media
|
|
||||||
if(media.free) {
|
|
||||||
var first = true;
|
|
||||||
listItem += "<span class='" + this.options.playlistOptions.freeGroupClass + "'>(";
|
|
||||||
$.each(media, function(property,value) {
|
|
||||||
if($.jPlayer.prototype.format[property]) { // Check property is a media format.
|
|
||||||
if(first) {
|
|
||||||
first = false;
|
|
||||||
} else {
|
|
||||||
listItem += " | ";
|
|
||||||
}
|
|
||||||
listItem += "<a class='" + self.options.playlistOptions.freeItemClass + "' href='" + value + "' tabindex='-1'>" + property + "</a>";
|
|
||||||
}
|
|
||||||
});
|
|
||||||
listItem += ")</span>";
|
|
||||||
}
|
|
||||||
|
|
||||||
// The title is given next in the HTML otherwise the float:right on the free media corrupts in IE6/7
|
|
||||||
listItem += "<a href='javascript:;' class='" + this.options.playlistOptions.itemClass + "' tabindex='0'>" + media.title + (media.artist ? " <span class='jp-artist'>by " + media.artist + "</span>" : "") + "</a>";
|
|
||||||
listItem += "</div></li>";
|
|
||||||
|
|
||||||
return listItem;
|
|
||||||
},
|
|
||||||
_createItemHandlers: function() {
|
|
||||||
var self = this;
|
|
||||||
// Create live handlers for the playlist items
|
|
||||||
$(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.itemClass).on("click", "a." + this.options.playlistOptions.itemClass, function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var index = $(this).parent().parent().index();
|
|
||||||
if(self.current !== index) {
|
|
||||||
self.play(index);
|
|
||||||
} else {
|
|
||||||
$(self.cssSelector.jPlayer).jPlayer("play");
|
|
||||||
}
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create live handlers that disable free media links to force access via right click
|
|
||||||
$(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.freeItemClass).on("click", "a." + this.options.playlistOptions.freeItemClass, function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$(this).parent().parent().find("." + self.options.playlistOptions.itemClass).click();
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Create live handlers for the remove controls
|
|
||||||
$(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.removeItemClass).on("click", "a." + this.options.playlistOptions.removeItemClass, function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var index = $(this).parent().parent().index();
|
|
||||||
self.remove(index);
|
|
||||||
self.blur(this);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
_updateControls: function() {
|
|
||||||
if(this.options.playlistOptions.enableRemoveControls) {
|
|
||||||
$(this.cssSelector.playlist + " ." + this.options.playlistOptions.removeItemClass).show();
|
|
||||||
} else {
|
|
||||||
$(this.cssSelector.playlist + " ." + this.options.playlistOptions.removeItemClass).hide();
|
|
||||||
}
|
|
||||||
|
|
||||||
if(this.shuffled) {
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("addStateClass", "shuffled");
|
|
||||||
} else {
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("removeStateClass", "shuffled");
|
|
||||||
}
|
|
||||||
if($(this.cssSelector.shuffle).length && $(this.cssSelector.shuffleOff).length) {
|
|
||||||
if(this.shuffled) {
|
|
||||||
$(this.cssSelector.shuffleOff).show();
|
|
||||||
$(this.cssSelector.shuffle).hide();
|
|
||||||
} else {
|
|
||||||
$(this.cssSelector.shuffleOff).hide();
|
|
||||||
$(this.cssSelector.shuffle).show();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_highlight: function(index) {
|
|
||||||
if(this.playlist.length && index !== undefined) {
|
|
||||||
$(this.cssSelector.playlist + " .jp-playlist-current").removeClass("jp-playlist-current");
|
|
||||||
$(this.cssSelector.playlist + " li:nth-child(" + (index + 1) + ")").addClass("jp-playlist-current").find(".jp-playlist-item").addClass("jp-playlist-current");
|
|
||||||
// $(this.cssSelector.details + " li").html("<span class='jp-title'>" + this.playlist[index].title + "</span>" + (this.playlist[index].artist ? " <span class='jp-artist'>by " + this.playlist[index].artist + "</span>" : ""));
|
|
||||||
}
|
|
||||||
},
|
|
||||||
setPlaylist: function(playlist) {
|
|
||||||
this._initPlaylist(playlist);
|
|
||||||
this._init();
|
|
||||||
},
|
|
||||||
add: function(media, playNow) {
|
|
||||||
$(this.cssSelector.playlist + " ul").append(this._createListItem(media)).find("li:last-child").hide().slideDown(this.options.playlistOptions.addTime);
|
|
||||||
this._updateControls();
|
|
||||||
this.original.push(media);
|
|
||||||
this.playlist.push(media); // Both array elements share the same object pointer. Comforms with _initPlaylist(p) system.
|
|
||||||
|
|
||||||
if(playNow) {
|
|
||||||
this.play(this.playlist.length - 1);
|
|
||||||
} else {
|
|
||||||
if(this.original.length === 1) {
|
|
||||||
this.select(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
remove: function(index) {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
if(index === undefined) {
|
|
||||||
this._initPlaylist([]);
|
|
||||||
this._refresh(function() {
|
|
||||||
$(self.cssSelector.jPlayer).jPlayer("clearMedia");
|
|
||||||
});
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
|
|
||||||
if(this.removing) {
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
index = (index < 0) ? self.original.length + index : index; // Negative index relates to end of array.
|
|
||||||
if(0 <= index && index < this.playlist.length) {
|
|
||||||
this.removing = true;
|
|
||||||
|
|
||||||
$(this.cssSelector.playlist + " li:nth-child(" + (index + 1) + ")").slideUp(this.options.playlistOptions.removeTime, function() {
|
|
||||||
$(this).remove();
|
|
||||||
|
|
||||||
if(self.shuffled) {
|
|
||||||
var item = self.playlist[index];
|
|
||||||
$.each(self.original, function(i) {
|
|
||||||
if(self.original[i] === item) {
|
|
||||||
self.original.splice(i, 1);
|
|
||||||
return false; // Exit $.each
|
|
||||||
}
|
|
||||||
});
|
|
||||||
self.playlist.splice(index, 1);
|
|
||||||
} else {
|
|
||||||
self.original.splice(index, 1);
|
|
||||||
self.playlist.splice(index, 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(self.original.length) {
|
|
||||||
if(index === self.current) {
|
|
||||||
self.current = (index < self.original.length) ? self.current : self.original.length - 1; // To cope when last element being selected when it was removed
|
|
||||||
self.select(self.current);
|
|
||||||
} else if(index < self.current) {
|
|
||||||
self.current--;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
$(self.cssSelector.jPlayer).jPlayer("clearMedia");
|
|
||||||
self.current = 0;
|
|
||||||
self.shuffled = false;
|
|
||||||
self._updateControls();
|
|
||||||
}
|
|
||||||
|
|
||||||
self.removing = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
select: function(index) {
|
|
||||||
index = (index < 0) ? this.original.length + index : index; // Negative index relates to end of array.
|
|
||||||
if(0 <= index && index < this.playlist.length) {
|
|
||||||
this.current = index;
|
|
||||||
this._highlight(index);
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("setMedia", this.playlist[this.current]);
|
|
||||||
} else {
|
|
||||||
this.current = 0;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
play: function(index) {
|
|
||||||
index = (index < 0) ? this.original.length + index : index; // Negative index relates to end of array.
|
|
||||||
if(0 <= index && index < this.playlist.length) {
|
|
||||||
if(this.playlist.length) {
|
|
||||||
this.select(index);
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("play");
|
|
||||||
}
|
|
||||||
} else if(index === undefined) {
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("play");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
pause: function() {
|
|
||||||
$(this.cssSelector.jPlayer).jPlayer("pause");
|
|
||||||
},
|
|
||||||
next: function() {
|
|
||||||
var index = (this.current + 1 < this.playlist.length) ? this.current + 1 : 0;
|
|
||||||
|
|
||||||
if(this.loop) {
|
|
||||||
// See if we need to shuffle before looping to start, and only shuffle if more than 1 item.
|
|
||||||
if(index === 0 && this.shuffled && this.options.playlistOptions.shuffleOnLoop && this.playlist.length > 1) {
|
|
||||||
this.shuffle(true, true); // playNow
|
|
||||||
} else {
|
|
||||||
this.play(index);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// The index will be zero if it just looped round
|
|
||||||
if(index > 0) {
|
|
||||||
this.play(index);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
previous: function() {
|
|
||||||
var index = (this.current - 1 >= 0) ? this.current - 1 : this.playlist.length - 1;
|
|
||||||
|
|
||||||
if(this.loop && this.options.playlistOptions.loopOnPrevious || index < this.playlist.length - 1) {
|
|
||||||
this.play(index);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
shuffle: function(shuffled, playNow) {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
if(shuffled === undefined) {
|
|
||||||
shuffled = !this.shuffled;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(shuffled || shuffled !== this.shuffled) {
|
|
||||||
|
|
||||||
$(this.cssSelector.playlist + " ul").slideUp(this.options.playlistOptions.shuffleTime, function() {
|
|
||||||
self.shuffled = shuffled;
|
|
||||||
if(shuffled) {
|
|
||||||
self.playlist.sort(function() {
|
|
||||||
return 0.5 - Math.random();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
self._originalPlaylist();
|
|
||||||
}
|
|
||||||
self._refresh(true); // Instant
|
|
||||||
|
|
||||||
if(playNow || !$(self.cssSelector.jPlayer).data("jPlayer").status.paused) {
|
|
||||||
self.play(0);
|
|
||||||
} else {
|
|
||||||
self.select(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
$(this).slideDown(self.options.playlistOptions.shuffleTime);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
blur: function(that) {
|
|
||||||
if($(this.cssSelector.jPlayer).jPlayer("option", "autoBlur")) {
|
|
||||||
$(that).blur();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})(jQuery);
|
|
@ -1,338 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayerInspector Plugin for jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://www.opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 1.0.5
|
|
||||||
* Date: 1st April 2014
|
|
||||||
*
|
|
||||||
* For use with jPlayer Version: 2.6.0+
|
|
||||||
*
|
|
||||||
* Note: Declare inspector instances after jPlayer instances. ie., Otherwise the jPlayer instance is nonsense.
|
|
||||||
*/
|
|
||||||
|
|
||||||
(function($, undefined) {
|
|
||||||
$.jPlayerInspector = {};
|
|
||||||
$.jPlayerInspector.i = 0;
|
|
||||||
$.jPlayerInspector.defaults = {
|
|
||||||
jPlayer: undefined, // The jQuery selector of the jPlayer instance to inspect.
|
|
||||||
idPrefix: "jplayer_inspector_",
|
|
||||||
visible: false
|
|
||||||
};
|
|
||||||
|
|
||||||
var methods = {
|
|
||||||
init: function(options) {
|
|
||||||
var self = this;
|
|
||||||
var $this = $(this);
|
|
||||||
|
|
||||||
var config = $.extend({}, $.jPlayerInspector.defaults, options);
|
|
||||||
$(this).data("jPlayerInspector", config);
|
|
||||||
|
|
||||||
config.id = $(this).attr("id");
|
|
||||||
config.jPlayerId = config.jPlayer.attr("id");
|
|
||||||
|
|
||||||
config.windowId = config.idPrefix + "window_" + $.jPlayerInspector.i;
|
|
||||||
config.statusId = config.idPrefix + "status_" + $.jPlayerInspector.i;
|
|
||||||
config.configId = config.idPrefix + "config_" + $.jPlayerInspector.i;
|
|
||||||
config.toggleId = config.idPrefix + "toggle_" + $.jPlayerInspector.i;
|
|
||||||
config.eventResetId = config.idPrefix + "event_reset_" + $.jPlayerInspector.i;
|
|
||||||
config.updateId = config.idPrefix + "update_" + $.jPlayerInspector.i;
|
|
||||||
config.eventWindowId = config.idPrefix + "event_window_" + $.jPlayerInspector.i;
|
|
||||||
|
|
||||||
config.eventId = {};
|
|
||||||
config.eventJq = {};
|
|
||||||
config.eventTimeout = {};
|
|
||||||
config.eventOccurrence = {};
|
|
||||||
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventId[eventType] = config.idPrefix + "event_" + eventName + "_" + $.jPlayerInspector.i;
|
|
||||||
config.eventOccurrence[eventType] = 0;
|
|
||||||
});
|
|
||||||
|
|
||||||
var structure =
|
|
||||||
'<p><a href="#" id="' + config.toggleId + '">' + (config.visible ? "Hide" : "Show") + '</a> jPlayer Inspector</p>'
|
|
||||||
+ '<div id="' + config.windowId + '">'
|
|
||||||
+ '<div id="' + config.statusId + '"></div>'
|
|
||||||
+ '<div id="' + config.eventWindowId + '" style="padding:5px 5px 0 5px;background-color:#eee;border:1px dotted #000;">'
|
|
||||||
+ '<p style="margin:0 0 10px 0;"><strong>jPlayer events that have occurred over the past 1 second:</strong>'
|
|
||||||
+ '<br />(Backgrounds: <span style="padding:0 5px;background-color:#eee;border:1px dotted #000;">Never occurred</span> <span style="padding:0 5px;background-color:#fff;border:1px dotted #000;">Occurred before</span> <span style="padding:0 5px;background-color:#9f9;border:1px dotted #000;">Occurred</span> <span style="padding:0 5px;background-color:#ff9;border:1px dotted #000;">Multiple occurrences</span> <a href="#" id="' + config.eventResetId + '">reset</a>)</p>';
|
|
||||||
|
|
||||||
// MJP: Would use the next 3 lines for ease, but the events are just slapped on the page.
|
|
||||||
// $.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
// structure += '<div id="' + config.eventId[eventType] + '" style="float:left;">' + eventName + '</div>';
|
|
||||||
// });
|
|
||||||
|
|
||||||
var eventStyle = "float:left;margin:0 5px 5px 0;padding:0 5px;border:1px dotted #000;";
|
|
||||||
// MJP: Doing it longhand so order and layout easier to control.
|
|
||||||
structure +=
|
|
||||||
'<div id="' + config.eventId[$.jPlayer.event.ready] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.setmedia] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.flashreset] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.resize] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.repeat] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.click] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.warning] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadstart] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.progress] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.timeupdate] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.volumechange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.error] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.play] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.pause] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.waiting] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.playing] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.seeking] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.seeked] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.ended] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadeddata] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadedmetadata] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.canplay] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.canplaythrough] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.suspend] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.abort] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.emptied] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.stalled] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.ratechange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.durationchange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div style="clear:both"></div>';
|
|
||||||
|
|
||||||
// MJP: Would like a check here in case we missed an event.
|
|
||||||
|
|
||||||
// MJP: Check fails, since it is not on the page yet.
|
|
||||||
/* $.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
if($("#" + config.eventId[eventType])[0] === undefined) {
|
|
||||||
structure += '<div id="' + config.eventId[eventType] + '" style="clear:left;' + eventStyle + '">' + eventName + '</div>';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
structure +=
|
|
||||||
'</div>'
|
|
||||||
+ '<p><a href="#" id="' + config.updateId + '">Update</a> jPlayer Inspector</p>'
|
|
||||||
+ '<div id="' + config.configId + '"></div>'
|
|
||||||
+ '</div>';
|
|
||||||
$(this).html(structure);
|
|
||||||
|
|
||||||
config.windowJq = $("#" + config.windowId);
|
|
||||||
config.statusJq = $("#" + config.statusId);
|
|
||||||
config.configJq = $("#" + config.configId);
|
|
||||||
config.toggleJq = $("#" + config.toggleId);
|
|
||||||
config.eventResetJq = $("#" + config.eventResetId);
|
|
||||||
config.updateJq = $("#" + config.updateId);
|
|
||||||
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventJq[eventType] = $("#" + config.eventId[eventType]);
|
|
||||||
config.eventJq[eventType].text(eventName + " (" + config.eventOccurrence[eventType] + ")"); // Sets the text to the event name and (0);
|
|
||||||
|
|
||||||
config.jPlayer.bind(eventType + ".jPlayerInspector", function(e) {
|
|
||||||
config.eventOccurrence[e.type]++;
|
|
||||||
if(config.eventOccurrence[e.type] > 1) {
|
|
||||||
config.eventJq[e.type].css("background-color","#ff9");
|
|
||||||
} else {
|
|
||||||
config.eventJq[e.type].css("background-color","#9f9");
|
|
||||||
}
|
|
||||||
config.eventJq[e.type].text(eventName + " (" + config.eventOccurrence[e.type] + ")");
|
|
||||||
// The timer to handle the color
|
|
||||||
clearTimeout(config.eventTimeout[e.type]);
|
|
||||||
config.eventTimeout[e.type] = setTimeout(function() {
|
|
||||||
config.eventJq[e.type].css("background-color","#fff");
|
|
||||||
}, 1000);
|
|
||||||
// The timer to handle the occurences.
|
|
||||||
setTimeout(function() {
|
|
||||||
config.eventOccurrence[e.type]--;
|
|
||||||
config.eventJq[e.type].text(eventName + " (" + config.eventOccurrence[e.type] + ")");
|
|
||||||
}, 1000);
|
|
||||||
if(config.visible) { // Update the status, if inspector open.
|
|
||||||
$this.jPlayerInspector("updateStatus");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
config.jPlayer.bind($.jPlayer.event.ready + ".jPlayerInspector", function(e) {
|
|
||||||
$this.jPlayerInspector("updateConfig");
|
|
||||||
});
|
|
||||||
|
|
||||||
config.toggleJq.click(function() {
|
|
||||||
if(config.visible) {
|
|
||||||
$(this).text("Show");
|
|
||||||
config.windowJq.hide();
|
|
||||||
config.statusJq.empty();
|
|
||||||
config.configJq.empty();
|
|
||||||
} else {
|
|
||||||
$(this).text("Hide");
|
|
||||||
config.windowJq.show();
|
|
||||||
config.updateJq.click();
|
|
||||||
}
|
|
||||||
config.visible = !config.visible;
|
|
||||||
$(this).blur();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
config.eventResetJq.click(function() {
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventJq[eventType].css("background-color","#eee");
|
|
||||||
});
|
|
||||||
$(this).blur();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
config.updateJq.click(function() {
|
|
||||||
$this.jPlayerInspector("updateStatus");
|
|
||||||
$this.jPlayerInspector("updateConfig");
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
if(!config.visible) {
|
|
||||||
config.windowJq.hide();
|
|
||||||
} else {
|
|
||||||
// config.updateJq.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
$.jPlayerInspector.i++;
|
|
||||||
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
destroy: function() {
|
|
||||||
$(this).data("jPlayerInspector") && $(this).data("jPlayerInspector").jPlayer.unbind(".jPlayerInspector");
|
|
||||||
$(this).empty();
|
|
||||||
},
|
|
||||||
updateConfig: function() { // This displays information about jPlayer's configuration in inspector
|
|
||||||
|
|
||||||
var jPlayerInfo = "<p>This jPlayer instance is running in your browser where:<br />"
|
|
||||||
|
|
||||||
for(i = 0; i < $(this).data("jPlayerInspector").jPlayer.data("jPlayer").solutions.length; i++) {
|
|
||||||
var solution = $(this).data("jPlayerInspector").jPlayer.data("jPlayer").solutions[i];
|
|
||||||
jPlayerInfo += " jPlayer's <strong>" + solution + "</strong> solution is";
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].used) {
|
|
||||||
jPlayerInfo += " being <strong>used</strong> and will support:<strong>";
|
|
||||||
for(format in $(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].support) {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].support[format]) {
|
|
||||||
jPlayerInfo += " " + format;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</strong><br />";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += " <strong>not required</strong><br />";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.active) {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").flash.active) {
|
|
||||||
jPlayerInfo += "<strong>Problem with jPlayer since both HTML5 and Flash are active.</strong>";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "The <strong>HTML5 is active</strong>.";
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").flash.active) {
|
|
||||||
jPlayerInfo += "The <strong>Flash is active</strong>.";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "No solution is currently active. jPlayer needs a setMedia().";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
var formatType = $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.formatType;
|
|
||||||
jPlayerInfo += "<p><code>status.formatType = '" + formatType + "'</code><br />";
|
|
||||||
if(formatType) {
|
|
||||||
jPlayerInfo += "<code>Browser canPlay('" + $.jPlayer.prototype.format[formatType].codec + "')</code>";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
}
|
|
||||||
|
|
||||||
jPlayerInfo += "<p><code>status.src = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.src + "'</code></p>";
|
|
||||||
|
|
||||||
jPlayerInfo += "<p><code>status.media = {<br />";
|
|
||||||
for(prop in $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.media) {
|
|
||||||
jPlayerInfo += " " + prop + ": " + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.media[prop] + "<br />"; // Some are strings
|
|
||||||
}
|
|
||||||
jPlayerInfo += "};</code></p>"
|
|
||||||
|
|
||||||
jPlayerInfo += "<p>";
|
|
||||||
jPlayerInfo += "<code>status.videoWidth = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.videoWidth + "'</code>";
|
|
||||||
jPlayerInfo += " | <code>status.videoHeight = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.videoHeight + "'</code>";
|
|
||||||
jPlayerInfo += "<br /><code>status.width = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.width + "'</code>";
|
|
||||||
jPlayerInfo += " | <code>status.height = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.height + "'</code>";
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
+ "<p>Raw browser test for HTML5 support. Should equal a function if HTML5 is available.<br />";
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.audio.available) {
|
|
||||||
jPlayerInfo += "<code>htmlElement.audio.canPlayType = " + (typeof $(this).data("jPlayerInspector").jPlayer.data("jPlayer").htmlElement.audio.canPlayType) +"</code><br />"
|
|
||||||
}
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.video.available) {
|
|
||||||
jPlayerInfo += "<code>htmlElement.video.canPlayType = " + (typeof $(this).data("jPlayerInspector").jPlayer.data("jPlayer").htmlElement.video.canPlayType) +"</code>";
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
jPlayerInfo += "<p>This instance is using the constructor options:<br />"
|
|
||||||
+ "<code>$('#" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").internal.self.id + "').jPlayer({<br />"
|
|
||||||
|
|
||||||
+ " swfPath: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "swfPath") + "',<br />"
|
|
||||||
|
|
||||||
+ " solution: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "solution") + "',<br />"
|
|
||||||
|
|
||||||
+ " supplied: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "supplied") + "',<br />"
|
|
||||||
|
|
||||||
+ " preload: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "preload") + "',<br />"
|
|
||||||
|
|
||||||
+ " volume: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "volume") + ",<br />"
|
|
||||||
|
|
||||||
+ " muted: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "muted") + ",<br />"
|
|
||||||
|
|
||||||
+ " backgroundColor: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "backgroundColor") + "',<br />"
|
|
||||||
|
|
||||||
+ " cssSelectorAncestor: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelectorAncestor") + "',<br />"
|
|
||||||
|
|
||||||
+ " cssSelector: {";
|
|
||||||
|
|
||||||
var cssSelector = $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelector");
|
|
||||||
for(prop in cssSelector) {
|
|
||||||
|
|
||||||
// jPlayerInfo += "<br /> " + prop + ": '" + cssSelector[prop] + "'," // This works too of course, but want to use option method for deep keys.
|
|
||||||
jPlayerInfo += "<br /> " + prop + ": '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelector." + prop) + "',"
|
|
||||||
}
|
|
||||||
|
|
||||||
jPlayerInfo = jPlayerInfo.slice(0, -1); // Because the sloppy comma was bugging me.
|
|
||||||
|
|
||||||
jPlayerInfo += "<br /> },<br />"
|
|
||||||
|
|
||||||
+ " errorAlerts: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "errorAlerts") + ",<br />"
|
|
||||||
|
|
||||||
+ " warningAlerts: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "warningAlerts") + "<br />"
|
|
||||||
|
|
||||||
+ "});</code></p>";
|
|
||||||
$(this).data("jPlayerInspector").configJq.html(jPlayerInfo);
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
updateStatus: function() { // This displays information about jPlayer's status in the inspector
|
|
||||||
$(this).data("jPlayerInspector").statusJq.html(
|
|
||||||
"<p>jPlayer is " +
|
|
||||||
($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.paused ? "paused" : "playing") +
|
|
||||||
" at time: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentTime*10)/10 + "s." +
|
|
||||||
" (d: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.duration*10)/10 + "s" +
|
|
||||||
", sp: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.seekPercent) + "%" +
|
|
||||||
", cpr: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentPercentRelative) + "%" +
|
|
||||||
", cpa: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentPercentAbsolute) + "%)</p>"
|
|
||||||
);
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
$.fn.jPlayerInspector = function( method ) {
|
|
||||||
// Method calling logic
|
|
||||||
if ( methods[method] ) {
|
|
||||||
return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
|
|
||||||
} else if ( typeof method === 'object' || ! method ) {
|
|
||||||
return methods.init.apply( this, arguments );
|
|
||||||
} else {
|
|
||||||
$.error( 'Method ' + method + ' does not exist on jQuery.jPlayerInspector' );
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})(jQuery);
|
|
@ -1,33 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "jplayer",
|
|
||||||
"title": "jPlayer : HTML5 Audio & Video",
|
|
||||||
"description": "jPlayer allows you to create a media player with a consistent interface and experience across all browsers.",
|
|
||||||
"keywords": [
|
|
||||||
"audio",
|
|
||||||
"video",
|
|
||||||
"media",
|
|
||||||
"player",
|
|
||||||
"jplayer",
|
|
||||||
"html5",
|
|
||||||
"streaming"
|
|
||||||
],
|
|
||||||
"version": "2.4.0",
|
|
||||||
"author": {
|
|
||||||
"name": "Mark J Panaghiston",
|
|
||||||
"url": "http://happyworm.com/"
|
|
||||||
},
|
|
||||||
"licenses": [
|
|
||||||
{
|
|
||||||
"type": "MIT",
|
|
||||||
"url": "https://github.com/happyworm/jPlayer/blob/master/MIT-LICENSE.txt"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"dependencies": {
|
|
||||||
"jquery": ">=1.7"
|
|
||||||
},
|
|
||||||
"homepage": "http://jplayer.org/",
|
|
||||||
"demo": "http://jplayer.org/latest/demos/",
|
|
||||||
"docs": "http://jplayer.org/latest/developer-guide/",
|
|
||||||
"download": "http://jplayer.org/download/",
|
|
||||||
"bugs": "https://github.com/happyworm/jPlayer/issues"
|
|
||||||
}
|
|
27
core/vendor/filemanager/js/jPlayer/package.json
vendored
@ -1,27 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "jplayer",
|
|
||||||
"version": "2.4.0",
|
|
||||||
"description": "The jQuery HTML5 Audio / Video Library",
|
|
||||||
"homepage": "http://www.jplayer.org/",
|
|
||||||
"keywords": [
|
|
||||||
"audio",
|
|
||||||
"video"
|
|
||||||
],
|
|
||||||
"dependencies": {
|
|
||||||
"jquery": ">1.7.0"
|
|
||||||
},
|
|
||||||
"licenses": [
|
|
||||||
{
|
|
||||||
"type": "MIT",
|
|
||||||
"url": "http://www.opensource.org/licenses/MIT"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"repositories": [
|
|
||||||
{
|
|
||||||
"type": "git",
|
|
||||||
"url": "https://github.com/happyworm/jPlayer.git"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"github": "http://github.com/happyworm/jPlayer",
|
|
||||||
"main": "jquery.jplayer/jquery.jplayer.js"
|
|
||||||
}
|
|
@ -1,579 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Player Plugin for Popcorn JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2012 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 1.1.6
|
|
||||||
* Date: 27th November 2014
|
|
||||||
*
|
|
||||||
* For Popcorn Version: 1.3
|
|
||||||
* For jPlayer Version: 2.9.0
|
|
||||||
* Requires: jQuery 1.7+
|
|
||||||
* Note: jQuery dependancy cannot be removed since jPlayer 2 is a jQuery plugin. Use of jQuery will be kept to a minimum.
|
|
||||||
*/
|
|
||||||
|
|
||||||
(function(Popcorn) {
|
|
||||||
|
|
||||||
var JQUERY_SCRIPT = '//code.jquery.com/jquery-1.11.1.min.js', // Used if jQuery not already present.
|
|
||||||
JPLAYER_SCRIPT = '//code.jplayer.org/2.9.0/jplayer/jquery.jplayer.min.js', // Used if jPlayer not already present.
|
|
||||||
JPLAYER_SWFPATH = '//code.jplayer.org/2.9.0/jplayer/jquery.jplayer.swf', // Used if not specified in jPlayer options via SRC Object.
|
|
||||||
SOLUTION = 'html,flash', // The default solution option.
|
|
||||||
DEBUG = false, // Decided to leave the debugging option and console output in for the time being. Overhead is trivial.
|
|
||||||
jQueryDownloading = false, // Flag to stop multiple instances from each pulling in jQuery, thus corrupting it.
|
|
||||||
jPlayerDownloading = false, // Flag to stop multiple instances from each pulling in jPlayer, thus corrupting it.
|
|
||||||
format = { // Duplicate of jPlayer 2.5.0 object, to avoid always requiring jQuery and jPlayer to be loaded before performing the _canPlayType() test.
|
|
||||||
mp3: {
|
|
||||||
codec: 'audio/mpeg',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m4a: { // AAC / MP4
|
|
||||||
codec: 'audio/mp4; codecs="mp4a.40.2"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m3u8a: { // AAC / MP4 / Apple HLS
|
|
||||||
codec: 'application/vnd.apple.mpegurl; codecs="mp4a.40.2"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m3ua: { // M3U
|
|
||||||
codec: 'audio/mpegurl',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
oga: { // OGG
|
|
||||||
codec: 'audio/ogg; codecs="vorbis, opus"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
flac: { // FLAC
|
|
||||||
codec: 'audio/x-flac',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
wav: { // PCM
|
|
||||||
codec: 'audio/wav; codecs="1"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
webma: { // WEBM
|
|
||||||
codec: 'audio/webm; codecs="vorbis"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
fla: { // FLV / F4A
|
|
||||||
codec: 'audio/x-flv',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
rtmpa: { // RTMP AUDIO
|
|
||||||
codec: 'audio/rtmp; codecs="rtmp"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m4v: { // H.264 / MP4
|
|
||||||
codec: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
m3u8v: { // H.264 / AAC / MP4 / Apple HLS
|
|
||||||
codec: 'application/vnd.apple.mpegurl; codecs="avc1.42E01E, mp4a.40.2"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
m3uv: { // M3U
|
|
||||||
codec: 'audio/mpegurl',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
ogv: { // OGG
|
|
||||||
codec: 'video/ogg; codecs="theora, vorbis"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
webmv: { // WEBM
|
|
||||||
codec: 'video/webm; codecs="vorbis, vp8"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
flv: { // FLV / F4V
|
|
||||||
codec: 'video/x-flv',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
rtmpv: { // RTMP VIDEO
|
|
||||||
codec: 'video/rtmp; codecs="rtmp"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
isObject = function(val) { // Basic check for Object
|
|
||||||
if(val && typeof val === 'object' && val.hasOwnProperty) {
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
getMediaType = function(url) { // Function to gleam the media type from the URL
|
|
||||||
var mediaType = false;
|
|
||||||
if(/\.mp3$/i.test(url)) {
|
|
||||||
mediaType = 'mp3';
|
|
||||||
} else if(/\.mp4$/i.test(url) || /\.m4v$/i.test(url)) {
|
|
||||||
mediaType = 'm4v';
|
|
||||||
} else if(/\.m4a$/i.test(url)) {
|
|
||||||
mediaType = 'm4a';
|
|
||||||
} else if(/\.ogg$/i.test(url) || /\.oga$/i.test(url)) {
|
|
||||||
mediaType = 'oga';
|
|
||||||
} else if(/\.ogv$/i.test(url)) {
|
|
||||||
mediaType = 'ogv';
|
|
||||||
} else if(/\.webm$/i.test(url)) {
|
|
||||||
mediaType = 'webmv';
|
|
||||||
}
|
|
||||||
return mediaType;
|
|
||||||
},
|
|
||||||
getSupplied = function(url) { // Function to generate a supplied option from an src object. ie., When supplied not specified.
|
|
||||||
var supplied = '',
|
|
||||||
separator = '';
|
|
||||||
if(isObject(url)) {
|
|
||||||
// Generate supplied option from object's properties. Non-format properties would be ignored by jPlayer. Order is unpredictable.
|
|
||||||
for(var prop in url) {
|
|
||||||
if(url.hasOwnProperty(prop)) {
|
|
||||||
supplied += separator + prop;
|
|
||||||
separator = ',';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(DEBUG) console.log('getSupplied(): Generated: supplied = "' + supplied + '"');
|
|
||||||
return supplied;
|
|
||||||
};
|
|
||||||
|
|
||||||
Popcorn.player( 'jplayer', {
|
|
||||||
_canPlayType: function( containerType, url ) {
|
|
||||||
// url : Either a String or an Object structured similar a jPlayer media object. ie., As used by setMedia in jPlayer.
|
|
||||||
// The url object may also contain a solution and supplied property.
|
|
||||||
|
|
||||||
// Define the src object structure here!
|
|
||||||
|
|
||||||
var cType = containerType.toLowerCase(),
|
|
||||||
srcObj = {
|
|
||||||
media:{},
|
|
||||||
options:{}
|
|
||||||
},
|
|
||||||
rVal = false, // Only a boolean false means it is not supported.
|
|
||||||
mediaType;
|
|
||||||
|
|
||||||
if(cType !== 'video' && cType !== 'audio') {
|
|
||||||
|
|
||||||
if(typeof url === 'string') {
|
|
||||||
// Check it starts with http, so the URL is absolute... Well, it is not a perfect check.
|
|
||||||
if(/^http.*/i.test(url)) {
|
|
||||||
mediaType = getMediaType(url);
|
|
||||||
if(mediaType) {
|
|
||||||
srcObj.media[mediaType] = url;
|
|
||||||
srcObj.options.solution = SOLUTION;
|
|
||||||
srcObj.options.supplied = mediaType;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
srcObj = url; // Assume the url is an src object.
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check for Object and appropriate minimum data structure.
|
|
||||||
if(isObject(srcObj) && isObject(srcObj.media)) {
|
|
||||||
|
|
||||||
if(!isObject(srcObj.options)) {
|
|
||||||
srcObj.options = {};
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!srcObj.options.solution) {
|
|
||||||
srcObj.options.solution = SOLUTION;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!srcObj.options.supplied) {
|
|
||||||
srcObj.options.supplied = getSupplied(srcObj.media);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Figure out how jPlayer will play it.
|
|
||||||
// This may not work properly when both audio and video is supplied. ie., A media player. But it should return truethy and jPlayer can figure it out.
|
|
||||||
|
|
||||||
var solution = srcObj.options.solution.toLowerCase().split(","), // Create the solution array, with prority based on the order of the solution string.
|
|
||||||
supplied = srcObj.options.supplied.toLowerCase().split(","); // Create the supplied formats array, with prority based on the order of the supplied formats string.
|
|
||||||
|
|
||||||
for(var sol = 0; sol < solution.length; sol++) {
|
|
||||||
|
|
||||||
var solutionType = solution[sol].replace(/^\s+|\s+$/g, ""), //trim
|
|
||||||
checkingHtml = solutionType === 'html',
|
|
||||||
checkingFlash = solutionType === 'flash',
|
|
||||||
mediaElem;
|
|
||||||
|
|
||||||
for(var fmt = 0; fmt < supplied.length; fmt++) {
|
|
||||||
mediaType = supplied[fmt].replace(/^\s+|\s+$/g, ""); //trim
|
|
||||||
if(format[mediaType]) { // Check format is valid.
|
|
||||||
|
|
||||||
// Create an HTML5 media element for the type of media.
|
|
||||||
if(!mediaElem && checkingHtml) {
|
|
||||||
mediaElem = document.createElement(format[mediaType].media);
|
|
||||||
}
|
|
||||||
// See if the HTML5 media element can play the MIME / Codec type.
|
|
||||||
// Flash also returns the object if the format is playable, so it is truethy, but that html property is false.
|
|
||||||
// This assumes Flash is available, but that should be dealt with by jPlayer if that happens.
|
|
||||||
var htmlCanPlay = !!(mediaElem && mediaElem.canPlayType && mediaElem.canPlayType(format[mediaType].codec)),
|
|
||||||
htmlWillPlay = htmlCanPlay && checkingHtml,
|
|
||||||
flashWillPlay = format[mediaType].flashCanPlay && checkingFlash;
|
|
||||||
// The first one found will match what jPlayer uses.
|
|
||||||
if(htmlWillPlay || flashWillPlay) {
|
|
||||||
rVal = {
|
|
||||||
html: htmlWillPlay,
|
|
||||||
type: mediaType
|
|
||||||
};
|
|
||||||
sol = solution.length; // Exit solution loop
|
|
||||||
fmt = supplied.length; // Exit supplied loop
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return rVal;
|
|
||||||
},
|
|
||||||
// _setup: function( options ) { // Warning: options is deprecated.
|
|
||||||
_setup: function() {
|
|
||||||
var media = this,
|
|
||||||
myPlayer, // The jQuery selector of the jPlayer element. Usually a <div>
|
|
||||||
jPlayerObj, // The jPlayer data instance. For performance and DRY code.
|
|
||||||
mediaType = 'unknown',
|
|
||||||
jpMedia = {},
|
|
||||||
jpOptions = {},
|
|
||||||
ready = false, // Used during init to override the annoying duration dependance in the track event padding during Popcorn's isReady(). ie., We is ready after loadeddata and duration can then be set real value at leisure.
|
|
||||||
duration = 0, // For the durationchange event with both HTML5 and Flash solutions. Used with 'ready' to keep control during the Popcorn isReady() via loadeddata event. (Duration=0 is bad.)
|
|
||||||
durationchangeId = null, // A timeout ID used with delayed durationchange event. (Because of the duration=NaN fudge to avoid Popcorn track event corruption.)
|
|
||||||
canplaythrough = false,
|
|
||||||
error = null, // The MediaError object.
|
|
||||||
|
|
||||||
dispatchDurationChange = function() {
|
|
||||||
if(ready) {
|
|
||||||
if(DEBUG) console.log('Dispatched event : durationchange : ' + duration);
|
|
||||||
media.dispatchEvent('durationchange');
|
|
||||||
} else {
|
|
||||||
if(DEBUG) console.log('DELAYED EVENT (!ready) : durationchange : ' + duration);
|
|
||||||
clearTimeout(durationchangeId); // Stop multiple triggers causing multiple timeouts running in parallel.
|
|
||||||
durationchangeId = setTimeout(dispatchDurationChange, 250);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerFlashEventsPatch = function() {
|
|
||||||
|
|
||||||
/* Events already supported by jPlayer Flash:
|
|
||||||
* loadstart
|
|
||||||
* loadedmetadata (M4A, M4V)
|
|
||||||
* progress
|
|
||||||
* play
|
|
||||||
* pause
|
|
||||||
* seeking
|
|
||||||
* seeked
|
|
||||||
* timeupdate
|
|
||||||
* ended
|
|
||||||
* volumechange
|
|
||||||
* error <- See the custom handler in jPlayerInit()
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Events patched:
|
|
||||||
* loadeddata
|
|
||||||
* durationchange
|
|
||||||
* canplaythrough
|
|
||||||
* playing
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Events NOT patched:
|
|
||||||
* suspend
|
|
||||||
* abort
|
|
||||||
* emptied
|
|
||||||
* stalled
|
|
||||||
* loadedmetadata (MP3)
|
|
||||||
* waiting
|
|
||||||
* canplay
|
|
||||||
* ratechange
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Triggering patched events through the jPlayer Object so the events are homogeneous. ie., The contain the event.jPlayer data structure.
|
|
||||||
|
|
||||||
var checkDuration = function(event) {
|
|
||||||
if(event.jPlayer.status.duration !== duration) {
|
|
||||||
duration = event.jPlayer.status.duration;
|
|
||||||
dispatchDurationChange();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
checkCanPlayThrough = function(event) {
|
|
||||||
if(!canplaythrough && event.jPlayer.status.seekPercent === 100) {
|
|
||||||
canplaythrough = true;
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : canplaythrough');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.canplaythrough);
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.loadstart, function() {
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : loadeddata');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.loadeddata);
|
|
||||||
}, 0);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.progress, function(event) {
|
|
||||||
checkDuration(event);
|
|
||||||
checkCanPlayThrough(event);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.timeupdate, function(event) {
|
|
||||||
checkDuration(event);
|
|
||||||
checkCanPlayThrough(event);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.play, function() {
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : playing');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.playing);
|
|
||||||
}, 0);
|
|
||||||
});
|
|
||||||
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handlers for FLASH');
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerInit = function() {
|
|
||||||
(function($) {
|
|
||||||
|
|
||||||
myPlayer = $('#' + media.id);
|
|
||||||
|
|
||||||
if(typeof media.src === 'string') {
|
|
||||||
mediaType = getMediaType(media.src);
|
|
||||||
jpMedia[mediaType] = media.src;
|
|
||||||
jpOptions.supplied = mediaType;
|
|
||||||
jpOptions.solution = SOLUTION;
|
|
||||||
} else if(isObject(media.src)) {
|
|
||||||
jpMedia = isObject(media.src.media) ? media.src.media : {};
|
|
||||||
jpOptions = isObject(media.src.options) ? media.src.options : {};
|
|
||||||
jpOptions.solution = jpOptions.solution || SOLUTION;
|
|
||||||
jpOptions.supplied = jpOptions.supplied || getSupplied(media.src.media);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Allow the swfPath to be set to local server. ie., If the jPlayer Plugin is local and already on the page, then you can also use the local SWF.
|
|
||||||
jpOptions.swfPath = jpOptions.swfPath || JPLAYER_SWFPATH;
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.ready, function(event) {
|
|
||||||
if(event.jPlayer.flash.used) {
|
|
||||||
jPlayerFlashEventsPatch();
|
|
||||||
}
|
|
||||||
// Set the media andd load it, so that the Flash solution behaves similar to HTML5 solution.
|
|
||||||
// This also allows the loadstart event to be used to know jPlayer is ready.
|
|
||||||
$(this).jPlayer('setMedia', jpMedia).jPlayer('load');
|
|
||||||
});
|
|
||||||
|
|
||||||
// Do not auto-bubble the reserved events, nor the loadeddata and durationchange event, since the duration must be carefully handled when loadeddata event occurs.
|
|
||||||
// See the duration property code for more details. (Ranting.)
|
|
||||||
|
|
||||||
var reservedEvents = $.jPlayer.reservedEvent + ' loadeddata durationchange',
|
|
||||||
reservedEvent = reservedEvents.split(/\s+/g);
|
|
||||||
|
|
||||||
// Generate event handlers for all the standard HTML5 media events. (Except durationchange)
|
|
||||||
|
|
||||||
var bindEvent = function(name) {
|
|
||||||
myPlayer.bind($.jPlayer.event[name], function(event) {
|
|
||||||
if(DEBUG) console.log('Dispatched event: ' + name + (event && event.jPlayer ? ' (' + event.jPlayer.status.currentTime + 's)' : '')); // Must be after dispatch for some reason on Firefox/Opera
|
|
||||||
media.dispatchEvent(name);
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created event handler for: ' + name);
|
|
||||||
};
|
|
||||||
|
|
||||||
for(var eventName in $.jPlayer.event) {
|
|
||||||
if($.jPlayer.event.hasOwnProperty(eventName)) {
|
|
||||||
var nativeEvent = true;
|
|
||||||
for(var iRes in reservedEvent) {
|
|
||||||
if(reservedEvent.hasOwnProperty(iRes)) {
|
|
||||||
if(reservedEvent[iRes] === eventName) {
|
|
||||||
nativeEvent = false;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(nativeEvent) {
|
|
||||||
bindEvent(eventName);
|
|
||||||
} else {
|
|
||||||
if(DEBUG) console.log('Skipped auto event handler creation for: ' + eventName);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.loadeddata, function(event) {
|
|
||||||
if(DEBUG) console.log('Dispatched event: loadeddata' + (event && event.jPlayer ? ' (' + event.jPlayer.status.currentTime + 's)' : ''));
|
|
||||||
media.dispatchEvent('loadeddata');
|
|
||||||
ready = true;
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: loadeddata');
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.durationchange, function(event) {
|
|
||||||
duration = event.jPlayer.status.duration;
|
|
||||||
dispatchDurationChange();
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: durationchange');
|
|
||||||
|
|
||||||
// The error event is a special case. Plus jPlayer error event assumes it is a broken URL. (It could also be a decoder error... Or aborted or a Network error.)
|
|
||||||
myPlayer.bind($.jPlayer.event.error, function(event) {
|
|
||||||
// Not sure how to handle the error situation. Popcorn does not appear to have the error or error.code property documented here: http://popcornjs.org/popcorn-docs/media-methods/
|
|
||||||
// If any error event happens, then something has gone pear shaped.
|
|
||||||
|
|
||||||
error = event.jPlayer.error; // Saving object pointer, not a copy of the object. Possible garbage collection issue... But the player is dead anyway, so don't care.
|
|
||||||
|
|
||||||
if(error.type === $.jPlayer.error.URL) {
|
|
||||||
error.code = 4; // MEDIA_ERR_SRC_NOT_SUPPORTED since jPlayer makes this assumption. It is the most common error, then the decode error. Never seen either of the other 2 error types occur.
|
|
||||||
} else {
|
|
||||||
error.code = 0; // It was a jPlayer error, not an HTML5 media error.
|
|
||||||
}
|
|
||||||
|
|
||||||
if(DEBUG) console.log('Dispatched event: error');
|
|
||||||
if(DEBUG) console.dir(error);
|
|
||||||
media.dispatchEvent('error');
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: error');
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'error', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
return error;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return error;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'currentTime', {
|
|
||||||
set: function( val ) {
|
|
||||||
if(jPlayerObj.status.paused) {
|
|
||||||
myPlayer.jPlayer('pause', val);
|
|
||||||
} else {
|
|
||||||
myPlayer.jPlayer('play', val);
|
|
||||||
}
|
|
||||||
return val;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.status.currentTime;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/* The joy of duration and the loadeddata event isReady() handler
|
|
||||||
* The duration is assumed to be a NaN or a valid duration.
|
|
||||||
* jPlayer uses zero instead of a NaN and this screws up the Popcorn track event start/end arrays padding.
|
|
||||||
* This line here:
|
|
||||||
* videoDurationPlus = duration != duration ? Number.MAX_VALUE : duration + 1;
|
|
||||||
* Not sure why it is not simply:
|
|
||||||
* videoDurationPlus = Number.MAX_VALUE; // Who cares if the padding is close to the real duration?
|
|
||||||
* So if you trigger loadeddata before the duration is correct, the track event padding is screwed up. (It pads the start, not the end... Well, duration+1 = 0+1 = 1s)
|
|
||||||
* That line makes the MP3 Flash fallback difficult to setup. The whole MP3 will need to load before the duration is known.
|
|
||||||
* Planning on using a NaN for duration until a >0 value is found... Except with MP3, where seekPercent must be 100% before setting the duration.
|
|
||||||
* Why not just use a NaN during init... And then correct the duration later?
|
|
||||||
*/
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'duration', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
if(ready) {
|
|
||||||
return duration;
|
|
||||||
} else {
|
|
||||||
return NaN;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
if(ready) {
|
|
||||||
return duration; // Popcorn has initialized, we can now use duration zero or whatever without fear.
|
|
||||||
} else {
|
|
||||||
return NaN; // Keep the duration a NaN until after loadeddata event has occurred. Otherwise Popcorn track event padding is corrupted.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'muted', {
|
|
||||||
set: function( val ) {
|
|
||||||
myPlayer.jPlayer('mute', val);
|
|
||||||
return jPlayerObj.options.muted;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.options.muted;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'volume', {
|
|
||||||
set: function( val ) {
|
|
||||||
myPlayer.jPlayer('volume', val);
|
|
||||||
return jPlayerObj.options.volume;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.options.volume;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'paused', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
return jPlayerObj.status.paused;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.status.paused;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
media.play = function() {
|
|
||||||
myPlayer.jPlayer('play');
|
|
||||||
};
|
|
||||||
media.pause = function() {
|
|
||||||
myPlayer.jPlayer('pause');
|
|
||||||
};
|
|
||||||
|
|
||||||
myPlayer.jPlayer(jpOptions); // Instance jPlayer. Note that the options should not have a ready event defined... Kill it by default?
|
|
||||||
jPlayerObj = myPlayer.data('jPlayer');
|
|
||||||
|
|
||||||
}(jQuery));
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerCheck = function() {
|
|
||||||
if (!jQuery.jPlayer) {
|
|
||||||
if (!jPlayerDownloading) {
|
|
||||||
jPlayerDownloading = true;
|
|
||||||
Popcorn.getScript(JPLAYER_SCRIPT, function() {
|
|
||||||
jPlayerDownloading = false;
|
|
||||||
jPlayerInit();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setTimeout(jPlayerCheck, 250);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
jPlayerInit();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
jQueryCheck = function() {
|
|
||||||
if (!window.jQuery) {
|
|
||||||
if (!jQueryDownloading) {
|
|
||||||
jQueryDownloading = true;
|
|
||||||
Popcorn.getScript(JQUERY_SCRIPT, function() {
|
|
||||||
jQueryDownloading = false;
|
|
||||||
jPlayerCheck();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setTimeout(jQueryCheck, 250);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
jPlayerCheck();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
jQueryCheck();
|
|
||||||
},
|
|
||||||
_teardown: function() {
|
|
||||||
jQuery('#' + this.id).jPlayer('destroy');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
}(Popcorn));
|
|
@ -1,551 +0,0 @@
|
|||||||
/*! Blue Monday Skin for jPlayer 2.9.2 ~ (c) 2009-2014 Happyworm Ltd ~ MIT License */
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Skin for jPlayer Plugin (jQuery JavaScript Library)
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Skin Name: Blue Monday
|
|
||||||
*
|
|
||||||
* Copyright (c) 2010 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
*
|
|
||||||
* Author: Silvia Benvenuti
|
|
||||||
* Skin Version: 5.1 (jPlayer 2.8.0)
|
|
||||||
* Date: 13th November 2014
|
|
||||||
*/
|
|
||||||
.jp-audio *:focus,
|
|
||||||
.jp-audio-stream *:focus,
|
|
||||||
.jp-video *:focus {
|
|
||||||
/* Disable the browser focus highlighting. */
|
|
||||||
outline: none; }
|
|
||||||
|
|
||||||
.jp-audio button::-moz-focus-inner,
|
|
||||||
.jp-audio-stream button::-moz-focus-inner,
|
|
||||||
.jp-video button::-moz-focus-inner {
|
|
||||||
/* Disable the browser CSS3 focus highlighting. */
|
|
||||||
border: 0; }
|
|
||||||
|
|
||||||
.jp-audio,
|
|
||||||
.jp-audio-stream,
|
|
||||||
.jp-video {
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: Verdana, Arial, sans-serif;
|
|
||||||
line-height: 1.6;
|
|
||||||
color: #666;
|
|
||||||
border: 1px solid #009be3;
|
|
||||||
background-color: #eee; }
|
|
||||||
|
|
||||||
.jp-audio {
|
|
||||||
width: 420px; }
|
|
||||||
|
|
||||||
.jp-audio-stream {
|
|
||||||
width: 182px; }
|
|
||||||
|
|
||||||
.jp-video-270p {
|
|
||||||
width: 480px; }
|
|
||||||
|
|
||||||
.jp-video-360p {
|
|
||||||
width: 640px; }
|
|
||||||
|
|
||||||
.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width: 480px;
|
|
||||||
height: 270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position: static !important;
|
|
||||||
position: relative; }
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
.jp-video-full div div {
|
|
||||||
z-index: 1000; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important;
|
|
||||||
position: relative;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-gui {
|
|
||||||
position: fixed !important;
|
|
||||||
position: static;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1001;
|
|
||||||
/* 1 layer above the others. */ }
|
|
||||||
|
|
||||||
.jp-video-full .jp-interface {
|
|
||||||
position: absolute !important;
|
|
||||||
position: relative;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0; }
|
|
||||||
|
|
||||||
.jp-interface {
|
|
||||||
position: relative;
|
|
||||||
background-color: #eee;
|
|
||||||
width: 100%; }
|
|
||||||
|
|
||||||
.jp-audio .jp-interface {
|
|
||||||
height: 80px; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-interface {
|
|
||||||
height: 80px; }
|
|
||||||
|
|
||||||
.jp-video .jp-interface {
|
|
||||||
border-top: 1px solid #009be3; }
|
|
||||||
|
|
||||||
/* @group CONTROLS */
|
|
||||||
.jp-controls-holder {
|
|
||||||
clear: both;
|
|
||||||
width: 440px;
|
|
||||||
margin: 0 auto;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
top: -8px;
|
|
||||||
/* This negative value depends on the size of the text in jp-currentTime and jp-duration */ }
|
|
||||||
|
|
||||||
.jp-interface .jp-controls {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-audio .jp-controls {
|
|
||||||
width: 380px;
|
|
||||||
padding: 20px 20px 0 20px; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-controls {
|
|
||||||
position: absolute;
|
|
||||||
top: 20px;
|
|
||||||
left: 20px;
|
|
||||||
width: 142px; }
|
|
||||||
|
|
||||||
.jp-video .jp-type-single .jp-controls {
|
|
||||||
width: 78px;
|
|
||||||
margin-left: 200px; }
|
|
||||||
|
|
||||||
.jp-video .jp-type-playlist .jp-controls {
|
|
||||||
width: 134px;
|
|
||||||
margin-left: 172px; }
|
|
||||||
|
|
||||||
.jp-video .jp-controls {
|
|
||||||
float: left; }
|
|
||||||
|
|
||||||
.jp-controls button {
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
overflow: hidden;
|
|
||||||
text-indent: -9999px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-play {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px; }
|
|
||||||
|
|
||||||
.jp-play {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 0 no-repeat; }
|
|
||||||
|
|
||||||
.jp-play:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -41px 0 no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing .jp-play {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -42px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing .jp-play:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -41px -42px no-repeat; }
|
|
||||||
|
|
||||||
.jp-stop, .jp-previous, .jp-next {
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
margin-top: 6px; }
|
|
||||||
|
|
||||||
.jp-stop {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -83px no-repeat;
|
|
||||||
margin-left: 10px; }
|
|
||||||
|
|
||||||
.jp-stop:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -29px -83px no-repeat; }
|
|
||||||
|
|
||||||
.jp-previous {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -112px no-repeat; }
|
|
||||||
|
|
||||||
.jp-previous:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -29px -112px no-repeat; }
|
|
||||||
|
|
||||||
.jp-next {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -141px no-repeat; }
|
|
||||||
|
|
||||||
.jp-next:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -29px -141px no-repeat; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group progress bar */
|
|
||||||
.jp-progress {
|
|
||||||
overflow: hidden;
|
|
||||||
background-color: #ddd; }
|
|
||||||
|
|
||||||
.jp-audio .jp-progress {
|
|
||||||
position: absolute;
|
|
||||||
top: 32px;
|
|
||||||
height: 15px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-single .jp-progress {
|
|
||||||
left: 110px;
|
|
||||||
width: 186px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-playlist .jp-progress {
|
|
||||||
left: 166px;
|
|
||||||
width: 130px; }
|
|
||||||
|
|
||||||
.jp-video .jp-progress {
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
width: 100%;
|
|
||||||
height: 10px; }
|
|
||||||
|
|
||||||
.jp-seek-bar {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -202px repeat-x;
|
|
||||||
width: 0px;
|
|
||||||
height: 100%;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-play-bar {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -218px repeat-x;
|
|
||||||
width: 0px;
|
|
||||||
height: 100%; }
|
|
||||||
|
|
||||||
/* The seeking class is added/removed inside jPlayer */
|
|
||||||
.jp-seeking-bg {
|
|
||||||
background: url("../image/jplayer.blue.monday.seeking.gif"); }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group volume controls */
|
|
||||||
.jp-state-no-volume .jp-volume-controls {
|
|
||||||
display: none; }
|
|
||||||
|
|
||||||
.jp-volume-controls {
|
|
||||||
position: absolute;
|
|
||||||
top: 32px;
|
|
||||||
left: 308px;
|
|
||||||
width: 200px; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-volume-controls {
|
|
||||||
left: 70px; }
|
|
||||||
|
|
||||||
.jp-video .jp-volume-controls {
|
|
||||||
top: 12px;
|
|
||||||
left: 50px; }
|
|
||||||
|
|
||||||
.jp-volume-controls button {
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
overflow: hidden;
|
|
||||||
text-indent: -9999px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-mute,
|
|
||||||
.jp-volume-max {
|
|
||||||
width: 18px;
|
|
||||||
height: 15px; }
|
|
||||||
|
|
||||||
.jp-volume-max {
|
|
||||||
left: 74px; }
|
|
||||||
|
|
||||||
.jp-mute {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -170px no-repeat; }
|
|
||||||
|
|
||||||
.jp-mute:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -19px -170px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-muted .jp-mute {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -60px -170px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-muted .jp-mute:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -79px -170px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-max {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -186px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-max:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -19px -186px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-bar {
|
|
||||||
position: absolute;
|
|
||||||
overflow: hidden;
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -250px repeat-x;
|
|
||||||
top: 5px;
|
|
||||||
left: 22px;
|
|
||||||
width: 46px;
|
|
||||||
height: 5px;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-volume-bar-value {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -256px repeat-x;
|
|
||||||
width: 0px;
|
|
||||||
height: 5px; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group current time and duration */
|
|
||||||
.jp-audio .jp-time-holder {
|
|
||||||
position: absolute;
|
|
||||||
top: 50px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-single .jp-time-holder {
|
|
||||||
left: 110px;
|
|
||||||
width: 186px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-playlist .jp-time-holder {
|
|
||||||
left: 166px;
|
|
||||||
width: 130px; }
|
|
||||||
|
|
||||||
.jp-current-time,
|
|
||||||
.jp-duration {
|
|
||||||
width: 60px;
|
|
||||||
font-size: .64em;
|
|
||||||
font-style: oblique; }
|
|
||||||
|
|
||||||
.jp-current-time {
|
|
||||||
float: left;
|
|
||||||
display: inline;
|
|
||||||
cursor: default; }
|
|
||||||
|
|
||||||
.jp-duration {
|
|
||||||
float: right;
|
|
||||||
display: inline;
|
|
||||||
text-align: right;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-video .jp-current-time {
|
|
||||||
margin-left: 20px; }
|
|
||||||
|
|
||||||
.jp-video .jp-duration {
|
|
||||||
margin-right: 20px; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group playlist */
|
|
||||||
.jp-details {
|
|
||||||
font-weight: bold;
|
|
||||||
text-align: center;
|
|
||||||
cursor: default; }
|
|
||||||
|
|
||||||
.jp-details,
|
|
||||||
.jp-playlist {
|
|
||||||
width: 100%;
|
|
||||||
background-color: #ccc;
|
|
||||||
border-top: 1px solid #009be3; }
|
|
||||||
|
|
||||||
.jp-type-single .jp-details,
|
|
||||||
.jp-type-playlist .jp-details {
|
|
||||||
border-top: none; }
|
|
||||||
|
|
||||||
.jp-details .jp-title {
|
|
||||||
margin: 0;
|
|
||||||
padding: 5px 20px;
|
|
||||||
font-size: .72em;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
.jp-playlist ul {
|
|
||||||
list-style-type: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0 20px;
|
|
||||||
font-size: .72em; }
|
|
||||||
|
|
||||||
.jp-playlist li {
|
|
||||||
padding: 5px 0 4px 20px;
|
|
||||||
border-bottom: 1px solid #eee; }
|
|
||||||
|
|
||||||
.jp-playlist li div {
|
|
||||||
display: inline; }
|
|
||||||
|
|
||||||
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
|
|
||||||
div.jp-type-playlist div.jp-playlist li:last-child {
|
|
||||||
padding: 5px 0 5px 20px;
|
|
||||||
border-bottom: none; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
|
|
||||||
list-style-type: square;
|
|
||||||
list-style-position: inside;
|
|
||||||
padding-left: 7px; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a {
|
|
||||||
color: #333;
|
|
||||||
text-decoration: none; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a:hover {
|
|
||||||
color: #0d88c1; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-current {
|
|
||||||
color: #0d88c1; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {
|
|
||||||
float: right;
|
|
||||||
display: inline;
|
|
||||||
text-align: right;
|
|
||||||
margin-right: 10px;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #666; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {
|
|
||||||
color: #0d88c1; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media {
|
|
||||||
float: right;
|
|
||||||
display: inline;
|
|
||||||
text-align: right;
|
|
||||||
margin-right: 10px; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a {
|
|
||||||
color: #666; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover {
|
|
||||||
color: #0d88c1; }
|
|
||||||
|
|
||||||
span.jp-artist {
|
|
||||||
font-size: .8em;
|
|
||||||
color: #666; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
.jp-video-play {
|
|
||||||
width: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
/* Important for nested negative margins to work in modern browsers */
|
|
||||||
cursor: pointer;
|
|
||||||
background-color: transparent;
|
|
||||||
/* Makes IE9 work with the active area over the whole video area. IE6/7/8 only have the button as active area. */ }
|
|
||||||
|
|
||||||
.jp-video-270p .jp-video-play {
|
|
||||||
margin-top: -270px;
|
|
||||||
height: 270px; }
|
|
||||||
|
|
||||||
.jp-video-360p .jp-video-play {
|
|
||||||
margin-top: -360px;
|
|
||||||
height: 360px; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-video-play {
|
|
||||||
height: 100%; }
|
|
||||||
|
|
||||||
.jp-video-play-icon {
|
|
||||||
position: relative;
|
|
||||||
display: block;
|
|
||||||
width: 112px;
|
|
||||||
height: 100px;
|
|
||||||
margin-left: -56px;
|
|
||||||
margin-top: -50px;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
background: url("../image/jplayer.blue.monday.video.play.png") 0 0 no-repeat;
|
|
||||||
text-indent: -9999px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-video-play-icon:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.video.play.png") 0 -100px no-repeat; }
|
|
||||||
|
|
||||||
.jp-jplayer audio,
|
|
||||||
.jp-jplayer {
|
|
||||||
width: 0px;
|
|
||||||
height: 0px; }
|
|
||||||
|
|
||||||
.jp-jplayer {
|
|
||||||
background-color: #000000; }
|
|
||||||
|
|
||||||
/* @group TOGGLES */
|
|
||||||
/* The audio toggles are nested inside jp-time-holder */
|
|
||||||
.jp-toggles {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0 auto;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-single .jp-toggles {
|
|
||||||
width: 25px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-playlist .jp-toggles {
|
|
||||||
width: 55px;
|
|
||||||
margin: 0;
|
|
||||||
position: absolute;
|
|
||||||
left: 325px;
|
|
||||||
top: 50px; }
|
|
||||||
|
|
||||||
.jp-video .jp-toggles {
|
|
||||||
position: absolute;
|
|
||||||
right: 16px;
|
|
||||||
margin: 0;
|
|
||||||
margin-top: 10px;
|
|
||||||
width: 100px; }
|
|
||||||
|
|
||||||
.jp-toggles button {
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
width: 25px;
|
|
||||||
height: 18px;
|
|
||||||
text-indent: -9999px;
|
|
||||||
line-height: 100%;
|
|
||||||
/* need this for IE6 */
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-full-screen {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -310px no-repeat;
|
|
||||||
margin-left: 20px; }
|
|
||||||
|
|
||||||
.jp-full-screen:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -30px -310px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-full-screen .jp-full-screen {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -60px -310px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-full-screen .jp-full-screen:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -90px -310px no-repeat; }
|
|
||||||
|
|
||||||
.jp-repeat {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -290px no-repeat; }
|
|
||||||
|
|
||||||
.jp-repeat:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -30px -290px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-looped .jp-repeat {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -60px -290px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-looped .jp-repeat:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -90px -290px no-repeat; }
|
|
||||||
|
|
||||||
.jp-shuffle {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") 0 -270px no-repeat;
|
|
||||||
margin-left: 5px; }
|
|
||||||
|
|
||||||
.jp-shuffle:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -30px -270px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-shuffled .jp-shuffle {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -60px -270px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-shuffled .jp-shuffle:focus {
|
|
||||||
background: url("../image/jplayer.blue.monday.jpg") -90px -270px no-repeat; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group NO SOLUTION error feedback */
|
|
||||||
.jp-no-solution {
|
|
||||||
padding: 5px;
|
|
||||||
font-size: .8em;
|
|
||||||
background-color: #eee;
|
|
||||||
border: 2px solid #009be3;
|
|
||||||
color: #000;
|
|
||||||
display: none; }
|
|
||||||
|
|
||||||
.jp-no-solution a {
|
|
||||||
color: #000; }
|
|
||||||
|
|
||||||
.jp-no-solution span {
|
|
||||||
font-size: 1em;
|
|
||||||
display: block;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* @end */
|
|
Before Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 17 KiB |
@ -1,640 +0,0 @@
|
|||||||
/*
|
|
||||||
* Skin for jPlayer Plugin (jQuery JavaScript Library)
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Skin Name: Blue Monday
|
|
||||||
*
|
|
||||||
* Copyright (c) 2010-2012 Happyworm Ltd
|
|
||||||
* Dual licensed under the MIT and GPL licenses.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
* - http://www.gnu.org/copyleft/gpl.html
|
|
||||||
*
|
|
||||||
* Author: Silvia Benvenuti
|
|
||||||
* Skin Version: 4.3 (jPlayer 2.2.0)
|
|
||||||
* Date: 19th November 2012
|
|
||||||
*/
|
|
||||||
|
|
||||||
div.jp-audio,
|
|
||||||
div.jp-audio-stream,
|
|
||||||
div.jp-video {
|
|
||||||
|
|
||||||
/* Edit the font-size to counteract inherited font sizing.
|
|
||||||
* Eg. 1.25em = 1 / 0.8em
|
|
||||||
*/
|
|
||||||
|
|
||||||
font-size:1.25em; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */
|
|
||||||
|
|
||||||
font-family:Verdana, Arial, sans-serif;
|
|
||||||
line-height:1.6;
|
|
||||||
color: #666;
|
|
||||||
border:1px solid #009be3;
|
|
||||||
background-color:#eee;
|
|
||||||
}
|
|
||||||
div.jp-audio {
|
|
||||||
width:420px;
|
|
||||||
}
|
|
||||||
div.jp-audio-stream {
|
|
||||||
width:182px;
|
|
||||||
}
|
|
||||||
div.jp-video-270p {
|
|
||||||
width:480px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p {
|
|
||||||
width:640px;
|
|
||||||
}
|
|
||||||
div.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width:480px;
|
|
||||||
height:270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position:static !important; position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
div.jp-video-full div div {
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-gui {
|
|
||||||
position: fixed !important; position: static; /* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width:100%;
|
|
||||||
height:100%;
|
|
||||||
z-index:1001; /* 1 layer above the others. */
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-interface {
|
|
||||||
position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface {
|
|
||||||
position: relative;
|
|
||||||
background-color:#eee;
|
|
||||||
width:100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio div.jp-type-single div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream div.jp-type-single div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-interface {
|
|
||||||
border-top:1px solid #009be3;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @group CONTROLS */
|
|
||||||
|
|
||||||
div.jp-controls-holder {
|
|
||||||
clear: both;
|
|
||||||
width:440px;
|
|
||||||
margin:0 auto;
|
|
||||||
position: relative;
|
|
||||||
overflow:hidden;
|
|
||||||
top:-8px; /* This negative value depends on the size of the text in jp-currentTime and jp-duration */
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls {
|
|
||||||
list-style-type:none;
|
|
||||||
margin:0;
|
|
||||||
padding: 0;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-controls {
|
|
||||||
width: 380px;
|
|
||||||
padding:20px 20px 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream ul.jp-controls {
|
|
||||||
width: 142px;
|
|
||||||
padding:20px 20px 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-type-single ul.jp-controls {
|
|
||||||
width: 78px;
|
|
||||||
margin-left: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-type-playlist ul.jp-controls {
|
|
||||||
width: 134px;
|
|
||||||
margin-left: 172px;
|
|
||||||
}
|
|
||||||
div.jp-video ul.jp-controls,
|
|
||||||
div.jp-interface ul.jp-controls li {
|
|
||||||
display:inline;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a {
|
|
||||||
display:block;
|
|
||||||
overflow:hidden;
|
|
||||||
text-indent:-9999px;
|
|
||||||
}
|
|
||||||
a.jp-play,
|
|
||||||
a.jp-pause {
|
|
||||||
width:40px;
|
|
||||||
height:40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-play {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 0 no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-play:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -41px 0 no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-pause {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -42px no-repeat;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
a.jp-pause:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -41px -42px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop, a.jp-previous, a.jp-next {
|
|
||||||
width:28px;
|
|
||||||
height:28px;
|
|
||||||
margin-top:6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -83px no-repeat;
|
|
||||||
margin-left:10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -83px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-previous {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -112px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-previous:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -112px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-next {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -141px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-next:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -141px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group progress bar */
|
|
||||||
|
|
||||||
div.jp-progress {
|
|
||||||
overflow:hidden;
|
|
||||||
background-color: #ddd;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-progress {
|
|
||||||
position: absolute;
|
|
||||||
top:32px;
|
|
||||||
height:15px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-single div.jp-progress {
|
|
||||||
left:110px;
|
|
||||||
width:186px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-progress {
|
|
||||||
left:166px;
|
|
||||||
width:130px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-progress {
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
width:100%;
|
|
||||||
height:10px;
|
|
||||||
}
|
|
||||||
div.jp-seek-bar {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -202px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height:100%;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
div.jp-play-bar {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -218px repeat-x ;
|
|
||||||
width:0px;
|
|
||||||
height:100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The seeking class is added/removed inside jPlayer */
|
|
||||||
div.jp-seeking-bg {
|
|
||||||
background: url("jplayer.blue.monday.seeking.gif");
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group volume controls */
|
|
||||||
|
|
||||||
|
|
||||||
a.jp-mute,
|
|
||||||
a.jp-unmute,
|
|
||||||
a.jp-volume-max {
|
|
||||||
width:18px;
|
|
||||||
height:15px;
|
|
||||||
margin-top:12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio div.jp-type-single a.jp-mute,
|
|
||||||
div.jp-audio div.jp-type-single a.jp-unmute {
|
|
||||||
margin-left: 210px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist a.jp-mute,
|
|
||||||
div.jp-audio div.jp-type-playlist a.jp-unmute {
|
|
||||||
margin-left: 154px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream div.jp-type-single a.jp-mute,
|
|
||||||
div.jp-audio-stream div.jp-type-single a.jp-unmute {
|
|
||||||
margin-left:10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio a.jp-volume-max,
|
|
||||||
div.jp-audio-stream a.jp-volume-max {
|
|
||||||
margin-left: 56px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-mute,
|
|
||||||
div.jp-video a.jp-unmute,
|
|
||||||
div.jp-video a.jp-volume-max {
|
|
||||||
position: absolute;
|
|
||||||
top:12px;
|
|
||||||
margin-top:0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-mute,
|
|
||||||
div.jp-video a.jp-unmute {
|
|
||||||
left: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-volume-max {
|
|
||||||
left: 134px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-mute {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-mute:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -19px -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-unmute {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -170px no-repeat;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
a.jp-unmute:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -79px -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-volume-max {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -186px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-volume-max:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -19px -186px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-volume-bar {
|
|
||||||
position: absolute;
|
|
||||||
overflow:hidden;
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -250px repeat-x;
|
|
||||||
width:46px;
|
|
||||||
height:5px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-volume-bar {
|
|
||||||
top:37px;
|
|
||||||
left:330px;
|
|
||||||
}
|
|
||||||
div.jp-audio-stream div.jp-volume-bar {
|
|
||||||
top:37px;
|
|
||||||
left:92px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-volume-bar {
|
|
||||||
top:17px;
|
|
||||||
left:72px;
|
|
||||||
}
|
|
||||||
div.jp-volume-bar-value {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -256px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height:5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group current time and duration */
|
|
||||||
|
|
||||||
div.jp-audio div.jp-time-holder {
|
|
||||||
position:absolute;
|
|
||||||
top:50px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-single div.jp-time-holder {
|
|
||||||
left:110px;
|
|
||||||
width:186px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-time-holder {
|
|
||||||
left:166px;
|
|
||||||
width:130px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-current-time,
|
|
||||||
div.jp-duration {
|
|
||||||
width:60px;
|
|
||||||
font-size:.64em;
|
|
||||||
font-style:oblique;
|
|
||||||
}
|
|
||||||
div.jp-current-time {
|
|
||||||
float: left;
|
|
||||||
display:inline;
|
|
||||||
}
|
|
||||||
div.jp-duration {
|
|
||||||
float: right;
|
|
||||||
display:inline;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-current-time {
|
|
||||||
margin-left:20px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-duration {
|
|
||||||
margin-right:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group playlist */
|
|
||||||
|
|
||||||
div.jp-title {
|
|
||||||
font-weight:bold;
|
|
||||||
text-align:center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-title,
|
|
||||||
div.jp-playlist {
|
|
||||||
width:100%;
|
|
||||||
background-color:#ccc;
|
|
||||||
border-top:1px solid #009be3;
|
|
||||||
}
|
|
||||||
div.jp-type-single div.jp-title,
|
|
||||||
div.jp-type-playlist div.jp-title,
|
|
||||||
div.jp-type-single div.jp-playlist {
|
|
||||||
border-top:none;
|
|
||||||
}
|
|
||||||
div.jp-title ul,
|
|
||||||
div.jp-playlist ul {
|
|
||||||
list-style-type:none;
|
|
||||||
margin:0;
|
|
||||||
padding:0 20px;
|
|
||||||
font-size:.72em;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-title li {
|
|
||||||
padding:5px 0;
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
div.jp-playlist li {
|
|
||||||
padding:5px 0 4px 20px;
|
|
||||||
border-bottom:1px solid #eee;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-playlist li div {
|
|
||||||
display:inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li:last-child {
|
|
||||||
padding:5px 0 5px 20px;
|
|
||||||
border-bottom:none;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
|
|
||||||
list-style-type:square;
|
|
||||||
list-style-position:inside;
|
|
||||||
padding-left:7px;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a {
|
|
||||||
color: #333;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a:hover {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-current {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {
|
|
||||||
float:right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
margin-right:10px;
|
|
||||||
font-weight:bold;
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media {
|
|
||||||
float:right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
margin-right:10px;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a{
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover{
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
span.jp-artist {
|
|
||||||
font-size:.8em;
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
div.jp-video-play {
|
|
||||||
width:100%;
|
|
||||||
overflow:hidden; /* Important for nested negative margins to work in modern browsers */
|
|
||||||
cursor:pointer;
|
|
||||||
background-color:rgba(0,0,0,0); /* Makes IE9 work with the active area over the whole video area. IE6/7/8 only have the button as active area. */
|
|
||||||
}
|
|
||||||
div.jp-video-270p div.jp-video-play {
|
|
||||||
margin-top:-270px;
|
|
||||||
height:270px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p div.jp-video-play {
|
|
||||||
margin-top:-360px;
|
|
||||||
height:360px;
|
|
||||||
}
|
|
||||||
div.jp-video-full div.jp-video-play {
|
|
||||||
height:100%;
|
|
||||||
}
|
|
||||||
a.jp-video-play-icon {
|
|
||||||
position:relative;
|
|
||||||
display:block;
|
|
||||||
width: 112px;
|
|
||||||
height: 100px;
|
|
||||||
|
|
||||||
margin-left:-56px;
|
|
||||||
margin-top:-50px;
|
|
||||||
left:50%;
|
|
||||||
top:50%;
|
|
||||||
|
|
||||||
background: url("jplayer.blue.monday.video.play.png") 0 0 no-repeat;
|
|
||||||
text-indent:-9999px;
|
|
||||||
}
|
|
||||||
div.jp-video-play:hover a.jp-video-play-icon {
|
|
||||||
background: url("jplayer.blue.monday.video.play.png") 0 -100px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-jplayer audio,
|
|
||||||
div.jp-jplayer {
|
|
||||||
width:0px;
|
|
||||||
height:0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-jplayer {
|
|
||||||
background-color: #000000;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* @group TOGGLES */
|
|
||||||
|
|
||||||
/* The audio toggles are nested inside jp-time-holder */
|
|
||||||
|
|
||||||
ul.jp-toggles {
|
|
||||||
list-style-type:none;
|
|
||||||
padding:0;
|
|
||||||
margin:0 auto;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio .jp-type-single ul.jp-toggles {
|
|
||||||
width:25px;
|
|
||||||
}
|
|
||||||
div.jp-audio .jp-type-playlist ul.jp-toggles {
|
|
||||||
width:55px;
|
|
||||||
margin: 0;
|
|
||||||
position: absolute;
|
|
||||||
left: 325px;
|
|
||||||
top: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video ul.jp-toggles {
|
|
||||||
margin-top:10px;
|
|
||||||
width:100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li {
|
|
||||||
display:block;
|
|
||||||
float:right;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li a {
|
|
||||||
display:block;
|
|
||||||
width:25px;
|
|
||||||
height:18px;
|
|
||||||
text-indent:-9999px;
|
|
||||||
line-height:100%; /* need this for IE6 */
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-full-screen {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -310px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-full-screen:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -310px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-restore-screen {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -310px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-restore-screen:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -310px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat-off {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat-off:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -270px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -270px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle-off {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -270px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle-off:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -270px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group NO SOLUTION error feedback */
|
|
||||||
|
|
||||||
.jp-no-solution {
|
|
||||||
padding:5px;
|
|
||||||
font-size:.8em;
|
|
||||||
background-color:#eee;
|
|
||||||
border:2px solid #009be3;
|
|
||||||
color:#000;
|
|
||||||
display:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution a {
|
|
||||||
color:#000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution span {
|
|
||||||
font-size:1em;
|
|
||||||
display:block;
|
|
||||||
text-align:center;
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
Before Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 17 KiB |
@ -1,42 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-playlist">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-previous" role="button" tabindex="0">previous</button>
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-next" role="button" tabindex="0">next</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-time-holder">
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-shuffle" role="button" tabindex="0">shuffle</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-playlist">
|
|
||||||
<ul>
|
|
||||||
<li> </li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,37 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-time-holder">
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,24 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio-stream" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,52 +0,0 @@
|
|||||||
<div id="{{WRAPPER}}" class="jp-video " role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-playlist">
|
|
||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div class="jp-gui">
|
|
||||||
<div class="jp-video-play">
|
|
||||||
<button class="jp-video-play-icon" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-interface">
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-previous" role="button" tabindex="0">previous</button>
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-next" role="button" tabindex="0">next</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-shuffle" role="button" tabindex="0">shuffle</button>
|
|
||||||
<button class="jp-full-screen" role="button" tabindex="0">full screen</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-playlist">
|
|
||||||
<ul>
|
|
||||||
<!-- The method Playlist.displayPlaylist() uses this unordered list -->
|
|
||||||
<li> </li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,43 +0,0 @@
|
|||||||
<div id="{{WRAPPER}}" class="jp-video " role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div class="jp-gui">
|
|
||||||
<div class="jp-video-play">
|
|
||||||
<button class="jp-video-play-icon" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-interface">
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-full-screen" role="button" tabindex="0">full screen</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,40 +0,0 @@
|
|||||||
<div id="{{jquery_jplayer_id}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{jp_container_id}}" class="jp-audio">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<ul class="jp-controls">
|
|
||||||
<li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
|
|
||||||
</ul>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-time-holder">
|
|
||||||
<div class="jp-current-time"></div>
|
|
||||||
<div class="jp-duration"></div>
|
|
||||||
<ul class="jp-toggles">
|
|
||||||
<li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-title">
|
|
||||||
<ul>
|
|
||||||
<li>{{title}}</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,572 +0,0 @@
|
|||||||
/*! Pink Flag Skin for jPlayer 2.9.2 ~ (c) 2009-2014 Happyworm Ltd ~ MIT License */
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Skin for jPlayer Plugin (jQuery JavaScript Library)
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Skin Name: Pink Flag
|
|
||||||
*
|
|
||||||
* Copyright (c) 2012 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
*
|
|
||||||
* Author: Silvia Benvenuti
|
|
||||||
* Skin Version: 2.1 (jPlayer 2.8.0)
|
|
||||||
* Date: 13th November 2014
|
|
||||||
*/
|
|
||||||
.jp-audio *:focus,
|
|
||||||
.jp-audio-stream *:focus,
|
|
||||||
.jp-video *:focus {
|
|
||||||
/* Disable the browser focus highlighting. */
|
|
||||||
outline: none; }
|
|
||||||
|
|
||||||
.jp-audio button::-moz-focus-inner,
|
|
||||||
.jp-audio-stream button::-moz-focus-inner,
|
|
||||||
.jp-video button::-moz-focus-inner {
|
|
||||||
/* Disable the browser CSS3 focus highlighting. */
|
|
||||||
border: 0; }
|
|
||||||
|
|
||||||
.jp-audio,
|
|
||||||
.jp-audio-stream,
|
|
||||||
.jp-video {
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: Verdana, Arial, sans-serif;
|
|
||||||
line-height: 1.6;
|
|
||||||
color: #fff;
|
|
||||||
border-top: 1px solid #554461;
|
|
||||||
border-left: 1px solid #554461;
|
|
||||||
border-right: 1px solid #180a1f;
|
|
||||||
border-bottom: 1px solid #180a1f;
|
|
||||||
background-color: #3a2a45; }
|
|
||||||
|
|
||||||
.jp-audio {
|
|
||||||
width: 201px;
|
|
||||||
padding: 20px; }
|
|
||||||
|
|
||||||
.jp-audio-stream {
|
|
||||||
width: 101px;
|
|
||||||
padding: 20px 20px 10px 20px; }
|
|
||||||
|
|
||||||
.jp-video-270p {
|
|
||||||
width: 480px; }
|
|
||||||
|
|
||||||
.jp-video-360p {
|
|
||||||
width: 640px; }
|
|
||||||
|
|
||||||
.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width: 480px;
|
|
||||||
height: 270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position: static !important;
|
|
||||||
position: relative; }
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
.jp-video-full div div {
|
|
||||||
z-index: 1000; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important;
|
|
||||||
position: relative;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-gui {
|
|
||||||
position: fixed !important;
|
|
||||||
position: static;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1001;
|
|
||||||
/* 1 layer above the others. */ }
|
|
||||||
|
|
||||||
.jp-video-full .jp-interface {
|
|
||||||
position: absolute !important;
|
|
||||||
position: relative;
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0; }
|
|
||||||
|
|
||||||
.jp-interface {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #3a2a45;
|
|
||||||
/* Required for the full screen */ }
|
|
||||||
|
|
||||||
/* @group CONTROLS */
|
|
||||||
.jp-video .jp-controls-holder {
|
|
||||||
clear: both;
|
|
||||||
width: 440px;
|
|
||||||
margin: 0 auto 10px auto;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-audio .jp-controls-holder {
|
|
||||||
height: 80px; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-controls-holder {
|
|
||||||
height: 50px; }
|
|
||||||
|
|
||||||
.jp-controls {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0 0 no-repeat;
|
|
||||||
padding: 1px 0 2px 1px;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 201px;
|
|
||||||
height: 34px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-controls,
|
|
||||||
.jp-audio-stream .jp-controls {
|
|
||||||
margin: 0 auto; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-controls {
|
|
||||||
width: 100px; }
|
|
||||||
|
|
||||||
.jp-video .jp-controls {
|
|
||||||
margin: 0 0 0 115px;
|
|
||||||
float: left;
|
|
||||||
display: inline;
|
|
||||||
/* need this to fix IE6 double margin */ }
|
|
||||||
|
|
||||||
.jp-controls button {
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
overflow: hidden;
|
|
||||||
text-indent: -9999px;
|
|
||||||
height: 34px;
|
|
||||||
margin: 0 1px 2px 0;
|
|
||||||
padding: 0;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
/* @group single player controls */
|
|
||||||
.jp-type-single .jp-controls button {
|
|
||||||
width: 99px; }
|
|
||||||
|
|
||||||
.jp-type-single .jp-play {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -40px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-single .jp-play:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -100px -40px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing .jp-type-single .jp-play {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -120px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing .jp-type-single .jp-play:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -100px -120px no-repeat; }
|
|
||||||
|
|
||||||
/* The right border is normally in the ul background image. */
|
|
||||||
.jp-audio-stream .jp-play,
|
|
||||||
.jp-audio-stream .jp-pause {
|
|
||||||
border-right: 1px solid #180920; }
|
|
||||||
|
|
||||||
.jp-type-single .jp-stop {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -80px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-single .jp-stop:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -100px -80px no-repeat; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group playlist player controls */
|
|
||||||
.jp-type-playlist .jp-controls button {
|
|
||||||
width: 49px; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-play {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -24px -40px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-play:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -124px -40px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing div.jp-type-playlist .jp-play {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -24px -120px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-playing div.jp-type-playlist .jp-play:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -124px -120px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-stop {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -24px -80px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-stop:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -124px -80px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-previous {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -24px -200px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-previous:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -124px -200px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-next {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -24px -160px no-repeat; }
|
|
||||||
|
|
||||||
.jp-type-playlist .jp-next:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -124px -160px no-repeat; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group TOGGLES */
|
|
||||||
.jp-toggles {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0 auto;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
.jp-audio .jp-toggles {
|
|
||||||
width: 55px; }
|
|
||||||
|
|
||||||
.jp-audio .jp-type-single .jp-toggles {
|
|
||||||
width: 25px; }
|
|
||||||
|
|
||||||
.jp-video .jp-toggles {
|
|
||||||
float: left;
|
|
||||||
width: 105px;
|
|
||||||
margin: 10px 0 0 15px; }
|
|
||||||
|
|
||||||
.jp-toggles button {
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
width: 25px;
|
|
||||||
height: 18px;
|
|
||||||
text-indent: -9999px;
|
|
||||||
line-height: 100%;
|
|
||||||
/* need this for IE6 */
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-full-screen {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0 -420px no-repeat;
|
|
||||||
margin-left: 15px; }
|
|
||||||
|
|
||||||
.jp-full-screen:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -30px -420px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-full-screen .jp-full-screen {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -60px -420px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-full-screen .jp-full-screen:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -90px -420px no-repeat; }
|
|
||||||
|
|
||||||
.jp-repeat {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0 -440px no-repeat;
|
|
||||||
margin-left: 0; }
|
|
||||||
|
|
||||||
.jp-repeat:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -30px -440px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-looped .jp-repeat {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -60px -440px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-looped .jp-repeat:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -90px -440px no-repeat; }
|
|
||||||
|
|
||||||
.jp-shuffle {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0 -460px no-repeat;
|
|
||||||
margin-left: 15px; }
|
|
||||||
|
|
||||||
.jp-shuffle:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -30px -460px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-shuffled .jp-shuffle {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -60px -460px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-shuffled .jp-shuffle:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -90px -460px no-repeat; }
|
|
||||||
|
|
||||||
.jp-audio .jp-shuffle {
|
|
||||||
margin-left: 5px; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group progress bar */
|
|
||||||
/* The seeking class is added/removed inside jPlayer */
|
|
||||||
div.jp-seeking-bg {
|
|
||||||
background: url("../image/jplayer.pink.flag.seeking.gif"); }
|
|
||||||
|
|
||||||
.jp-progress {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -240px no-repeat;
|
|
||||||
width: 197px;
|
|
||||||
height: 13px;
|
|
||||||
padding: 0 2px 2px 2px;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
div.jp-video .jp-progress {
|
|
||||||
border-top: 1px solid #180a1f;
|
|
||||||
border-bottom: 1px solid #554560;
|
|
||||||
width: 100%;
|
|
||||||
background-image: none;
|
|
||||||
padding: 0; }
|
|
||||||
|
|
||||||
.jp-seek-bar {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -260px repeat-x;
|
|
||||||
width: 0px;
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-play-bar {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -280px repeat-x;
|
|
||||||
width: 0px;
|
|
||||||
height: 100%;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group volume controls */
|
|
||||||
.jp-state-no-volume .jp-volume-controls {
|
|
||||||
display: none; }
|
|
||||||
|
|
||||||
.jp-audio .jp-volume-controls,
|
|
||||||
.jp-audio-stream .jp-volume-controls {
|
|
||||||
height: 30px; }
|
|
||||||
|
|
||||||
.jp-volume-controls button {
|
|
||||||
position: absolute;
|
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
|
||||||
text-indent: -9999px;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
width: 16px;
|
|
||||||
height: 11px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-audio .jp-volume-controls .jp-mute,
|
|
||||||
.jp-audio-stream .jp-volume-controls .jp-mute {
|
|
||||||
top: -6px;
|
|
||||||
left: 0; }
|
|
||||||
|
|
||||||
.jp-audio .jp-volume-controls .jp-volume-max,
|
|
||||||
.jp-audio-stream .jp-volume-controls .jp-volume-max {
|
|
||||||
top: -6px;
|
|
||||||
right: 0; }
|
|
||||||
|
|
||||||
.jp-video .jp-volume-controls .jp-mute,
|
|
||||||
.jp-video .jp-volume-controls .jp-unmute {
|
|
||||||
left: 0;
|
|
||||||
top: 14px; }
|
|
||||||
|
|
||||||
.jp-video .jp-volume-controls .jp-volume-max {
|
|
||||||
left: 84px;
|
|
||||||
top: 14px; }
|
|
||||||
|
|
||||||
.jp-volume-controls .jp-mute {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -330px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-controls .jp-mute:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -25px -330px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-muted .jp-volume-controls .jp-mute {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -60px -330px no-repeat; }
|
|
||||||
|
|
||||||
.jp-state-muted .jp-volume-controls .jp-mute:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -85px -330px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-controls .jp-volume-max {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -350px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-controls .jp-volume-max:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") -25px -350px no-repeat; }
|
|
||||||
|
|
||||||
.jp-volume-bar {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -300px repeat-x;
|
|
||||||
position: absolute;
|
|
||||||
width: 197px;
|
|
||||||
height: 4px;
|
|
||||||
padding: 2px 2px 1px 2px;
|
|
||||||
overflow: hidden;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-audio .jp-interface .jp-volume-bar,
|
|
||||||
.jp-audio-stream .jp-interface .jp-volume-bar {
|
|
||||||
top: 10px;
|
|
||||||
left: 0; }
|
|
||||||
|
|
||||||
.jp-audio-stream .jp-interface .jp-volume-bar {
|
|
||||||
width: 97px;
|
|
||||||
border-right: 1px solid #180920;
|
|
||||||
padding-right: 1px; }
|
|
||||||
|
|
||||||
.jp-video .jp-volume-bar {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 95px;
|
|
||||||
border-right: 1px solid #180920;
|
|
||||||
padding-right: 1px;
|
|
||||||
margin-top: 30px; }
|
|
||||||
|
|
||||||
.jp-volume-bar-value {
|
|
||||||
background: url("../image/jplayer.pink.flag.jpg") 0px -320px repeat-x;
|
|
||||||
height: 4px; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group current time and duration */
|
|
||||||
.jp-current-time, .jp-duration {
|
|
||||||
width: 70px;
|
|
||||||
font-size: .5em;
|
|
||||||
color: #8c7a99; }
|
|
||||||
|
|
||||||
.jp-current-time {
|
|
||||||
float: left;
|
|
||||||
cursor: default; }
|
|
||||||
|
|
||||||
.jp-duration {
|
|
||||||
float: right;
|
|
||||||
text-align: right;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
.jp-video .jp-current-time {
|
|
||||||
padding-left: 20px; }
|
|
||||||
|
|
||||||
.jp-video .jp-duration {
|
|
||||||
padding-right: 20px; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
/* @group playlist */
|
|
||||||
.jp-details {
|
|
||||||
font-size: .7em;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0; }
|
|
||||||
|
|
||||||
.jp-details .jp-title {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
text-align: center;
|
|
||||||
cursor: default; }
|
|
||||||
|
|
||||||
.jp-video .jp-details {
|
|
||||||
margin: 0 90px 10px; }
|
|
||||||
|
|
||||||
.jp-playlist ul {
|
|
||||||
list-style-type: none;
|
|
||||||
font-size: .7em;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0; }
|
|
||||||
|
|
||||||
.jp-video .jp-playlist ul {
|
|
||||||
margin: 0 20px; }
|
|
||||||
|
|
||||||
.jp-playlist li {
|
|
||||||
position: relative;
|
|
||||||
padding: 2px 0;
|
|
||||||
border-top: 1px solid #554461;
|
|
||||||
border-bottom: 1px solid #180a1f;
|
|
||||||
overflow: hidden; }
|
|
||||||
|
|
||||||
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
|
|
||||||
div.jp-type-playlist div.jp-playlist li:first-child {
|
|
||||||
border-top: none;
|
|
||||||
padding-top: 3px; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li:last-child {
|
|
||||||
border-bottom: none;
|
|
||||||
padding-bottom: 3px; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a {
|
|
||||||
color: #fff;
|
|
||||||
text-decoration: none; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a:hover {
|
|
||||||
color: #e892e9; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
|
|
||||||
background-color: #26102e;
|
|
||||||
margin: 0 -20px;
|
|
||||||
padding: 2px 20px;
|
|
||||||
border-top: 1px solid #26102e;
|
|
||||||
border-bottom: 1px solid #26102e; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current a {
|
|
||||||
color: #e892e9; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {
|
|
||||||
float: right;
|
|
||||||
display: inline;
|
|
||||||
text-align: right;
|
|
||||||
margin-left: 10px;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #8C7A99; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {
|
|
||||||
color: #E892E9; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media {
|
|
||||||
float: right;
|
|
||||||
display: inline;
|
|
||||||
text-align: right;
|
|
||||||
color: #8C7A99; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a {
|
|
||||||
color: #8C7A99; }
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover {
|
|
||||||
color: #E892E9; }
|
|
||||||
|
|
||||||
span.jp-artist {
|
|
||||||
font-size: .8em;
|
|
||||||
color: #8C7A99; }
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
.jp-video .jp-video-play {
|
|
||||||
width: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
/* Important for nested negative margins to work in modern browsers */ }
|
|
||||||
|
|
||||||
.jp-video-270p .jp-video-play {
|
|
||||||
margin-top: -270px;
|
|
||||||
height: 270px; }
|
|
||||||
|
|
||||||
.jp-video-360p .jp-video-play {
|
|
||||||
margin-top: -360px;
|
|
||||||
height: 360px; }
|
|
||||||
|
|
||||||
.jp-video-full .jp-video-play {
|
|
||||||
height: 100%; }
|
|
||||||
|
|
||||||
.jp-video-play-icon {
|
|
||||||
position: relative;
|
|
||||||
display: block;
|
|
||||||
width: 112px;
|
|
||||||
height: 100px;
|
|
||||||
margin-left: -56px;
|
|
||||||
margin-top: -50px;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer;
|
|
||||||
background: url("../image/jplayer.pink.flag.video.play.png") 0 0 no-repeat;
|
|
||||||
text-indent: -9999px; }
|
|
||||||
|
|
||||||
.jp-video-play-icon:focus {
|
|
||||||
background: url("../image/jplayer.pink.flag.video.play.png") 0 -100px no-repeat; }
|
|
||||||
|
|
||||||
.jp-jplayer audio,
|
|
||||||
.jp-jplayer {
|
|
||||||
width: 0px;
|
|
||||||
height: 0px; }
|
|
||||||
|
|
||||||
.jp-jplayer {
|
|
||||||
background-color: #000000; }
|
|
||||||
|
|
||||||
/* @group NO SOLUTION error feedback */
|
|
||||||
.jp-no-solution {
|
|
||||||
padding: 5px;
|
|
||||||
font-size: .8em;
|
|
||||||
background-color: #3a2a45;
|
|
||||||
border-top: 2px solid #554461;
|
|
||||||
border-left: 2px solid #554461;
|
|
||||||
border-right: 2px solid #180a1f;
|
|
||||||
border-bottom: 2px solid #180a1f;
|
|
||||||
color: #FFF;
|
|
||||||
display: none; }
|
|
||||||
|
|
||||||
.jp-no-solution a {
|
|
||||||
color: #FFF; }
|
|
||||||
|
|
||||||
.jp-no-solution span {
|
|
||||||
font-size: 1em;
|
|
||||||
display: block;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* @end */
|
|
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 17 KiB |
@ -1,42 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-playlist">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-previous" role="button" tabindex="0">previous</button>
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
<button class="jp-next" role="button" tabindex="0">next</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-shuffle" role="button" tabindex="0">shuffle</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-playlist">
|
|
||||||
<ul>
|
|
||||||
<li> </li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,37 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,24 +0,0 @@
|
|||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{WRAPPER}}" class="jp-audio-stream" role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,52 +0,0 @@
|
|||||||
<div id="{{WRAPPER}}" class="jp-video " role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-playlist">
|
|
||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div class="jp-gui">
|
|
||||||
<div class="jp-video-play">
|
|
||||||
<button class="jp-video-play-icon" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-interface">
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-previous" role="button" tabindex="0">previous</button>
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
<button class="jp-next" role="button" tabindex="0">next</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-shuffle" role="button" tabindex="0">shuffle</button>
|
|
||||||
<button class="jp-full-screen" role="button" tabindex="0">full screen</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-playlist">
|
|
||||||
<ul>
|
|
||||||
<!-- The method Playlist.displayPlaylist() uses this unordered list -->
|
|
||||||
<li></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,43 +0,0 @@
|
|||||||
<div id="{{WRAPPER}}" class="jp-video " role="application" aria-label="media player">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div id="{{JPLAYER}}" class="jp-jplayer"></div>
|
|
||||||
<div class="jp-gui">
|
|
||||||
<div class="jp-video-play">
|
|
||||||
<button class="jp-video-play-icon" role="button" tabindex="0">play</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-interface">
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-current-time" role="timer" aria-label="time"> </div>
|
|
||||||
<div class="jp-duration" role="timer" aria-label="duration"> </div>
|
|
||||||
<div class="jp-details">
|
|
||||||
<div class="jp-title" aria-label="title"> </div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls-holder">
|
|
||||||
<div class="jp-volume-controls">
|
|
||||||
<button class="jp-mute" role="button" tabindex="0">mute</button>
|
|
||||||
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-controls">
|
|
||||||
<button class="jp-play" role="button" tabindex="0">play</button>
|
|
||||||
<button class="jp-stop" role="button" tabindex="0">stop</button>
|
|
||||||
</div>
|
|
||||||
<div class="jp-toggles">
|
|
||||||
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
|
|
||||||
<button class="jp-full-screen" role="button" tabindex="0">full screen</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,640 +0,0 @@
|
|||||||
/*
|
|
||||||
* Skin for jPlayer Plugin (jQuery JavaScript Library)
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Skin Name: Blue Monday
|
|
||||||
*
|
|
||||||
* Copyright (c) 2010-2012 Happyworm Ltd
|
|
||||||
* Dual licensed under the MIT and GPL licenses.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
* - http://www.gnu.org/copyleft/gpl.html
|
|
||||||
*
|
|
||||||
* Author: Silvia Benvenuti
|
|
||||||
* Skin Version: 4.3 (jPlayer 2.2.0)
|
|
||||||
* Date: 19th November 2012
|
|
||||||
*/
|
|
||||||
|
|
||||||
div.jp-audio,
|
|
||||||
div.jp-audio-stream,
|
|
||||||
div.jp-video {
|
|
||||||
|
|
||||||
/* Edit the font-size to counteract inherited font sizing.
|
|
||||||
* Eg. 1.25em = 1 / 0.8em
|
|
||||||
*/
|
|
||||||
|
|
||||||
font-size:1.25em; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */
|
|
||||||
|
|
||||||
font-family:Verdana, Arial, sans-serif;
|
|
||||||
line-height:1.6;
|
|
||||||
color: #666;
|
|
||||||
border:1px solid #009be3;
|
|
||||||
background-color:#eee;
|
|
||||||
}
|
|
||||||
div.jp-audio {
|
|
||||||
width:420px;
|
|
||||||
}
|
|
||||||
div.jp-audio-stream {
|
|
||||||
width:182px;
|
|
||||||
}
|
|
||||||
div.jp-video-270p {
|
|
||||||
width:480px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p {
|
|
||||||
width:640px;
|
|
||||||
}
|
|
||||||
div.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width:480px;
|
|
||||||
height:270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position:static !important; position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
div.jp-video-full div div {
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-gui {
|
|
||||||
position: fixed !important; position: static; /* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width:100%;
|
|
||||||
height:100%;
|
|
||||||
z-index:1001; /* 1 layer above the others. */
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-interface {
|
|
||||||
position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface {
|
|
||||||
position: relative;
|
|
||||||
background-color:#eee;
|
|
||||||
width:100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio div.jp-type-single div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream div.jp-type-single div.jp-interface {
|
|
||||||
height:80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-interface {
|
|
||||||
border-top:1px solid #009be3;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @group CONTROLS */
|
|
||||||
|
|
||||||
div.jp-controls-holder {
|
|
||||||
clear: both;
|
|
||||||
width:440px;
|
|
||||||
margin:0 auto;
|
|
||||||
position: relative;
|
|
||||||
overflow:hidden;
|
|
||||||
top:-8px; /* This negative value depends on the size of the text in jp-currentTime and jp-duration */
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls {
|
|
||||||
list-style-type:none;
|
|
||||||
margin:0;
|
|
||||||
padding: 0;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-controls {
|
|
||||||
width: 380px;
|
|
||||||
padding:20px 20px 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream ul.jp-controls {
|
|
||||||
width: 142px;
|
|
||||||
padding:20px 20px 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-type-single ul.jp-controls {
|
|
||||||
width: 78px;
|
|
||||||
margin-left: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-type-playlist ul.jp-controls {
|
|
||||||
width: 134px;
|
|
||||||
margin-left: 172px;
|
|
||||||
}
|
|
||||||
div.jp-video ul.jp-controls,
|
|
||||||
div.jp-interface ul.jp-controls li {
|
|
||||||
display:inline;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a {
|
|
||||||
display:block;
|
|
||||||
overflow:hidden;
|
|
||||||
text-indent:-9999px;
|
|
||||||
}
|
|
||||||
a.jp-play,
|
|
||||||
a.jp-pause {
|
|
||||||
width:40px;
|
|
||||||
height:40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-play {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 0 no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-play:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -41px 0 no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-pause {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -42px no-repeat;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
a.jp-pause:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -41px -42px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop, a.jp-previous, a.jp-next {
|
|
||||||
width:28px;
|
|
||||||
height:28px;
|
|
||||||
margin-top:6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -83px no-repeat;
|
|
||||||
margin-left:10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-stop:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -83px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-previous {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -112px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-previous:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -112px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-next {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -141px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-next:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -29px -141px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group progress bar */
|
|
||||||
|
|
||||||
div.jp-progress {
|
|
||||||
overflow:hidden;
|
|
||||||
background-color: #ddd;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-progress {
|
|
||||||
position: absolute;
|
|
||||||
top:32px;
|
|
||||||
height:15px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-single div.jp-progress {
|
|
||||||
left:110px;
|
|
||||||
width:186px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-progress {
|
|
||||||
left:166px;
|
|
||||||
width:130px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-progress {
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
width:100%;
|
|
||||||
height:10px;
|
|
||||||
}
|
|
||||||
div.jp-seek-bar {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -202px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height:100%;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
div.jp-play-bar {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -218px repeat-x ;
|
|
||||||
width:0px;
|
|
||||||
height:100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The seeking class is added/removed inside jPlayer */
|
|
||||||
div.jp-seeking-bg {
|
|
||||||
background: url("jplayer.blue.monday.seeking.gif");
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group volume controls */
|
|
||||||
|
|
||||||
|
|
||||||
a.jp-mute,
|
|
||||||
a.jp-unmute,
|
|
||||||
a.jp-volume-max {
|
|
||||||
width:18px;
|
|
||||||
height:15px;
|
|
||||||
margin-top:12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio div.jp-type-single a.jp-mute,
|
|
||||||
div.jp-audio div.jp-type-single a.jp-unmute {
|
|
||||||
margin-left: 210px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist a.jp-mute,
|
|
||||||
div.jp-audio div.jp-type-playlist a.jp-unmute {
|
|
||||||
margin-left: 154px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream div.jp-type-single a.jp-mute,
|
|
||||||
div.jp-audio-stream div.jp-type-single a.jp-unmute {
|
|
||||||
margin-left:10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio a.jp-volume-max,
|
|
||||||
div.jp-audio-stream a.jp-volume-max {
|
|
||||||
margin-left: 56px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-mute,
|
|
||||||
div.jp-video a.jp-unmute,
|
|
||||||
div.jp-video a.jp-volume-max {
|
|
||||||
position: absolute;
|
|
||||||
top:12px;
|
|
||||||
margin-top:0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-mute,
|
|
||||||
div.jp-video a.jp-unmute {
|
|
||||||
left: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video a.jp-volume-max {
|
|
||||||
left: 134px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-mute {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-mute:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -19px -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-unmute {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -170px no-repeat;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
a.jp-unmute:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -79px -170px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-volume-max {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -186px no-repeat;
|
|
||||||
}
|
|
||||||
a.jp-volume-max:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -19px -186px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-volume-bar {
|
|
||||||
position: absolute;
|
|
||||||
overflow:hidden;
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -250px repeat-x;
|
|
||||||
width:46px;
|
|
||||||
height:5px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-volume-bar {
|
|
||||||
top:37px;
|
|
||||||
left:330px;
|
|
||||||
}
|
|
||||||
div.jp-audio-stream div.jp-volume-bar {
|
|
||||||
top:37px;
|
|
||||||
left:92px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-volume-bar {
|
|
||||||
top:17px;
|
|
||||||
left:72px;
|
|
||||||
}
|
|
||||||
div.jp-volume-bar-value {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -256px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height:5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group current time and duration */
|
|
||||||
|
|
||||||
div.jp-audio div.jp-time-holder {
|
|
||||||
position:absolute;
|
|
||||||
top:50px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-single div.jp-time-holder {
|
|
||||||
left:110px;
|
|
||||||
width:186px;
|
|
||||||
}
|
|
||||||
div.jp-audio div.jp-type-playlist div.jp-time-holder {
|
|
||||||
left:166px;
|
|
||||||
width:130px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-current-time,
|
|
||||||
div.jp-duration {
|
|
||||||
width:60px;
|
|
||||||
font-size:.64em;
|
|
||||||
font-style:oblique;
|
|
||||||
}
|
|
||||||
div.jp-current-time {
|
|
||||||
float: left;
|
|
||||||
display:inline;
|
|
||||||
}
|
|
||||||
div.jp-duration {
|
|
||||||
float: right;
|
|
||||||
display:inline;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video div.jp-current-time {
|
|
||||||
margin-left:20px;
|
|
||||||
}
|
|
||||||
div.jp-video div.jp-duration {
|
|
||||||
margin-right:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group playlist */
|
|
||||||
|
|
||||||
div.jp-title {
|
|
||||||
font-weight:bold;
|
|
||||||
text-align:center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-title,
|
|
||||||
div.jp-playlist {
|
|
||||||
width:100%;
|
|
||||||
background-color:#ccc;
|
|
||||||
border-top:1px solid #009be3;
|
|
||||||
}
|
|
||||||
div.jp-type-single div.jp-title,
|
|
||||||
div.jp-type-playlist div.jp-title,
|
|
||||||
div.jp-type-single div.jp-playlist {
|
|
||||||
border-top:none;
|
|
||||||
}
|
|
||||||
div.jp-title ul,
|
|
||||||
div.jp-playlist ul {
|
|
||||||
list-style-type:none;
|
|
||||||
margin:0;
|
|
||||||
padding:0 20px;
|
|
||||||
font-size:.72em;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-title li {
|
|
||||||
padding:5px 0;
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
div.jp-playlist li {
|
|
||||||
padding:5px 0 4px 20px;
|
|
||||||
border-bottom:1px solid #eee;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-playlist li div {
|
|
||||||
display:inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li:last-child {
|
|
||||||
padding:5px 0 5px 20px;
|
|
||||||
border-bottom:none;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
|
|
||||||
list-style-type:square;
|
|
||||||
list-style-position:inside;
|
|
||||||
padding-left:7px;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a {
|
|
||||||
color: #333;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a:hover {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-current {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {
|
|
||||||
float:right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
margin-right:10px;
|
|
||||||
font-weight:bold;
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media {
|
|
||||||
float:right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
margin-right:10px;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a{
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover{
|
|
||||||
color:#0d88c1;
|
|
||||||
}
|
|
||||||
span.jp-artist {
|
|
||||||
font-size:.8em;
|
|
||||||
color:#666;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
div.jp-video-play {
|
|
||||||
width:100%;
|
|
||||||
overflow:hidden; /* Important for nested negative margins to work in modern browsers */
|
|
||||||
cursor:pointer;
|
|
||||||
background-color:rgba(0,0,0,0); /* Makes IE9 work with the active area over the whole video area. IE6/7/8 only have the button as active area. */
|
|
||||||
}
|
|
||||||
div.jp-video-270p div.jp-video-play {
|
|
||||||
margin-top:-270px;
|
|
||||||
height:270px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p div.jp-video-play {
|
|
||||||
margin-top:-360px;
|
|
||||||
height:360px;
|
|
||||||
}
|
|
||||||
div.jp-video-full div.jp-video-play {
|
|
||||||
height:100%;
|
|
||||||
}
|
|
||||||
a.jp-video-play-icon {
|
|
||||||
position:relative;
|
|
||||||
display:block;
|
|
||||||
width: 112px;
|
|
||||||
height: 100px;
|
|
||||||
|
|
||||||
margin-left:-56px;
|
|
||||||
margin-top:-50px;
|
|
||||||
left:50%;
|
|
||||||
top:50%;
|
|
||||||
|
|
||||||
background: url("jplayer.blue.monday.video.play.png") 0 0 no-repeat;
|
|
||||||
text-indent:-9999px;
|
|
||||||
}
|
|
||||||
div.jp-video-play:hover a.jp-video-play-icon {
|
|
||||||
background: url("jplayer.blue.monday.video.play.png") 0 -100px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-jplayer audio,
|
|
||||||
div.jp-jplayer {
|
|
||||||
width:0px;
|
|
||||||
height:0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-jplayer {
|
|
||||||
background-color: #000000;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* @group TOGGLES */
|
|
||||||
|
|
||||||
/* The audio toggles are nested inside jp-time-holder */
|
|
||||||
|
|
||||||
ul.jp-toggles {
|
|
||||||
list-style-type:none;
|
|
||||||
padding:0;
|
|
||||||
margin:0 auto;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio .jp-type-single ul.jp-toggles {
|
|
||||||
width:25px;
|
|
||||||
}
|
|
||||||
div.jp-audio .jp-type-playlist ul.jp-toggles {
|
|
||||||
width:55px;
|
|
||||||
margin: 0;
|
|
||||||
position: absolute;
|
|
||||||
left: 325px;
|
|
||||||
top: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video ul.jp-toggles {
|
|
||||||
margin-top:10px;
|
|
||||||
width:100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li {
|
|
||||||
display:block;
|
|
||||||
float:right;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li a {
|
|
||||||
display:block;
|
|
||||||
width:25px;
|
|
||||||
height:18px;
|
|
||||||
text-indent:-9999px;
|
|
||||||
line-height:100%; /* need this for IE6 */
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-full-screen {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -310px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-full-screen:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -310px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-restore-screen {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -310px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-restore-screen:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -310px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat-off {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-repeat-off:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -290px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle {
|
|
||||||
background: url("jplayer.blue.monday.jpg") 0 -270px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -30px -270px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle-off {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -60px -270px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-shuffle-off:hover {
|
|
||||||
background: url("jplayer.blue.monday.jpg") -90px -270px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group NO SOLUTION error feedback */
|
|
||||||
|
|
||||||
.jp-no-solution {
|
|
||||||
padding:5px;
|
|
||||||
font-size:.8em;
|
|
||||||
background-color:#eee;
|
|
||||||
border:2px solid #009be3;
|
|
||||||
color:#000;
|
|
||||||
display:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution a {
|
|
||||||
color:#000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution span {
|
|
||||||
font-size:1em;
|
|
||||||
display:block;
|
|
||||||
text-align:center;
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
Before Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 17 KiB |
@ -1,40 +0,0 @@
|
|||||||
<div id="{{jquery_jplayer_id}}" class="jp-jplayer"></div>
|
|
||||||
<div id="{{jp_container_id}}" class="jp-audio">
|
|
||||||
<div class="jp-type-single">
|
|
||||||
<div class="jp-gui jp-interface">
|
|
||||||
<ul class="jp-controls">
|
|
||||||
<li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
|
|
||||||
</ul>
|
|
||||||
<div class="jp-progress">
|
|
||||||
<div class="jp-seek-bar">
|
|
||||||
<div class="jp-play-bar"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-volume-bar">
|
|
||||||
<div class="jp-volume-bar-value"></div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-time-holder">
|
|
||||||
<div class="jp-current-time"></div>
|
|
||||||
<div class="jp-duration"></div>
|
|
||||||
<ul class="jp-toggles">
|
|
||||||
<li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
|
|
||||||
<li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-title">
|
|
||||||
<ul>
|
|
||||||
<li>{{title}}</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution">
|
|
||||||
<span>Update Required</span>
|
|
||||||
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
@ -1,670 +0,0 @@
|
|||||||
/*
|
|
||||||
* Skin for jPlayer Plugin (jQuery JavaScript Library)
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Skin Name: Pink Flag
|
|
||||||
*
|
|
||||||
* Copyright (c) 2012 Happyworm Ltd
|
|
||||||
* Dual licensed under the MIT and GPL licenses.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
* - http://www.gnu.org/copyleft/gpl.html
|
|
||||||
*
|
|
||||||
* Author: Silvia Benvenuti
|
|
||||||
* Skin Version: 1.2 (jPlayer 2.2.0)
|
|
||||||
* Date: 22nd October 2012
|
|
||||||
*/
|
|
||||||
|
|
||||||
div.jp-audio,
|
|
||||||
div.jp-audio-stream,
|
|
||||||
div.jp-video {
|
|
||||||
|
|
||||||
/* Edit the font-size to counteract inherited font sizing.
|
|
||||||
* Eg. 1.25em = 1 / 0.8em
|
|
||||||
*/
|
|
||||||
|
|
||||||
font-size:1.25em; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */
|
|
||||||
|
|
||||||
font-family:Verdana, Arial, sans-serif;
|
|
||||||
line-height:1.6;
|
|
||||||
color: #fff;
|
|
||||||
border-top:1px solid #554461;
|
|
||||||
border-left:1px solid #554461;
|
|
||||||
border-right:1px solid #180a1f;
|
|
||||||
border-bottom:1px solid #180a1f;
|
|
||||||
background-color:#3a2a45;
|
|
||||||
}
|
|
||||||
div.jp-audio {
|
|
||||||
width:201px;
|
|
||||||
padding:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream {
|
|
||||||
width:101px;
|
|
||||||
padding:20px 20px 10px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-270p {
|
|
||||||
width:480px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p {
|
|
||||||
width:640px;
|
|
||||||
}
|
|
||||||
div.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width:480px;
|
|
||||||
height:270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position:static !important; position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
div.jp-video-full div div {
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video-full div.jp-gui {
|
|
||||||
position: fixed !important; position: static; /* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width:100%;
|
|
||||||
height:100%;
|
|
||||||
z-index:1001; /* 1 layer above the others. */
|
|
||||||
}
|
|
||||||
div.jp-video-full div.jp-interface {
|
|
||||||
position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface {
|
|
||||||
position: relative;
|
|
||||||
width:100%;
|
|
||||||
background-color:#3a2a45; /* Required for the full screen */
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-audio .jp-interface {
|
|
||||||
height: 80px;
|
|
||||||
padding-top:30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream .jp-interface {
|
|
||||||
height: 50px;
|
|
||||||
padding-top:30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @group CONTROLS */
|
|
||||||
|
|
||||||
div.jp-controls-holder {
|
|
||||||
clear: both;
|
|
||||||
width:440px;
|
|
||||||
margin:0 auto 10px auto;
|
|
||||||
position: relative;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0 0 no-repeat;
|
|
||||||
list-style-type:none;
|
|
||||||
padding: 1px 0 2px 1px;
|
|
||||||
overflow:hidden;
|
|
||||||
width: 201px;
|
|
||||||
height: 34px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-controls,
|
|
||||||
div.jp-audio-stream ul.jp-controls {
|
|
||||||
margin:0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream ul.jp-controls {
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video ul.jp-controls {
|
|
||||||
margin:0 0 0 115px;
|
|
||||||
float:left;
|
|
||||||
display:inline; /* need this to fix IE6 double margin */
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls li {
|
|
||||||
display:inline;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
div.jp-interface ul.jp-controls a {
|
|
||||||
display:block;
|
|
||||||
overflow:hidden;
|
|
||||||
text-indent:-9999px;
|
|
||||||
height: 34px;
|
|
||||||
margin: 0 1px 2px 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* @group single player controls */
|
|
||||||
|
|
||||||
div.jp-type-single .jp-controls li a{
|
|
||||||
width: 99px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-play {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -40px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-play:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -100px -40px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-pause {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -120px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-pause:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -100px -120px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The right border is normally in the ul background image. */
|
|
||||||
div.jp-audio-stream .jp-play,
|
|
||||||
div.jp-audio-stream .jp-pause {
|
|
||||||
border-right:1px solid #180920;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-stop {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -80px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-single .jp-stop:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -100px -80px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group playlist player controls */
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-controls li a{
|
|
||||||
width: 49px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-play {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -24px -40px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-play:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -124px -40px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-pause {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -24px -120px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-pause:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -124px -120px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-stop {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -24px -80px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-stop:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -124px -80px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-previous {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -24px -200px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-previous:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -124px -200px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-next {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -24px -160px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist .jp-next:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -124px -160px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* @group TOGGLES */
|
|
||||||
|
|
||||||
ul.jp-toggles {
|
|
||||||
list-style-type:none;
|
|
||||||
padding:0;
|
|
||||||
margin:0 auto;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-toggles {
|
|
||||||
width:55px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio .jp-type-single ul.jp-toggles {
|
|
||||||
width:25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video ul.jp-toggles {
|
|
||||||
width:100px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li{
|
|
||||||
display:block;
|
|
||||||
float:right;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.jp-toggles li a{
|
|
||||||
display:block;
|
|
||||||
width:25px;
|
|
||||||
height:18px;
|
|
||||||
text-indent:-9999px;
|
|
||||||
line-height:100%; /* need this for IE6 */
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-full-screen {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0 -420px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-full-screen:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -30px -420px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-restore-screen {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -60px -420px no-repeat;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-restore-screen:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -90px -420px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-repeat {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0 -440px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-repeat:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -30px -440px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-repeat-off {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -60px -440px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-repeat-off:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -90px -440px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-shuffle {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0 -460px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-shuffle:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -30px -460px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-shuffle-off {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -60px -460px no-repeat;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-shuffle-off:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -90px -460px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group progress bar */
|
|
||||||
|
|
||||||
/* The seeking class is added/removed inside jPlayer */
|
|
||||||
div.jp-seeking-bg {
|
|
||||||
background: url("jplayer.pink.flag.seeking.gif");
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-progress {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -240px no-repeat;
|
|
||||||
width: 197px;
|
|
||||||
height: 13px;
|
|
||||||
padding: 0 2px 2px 2px;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video .jp-progress {
|
|
||||||
border-top:1px solid #180a1f;
|
|
||||||
border-bottom: 1px solid #554560;
|
|
||||||
width:100%;
|
|
||||||
background-image: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-seek-bar {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -260px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height: 100%;
|
|
||||||
overflow:hidden;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-play-bar {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -280px repeat-x;
|
|
||||||
width:0px;
|
|
||||||
height: 100%;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group volume controls */
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-mute,
|
|
||||||
div.jp-interface ul.jp-controls a.jp-unmute,
|
|
||||||
div.jp-interface ul.jp-controls a.jp-volume-max {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -330px no-repeat;
|
|
||||||
position: absolute;
|
|
||||||
width: 16px;
|
|
||||||
height: 11px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-controls a.jp-mute,
|
|
||||||
div.jp-audio ul.jp-controls a.jp-unmute,
|
|
||||||
div.jp-audio-stream ul.jp-controls a.jp-mute,
|
|
||||||
div.jp-audio-stream ul.jp-controls a.jp-unmute {
|
|
||||||
top:-6px;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio ul.jp-controls a.jp-volume-max,
|
|
||||||
div.jp-audio-stream ul.jp-controls a.jp-volume-max {
|
|
||||||
top:-6px;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-video ul.jp-controls a.jp-mute,
|
|
||||||
div.jp-video ul.jp-controls a.jp-unmute {
|
|
||||||
left: 0;
|
|
||||||
top:14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video ul.jp-controls a.jp-volume-max {
|
|
||||||
left: 84px;
|
|
||||||
top:14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-mute:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -25px -330px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-unmute {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -60px -330px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-unmute:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -85px -330px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-volume-max {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -350px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-interface ul.jp-controls a.jp-volume-max:hover {
|
|
||||||
background: url("jplayer.pink.flag.jpg") -25px -350px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-volume-bar {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -300px repeat-x;
|
|
||||||
position: absolute;
|
|
||||||
width: 197px;
|
|
||||||
height: 4px;
|
|
||||||
padding: 2px 2px 1px 2px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-volume-bar:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-audio .jp-interface .jp-volume-bar,
|
|
||||||
div.jp-audio-stream .jp-interface .jp-volume-bar {
|
|
||||||
top:10px;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-audio-stream .jp-interface .jp-volume-bar {
|
|
||||||
width: 97px;
|
|
||||||
border-right:1px solid #180920;
|
|
||||||
padding-right:1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-video .jp-volume-bar {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width:95px;
|
|
||||||
border-right:1px solid #180920;
|
|
||||||
padding-right:1px;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-volume-bar-value {
|
|
||||||
background: url("jplayer.pink.flag.jpg") 0px -320px repeat-x;
|
|
||||||
height: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group current time and duration */
|
|
||||||
|
|
||||||
.jp-current-time, .jp-duration {
|
|
||||||
width:70px;
|
|
||||||
font-size:.5em;
|
|
||||||
color: #8c7a99;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-current-time {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-duration {
|
|
||||||
float: right;
|
|
||||||
text-align:right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video .jp-current-time {
|
|
||||||
padding-left:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video .jp-duration {
|
|
||||||
padding-right:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
/* @group playlist */
|
|
||||||
|
|
||||||
.jp-title ul,
|
|
||||||
.jp-playlist ul {
|
|
||||||
list-style-type:none;
|
|
||||||
font-size:.7em;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video .jp-title ul {
|
|
||||||
margin: 0 20px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video .jp-playlist ul {
|
|
||||||
margin: 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-title li,
|
|
||||||
.jp-playlist li {
|
|
||||||
position: relative;
|
|
||||||
padding: 2px 0;
|
|
||||||
border-top:1px solid #554461;
|
|
||||||
border-bottom:1px solid #180a1f;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-title li{
|
|
||||||
border-bottom:none;
|
|
||||||
border-top:none;
|
|
||||||
padding:0;
|
|
||||||
text-align:center;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li:first-child {
|
|
||||||
border-top:none;
|
|
||||||
padding-top:3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li:last-child {
|
|
||||||
border-bottom:none;
|
|
||||||
padding-bottom:3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a {
|
|
||||||
color: #fff;
|
|
||||||
text-decoration:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a:hover {
|
|
||||||
color: #e892e9;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
|
|
||||||
background-color: #26102e;
|
|
||||||
margin: 0 -20px;
|
|
||||||
padding: 2px 20px;
|
|
||||||
border-top: 1px solid #26102e;
|
|
||||||
border-bottom: 1px solid #26102e;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist li.jp-playlist-current a{
|
|
||||||
color: #e892e9;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {
|
|
||||||
float:right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
margin-left:10px;
|
|
||||||
font-weight:bold;
|
|
||||||
color:#8C7A99;
|
|
||||||
}
|
|
||||||
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {
|
|
||||||
color:#E892E9;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media {
|
|
||||||
float: right;
|
|
||||||
display:inline;
|
|
||||||
text-align:right;
|
|
||||||
color:#8C7A99;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a{
|
|
||||||
color:#8C7A99;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover{
|
|
||||||
color:#E892E9;
|
|
||||||
}
|
|
||||||
span.jp-artist {
|
|
||||||
font-size:.8em;
|
|
||||||
color:#8C7A99;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @end */
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-video div.jp-video-play {
|
|
||||||
width:100%;
|
|
||||||
overflow:hidden; /* Important for nested negative margins to work in modern browsers */
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
div.jp-video-270p div.jp-video-play {
|
|
||||||
margin-top:-270px;
|
|
||||||
height:270px;
|
|
||||||
}
|
|
||||||
div.jp-video-360p div.jp-video-play {
|
|
||||||
margin-top:-360px;
|
|
||||||
height:360px;
|
|
||||||
}
|
|
||||||
div.jp-video-full div.jp-video-play {
|
|
||||||
height:100%;
|
|
||||||
}
|
|
||||||
a.jp-video-play-icon {
|
|
||||||
position:relative;
|
|
||||||
display:block;
|
|
||||||
width: 112px;
|
|
||||||
height: 100px;
|
|
||||||
|
|
||||||
margin-left:-56px;
|
|
||||||
margin-top:-50px;
|
|
||||||
left:50%;
|
|
||||||
top:50%;
|
|
||||||
|
|
||||||
background: url("jplayer.pink.flag.video.play.png") 0 0 no-repeat;
|
|
||||||
text-indent:-9999px;
|
|
||||||
}
|
|
||||||
div.jp-video-play:hover a.jp-video-play-icon {
|
|
||||||
background: url("jplayer.pink.flag.video.play.png") 0 -100px no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
div.jp-jplayer audio,
|
|
||||||
div.jp-jplayer {
|
|
||||||
width:0px;
|
|
||||||
height:0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.jp-jplayer {
|
|
||||||
background-color: #000000;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* @group NO SOLUTION error feedback */
|
|
||||||
|
|
||||||
.jp-no-solution {
|
|
||||||
padding:5px;
|
|
||||||
font-size:.8em;
|
|
||||||
background-color:#3a2a45;
|
|
||||||
border-top:2px solid #554461;
|
|
||||||
border-left:2px solid #554461;
|
|
||||||
border-right:2px solid #180a1f;
|
|
||||||
border-bottom:2px solid #180a1f;
|
|
||||||
color:#FFF;
|
|
||||||
display:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution a {
|
|
||||||
color:#FFF;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-no-solution span {
|
|
||||||
font-size:1em;
|
|
||||||
display:block;
|
|
||||||
text-align:center;
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
/* @end */
|
|
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 17 KiB |