Saturday, March 13, 2010

Playing video over java applet

Hello guys ,

For those interested in playing youtube video or want to show webpage over applet can use this code,

Please note code is not commented well and users are requested to modify it accordingly.


<style>
html,body {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

color:#6A6666;
width:100%;
height:100%;
background-color: white;

margin:0px 0px 0px 0px;

padding:0px 0px 0px 0px;

overflow:hidden;


}
#ytapiplayer {display:block; width:560px; height:340px;
position:absolute;
top:100px; left:300px;
background:#000;
/* for IE
filter:alpha(opacity=0);
/* CSS3 standard
opacity:0;*/
z-index:1000; visibility:hidden;
}

#resizable {
background-color:black;
}
#framediv {
background-color:black;
}

.iframeclass{
position:absolute;
top:0;
left:0;
margin-top:0px;
margin-left:0px;
width:100%;
height:100%;
background-color:'black';
/* for IE
filter:alpha(opacity=0);
/* CSS3 standard
opacity:0; */
}
</style>

<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.4.2.js"></script>

<script>
//jquery only used for safari detection here
var isSafari=0;
var userAgent = navigator.userAgent.toLowerCase();
jQuery.each(jQuery.browser, function(i, val) {
if(i=="safari"&&($.browser.webkit)&&!(/chrome/.test(userAgent))){
isSafari=1;
}
});

function fnMinMax(obj,videoWidth,videoHeight){
if(obj.title=='Minimize'){
var sd = document.getElementById('resizable');
sd.style.visibility='hidden';
sd.style.display='none';
var shimmer=document.getElementById('shimmer');
shimmer.style.width=''+videoWidth+'px';
shimmer.style.height='20px';
obj.title='Maximize';
obj.innerHTML='Maximize';
}else{
var videoHeightNew=parseInt(videoHeight)+20;
var shimmer=document.getElementById('shimmer');
shimmer.style.width=''+videoWidth+'px';
shimmer.style.height=''+videoHeightNew+'px';
var player=document.getElementById('ytapiplayer');
shimmer.setAttribute('bgcolor','#000');
player.style.width=''+videoWidth+'px';
player.style.height=''+videoHeightNew+'px';
var sd = document.getElementById('resizable');
sd.style.visibility='visible';
sd.style.display='block';

obj.title='Minimize';
obj.innerHTML='Minimize';

}

}

