- Better mobile experience
- New Login
- jQuery update
- Small fixes and enhancements
pull/4/head 1.0.2
Tobias Reich 12 years ago
parent c6c6a2e808
commit b565390419

@ -118,6 +118,48 @@
}
}
/* moveUp ------------------------------------------------*/
@-webkit-keyframes moveUp {
0% {
-webkit-transform: translateY(1000px);
}
100% {
-webkit-transform: translateY(0px);
}
}
@-moz-keyframes moveUp {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-ms-keyframes moveUp {
0% {
-ms-transform: translateY(1000px);
}
100% {
-ms-transform: translateY(0px);
}
}
@-o-keyframes moveUp {
0% {
-o-transform: translateY(1000px);
}
100% {
-o-transform: translateY(0px);
}
}
@keyframes moveUp {
0% {
transform: translateY(1000px);
}
100% {
transform: translateY(0px);
}
}
/* moveDown ------------------------------------------------*/
@-webkit-keyframes moveDown {
0% {

@ -9,10 +9,39 @@ table { border-collapse:collapse; border-spacing:0; }
/* Screen behavior -------------------------------------------------*/
@media only screen and (max-width: 900px) {
#title span { display: none; }
}
@media only screen and (max-width: 600px) {
@media only screen and (max-width: 640px) {
#title { display: none; }
#button_move { display: none; }
.center {
top: 0px !important;
left: 0px !important;
}
.message {
position: fixed !important;
width: 100% !important;
height: 100% !important;
margin: 1px 0px 0px 0px !important;
border-radius: 0px !important;
/* Animation */
-webkit-animation-name: moveUp !important;
-webkit-animation-duration: .3s !important;
-moz-animation-name: moveUp !important;
-moz-animation-duration: .3s !important;
-o-animation-name: moveUp !important;
-o-animation-duration: .3s !important;
animation-name: moveUp !important;
animation-duration: .3s !important;
}
}
/* Basics -------------------------------------------------*/
@ -60,7 +89,7 @@ body { background-color: #222; background-image: url(../img/background.jpg); fon
text-align: center;
text-shadow: 0 -1px 0 #000;
background: #000;
box-shadow: 0 1px 2px hsla(0, 0%, 0%, .29);
box-shadow: 0 1px 2px hsla(0, 0%, 0%, .25);
border-radius: 3px;
}
.tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }
@ -399,7 +428,7 @@ header {
#search:focus {
box-shadow: 0px 1px 0px #555, inset 0px 0px 2px #333;
opacity: 1;
width: 180px;
width: 150px;
}
/* Tools ------------------------------------------------*/
@ -690,14 +719,11 @@ header {
float: left;
width: 100%;
padding: 12px 0px;
background-color: rgba(0, 0, 0, .2);
color: #fff;
font-size: 16px;
font-weight: bold;
text-shadow: 0px -1px 0px #000;
text-align: center;
border-bottom: 1px solid #111;
box-shadow: 0px 1px 0px rgba(255,255,255,.2);
}
.message .close {
position: absolute;
@ -710,16 +736,13 @@ header {
}
.message p {
float: left;
width: 470px;
width: 90%;
margin-top: 1px;
padding: 12px 15px 15px 15px;
padding: 12px 5% 15px 5%;
color: #eee;
font-size: 14px;
background-color: #555;
text-shadow: 0px -1px 0px #222;
line-height: 20px;
border-bottom: 1px solid #111;
box-shadow: 0px 1px 0px rgba(255,255,255,.1);
}
.message .button {
float: right;
@ -743,6 +766,9 @@ header {
box-shadow: inset 0px 1px 0px rgba(255,255,255,.2), 0px 1px 0px rgba(255,255,255,.1);
cursor: pointer;
}
.message .button:first-of-type {
margin: 15px 5% 18px 0px !important;
}
.message .button.active {
color: #fff;
box-shadow: inset 0px 1px 0px rgba(255,255,255,.2), 0px 1px 0px rgba(255,255,255,.1), 0px 0px 5px #005ecc;
@ -818,35 +844,25 @@ header {
/* Sign in ------------------------------------------------*/
.sign_in {
float: left;
width: 500px;
width: 100%;
margin-top: 1px;
padding: 20px 0px;
padding: 5px 0px;
color: #eee;
font-size: 14px;
background-color: #555;
text-shadow: 0px -1px 0px #222;
line-height: 20px;
border-bottom: 1px solid #111;
box-shadow: 0px 1px 0px rgba(255,255,255,.1);
}
.sign_in label {
float: left;
width: 20%;
margin: 6px 0px 0px 10%;
}
.sign_in label:first-of-type {
margin-bottom: 10px;
}
.sign_in input {
float: left;
width: 55%;
padding: 7px 10px 9px 10px;
width: 86%;
padding: 7px 2% 9px 2%;
margin: 0px 5%;
background-color: #444;
color: #fff;
text-shadow: 0px 1px 0px #222;
border: none;
border: 1px solid #111;
box-shadow: 0px 1px 0px #777;
box-shadow: 0px 1px 0px #555;
outline: none;
border-radius: 5px;
}
@ -854,15 +870,15 @@ header {
margin-bottom: 10px;
}
.sign_in input:focus {
box-shadow: 0px 1px 0px #777, inset 0px 0px 3px #333, 0px 0px 5px #005ecc;
box-shadow: 0px 1px 0px #666, inset 0px 0px 3px #333, 0px 0px 5px #005ecc;
}
.sign_in input.error:focus {
box-shadow: 0px 1px 0px #777, inset 0px 0px 3px #333, 0px 0px 5px #cc0007;
box-shadow: 0px 1px 0px #666, inset 0px 0px 3px #333, 0px 0px 5px #cc0007;
}
.message #version {
display: inline-block;
margin-top: 23px;
margin-left: 19px;
margin-left: 5%;
color: #888;
text-shadow: 0px -1px 0px #111;
}

@ -3,7 +3,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title></title>
<title>Lychee</title>
<meta name="author" content="Tobias Reich, Philipp Maurer">
<meta name="keywords" content="">
@ -16,7 +16,7 @@
<link rel="apple-touch-icon-precomposed" href="img/apple-touch-icon.png">
<meta name="apple-mobile-web-app-status-bar-style" content="black" >
<meta name="viewport" content="width=device-width, user-scalable=no">
<meta name="viewport" content="user-scalable=no, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
</head>

@ -137,8 +137,8 @@ function buildSignInModal() {
modal += "<div class='message center'>";
modal += "<h1><a class='icon-lock'></a> Sign in</h1>";
modal += "<div class='sign_in'>";
modal += "<label>Username:</label><input id='username' type='text' name='' value=''>";
modal += "<label>Password:</label><input id='password' type='password' name='' value=''>";
modal += "<input id='username' type='text' name='' value='' placeholder='username'>";
modal += "<input id='password' type='password' name='' value='' placeholder='password'>";
modal += "</div>";
modal += "<div id='version'>Version " + version + "</div>";
modal += "<a onclick='login()' class='button active'>Sign in</a>";

File diff suppressed because one or more lines are too long

@ -13,7 +13,7 @@
function init() {
$("#tools_albums").show();
$(".tools").tipsy({gravity: 'n'});
if (!mobileBrowser()) $(".tools").tipsy({gravity: 'n'});
params = "function=loggedIn";
$.ajax({type: "POST", url: api_path, data: params, success: function(data) {
if (data!=1) {
@ -85,9 +85,11 @@ function getURL() {
} else if (albumID&&photoID) {
if (content.html()=="") {
content.hide();
loadPhotos(albumID, true);
}
showImageview(photoID);
if (content.html()=="") loadPhotos(albumID, true);
} else if (albumID) {
@ -662,7 +664,7 @@ function loadAlbumInfo(albumID) {
case "s":
document.title = "Lychee - Public";
headerTitle.html("Public<span> - " + data.publicNum + " photos</span>");
$("#button_edit_album, #button_trash_album .button_divider").hide();
$("#button_edit_album, #button_trash_album, .button_divider").hide();
break;
case "0":
document.title = "Lychee - Unsorted";

@ -12,45 +12,49 @@ var header = $("header"),
loading = $("#loading"),
infobox = $("#infobox"),
api_path = "php/api.php",
version = "1.0.1";
version = "1.0.2";
$(document).ready(function(){
/* Event Name */
if (mobileBrowser()) event_name = "touchend";
else event_name = "click";
/* Login */
$("#password").live("keyup", function() {
if ($(this).val().length>0) $(this).removeClass("error");
});
/* Add Dialog */
$(".button_add").live("click", function() { $("body").append(buildAddModal) });
$("#add_album").live("click", addAlbum);
$("#add_photo").live("click", function() { $("#auswahl").html(""); $("#upload_files").click() });
$(".button_add").live(event_name, function() { $("body").append(buildAddModal) });
$("#add_album").live(event_name, addAlbum);
$("#add_photo").live(event_name, function() { $("#auswahl").html(""); $("#upload_files").click() });
/* Toolbar Buttons */
$("#button_signout").live("click", function() {
$("#button_signout").live(event_name, function() {
modal = buildModal("Sign Out", "Are you sure you want to leave and log out?", ["Sign out", "Stay here"], ["logout();", ""]);
$("body").append(modal);
});
$("#button_download").live("click", function() {
$("#button_download").live(event_name, function() {
link = $("#image_view #image").css("background-image").replace(/"/g,"").replace(/url\(|\)$/ig, "");
window.open(link,"_newtab");
});
$("#button_move").live("click", function(e) {
$("#button_move").live(event_name, function(e) {
showContextMenuMove(image_view.attr("data-id"), e.pageX, e.pageY);
});
$("#button_trash_album").live("click", function() {
$("#button_trash_album").live(event_name, function() {
if (content.attr("data-id")=="0") deleteUnsorted();
else deleteAlbum();
});
$("#button_trash").live("click", function() { deletePhoto() });
$("#button_edit_album").live("click", function() { renameAlbum() });
$("#button_edit").live("click", function() { renamePhoto() });
$("#button_info").live("click", function() { showInfobox() });
$("#button_archive").live("click", function() { getAlbumArchive() });
$("#button_sync").live("click", function() { syncFolder() });
$("#button_trash").live(event_name, function() { deletePhoto() });
$("#button_edit_album").live(event_name, function() { renameAlbum() });
$("#button_edit").live(event_name, function() { renamePhoto() });
$("#button_info").live(event_name, function() { showInfobox() });
$("#button_archive").live(event_name, function() { getAlbumArchive() });
$("#button_sync").live(event_name, function() { syncFolder() });
/* Rename Album/Photo via Titlebar */
$("#title.editable").live("click", function() {
$("#title.editable").live(event_name, function() {
if (visibleImageview()) renamePhoto(); else renameAlbum();
});
@ -59,15 +63,15 @@ $(document).ready(function(){
e.preventDefault();
showContextMenuPhoto($(this).attr("data-id"), e.pageX, e.pageY);
});
$(".contextmenu_bg").live("click", closeContextMenu);
$(".contextmenu_bg").live(event_name, closeContextMenu);
/* Star/Share Photo */
$("#button_star").live("click", setPhotoStar);
$("#button_share").live("click", function(e) {
$("#button_star").live(event_name, setPhotoStar);
$("#button_share").live(event_name, function(e) {
if ($("#button_share a.active").length) showContextMenuShare(image_view.attr("data-id"), e.pageX, e.pageY);
else setPhotoPublic(e);
});
$(".copylink").live("click", function() { $(this).select() });
$(".copylink").live(event_name, function() { $(this).select() });
/* Upload */
$("#upload_files").live("change", function() {
@ -84,19 +88,19 @@ $(document).ready(function(){
$(".photo").live("click", function() { setURL("a" + content.attr("data-id") + "p" + $(this).attr("data-id")) });
/* Nav Back */
$("#button_back_home").live("click", function() { setURL("") });
$("#button_back").live("click", function() { setURL("a" + content.attr("data-id")) });
$("#button_back_home").live(event_name, function() { setURL("") });
$("#button_back").live(event_name, function() { setURL("a" + content.attr("data-id")) });
/* Close Modal */
$(".message a.close").live("click", closeModal);
$(".message a.close").live(event_name, closeModal);
/* Image View */
$("#image_view a#previous").live("click", loadPreviousPhoto);
$("#image_view a#next").live("click", loadNextPhoto);
$("#image_view a#previous").live(event_name, loadPreviousPhoto);
$("#image_view a#next").live(event_name, loadNextPhoto);
/* Infobox */
$("#infobox_overlay, #infobox .header a").live("click", function() { hideInfobox() });
$("#edit_description").live("click", function() { setPhotoDescription() });
$("#infobox_overlay, #infobox .header a").live(event_name, function() { hideInfobox() });
$("#edit_description").live(event_name, function() { setPhotoDescription() });
/* Window */
$(window).keydown(key);
@ -105,7 +109,7 @@ $(document).ready(function(){
$(window).bind("mouseenter", showControls);
/* Init */
if ((BrowserDetect.browser=="Explorer")||(BrowserDetect.browser=="Safari"&&BrowserDetect.version<5)||(BrowserDetect.browser=="Chrome"&&BrowserDetect.version<18)||(BrowserDetect.browser=="Firefox"&&BrowserDetect.version<14)) {
if ((BrowserDetect.browser=="Explorer")||(BrowserDetect.browser=="Safari"&&BrowserDetect.version<5)||(BrowserDetect.browser=="Chrome"&&BrowserDetect.version<18)||(BrowserDetect.browser=="Firefox"&&BrowserDetect.version<15)) {
modal = buildModal("Browser not supported", "You are currently using an outdated or unsupported Browser. This site might not work properly. Please consider to update your Browser!", ["Leave"], ["location.href = 'http://browsehappy.com';"]);
$("body").append(modal);

@ -2,8 +2,8 @@
#### A great looking and easy-to-use Photo-Management-System.
![Lychee ImageView](http://lychee.electerious.com/uploads/big/13511584079432.png)
![Lychee ImageView](http://lychee.electerious.com/uploads/big/13497110451270.png)
![Lychee ImageView](http://lychee.electerious.com/uploads/big/13582806160093.png)
![Lychee ImageView](http://lychee.electerious.com/uploads/big/13582805615704.png)
Lychee is a free, easy to use and great looking photo-management-system you can run on your server to manage and share photos. Just download the source and follow the instructions to install Lychee wherever you want.

@ -16,7 +16,7 @@
<link rel="shortcut icon" href="img/favicon.png">
<meta name="apple-mobile-web-app-status-bar-style" content="black" >
<meta name="viewport" content="width=device-width, user-scalable=no">
<meta name="viewport" content="user-scalable=no, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<?php if(isset($_GET['p'])) echo facebookHeader($_GET['p']); ?>

Loading…
Cancel
Save