unknown
13 years ago
parent
1d8d0a42a4
commit
02a515b399
@ -0,0 +1,16 @@ |
||||
<?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> |
||||
@ -0,0 +1,148 @@ |
||||
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; |
||||
} |
||||
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 214 B |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 931 B |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 475 B |
|
After Width: | Height: | Size: 448 B |
|
After Width: | Height: | Size: 1.2 KiB |
@ -0,0 +1,279 @@ |
||||
<!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> |
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue