arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fixed search x, new InfoBox close

Browse Source
This commit is contained in:
Tobias Reich 2014-12-28 23:29:01 +01:00
parent 5b6ad09f98
commit 2c0a9a489f
9 changed files with 37 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist/main.css vendored
View File

Binary file not shown.

BIN
dist/main.js vendored
View File

Binary file not shown.

BIN
dist/view.js vendored
View File

Binary file not shown.

2
index.html
View File

@ -46,7 +46,7 @@
</a>
<a class="button_divider"></a>
<input id="search" type="text" name="search" placeholder="Search …">
<a id="clearSearch" class="button right">&times;</a>
<a id="clearSearch">&times;</a>
</div>
<div class="toolbar" id="tools_album">
<a class="button left" id="button_back_home" title="Close Album">

11
src/scripts/build.coffee
View File

@ -5,6 +5,13 @@
window.build = {}
build.iconic = (icon, classes, path) ->
path = path || 'src/images/iconic.svg'
classes = classes || 'iconic'
"<svg viewBox='0 0 8 8' class='#{ classes }'><use xlink:href='#{ path }##{ icon }'></use></svg>"
build.divider = (title) ->
"<div class='divider fadeIn'><h1>#{ title }</h1></div>"
@ -258,7 +265,7 @@ build.tags = (tags, forView) ->
build.infoboxPhoto = (data, forView) ->
html = """
<div class='header'><h1>About</h1><a class='icon-remove-sign'></a></div>
<div class='header'><h1>About</h1><a class='close'>#{ build.iconic('circle-x') }</a></div>
<div class='wrapper'>
"""
@ -356,7 +363,7 @@ build.infoboxPhoto = (data, forView) ->
build.infoboxAlbum = (data, forView) ->
html = """
<div class='header'><h1>About</h1><a class='icon-remove-sign'></a></div>
<div class='header'><h1>About</h1><a class='close'>#{ build.iconic('circle-x') }</a></div>
<div class='wrapper'>
"""

11
src/scripts/init.js
View File

@ -28,6 +28,7 @@ $(document).ready(function() {
$('#button_settings') .on(event_name, contextMenu.settings);
$('#button_info_album') .on(event_name, view.infobox.show);
$('#button_info') .on(event_name, view.infobox.show);
$('.button_add') .on(event_name, contextMenu.add);
$('#button_more') .on(event_name, function(e) { contextMenu.photoMore(photo.getID(), e) });
$('#button_move') .on(event_name, function(e) { contextMenu.move([photo.getID()], e) });
$('#hostedwith') .on(event_name, function() { window.open(lychee.website) });
@ -54,7 +55,7 @@ $(document).ready(function() {
/* Infobox */
$('#infobox')
.on(event_name, '.header a', view.infobox.hide)
.on(event_name, '.header .close', view.infobox.hide)
.on(event_name, '#edit_title_album', function() { album.setTitle([album.getID()]) })
.on(event_name, '#edit_description_album', function() { album.setDescription(album.getID()) })
.on(event_name, '#edit_title', function() { photo.setTitle([photo.getID()]) })
@ -160,13 +161,9 @@ $(document).ready(function() {
.on(event_name, '.message .button:first', function() { if (modal.fns!==null) modal.fns[0](); if (!visible.signin()) modal.close() })
.on(event_name, '.message .button:last', function() { if (modal.fns!==null) modal.fns[1](); if (!visible.signin()) modal.close() })
/* Add Dialog */
.on(event_name, '.button_add', contextMenu.add)
/* Context Menu */
.on('contextmenu', '.photo', function(e) { contextMenu.photo(photo.getID(), e) })
.on('contextmenu', '.album', function(e) { contextMenu.album(album.getID(), e) })
.on(event_name, '.contextmenu_bg', contextMenu.close)
.on('contextmenu', '.photo', function(e) { contextMenu.photo(photo.getID(), e) })
.on('contextmenu', '.album', function(e) { contextMenu.album(album.getID(), e) })
/* Infobox */
.on(event_name, '#infobox_overlay', view.infobox.hide)

13
src/styles/_header.scss
View File

@ -122,14 +122,19 @@ header {
#clearSearch {
position: absolute;
top: 15px;
right: 81px;
top: 13px;
right: 78px;
padding: 0;
color: #888;
font-size: 20px;
opacity: 0;
transition: opacity .2s ease-out;
transition: opacity .2s ease-out, color .2s ease-out;
cursor: pointer;
&:hover { opacity: 1; }
&:hover {
color: #fff;
opacity: 1;
}
}
/* Hosted with Lychee ------------------------------------------------*/

22
src/styles/_infobox.scss
View File

@ -56,6 +56,7 @@
height: 49px;
width: 100%;
background-image: linear-gradient(to bottom, #2A2A2A, #131313);
border-bottom: 1px solid rgba(0, 0, 0, .7);
}
.header h1 {
@ -69,17 +70,20 @@
text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
}
.header a {
.header .close {
float: right;
padding: 15px 65px 15px 15px;
color: #fff;
font-size: 20px;
font-weight: bold;
text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
opacity: .5;
padding: 16px 65px 12px 15px;
width: 15px;
cursor: pointer;
&:hover { opacity: 1; }
.iconic {
fill: #888;
filter: drop-shadow( 0 -1px 0 rgba(0, 0, 0, .2) );
transition: fill .2s ease;
}
&:hover .iconic { fill: #fff; }
}
/* Seperator ------------------------------------------------*/
@ -90,7 +94,7 @@
box-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
&:first-child {
border: none;
border-top: 1px solid rgba(255, 255, 255, .02);
box-shadow: none;
}

2
src/styles/main.scss
View File

@ -33,7 +33,7 @@ body {
.center {
position: absolute;
left: 50%;
top:50%;
top: 50%;
}
input {