<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Video Picker</title> <link rel="stylesheet" type="text/css" href="css/main.css"> <script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script> <script src="scripts/jquery.oembed.js" type="text/javascript"></script> <!--DEFAULT FR--> </head> <body> <script type="text/javascript"> var oembedUrl = ""; var language = "en"; function initialize() { if(window.uniboard){ oembedUrl = window.uniboard.preference("oembedUrl", ""); }else{ oembedUrl = ""; }; if(oembedUrl.length > 0){ $("#textbox").val(oembedUrl); $("#search-button").trigger("click"); }else{ //var language = navigator.userAgent.split(";"); //language = language[3].replace(/\s/g, "").substr(0, 2); $("#embeded-content").load("locales/" + language + "/howto.html"); // Welcome note with some explanations }; }; $(document).ready(function(){ var resizer; // Timer var resizerIndex; resizerIndex = 0; //language = navigator.userAgent.split(";"); //language = language[3].replace(/\s/g, "").substr(0, 2); $("#search-button") .click(function(){ window.resizeTo(385, 80); $("#container") .removeClass("welcome") .removeClass("change") .removeClass("error") .addClass("load"); $("#container-shadow") .hide(); $("#arrow") .hide(); $("#embeded-content") .css({ marginLeft:-9000, marginTop:-9000 }) .empty() .oembed($("#textbox").val()); checkcontent(); }) .mouseenter(function(){ $(this) .addClass("over"); }) .mouseleave(function(){ $(this) .removeClass("over"); }); /*$("#ubwidget").mouseenter(function(){ $("#show-area").fadeIn(1000); }); $("#ubwidget").mouseout(function(){ $("#show-area").fadeOut(600); });*/ $('#textbox').keypress(function(e){ if (e.which == 13){ $('#search-button').click(); }; }); $("#show-inputfield-button") .click( function(){ $("#show-area").fadeOut(0); $("#inputfield").show(); $("#shadow").show(); $("#container") .removeClass("show").addClass("change"); adaptWidgetSize(18, 88); }) .mouseenter(function(){ $(this) .addClass("over"); }) .mouseleave(function(){ $(this) .removeClass("over"); }); function checkcontent(){ if($("#embeded-content").html().length != 0 && $("#embeded-content").children(":first").width() > 0){ clearTimeout(resizer); resizerIndex = 0; if(window.uniboard){ window.uniboard.setPreference("oembedUrl", $("#textbox").val()); }; $("#inputfield") .hide(); $("#shadow") .hide(); $("#embeded-content") .css({ marginLeft:0, marginTop:0 }) .width($("#embeded-content").children(":first").width()) .height($("#embeded-content").children(":first").height()); $("#container") .removeClass("load").addClass("show"); $("#show-area") .fadeIn(2000) .css({ left:$("#embeded-content").children(":first").width()-25, top:($("#embeded-content").children(":first").height()-35)/2 }); adaptWidgetSize(5, 13); return false; }; if(resizerIndex > 30){ resizerIndex = 0; $("#container") .removeClass("show").addClass("error"); $("#arrow") .show(); $("#embeded-content") .css({ marginTop:0, marginLeft:0 }) .width(395) .load("locales/" + language + "/error.html", function(){ adaptWidgetSize(20, 125); }); $("#container-shadow") .show(); }else{ resizer = setTimeout(function(){checkcontent()}, 100); resizerIndex++; }; }; function adaptWidgetSize(adjustmentX, adjustmentY){ var margins = { top: cssToInt($("body").css("margin-top")), right: cssToInt($("body").css("margin-right")), bottom: cssToInt($("body").css("margin-bottom")), left: cssToInt($("body").css("margin-left")) }; var widgetWidth = $("#embeded-content").width() + margins.right + margins.left + adjustmentX; var widgetHeight = $("#embeded-content").position().top + $("#embeded-content").height() + margins.bottom + adjustmentY; window.resizeTo(widgetWidth, $(window).height()); window.resizeTo($(window).width(), widgetHeight); window.uniboard.resize(widgetWidth, widgetHeight); }; function cssToInt(cssvalue){ return(parseInt(cssvalue.replace("px", ""))); }; if (window.widget) { window.widget.onremove = function(){ //$("#show-inputfield-button").trigger("click"); $("#embeded-content") .empty() .oembed($("#textbox").val()); } } window.initialize(); }); </script> <div id="ubwidget"> <div id="shadow"></div> <div id="inputfield"> <input id="textbox" type="text"> <div id="search-button" class="button">Show</div> </div> <div id="container" class="welcome"> <div id="arrow"><img src="imgs/arrow.png" alt="arrow-top"></div> <div id="show-container"> <div id="embeded-content"></div> <div id="show-area"> <img id="show-inputfield-button" src="imgs/bts.png"> </div> </div> <table cellspacing="0" cellpadding="0" id="container-shadow"> <tr> <td id="shadow-left"></td> <td id="shadow-center"> </td> <td id="shadow-right"></td> </tr> </table> </div> </div> </body> </html>