function showPopUp(videoUrl,videoWidth,videoHeight,videoPosX,videoPosY){
if(videoUrl==''){
//videoUrl='http://www.youtube.com/v/UXQ8ym4ufeA&hl=en_US&fs=0&hd=0&autoplay=1&showsearch=0&iv_load_policy=3&rel=0';
}
if(videoWidth!=''&&videoHeight==''){
videoHeight=videoWidth*3/4;
}
if(videoWidth==''&&videoHeight!=''){
videoWidth=videoHeight*4/3;
}
if(videoWidth==''){
videoWidth='500';
}
if(videoHeight==''){
videoHeight='450';
}

if(!isSafari){
//if(document.getElementById('ytapiplayer').style.visibility=='visible'){
if(videoUrl==''){

var sd = document.getElementById('ytapiplayer');
sd.style.visibility='hidden';
sd.style.display='none';
sd.innerHTML='';
var shimmer = document.getElementById('shimmer');
document.body.removeChild(shimmer);

}else{
var shimmer = document.createElement('iframe');
shimmer.id='shimmer';
shimmer.style.position='absolute';
// normally you would get the dimensions and
// positions of the sub div dynamically. For demo
// purposes this is hardcoded
var shimmerWidth=parseInt(videoWidth);
var shimmerHeight=parseInt(videoHeight)+20;
shimmer.style.width=''+shimmerWidth+'px';
shimmer.style.height=''+shimmerHeight+'px';
shimmer.style.top='100px'; //we will change this later
shimmer.style.left='300px';//we will change this later
shimmer.style.zIndex='999';
shimmer.setAttribute('frameborder','0');
shimmer.setAttribute('bgcolor','#000');
shimmer.setAttribute('src','javascript:false');
document.body.appendChild(shimmer);
showdeadcenterdiv(videoPosX,videoPosY,'shimmer');//curently won't show at center for this uncomment code in this function and modeify top and left postion accordinglt
// make sub div visible
var sd = document.getElementById('ytapiplayer');
sd.innerHTML='';
var resizeW=parseInt(videoWidth)-5;
var resizeH=parseInt(videoHeight)-5;
sd.style.visibility='visible';
sd.style.display='block';
sd.style.width=''+shimmerWidth+'px';
sd.style.height=''+shimmerHeight+'px';
sd.innerHTML='<span style="margin-left:'+(videoWidth-140)+'px;margin-top:0px"><a href="javascript:void(0);" onclick="fnMinMax(this,'+videoWidth+','+videoHeight+')" style="color:#FFFFFF;text-decoration:none" title="Minimize">Minimize</a> <a href="javascript:void(0);" onclick="showPopUp(\'\',\'\',\'\',\'\',\'\')" style="color:#FFFFFF;text-decoration:none">CLose</a></span><div id="resizable" style="width:'+videoWidth+'px;height:'+videoHeight+'px;top:0px;left:0px" class="ui-state-active"><iframe src="'+videoUrl+'" width="98%" height="98%" frameborder="0"></iframe> </div>';
showdeadcenterdiv(videoPosX,videoPosY,'ytapiplayer');
$("#resizable").resizable({
containment: '#ytapiplayer'
});
}
}else{

var scrolledX, scrolledY;
if( self.pageYoffset ) {
scrolledX = self.pageXoffset;
scrolledY = self.pageYoffset;
} else if( document.documentElement && document.documentElement.scrolltop ) {
scrolledX = document.documentElement.scrollLeft;
scrolledY = document.documentElement.scrolltop;
} else if( document.body ) {
scrolledX = document.body.scrollLeft;
scrolledY = document.body.scrolltop;
}
if(typeof(scrolledX)=='undefined'){
scrolledX=0;
}
if(typeof(scrolledY)=='undefined'){
scrolledY=0;
}
// Next, determine the coordinates of the center of browser's window

var centerX, centerY;
if( self.innerHeight ) {
centerX = self.innerWidth;
centerY = self.innerHeight;
} else if( document.documentElement && document.documentElement.clientHeight ) {
centerX = document.documentElement.clientWidth;
centerY = document.documentElement.clientHeight;
} else if( document.body ) {
centerX = document.body.clientWidth;
centerY = document.body.clientHeight;
}

//if(document.getElementById('ytapiplayer').style.visibility=='visible'){
if(videoUrl==''){
var sd = document.getElementById('ytapiplayer');
sd.style.visibility='hidden';
sd.style.display='none';//even one hiding will do
sd.innerHTML='';
document.getElementById('appletdiv').style.width=scrolledX+centerX;
document.getElementById('appletdiv').style.height=scrolledY+centerY;
}else{
var leftoffset = scrolledX + (centerX - videoWidth);
var topoffset = scrolledY + (centerY - videoHeight);
document.getElementById('appletdiv').style.width=leftoffset;
//document.getElementById('appletdiv').style.height=topoffset;
var sd = document.getElementById('ytapiplayer');
sd.innerHTML='';
var resizeW=parseInt(videoWidth)-5;
var resizeH=parseInt(videoHeight)-5;
sd.style.visibility='visible';
sd.style.display='block';
sd.style.width=''+videoWidth+'px';
sd.style.height=''+videoHeight+'px';
sd.innerHTML='<span style="margin-left:'+(videoWidth-60)+'px;margin-top:0px"><a href="javascript:void(0);" onclick="showPopUp(\'\',\'\',\'\',\'\',\'\')" style="color:#FFFFFF;text-decoration:none">CLose</a></span><div id="resizable" style="width:'+videoWidth+'px;height:'+videoHeight+'px;top:0px;left:0px" class="ui-state-active"><iframe src="'+videoUrl+'" width="98%" height="98%" frameborder="0"></iframe> </div>';
sd.style.top=topoffset;
sd.style.left=leftoffset;
$("#resizable").resizable({
containment: '#ytapiplayer'
});
}

}

}

