Merge pull request #436 from ZeroCool940711/master

Improved the Image search page to have bigger thumbnails, use a more area for results and have a smaller sidebar.
pull/440/head
Michael Christen 3 years ago committed by GitHub
commit 7abfeb221b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -258,8 +258,8 @@ tt, *.tt {
.thumbcontainer { .thumbcontainer {
margin: 2px; margin: 2px;
width: 128px; width: 256px;
height: 128px; /* 96px thumbnail + some lines of text */ height: 256px; /* 96px thumbnail + some lines of text */
float: left; float: left;
/* Cut non square images not rendered by YaCy ViewImage */ /* Cut non square images not rendered by YaCy ViewImage */
overflow: hidden; overflow: hidden;
@ -600,10 +600,10 @@ ul.SubMenu a.MenuItemLink {
a.thumblink { a.thumblink {
display:block; display:block;
width: 128px; width: 256px;
height: 128px; height: 256px;
margin: 2px; margin: 2px;
line-height: 128px; line-height: 256px;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
} }

@ -33,6 +33,7 @@ body {
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.sidebar { .sidebar {
width: 15%;
position: fixed; position: fixed;
top: 61px; top: 61px;
bottom: 0; bottom: 0;
@ -131,4 +132,6 @@ ul.nav li.dropdown:hover ul.dropdown-menu{
} }
.col-md-9 { .col-md-9 {
overflow-x: hidden; overflow-x: hidden;
margin-left: 15%;
width: 85%;
} }

@ -1696,7 +1696,7 @@ pre code {
width: 83.33333333%; width: 83.33333333%;
} }
.col-xs-9 { .col-xs-9 {
width: 75%; width: 85%;
} }
.col-xs-8 { .col-xs-8 {
width: 66.66666667%; width: 66.66666667%;
@ -1714,7 +1714,7 @@ pre code {
width: 33.33333333%; width: 33.33333333%;
} }
.col-xs-3 { .col-xs-3 {
width: 25%; width: 15%;
} }
.col-xs-2 { .col-xs-2 {
width: 16.66666667%; width: 16.66666667%;
@ -1732,7 +1732,7 @@ pre code {
right: 83.33333333%; right: 83.33333333%;
} }
.col-xs-pull-9 { .col-xs-pull-9 {
right: 75%; right: 85%;
} }
.col-xs-pull-8 { .col-xs-pull-8 {
right: 66.66666667%; right: 66.66666667%;
@ -1771,7 +1771,7 @@ pre code {
left: 83.33333333%; left: 83.33333333%;
} }
.col-xs-push-9 { .col-xs-push-9 {
left: 75%; left: 85%;
} }
.col-xs-push-8 { .col-xs-push-8 {
left: 66.66666667%; left: 66.66666667%;
@ -1810,7 +1810,7 @@ pre code {
margin-left: 83.33333333%; margin-left: 83.33333333%;
} }
.col-xs-offset-9 { .col-xs-offset-9 {
margin-left: 75%; margin-left: 85%;
} }
.col-xs-offset-8 { .col-xs-offset-8 {
margin-left: 66.66666667%; margin-left: 66.66666667%;
@ -1828,7 +1828,7 @@ pre code {
margin-left: 33.33333333%; margin-left: 33.33333333%;
} }
.col-xs-offset-3 { .col-xs-offset-3 {
margin-left: 25%; margin-left: 15%;
} }
.col-xs-offset-2 { .col-xs-offset-2 {
margin-left: 16.66666667%; margin-left: 16.66666667%;
@ -1864,7 +1864,7 @@ pre code {
width: 83.33333333%; width: 83.33333333%;
} }
.col-sm-9 { .col-sm-9 {
width: 75%; width: 85%;
} }
.col-sm-8 { .col-sm-8 {
width: 66.66666667%; width: 66.66666667%;
@ -1882,7 +1882,7 @@ pre code {
width: 33.33333333%; width: 33.33333333%;
} }
.col-sm-3 { .col-sm-3 {
width: 25%; width: 15%;
} }
.col-sm-2 { .col-sm-2 {
width: 16.66666667%; width: 16.66666667%;
@ -1900,7 +1900,7 @@ pre code {
right: 83.33333333%; right: 83.33333333%;
} }
.col-sm-pull-9 { .col-sm-pull-9 {
right: 75%; right: 85%;
} }
.col-sm-pull-8 { .col-sm-pull-8 {
right: 66.66666667%; right: 66.66666667%;
@ -1939,7 +1939,7 @@ pre code {
left: 83.33333333%; left: 83.33333333%;
} }
.col-sm-push-9 { .col-sm-push-9 {
left: 75%; left: 85%;
} }
.col-sm-push-8 { .col-sm-push-8 {
left: 66.66666667%; left: 66.66666667%;
@ -1978,7 +1978,7 @@ pre code {
margin-left: 83.33333333%; margin-left: 83.33333333%;
} }
.col-sm-offset-9 { .col-sm-offset-9 {
margin-left: 75%; margin-left: 85%;
} }
.col-sm-offset-8 { .col-sm-offset-8 {
margin-left: 66.66666667%; margin-left: 66.66666667%;
@ -2033,7 +2033,7 @@ pre code {
width: 83.33333333%; width: 83.33333333%;
} }
.col-md-9 { .col-md-9 {
width: 75%; width: 85%;
} }
.col-md-8 { .col-md-8 {
width: 66.66666667%; width: 66.66666667%;
@ -2051,7 +2051,7 @@ pre code {
width: 33.33333333%; width: 33.33333333%;
} }
.col-md-3 { .col-md-3 {
width: 25%; width: 15%;
} }
.col-md-2 { .col-md-2 {
width: 16.66666667%; width: 16.66666667%;
@ -2069,7 +2069,7 @@ pre code {
right: 83.33333333%; right: 83.33333333%;
} }
.col-md-pull-9 { .col-md-pull-9 {
right: 75%; right: 85%;
} }
.col-md-pull-8 { .col-md-pull-8 {
right: 66.66666667%; right: 66.66666667%;
@ -2108,7 +2108,7 @@ pre code {
left: 83.33333333%; left: 83.33333333%;
} }
.col-md-push-9 { .col-md-push-9 {
left: 75%; left: 85%;
} }
.col-md-push-8 { .col-md-push-8 {
left: 66.66666667%; left: 66.66666667%;
@ -2147,7 +2147,7 @@ pre code {
margin-left: 83.33333333%; margin-left: 83.33333333%;
} }
.col-md-offset-9 { .col-md-offset-9 {
margin-left: 75%; margin-left: 85%;
} }
.col-md-offset-8 { .col-md-offset-8 {
margin-left: 66.66666667%; margin-left: 66.66666667%;
@ -2202,7 +2202,7 @@ pre code {
width: 83.33333333%; width: 83.33333333%;
} }
.col-lg-9 { .col-lg-9 {
width: 75%; width: 85%;
} }
.col-lg-8 { .col-lg-8 {
width: 66.66666667%; width: 66.66666667%;
@ -2220,7 +2220,7 @@ pre code {
width: 33.33333333%; width: 33.33333333%;
} }
.col-lg-3 { .col-lg-3 {
width: 25%; width: 15%;
} }
.col-lg-2 { .col-lg-2 {
width: 16.66666667%; width: 16.66666667%;
@ -2238,7 +2238,7 @@ pre code {
right: 83.33333333%; right: 83.33333333%;
} }
.col-lg-pull-9 { .col-lg-pull-9 {
right: 75%; right: 85%;
} }
.col-lg-pull-8 { .col-lg-pull-8 {
right: 66.66666667%; right: 66.66666667%;
@ -2277,7 +2277,7 @@ pre code {
left: 83.33333333%; left: 83.33333333%;
} }
.col-lg-push-9 { .col-lg-push-9 {
left: 75%; left: 85%;
} }
.col-lg-push-8 { .col-lg-push-8 {
left: 66.66666667%; left: 66.66666667%;
@ -2316,7 +2316,7 @@ pre code {
margin-left: 83.33333333%; margin-left: 83.33333333%;
} }
.col-lg-offset-9 { .col-lg-offset-9 {
margin-left: 75%; margin-left: 85%;
} }
.col-lg-offset-8 { .col-lg-offset-8 {
margin-left: 66.66666667%; margin-left: 66.66666667%;

@ -252,7 +252,7 @@ function resultLine(type, item, linenumber) {
if (type == "image") { if (type == "image") {
html += "<div style=\"float:left\">"; html += "<div style=\"float:left\">";
html += "<a href=\"" + item.link + "\" class=\"thumblink\" onclick=\"return hs.expand(this)\">"; html += "<a href=\"" + item.link + "\" class=\"thumblink\" onclick=\"return hs.expand(this)\">";
html += "<img src=\"/ViewImage.png?maxwidth=96&amp;maxheight=96&amp;code=" + item.guid + " + &amp;url=" + item.link + "\" alt=\"" + title + "\" />"; html += "<img src=\"/ViewImage.png?maxwidth=256&amp;maxheight=256&amp;code=" + item.guid + " + &amp;url=" + item.link + "\" alt=\"" + title + "\" />";
//html += "<img src=\"" + item.link + "\" width=\"96\" height=\"96\" alt=\"" + title + "\" />"; //html += "<img src=\"" + item.link + "\" width=\"96\" height=\"96\" alt=\"" + title + "\" />";
html += "</a>"; html += "</a>";
var name = title; var name = title;

@ -56,7 +56,7 @@
:: ::
#(item)#::<div class="thumbcontainer"> #(item)#::<div class="thumbcontainer">
<a href="#[hrefFullPreview]#" target="#[target]#" class="thumblink" onclick="return hs.expand(this)"> <a href="#[hrefFullPreview]#" target="#[target]#" class="thumblink" onclick="return hs.expand(this)">
<img src="#[hrefCache]#" width="#[width]#" height="#[height]#" style="#[style]#" alt="#[name]#" onerror="handleResultThumbError(this)"/> <img src="#[hrefCache]#" width="256" height="256" style="#[style]#" alt="#[name]#" onerror="handleResultThumbError(this)"/>
</a> </a>
<div class="highslide-caption"><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[name]#</a><br /><a href="#[source]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[sourcedom]#</a></div> <div class="highslide-caption"><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[name]#</a><br /><a href="#[source]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[sourcedom]#</a></div>
</div>#(/item)# </div>#(/item)#

@ -88,7 +88,7 @@ public class yacysearchitem {
private static final int MAX_NAME_LENGTH = 60; private static final int MAX_NAME_LENGTH = 60;
private static final int MAX_URL_LENGTH = 120; private static final int MAX_URL_LENGTH = 120;
/** Default image item width in pixels */ /** Default image item width in pixels */
private static final int DEFAULT_IMG_WIDTH = 128; private static final int DEFAULT_IMG_WIDTH = 256;
/** Default image item height in pixels */ /** Default image item height in pixels */
private static final int DEFAULT_IMG_HEIGHT = DEFAULT_IMG_WIDTH; private static final int DEFAULT_IMG_HEIGHT = DEFAULT_IMG_WIDTH;

@ -19,7 +19,7 @@
}::#(item)#::#(nl)#:: ,#(/nl)# }::#(item)#::#(nl)#:: ,#(/nl)#
{ {
"title": "#[name]#", "title": "#[name]#",
"icon": "/ViewImage.png?maxwidth=96&amp;maxheight=96&amp;code=#[code]#", "icon": "/ViewImage.png?maxwidth=256&amp;maxheight=256&amp;code=#[code]#",
"image": "#[href]#", "image": "#[href]#",
"cache": "#[hrefCache]#", "cache": "#[hrefCache]#",
"url": "#[source]#", "url": "#[source]#",

@ -43,14 +43,14 @@
height="#[width]#" height="#[width]#"
width="#[height]#" /> width="#[height]#" />
<media:content <media:content
url="/ViewImage.png?maxwidth=96&amp;maxheight=96&amp;code=#[code]#" url="/ViewImage.png?maxwidth=256&amp;maxheight=256&amp;code=#[code]#"
fileSize="#[fileSize]#" fileSize="#[fileSize]#"
type="#[mimetype]#" type="#[mimetype]#"
medium="image" medium="image"
isDefault="false" isDefault="false"
expression="sample" expression="sample"
height="96" height="256"
width="96" /> width="256" />
</media:group> </media:group>
</item>#(/item)#:: </item>#(/item)#::
#(/content)# #(/content)#
Loading…
Cancel
Save