<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="js/jqp.js"></script>
<script>
function do_delete(t, vid_id) {
$.post('ajax.php',
{
do: 'delete_video',
video_id: vid_id
}
, function(data){
var d = data;
switch(d.error){
case '':
//success
$(t).parents('.vid').fadeOut();
break;
default:
alert('simple alert box! lol ^_^');
break;
}
}
, "json"
);
}
function do_position(d, embed_id, fixed_id){
$.post('ajax.php',
{
do: 'video_position',
position: $(d).val(),
fixed: (($('.'+fixed_id+':checked').val()!=null)?'true':'false'),
}
, function(data){
var d = data;
var od = $('.'+embed_id)
if(od.length){
od[0].value = d.code;
}
}
, "json"
);
}
$(function() {
$("a.tooltip").hover(function(e){
this.t = this.title;
this.title = "";
$("body").append("<p id='tooltip'>"+ this.t +"</p>");
$("#tooltip").css("top",(e.pageY - 10) + "px").css("left",(e.pageX + 20) + "px").fadeIn("fast");
},
function(){
this.title = this.t;
$("#tooltip").remove();
});
$("a.tooltip").mousemove(function(e){
$("#tooltip").css("top",(e.pageY - 10) + "px").css("left",(e.pageX + 20) + "px");
});
});
</script>
<style>
.container{
width : 600px;
margin: auto;
}
div.err .r{
color: red;
}
div.err{
padding-left: 85px;
padding-top: 25px;
font-weight : bold;
background-color : #FA697A;
width : 524px;
height : 45px;
border: #FD0000 solid 1px;
}
div.vid{
height : 100px;
margin-top: 10px;
margin-bottom: 10px;
}
div.vidname{
float : left;
width : 160px;
height : 60px;
}
div.embed textarea{
width : 250px;
}
div.embed{
float : left;
height : 60px;
width : 270px;
}
div.t4{
float : left;
line-height : 3.5em;
}
div.pic{
float : left;
width : 100px;
}
div.pic img{
border: black solid 2px;
}
#tooltip{
position:absolute;
border:1px solid #333;
background:#66FF99;
padding:2px 5px;
color:#333;
display:none;
}
</style>
</head>
<body>
<div class="container">
<div class="err">
<span class="r">Error:</span> .... etc.. etc...
</div>
<div class="videos">
<div class="vid">
<div class="pic">
<img src="pic.jpg" width="50" height="50" alt="" title="" />
</div>
<div class="vidname">
My First Video
</div>
<div class="embed">
Embed <br />
<textarea class="embed_1" wrap="virtual"><object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object></textarea>
<br />
<label>Position:
<select name="select" class="position" onchange="do_position(this, 'embed_1', 'fixed_1');">
<option value="none" selected>none</option>
<option value="top left">top left</option>
<option value="bottom left">bottom left</option>
<option value="top right">top right</option>
<option value="bottom right">bottom right</option>
</select>
</label>
<label><input name="fixed" class="fixed_1" type="checkbox"checked />Fixed</label> <a href="#" class="tooltip" title="help help help <br /> <b>testing</b> 1"><img src="img/help.gif" width="16" height="16" alt="" title="" style="border:0px;" /></a>
</div>
<div class="t4">
<a href="#" onclick="do_delete(this, 'vid_id!');">(Delete)</a>
</div>
</div>
<div style="clear:both;"></div>
<div class="vid">
<div class="pic">
<img src="pic.jpg" width="50" height="50" alt="" title="" />
</div>
<div class="vidname">
My Second Video
</div>
<div class="embed">
Embed <br />
<textarea class="embed_2" wrap="virtual"><object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object></textarea>
<br />
<label>Position:
<select name="select" class="position" onchange="do_position(this, 'embed_2', 'fixed_2');">
<option value="none" selected>none</option>
<option value="top left">top left</option>
<option value="bottom left">bottom left</option>
<option value="top right">top right</option>
<option value="bottom right">bottom right</option>
</select>
</label>
<label><input name="fixed" class="fixed_2" type="checkbox" checked />Fixed</label> <a href="#" class="tooltip" title="help help help <br /> <b>testing</b> 2"><img src="img/help.gif" width="16" height="16" alt="" title="" style="border:0px;" /></a>
</div>
<div class="t4">
<a href="#" onclick="do_delete(this, 'vid_id!');">(Delete)</a>
</div>
</div>
<div style="clear:both;"></div>
<div class="vid">
<div class="pic">
<img src="pic.jpg" width="50" height="50" alt="" title="" />
</div>
<div class="vidname">
My Third Video
</div>
<div class="embed">
Embed <br />
<textarea class="embed_3" cols="30" wrap="virtual"><object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/FtX8nswnUKU&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object></textarea>
<br />
<label>Position:
<select name="select" class="position" onchange="do_position(this, 'embed_3', 'fixed_3');">
<option value="none" selected>none</option>
<option value="top left">top left</option>
<option value="bottom left">bottom left</option>
<option value="top right">top right</option>
<option value="bottom right">bottom right</option>
</select>
</label>
<label><input name="fixed" class="fixed_3" type="checkbox"checked />Fixed</label> <a href="#" class="tooltip" title="help help help <br /> <b>testing</b> 3"><img src="img/help.gif" width="16" height="16" alt="" title="" style="border:0px;" /></a>
</div>
<div class="t4">
<a href="#" onclick="do_delete(this, 'vid_id!');">(Delete)</a>
</div>
</div>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>