//Show at ur given position
function showdeadcenterdiv(Xpos,Ypos,divid) {
//unomment code below for showing div at dead center.
try{
// First, determine how much the visitor has scrolled
/*
var scrolledX, scrolledY;
if( self.pageYoffset ) {
scrolledX = self.pageXoffset;
scrolledY = self.pageYoffset;
} else if( document.documentElement && document.documentElement.scrolltop ) {
scrolledX = document.documentElement.scrollLeft;
scrolledY = document.documentElement.scrolltop;
} else if( document.body ) {
scrolledX = document.body.scrollLeft;
scrolledY = document.body.scrolltop;
}

if(typeof(scrolledX)=='undefined'){
scrolledX=0;
}
if(typeof(scrolledY)=='undefined'){
scrolledY=0;
}
// Next, determine the coordinates of the center of browser's window

var centerX, centerY;
if( self.innerHeight ) {
centerX = self.innerWidth;
centerY = self.innerHeight;
} else if( document.documentElement && document.documentElement.clientHeight ) {
centerX = document.documentElement.clientWidth;
centerY = document.documentElement.clientHeight;
} else if( document.body ) {
centerX = document.body.clientWidth;
centerY = document.body.clientHeight;
}

// Xwidth is the width of the div, Yheight is the height of the
// div passed as arguments to the function:
var leftoffset = scrolledX + (centerX - Xwidth) / 2;
var topoffset = scrolledY + (centerY - Yheight) / 2;
// The initial width and height of the div can be set in the
// style sheet with display:none; divid is passed as an argument to // the function
*/
if(Ypos==''){
Ypos='40';
}
if(Xpos==''){
Xpos='18';
}
var o=document.getElementById(divid);
var r=o.style;
r.position='absolute';
//r.top = topoffset + 'px';
//r.left = leftoffset + 'px';
r.top = Ypos+'px';
r.left = Xpos+'px';
r.display = "block";
}catch(err){

//alert(divid);

}
}
</script>


<div id="ytapiplayer" class="ui-widget-content">
<div id="resizable" >
</div>
</div>
<div id="appletdiv" style="width:100%;height:100%">

//Your applet code here.
</applet>

Simple Browser Java Installed or enabled detection script

Hello guys,

For those interested in simple java detection script .

here is the code.


//for mozilla ,chrome ,safari java checking
<script language="JavaScript" type="text/javascript">
// <![CDATA[

var isIE = "false";

var javawsInstalled = 0;

if (navigator.mimeTypes && navigator.mimeTypes.length) {
x = navigator.mimeTypes['application/x-java-jnlp-file'];//for firefox detection
if(x==null){

x = navigator.mimeTypes['application/x-java-vm'];//for chrome /safari
}
if(x==null){
x=navigator.mimeTypes['application/x-java-applet'];//for safari only if above fail
}
if (x) {
javawsInstalled = 1;
}
} else {
isIE = "true";
}
// ]]>
</script>

//for IE java checking
<script language="VBScript" type="text/vbscript">
// <![CDATA[
on error resume next
If isIE = "true" Then
If Not(IsObject(CreateObject("JavaWebStart.IsInstalled"))) Then
javawsInstalled = 0
Else
javawsInstalled = 1
End If
End If
// ]]>
</script>

//final alert script
<script language="Javascript" type="text/javascript">
if(!javawsInstalled){
alert('Write ur customized message to download java');//ask user to install java
}
else{
if(!navigator.javaEnabled()){
alert('Write ur customized message to enable java');//ask user to enable java from browser

}
}