Skip to content

O
OpenBoard
Commit 0bd4844f authored by unknown's avatar unknown
Browse files
Options

fixed google image search

parent be1d2bcc
Hide whitespace changes
Inline Side-by-side
Showing with 23 additions and 422 deletions
resources/library/search/Google images.wgs/config.xml
View file @ 0bd4844f
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<name>Choisir</name> <name>Choisir</name>
<author href="http://www.getuniboard.com" <author href="http://www.getuniboard.com"
email="info@mnemis.com">Mnemis SA</author> email="info@mnemis.com">Mnemis SA</author>
<description>Choisir widget</description> <description>Google Image Search</description>
<content src="index.html"/> <content src="index.html"/>
</widget> </widget>
resources/library/search/Google images.wgs/css/basic.css
View file @ 0bd4844f
...@@ -6,15 +6,6 @@ html, body{ ...@@ -6,15 +6,6 @@ html, body{
margin: 0; margin: 0;
} }
a {html, body{
width: 100%;
padding: 0;
height: auto;
background-color: white;
margin: 0;
}
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 14px; width: 14px;
background-color:white; background-color:white;
...@@ -48,49 +39,36 @@ a {html, body{ ...@@ -48,49 +39,36 @@ a {html, body{
} }
a { a {
text-decoration: none; text-decoration: underline;
} }
.disclaimer{ .disclaimer{
height: auto; height: auto;
position: fixed; position: fixed;
left: 0; left: 0;
bottom: 0; bottom: 0;
margin-left: 1px;
margin-right: 1px;
margin-bottom: 0px;
padding: 5px; padding: 5px;
text-align: center; text-align: center;
background-color: #BBBBBB; background-color: #BBBBBB;
-webkit-border-top-left-radius: 15px; border-top: solid 4px #EEEEEE;
-webkit-border-top-right-radius: 15px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
border: solid 4px #EEEEEE;
border-bottom: none; border-bottom: none;
z-index: 10;
font-size: 12px; font-size: 12px;
} }
#searchResult { #searchResult {
overflow: hidden; overflow: hidden;
text-align: center; text-align: center;
margin-top: 50px;
margin-bottom: 50px;
} }
.search{ .search{
width: 90%;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
padding: 5px; padding: 5px;
background-color: #BBBBBB; background-color: #BBBBBB;
-webkit-border-bottom-left-radius: 15px; border-bottom: solid 4px #EEEEEE;
-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: 101;
} }
.search, .search,
...@@ -100,25 +78,6 @@ a { ...@@ -100,25 +78,6 @@ a {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
} }
.togglePages{
padding: 0;
position: absolute;
bottom: -19px;
left: 40%;
width: 22%;
height: 15px;
background-color: #666;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
-webkit-box-shadow: #dadada -1px 0 4px;
box-shadow: #dadada -1px 0 4px;
cursor: pointer;
z-index: 100;
text-align: center;
}
.toggleIcon{ .toggleIcon{
display: inline-block; display: inline-block;
width: 14px; width: 14px;
...@@ -175,6 +134,7 @@ a { ...@@ -175,6 +134,7 @@ a {
.searchResult{ .searchResult{
width: 98%; width: 98%;
padding: 3px; padding: 3px;
background-color:#123456; background-color:#123456;
} }
...@@ -186,367 +146,13 @@ a { ...@@ -186,367 +146,13 @@ a {
overflow: hidden; overflow: hidden;
font-size: small; font-size: small;
font-family: Verdana,Arial,Helvetica,sans-serif; 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;
vertical-align: top; vertical-align: top;
} }
.resultFooter{ .resultFooter{
float: left;
margin: 5px;
padding: 3px;
width: 100%;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-weight: bold;
font-size: x-large;
text-align: center;
}
#branding{
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
.filterContainer{
float: left;
margin: 2px;
padding: 2px;
font-size: 14px;
}
.filterSelect{
border-style:none;
-webkit-border-top-right-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-bottomright: 15px;
border-top-right-radius: 15px;
margin-top: 2px;
width: 100%;
}
span{
font-family: Verdana,Arial,Helvetica,sans-serif;
color: #666;
}
[draggable] {
-webkit-user-select: none;
user-select: none;
}
.toggleFilters{
margin: 0;
padding: 0;
background-position: center;
background-image: url(../images/down.png);
position: absolute;
top: 11px;
right: 6px;
width: 20px;
height: 20px;
cursor: pointer;
}
.colors_line {
float: left;
margin: 4px;
margin-right: 0;
clear: left;
}
.custom {
opacity: 0;
position: absolute;
left: -10000px;
}
.filter_button.button.color {
display: inline-block;
width: 15px;
height: 15px;
border: 1px solid #EBEBEB;
padding: 0;
margin: 0;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.filter_button.button.color:hover {
border: 1px solid rgb(128,128,128);
cursor: pointer;
}
input[type="radio"]:checked + .filter_button.button.color {
border: 1px solid rgb(255,255,255);
box-shadow: 0 0 0px 1px #000;
-webkit-box-shadow: 0 0 0px 1px #000;
}
#allcolor {
background: white url('../images/search_app.png') -43px -144px no-repeat;
}
#colored {
background: white url('../images/search_app.png') -43px -244px no-repeat;
}
#grayed {
background: white url('../images/search_app.png') -45px -343px no-repeat;
}
#black{
background-color:#ffffff;
}
#blue{
background-color:#0000FF;
}
#brown{
background-color:rgba(139, 82, 16, 1);
}
#gray{
background-color:#999999;
}
#green{
background-color:#00CC00;
}
#orange{
background-color:#FB940B;
}
#pink{
background-color:#FF98BF;
}
#purple{
background-color:#762CA7;
}
#red{
background-color:#CC0000;
}
#teal{
background-color:#03C0C6;
}
#white{
background-color:#000000;
}
#yellow{
background-color:#FFFF00;
}
.selectBox-dropdown, .selectBox-options li a {
line-height: 1.3 !important;
font-size: 13px;
}
.pager_button {
padding: 3px 5px;
font-size: 16px;
color: black;
display: inline-block;
}
.pager_button.active {
border-radius: 3px;
-webkit-border-radius: 3px;
background-color: gray;
color: white;
}
text-decoration: none;
}
::-webkit-scrollbar {
width: 14px;
background-color:white;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color:lightgray;
border: 2px solid gray;
}
::-webkit-scrollbar-button:vertical:start{
border-radius: 10px;
background-color:lightgray;
background-image: url(../images/trgUp.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
::-webkit-scrollbar-button:vertical:end{
border-radius: 10px;
background-color:lightgray;
background-image: url(../images/trgDown.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
.disclaimer{
height: auto;
position: fixed;
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;
font-size: 12px;
}
#searchResult {
overflow: hidden;
text-align: center;
}
.search{
width: 90%;
position: fixed; position: fixed;
top: 0;
left: 0; left: 0;
padding: 5px; bottom: 50px;
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: 101;
}
.search,
.disclaimer {
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.togglePages{
padding: 0;
position: absolute;
bottom: -19px;
left: 40%;
width: 22%;
height: 15px;
background-color: #666;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
-webkit-box-shadow: #dadada -1px 0 4px;
box-shadow: #dadada -1px 0 4px;
cursor: pointer;
z-index: 100;
text-align: center;
}
.toggleIcon{
display: inline-block;
width: 14px;
height: 14px;
background: url(../images/trgUp.png) 50% no-repeat;
}
.searchInput{
padding: 3px;
float: left;
width: 100%;
border-radius: 3px;
border-style: none;
height: 22px;
line-height: 18px;
vertical-align: middle;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.searchButton{
background: url("../images/search_app.png") -38px -38px no-repeat;
width: 24px;
height: 24px;
overflow: hidden;
position: absolute;
right: 30px;
top: 9px;
margin-left: -2px;
cursor: pointer;
}
.subSearch{
margin: 0;
float: left;
}
#subSearchInput{
width: 100%;
float: left;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 5px;
padding-right: 26px;
}
#subSearchFilter{
width: 100%;
float: left;
display: none;
}
.searchResult{
width: 98%;
padding: 3px;
background-color:#123456;
}
.imgContainer{
display: inline-block;
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;
vertical-align: top;
}
.resultFooter{
float: left;
margin: 5px; margin: 5px;
padding: 3px; padding: 3px;
width: 100%; width: 100%;
...@@ -554,13 +160,7 @@ input[type="radio"]:checked + .filter_button.button.color { ...@@ -554,13 +160,7 @@ input[type="radio"]:checked + .filter_button.button.color {
font-weight: bold; font-weight: bold;
font-size: x-large; font-size: x-large;
text-align: center; text-align: center;
} background-color: white;
#branding{
position: absolute;
top: 0;
left: 0;
z-index: 2;
} }
.filterContainer{ .filterContainer{
......
resources/library/search/Google images.wgs/index.html
View file @ 0bd4844f
...@@ -66,7 +66,7 @@ ...@@ -66,7 +66,7 @@
// For each result write it's title and image to the screen // For each result write it's title and image to the screen
var result = results[i]; var result = results[i];
var imgContainer = $("<div class='imgContainer' draggable='true'>"); var imgContainer = $("<div class='imgContainer' draggable='true'>");
var title = document.createElement('div'); //var title = document.createElement('div');
var iUrl = $("<input type='hidden'/>"); var iUrl = $("<input type='hidden'/>");
var iContent = $("<input type='hidden'/>"); var iContent = $("<input type='hidden'/>");
var iHeight = $("<input type='hidden'/>"); var iHeight = $("<input type='hidden'/>");
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
// We use titleNoFormatting so that no HTML tags are left in the // We use titleNoFormatting so that no HTML tags are left in the
// title // title
title.innerHTML = result.title; //title.innerHTML = result.title;
var newImg = document.createElement('img'); var newImg = document.createElement('img');
// There is also a result.url property which has the escaped version // There is also a result.url property which has the escaped version
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
var imgHeight = (result.tbHeight > minHeight)?result.tbHeight:minHeight; var imgHeight = (result.tbHeight > minHeight)?result.tbHeight:minHeight;
imgContainer.width(imgWidth).height(imgHeight); imgContainer.width(imgWidth).height(imgHeight);
imgContainer.append($(newImg)); imgContainer.append($(newImg));
imgContainer.append($(title)); //imgContainer.append($(title));
imgContainer.append(iUrl); imgContainer.append(iUrl);
imgContainer.append(iContent); imgContainer.append(iContent);
imgContainer.append(iHeight); imgContainer.append(iHeight);
...@@ -164,8 +164,8 @@ ...@@ -164,8 +164,8 @@
var search = $("<div id='search' class='search'>").appendTo("body"); var search = $("<div id='search' class='search'>").appendTo("body");
var togglePages = $("<div id='togglePages' class='togglePages'>").appendTo(search); //var togglePages = $("<div id='togglePages' class='togglePages'>").appendTo(search);
var toggleIcon = $("<div id='toggleIcon' class='toggleIcon'>").appendTo(togglePages); //var toggleIcon = $("<div id='toggleIcon' class='toggleIcon'>").appendTo(togglePages);
var subSearchInput = $("<div id='subSearchInput' class='subSearch'>").appendTo(search); var subSearchInput = $("<div id='subSearchInput' class='subSearch'>").appendTo(search);
var subSearchFilter = $("<div id='subSearchFilter' class='subSearch'>").appendTo(search); var subSearchFilter = $("<div id='subSearchFilter' class='subSearch'>").appendTo(search);
...@@ -245,16 +245,18 @@ ...@@ -245,16 +245,18 @@
toggleFilters.click(function(){ toggleFilters.click(function(){
if(filtersDisplayed){ if(filtersDisplayed){
subSearchFilter.hide(); subSearchFilter.hide();
//$("#search").height(46);
toggleFilters.css("background-image","url(images/down.png)"); toggleFilters.css("background-image","url(images/down.png)");
filtersDisplayed = false; filtersDisplayed = false;
} else { } else {
//$("#search").height(120);
subSearchFilter.show(); subSearchFilter.show();
toggleFilters.css("background-image","url(images/up.png)"); toggleFilters.css("background-image","url(images/up.png)");
filtersDisplayed = true; filtersDisplayed = true;
} }
}); });
togglePages.click(function(event){ /*togglePages.click(function(event){
if(mode){ if(mode){
hide = false; hide = false;
$("#search, #disclaimer").slideDown('fast', function(){ $("#search, #disclaimer").slideDown('fast', function(){
...@@ -270,12 +272,12 @@ ...@@ -270,12 +272,12 @@
}); });
mode = true; mode = true;
} }
}); });*/
searchButton.click(function(){ searchButton.click(function(){
if(!hide){ if(!hide){
checkFilters(imageSearch).execute(searchInput.val()); checkFilters(imageSearch).execute(searchInput.val());
togglePages.trigger("click"); //togglePages.trigger("click");
} }
}); });
...@@ -283,7 +285,7 @@ ...@@ -283,7 +285,7 @@
if(!hide){ if(!hide){
if((event.keyCode == 0xA)||(event.keyCode == 0xD)){ if((event.keyCode == 0xA)||(event.keyCode == 0xD)){
checkFilters(imageSearch).execute(searchInput.val()); checkFilters(imageSearch).execute(searchInput.val());
togglePages.trigger("click"); //togglePages.trigger("click");
} }
} }
...@@ -463,7 +465,6 @@ ...@@ -463,7 +465,6 @@
</head> </head>
<body style="font-family: Arial;border: 0 none;"> <body style="font-family: Arial;border: 0 none;">
<div id="branding" style="float: left;"></div><br />
<div id="searchResult"></div> <div id="searchResult"></div>
</body> </body>
</html> </html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment