@ -1,16 +0,0 @@ |
|||||||
<?xml version="1.0" encoding="UTF-8"?> |
|
||||||
<widget xmlns="http://www.w3.org/ns/widgets" |
|
||||||
xmlns:ub="http://uniboard.mnemis.com/widgets" |
|
||||||
id="http://uniboard.mnemis.com/widgets/webbrowser" |
|
||||||
version="1.1" |
|
||||||
width="900" |
|
||||||
height="500" |
|
||||||
ub:resizable="true"> |
|
||||||
|
|
||||||
<name>Choisir</name> |
|
||||||
<author href="http://www.getuniboard.com" |
|
||||||
email="info@mnemis.com">Mnemis SA</author> |
|
||||||
<description>Choisir widget</description> |
|
||||||
|
|
||||||
<content src="index.html"/> |
|
||||||
</widget> |
|
@ -1,148 +0,0 @@ |
|||||||
body{ |
|
||||||
width: 100%; |
|
||||||
padding: 0; |
|
||||||
height: auto; |
|
||||||
background-color: white; |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
|
|
||||||
.disclaimer{ |
|
||||||
width: 90%; |
|
||||||
height: 50px; |
|
||||||
position: absolute; |
|
||||||
left: 0; |
|
||||||
bottom: 0; |
|
||||||
margin-left: 1px; |
|
||||||
margin-right: 1px; |
|
||||||
margin-bottom: 0px; |
|
||||||
padding: 5px; |
|
||||||
text-align: center; |
|
||||||
background-color: #BBBBBB; |
|
||||||
-webkit-border-top-left-radius: 15px; |
|
||||||
-webkit-border-top-right-radius: 15px; |
|
||||||
border-top-left-radius: 15px; |
|
||||||
border-top-right-radius: 15px; |
|
||||||
border: solid 4px #EEEEEE; |
|
||||||
border-bottom: none; |
|
||||||
z-index: 10; |
|
||||||
} |
|
||||||
|
|
||||||
.search{ |
|
||||||
width: 90%; |
|
||||||
position: absolute; |
|
||||||
top: 0; |
|
||||||
left: 0; |
|
||||||
margin-left: 1px; |
|
||||||
margin-right: 1px; |
|
||||||
margin-top: 0px; |
|
||||||
padding: 5px; |
|
||||||
background-color: #BBBBBB; |
|
||||||
-webkit-border-bottom-left-radius: 15px; |
|
||||||
-webkit-border-bottom-right-radius: 15px; |
|
||||||
border-bottom-left-radius: 15px; |
|
||||||
border-bottom-right-radius: 15px; |
|
||||||
border: solid 4px #EEEEEE; |
|
||||||
border-top: none; |
|
||||||
z-index: 10; |
|
||||||
} |
|
||||||
|
|
||||||
.togglePages{ |
|
||||||
padding: 0; |
|
||||||
position: absolute; |
|
||||||
bottom: -14px; |
|
||||||
left: 43%; |
|
||||||
width: 15%; |
|
||||||
height: 10px; |
|
||||||
background-color: #666; |
|
||||||
-webkit-border-bottom-left-radius: 5px; |
|
||||||
-webkit-border-bottom-right-radius: 5px; |
|
||||||
border-bottom-left-radius: 5px; |
|
||||||
border-bottom-right-radius: 5px; |
|
||||||
-webkit-box-shadow: #dadada -1px 0 4px; |
|
||||||
box-shadow: #dadada -1px 0 4px; |
|
||||||
cursor: pointer; |
|
||||||
} |
|
||||||
|
|
||||||
.toggleIcon{ |
|
||||||
width: 14px; |
|
||||||
height: 10px; |
|
||||||
background-image: url(../images/trgUp.png); |
|
||||||
} |
|
||||||
|
|
||||||
.searchInput{ |
|
||||||
margin: 10px 5px 10px 5px; |
|
||||||
padding: 2px; |
|
||||||
padding-left: 8px; |
|
||||||
padding-right:8px; |
|
||||||
float: left; |
|
||||||
width: 60%; |
|
||||||
border-radius: 15px; |
|
||||||
border-style: none; |
|
||||||
} |
|
||||||
|
|
||||||
.searchButton{ |
|
||||||
width: 32px; |
|
||||||
height: 32px; |
|
||||||
margin: 5px 5px; |
|
||||||
background-image: url(../images/search.png); |
|
||||||
float: left; |
|
||||||
cursor: pointer; |
|
||||||
} |
|
||||||
|
|
||||||
.subSearch{ |
|
||||||
margin: 0; |
|
||||||
float: left; |
|
||||||
} |
|
||||||
|
|
||||||
#subSearchInput{ |
|
||||||
width: 100%; |
|
||||||
float: left; |
|
||||||
} |
|
||||||
|
|
||||||
.searchResult{ |
|
||||||
width: 98%; |
|
||||||
padding: 3px; |
|
||||||
background-color:#123456; |
|
||||||
} |
|
||||||
|
|
||||||
.videoContainer{ |
|
||||||
float: left; |
|
||||||
padding: 3px; |
|
||||||
margin: 3px; |
|
||||||
text-align: center; |
|
||||||
overflow: hidden; |
|
||||||
font-size: small; |
|
||||||
font-family: Verdana,Arial,Helvetica,sans-serif; |
|
||||||
border: 1px solid #666; |
|
||||||
border-radius: 5px; |
|
||||||
-webkit-box-shadow: #dadada -1px 0 4px; |
|
||||||
-webkit-border-radius: 5px; |
|
||||||
box-shadow: #666 -1px 0 4px; |
|
||||||
} |
|
||||||
|
|
||||||
.resultFooter{ |
|
||||||
float: left; |
|
||||||
margin: 5px; |
|
||||||
padding: 3px; |
|
||||||
width: 100%; |
|
||||||
font-family: Verdana,Arial,Helvetica,sans-serif; |
|
||||||
font-weight: bold; |
|
||||||
font-size: x-large; |
|
||||||
} |
|
||||||
|
|
||||||
#branding{ |
|
||||||
position: absolute; |
|
||||||
top: 0; |
|
||||||
left: 10px; |
|
||||||
z-index: 2; |
|
||||||
} |
|
||||||
|
|
||||||
span{ |
|
||||||
font-family: Verdana,Arial,Helvetica,sans-serif; |
|
||||||
color: #666; |
|
||||||
} |
|
||||||
|
|
||||||
[draggable] { |
|
||||||
-webkit-user-select: none; |
|
||||||
user-select: none; |
|
||||||
} |
|
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 214 B |
Before Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 931 B |
Before Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 475 B |
Before Width: | Height: | Size: 448 B |
Before Width: | Height: | Size: 1.2 KiB |
@ -1,279 +0,0 @@ |
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml"> |
|
||||||
<head> |
|
||||||
<title>Google Image Search</title> |
|
||||||
<link rel="stylesheet" type="text/css" href="css/basic.css"/> |
|
||||||
<script type="text/javascript" src="http://www.google.com/uds"></script> |
|
||||||
<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// This code generates a "Raw Searcher" to handle search queries. The Raw Searcher requires |
|
||||||
// you to handle and draw the search results manually. |
|
||||||
google.load('search', '1'); |
|
||||||
|
|
||||||
var videoSearch; |
|
||||||
var minHeight = 180; |
|
||||||
var minWidht = 150; |
|
||||||
var filtersDisplayed = false; //display or hide filters |
|
||||||
|
|
||||||
function addPaginationLinks() { |
|
||||||
|
|
||||||
// To paginate search results, use the cursor function. |
|
||||||
var cursor = videoSearch.cursor; |
|
||||||
var curPage = cursor.currentPageIndex; // check what page the app is on |
|
||||||
var pagesDiv = $("<div id='resultFooter' class='resultFooter'>"); |
|
||||||
for (var i = 0; i < cursor.pages.length; i++) { |
|
||||||
var page = cursor.pages[i]; |
|
||||||
if (curPage == i) { |
|
||||||
|
|
||||||
// If we are on the current page, then don't make a link. |
|
||||||
var label = document.createTextNode(' ' + page.label + ' '); |
|
||||||
pagesDiv.append($(label)); |
|
||||||
} else { |
|
||||||
|
|
||||||
// Create links to other pages using gotoPage() on the searcher. |
|
||||||
var link = document.createElement('a'); |
|
||||||
link.href = 'javascript:videoSearch.gotoPage('+i+');'; |
|
||||||
link.innerHTML = page.label; |
|
||||||
link.style.marginRight = '2px'; |
|
||||||
pagesDiv.append($(link)); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
pagesDiv.appendTo($('#searchResult')); |
|
||||||
|
|
||||||
$(".videoContainer").each(function(){ |
|
||||||
this.addEventListener("dragstart", imageDragging, false); |
|
||||||
}) |
|
||||||
|
|
||||||
$(".videoContainer").each(function(){ |
|
||||||
this.addEventListener("dragenter", imageDragenter, false); |
|
||||||
}) |
|
||||||
|
|
||||||
$(".videoContainer").each(function(){ |
|
||||||
this.addEventListener("dragleave", imageDragleave, false); |
|
||||||
}) |
|
||||||
|
|
||||||
$(".videoContainer").each(function(){ |
|
||||||
this.addEventListener("dragover", imageDragover, false); |
|
||||||
}) |
|
||||||
} |
|
||||||
|
|
||||||
function searchComplete() { |
|
||||||
|
|
||||||
// Check that we got results |
|
||||||
document.getElementById('searchResult').innerHTML = ''; |
|
||||||
if (videoSearch.results && videoSearch.results.length > 0) { |
|
||||||
|
|
||||||
var contentDiv = $('#searchResult').empty(); |
|
||||||
var results = videoSearch.results; |
|
||||||
for (var i = 0; i < results.length; i++) { |
|
||||||
|
|
||||||
// Create HTML elements for search results |
|
||||||
var result = results[i]; |
|
||||||
/*var str = videoSearch.results[i].playUrl.replace("&autoplay=1","").replace("&autoplay=true",""); |
|
||||||
alert(str) |
|
||||||
a.src = str + "&autoPlay=false"; |
|
||||||
a.type = "application/x-shockwave-flash";*/ |
|
||||||
|
|
||||||
// Append search results to the HTML nodes |
|
||||||
//p.appendChild(a); |
|
||||||
//document.body.appendChild(p); |
|
||||||
|
|
||||||
var videoContainer = $("<div class='videoContainer' draggable='true'>"); |
|
||||||
var title = document.createElement('div'); |
|
||||||
var vUrl = $("<input type='hidden'/>"); |
|
||||||
var vContent = $("<input type='hidden'/>"); |
|
||||||
var vHeight = $("<input type='hidden'/>"); |
|
||||||
var vWidth = $("<input type='hidden'/>"); |
|
||||||
var vTitle = $("<input type='hidden'/>"); |
|
||||||
var vAuthor = $("<input type='hidden'/>"); |
|
||||||
var vDuration = $("<input type='hidden'/>"); |
|
||||||
var vPublished = $("<input type='hidden'/>"); |
|
||||||
var vPublisher = $("<input type='hidden'/>"); |
|
||||||
var vRating = $("<input type='hidden'/>"); |
|
||||||
var vCount = $("<input type='hidden'/>"); |
|
||||||
|
|
||||||
// We use titleNoFormatting so that no HTML tags are left in the |
|
||||||
// title |
|
||||||
title.innerHTML = result.title; |
|
||||||
var newImg = document.createElement('img'); |
|
||||||
|
|
||||||
// There is also a result.url property which has the escaped version |
|
||||||
newImg.src = result.tbUrl; |
|
||||||
//var str = videoSearch.results[i].playUrl.replace("&autoplay=1","").replace("&autoplay=true",""); |
|
||||||
vUrl.attr("value", result.url); |
|
||||||
vContent.attr("value", result.content); |
|
||||||
vHeight.attr("value", result.tbHeight); |
|
||||||
vWidth.attr("value", result.tbWidth); |
|
||||||
vTitle.attr("value",result.titleNoFormatting); |
|
||||||
vAuthor.attr("value", result.author); |
|
||||||
vDuration.attr("value", result.duration); |
|
||||||
vPublished.attr("value", result.published); |
|
||||||
vPublisher.attr("value", result.publisher); |
|
||||||
vRating.attr("value",result.rating); |
|
||||||
vCount.attr("value",result.viewCount); |
|
||||||
//var imgWidth = (result.tbWidth > minWidht)?result.tbWidth:minWidht; |
|
||||||
//var imgHeight = (result.tbHeight > minHeight)?result.tbHeight:minHeight; |
|
||||||
videoContainer.width(minWidht).height(minHeight); |
|
||||||
videoContainer.append($(newImg)); |
|
||||||
videoContainer.append($(title)); |
|
||||||
videoContainer.append(vUrl); |
|
||||||
videoContainer.append(vContent); |
|
||||||
videoContainer.append(vHeight); |
|
||||||
videoContainer.append(vWidth); |
|
||||||
videoContainer.append(vTitle); |
|
||||||
videoContainer.append(vAuthor); |
|
||||||
videoContainer.append(vDuration); |
|
||||||
videoContainer.append(vPublished); |
|
||||||
videoContainer.append(vPublisher); |
|
||||||
videoContainer.append(vRating); |
|
||||||
videoContainer.append(vCount); |
|
||||||
|
|
||||||
// Put our title + image in the content |
|
||||||
videoContainer.appendTo(contentDiv); |
|
||||||
} |
|
||||||
|
|
||||||
addPaginationLinks(videoSearch); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
function onLoad() { |
|
||||||
// Create a VideoSearch instance. |
|
||||||
videoSearch = new google.search.VideoSearch(); |
|
||||||
|
|
||||||
// Set searchComplete as the callback function when a search is complete. The |
|
||||||
// videoSearch object will have results in it. |
|
||||||
videoSearch.setSearchCompleteCallback(this, searchComplete, null); |
|
||||||
|
|
||||||
videoSearch.setResultSetSize(8); |
|
||||||
|
|
||||||
// Include the required Google branding |
|
||||||
google.search.Search.getBranding('branding'); |
|
||||||
} |
|
||||||
|
|
||||||
// Set a callback to call your code when the page loads |
|
||||||
google.setOnLoadCallback(onLoad); |
|
||||||
|
|
||||||
function imageDragging(e){ |
|
||||||
e.dataTransfer.setData("text/plain",$(this).find("input:hidden").eq(0).val()); |
|
||||||
//alert($(this).find("input:hidden").val()); |
|
||||||
} |
|
||||||
|
|
||||||
function imageDragleave(e){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
function imageDragover(e){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
function imageDragenter(e){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
$(document).ready(function(){ |
|
||||||
|
|
||||||
//variables |
|
||||||
var mode = false; //search or view mode |
|
||||||
var hide = false; //hide or no main panel |
|
||||||
|
|
||||||
//basic containers and elements |
|
||||||
var disclaimer = $("<div id='disclaimer' class='disclaimer'>Disclaimer<div>").appendTo("body"); |
|
||||||
var search = $("<div id='search' class='search'>").appendTo("body"); |
|
||||||
|
|
||||||
disclaimer.width($("body").width()-20); |
|
||||||
search.width($("body").width()-20); |
|
||||||
|
|
||||||
var togglePages = $("<div id='togglePages' class='togglePages'>").appendTo(search); |
|
||||||
var toggleIcon = $("<div id='toggleIcon' class='toggleIcon'>").appendTo(togglePages).css("margin-left",(togglePages.width()/2 - 7)); |
|
||||||
|
|
||||||
var subSearchInput = $("<div id='subSearchInput' class='subSearch'>").appendTo(search); |
|
||||||
|
|
||||||
var searchInput = $("<input id='searchInput' class='searchInput' type='text'/>").appendTo(subSearchInput); |
|
||||||
var searchButton = $("<div id='searchButton' class='searchButton'>").appendTo(subSearchInput); |
|
||||||
|
|
||||||
togglePages.click(function(event){ |
|
||||||
if(mode){ |
|
||||||
hide = false; |
|
||||||
$("#search, #disclaimer").slideDown('slow', function(){ |
|
||||||
toggleIcon.css("background-image","url(images/trgUp.png)"); |
|
||||||
togglePages.appendTo("#search").css("top","").css("bottom","-14px"); |
|
||||||
}); |
|
||||||
mode = false; |
|
||||||
} else { |
|
||||||
hide = true; |
|
||||||
$("#search, #disclaimer").slideUp('slow', function(){ |
|
||||||
toggleIcon.css("background-image","url(images/trgDown.png)"); |
|
||||||
togglePages.appendTo("body").css("top","0"); |
|
||||||
}); |
|
||||||
mode = true; |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
searchButton.click(function(){ |
|
||||||
if(!hide){ |
|
||||||
videoSearch.execute(searchInput.val()); |
|
||||||
togglePages.trigger("click"); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
searchInput.keydown(function(event){ |
|
||||||
if(!hide){ |
|
||||||
if((event.keyCode == 0xA)||(event.keyCode == 0xD)){ |
|
||||||
videoSearch.execute(searchInput.val()); |
|
||||||
togglePages.trigger("click"); |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
$(".videoContainer").live("click",function(){ |
|
||||||
//alert(createMetaData($(this))); |
|
||||||
sankore.sendFileMetadata(createMetaData($(this))); |
|
||||||
}); |
|
||||||
|
|
||||||
$(window).resize(function(){ |
|
||||||
disclaimer.width($("body").width()-20); |
|
||||||
search.width($("body").width()-20); |
|
||||||
toggleIcon.css("margin-left",(togglePages.width()/2 - 7)); |
|
||||||
}) |
|
||||||
|
|
||||||
}); |
|
||||||
|
|
||||||
function createMetaData(parent){ |
|
||||||
var meta = ""; |
|
||||||
//alert($(this).find("input:hidden").eq(0).val()); |
|
||||||
meta = "<metadata><data><key>Type</key><value>Video</value></data><data><key>Url</key><value>" + |
|
||||||
parent.find("input:hidden").eq(0).val() + |
|
||||||
"</value></data><data><key>Content</key><value>" + |
|
||||||
parent.find("input:hidden").eq(1).val() + |
|
||||||
"</value></data><data><key>tbHeight</key><value>" + |
|
||||||
parent.find("input:hidden").eq(2).val() + |
|
||||||
"</value></data><data><key>tbWidth</key><value>" + |
|
||||||
parent.find("input:hidden").eq(3).val() + |
|
||||||
"</value></data><data><key>Title</key><value>" + |
|
||||||
parent.find("input:hidden").eq(4).val() + |
|
||||||
"</value></data><data><key>Author</key><value>" + |
|
||||||
parent.find("input:hidden").eq(5).val() + |
|
||||||
"</value></data><data><key>Duration</key><value>" + |
|
||||||
parent.find("input:hidden").eq(6).val() + |
|
||||||
"</value></data><data><key>Published</key><value>" + |
|
||||||
parent.find("input:hidden").eq(7).val() + |
|
||||||
"</value></data><data><key>Publisher</key><value>" + |
|
||||||
parent.find("input:hidden").eq(8).val() + |
|
||||||
"</value></data><data><key>Rating</key><value>" + |
|
||||||
parent.find("input:hidden").eq(9).val() + |
|
||||||
"</value></data><data><key>View count</key><value>" + |
|
||||||
parent.find("input:hidden").eq(10).val() + |
|
||||||
"</value></data></metadata>"; |
|
||||||
return meta; |
|
||||||
} |
|
||||||
|
|
||||||
</script> |
|
||||||
|
|
||||||
</head> |
|
||||||
<body style="font-family: Arial;border: 0 none;"> |
|
||||||
<div id="branding" style="float: left;"></div><br /> |
|
||||||
<div id="searchResult"></div> |
|
||||||
</body> |
|
||||||
</html> |
|