- Improved ImageView
- Login-Window now shows the version of Lychee
- iPhone Homescreen Icon
- Improved Readme with Pictures
pull/4/head 1.0.1
Tobias Reich 12 years ago
parent 913cd212d6
commit 7030b7657e

@ -349,6 +349,11 @@ header {
#tools_albums, #tools_album, #tools_photo { #tools_albums, #tools_album, #tools_photo {
display: none; display: none;
} }
/* Button Custom ------------------------------------------------*/
header .button.icon-refresh {
padding: 7px 10px 4px 10px;
}
/* Button Divider ------------------------------------------------*/ /* Button Divider ------------------------------------------------*/
header .button_divider { header .button_divider {
@ -854,6 +859,13 @@ header {
.sign_in input.error:focus { .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 #777, inset 0px 0px 3px #333, 0px 0px 5px #cc0007;
} }
.message #version {
display: inline-block;
margin-top: 23px;
margin-left: 19px;
color: #888;
text-shadow: 0px -1px 0px #111;
}
/* Sign in ------------------------------------------------*/ /* Sign in ------------------------------------------------*/
.copylink { .copylink {
@ -891,7 +903,7 @@ header {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 50% 50%; background-position: 50% 50%;
background-size: contain; background-size: contain;
-webkit-transition: top .3s, bottom .3s; -webkit-transition: top .3s, bottom .3s, margin-top .3s;
-webkit-animation-name: zoomIn; -webkit-animation-name: zoomIn;
-webkit-animation-duration: .3s; -webkit-animation-duration: .3s;
@ -906,6 +918,12 @@ header {
animation-duration: .3s; animation-duration: .3s;
animation-fill-mode: forwards; animation-fill-mode: forwards;
} }
#image_view #image.small {
top: 50%;
right: auto;
bottom: auto;
left: 50%;
}
/* Previous/Next Buttons ------------------------------------------------*/ /* Previous/Next Buttons ------------------------------------------------*/
#image_view a { #image_view a {

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

@ -14,6 +14,7 @@
<link type="text/css" rel="stylesheet" href="css/style.css"> <link type="text/css" rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" href="img/favicon.png"> <link rel="shortcut icon" href="img/favicon.png">
<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="apple-mobile-web-app-status-bar-style" content="black" >
<meta name="viewport" content="width=device-width, user-scalable=no"> <meta name="viewport" content="width=device-width, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
@ -31,6 +32,7 @@
<div id="tools_albums"> <div id="tools_albums">
<a class="button" id="button_signout">Sign Out</a> <a class="button" id="button_signout">Sign Out</a>
<a class="button icon icon-plus-sign button_add"></a> <a class="button icon icon-plus-sign button_add"></a>
<!--<a class="button icon icon-refresh" id="button_sync"></a>-->
<a class="button_divider"></a> <a class="button_divider"></a>
<input id="search" type="text" name="search" placeholder="Search …"> <input id="search" type="text" name="search" placeholder="Search …">
</div> </div>

@ -140,6 +140,7 @@ function buildSignInModal() {
modal += "<label>Username:</label><input id='username' type='text' name='' value=''>"; modal += "<label>Username:</label><input id='username' type='text' name='' value=''>";
modal += "<label>Password:</label><input id='password' type='password' name='' value=''>"; modal += "<label>Password:</label><input id='password' type='password' name='' value=''>";
modal += "</div>"; modal += "</div>";
modal += "<div id='version'>Version " + version + "</div>";
modal += "<a onclick='login()' class='button active'>Sign in</a>"; modal += "<a onclick='login()' class='button active'>Sign in</a>";
modal += "</div>"; modal += "</div>";
modal += "</div>"; modal += "</div>";

@ -68,21 +68,39 @@ function setURL(website_url) {
} }
function getURL() { function getURL() {
closeContextMenu(); closeContextMenu();
hash = document.location.hash.replace("#", ""); hash = document.location.hash.replace("#", "");
if (hash.indexOf("a")!=-1) {
if (hash.indexOf("p")!=-1) { albumID = "";
hash = hash.split("p"); photoID = "";
content.hide();
showImageview(hash[1]); if (hash.indexOf("a")!=-1) albumID = hash.split("p")[0].replace("a", "");
if (content.html()=="") loadPhotos(hash[0].replace("a", ""), true); if (hash.indexOf("p")!=-1) photoID = hash.split("p")[1];
} else {
if (visibleImageview()) hideImageview(); if (hash=="upload") {
else loadPhotos(hash.replace("a", ""), false);
} loadAlbums();
$("body").append(buildAddModal);
} else if (albumID&&photoID) {
content.hide();
showImageview(photoID);
if (content.html()=="") loadPhotos(albumID, true);
} else if (albumID) {
if (!visibleControls()) showControls();
if (visibleImageview()) hideImageview();
else loadPhotos(albumID, false);
} else { } else {
loadAlbums(); loadAlbums();
} }
} }
/* /*
@ -190,12 +208,18 @@ function showControls() {
image_view.css("background-color", "rgba(30,30,30,.99)"); image_view.css("background-color", "rgba(30,30,30,.99)");
loading.css("opacity", 1); loading.css("opacity", 1);
header.css("margin-Top", "0px"); header.css("margin-Top", "0px");
$("#image_view #image").css({ if ($("#image_view #image.small").length>0) {
top: 70, $("#image_view #image").css({
right: 30, marginTop: -1*($("#image_view #image").height()/2)+20
bottom: 30, });
left: 30 } else {
}); $("#image_view #image").css({
top: 70,
right: 30,
bottom: 30,
left: 30
});
}
} }
} }
function hideControls() { function hideControls() {
@ -207,12 +231,18 @@ function hideControls() {
image_view.css("background-color", "#111"); image_view.css("background-color", "#111");
loading.css("opacity", 0); loading.css("opacity", 0);
header.css("margin-Top", "-45px"); header.css("margin-Top", "-45px");
$("#image_view #image").css({ if ($("#image_view #image.small").length>0) {
top: 0, $("#image_view #image").css({
right: 0, marginTop: -1*($("#image_view #image").height()/2)
bottom: 0, });
left: 0 } else {
}); $("#image_view #image").css({
top: 0,
right: 0,
bottom: 0,
left: 0
});
}
}, 500)); }, 500));
} }
} }
@ -354,6 +384,21 @@ function visibleInfobox() {
else return true; else return true;
} }
function isPhotoSmall(photo) {
size = [
["width", false],
["height", false]
];
if (photo.width<$(window).width()-60) size["width"] = true;
if (photo.height<$(window).height()-100) size["height"] = true;
if (size["width"]&&size["height"]) return true;
else return false;
}
/* /*
Key Function Key Function
This function triggers events when a special key is pressed. This function triggers events when a special key is pressed.
@ -447,7 +492,7 @@ function renamePhoto(photoID) {
newTitle = prompt("Please enter a new title for this photo:", oldTitle); newTitle = prompt("Please enter a new title for this photo:", oldTitle);
if (photoID!=""&&photoID!=null&&photoID!=undefined&&newTitle.length>2&&newTitle.length<31) { if (photoID!=null&&photoID!=undefined&&newTitle.length<31) {
loadingFadeIn("loading"); loadingFadeIn("loading");
@ -680,8 +725,10 @@ function loadPhotoInfo(photoID) {
} }
image_view.attr("data-id", photoID); image_view.attr("data-id", photoID);
if (visibleControls()) image_view.html("").append("<a id='previous' class='icon-caret-left'></a><a id='next' class='icon-caret-right'></a><div id='image_wrapper'><div id='image' style='background-image: url(" + data.url + ")'></div></div>"); if (visibleControls()&&isPhotoSmall(data)) image_view.html("").append("<a id='previous' class='icon-caret-left'></a><a id='next' class='icon-caret-right'></a><div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt(data.height/2-20) + "px; margin-left: -" + data.width/2 + "px;'></div>");
else image_view.html("").append("<a id='previous' style='left: -50px' class='icon-caret-left'></a><a id='next' style='right: -50px' class='icon-caret-right'></a><div id='image_wrapper'><div id='image' style='background-image: url(" + data.url + "); top: 0px; right: 0px; bottom: 0px; left: 0px;'></div></div>"); else if (visibleControls()) image_view.html("").append("<a id='previous' class='icon-caret-left'></a><a id='next' class='icon-caret-right'></a><div id='image' style='background-image: url(" + data.url + ")'></div>");
else if (isPhotoSmall(data)) image_view.html("").append("<a id='previous' style='left: -50px' class='icon-caret-left'></a><a id='next' style='right: -50px' class='icon-caret-right'></a><div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt(data.height/2) + "px; margin-left: -" + data.width/2 + "px;'></div>");
else image_view.html("").append("<a id='previous' style='left: -50px' class='icon-caret-left'></a><a id='next' style='right: -50px' class='icon-caret-right'></a><div id='image' style='background-image: url(" + data.url + "); top: 0px; right: 0px; bottom: 0px; left: 0px;'></div>");
image_view.removeClass("fadeOut").addClass("fadeIn").show(); image_view.removeClass("fadeOut").addClass("fadeIn").show();
if (!visibleControls()) hideControls(true); if (!visibleControls()) hideControls(true);
@ -914,6 +961,18 @@ function loadNextPhoto() {
} }
function syncFolder() {
params = "function=syncFolder";
$.ajax({type: "POST", url: api_path, data: params, success: function(data) {
if (data==1) setURL("a0");
else loadingFadeIn("error");
}, error: ajaxError });
}
function search(term) { function search(term) {
clearTimeout($(window).data("timeout")); clearTimeout($(window).data("timeout"));

@ -11,7 +11,8 @@ var header = $("header"),
image_view = $("#image_view"), image_view = $("#image_view"),
loading = $("#loading"), loading = $("#loading"),
infobox = $("#infobox"), infobox = $("#infobox"),
api_path = "php/api.php"; api_path = "php/api.php",
version = "1.0.1";
$(document).ready(function(){ $(document).ready(function(){
@ -46,6 +47,7 @@ $(document).ready(function(){
$("#button_edit").live("click", function() { renamePhoto() }); $("#button_edit").live("click", function() { renamePhoto() });
$("#button_info").live("click", function() { showInfobox() }); $("#button_info").live("click", function() { showInfobox() });
$("#button_archive").live("click", function() { getAlbumArchive() }); $("#button_archive").live("click", function() { getAlbumArchive() });
$("#button_sync").live("click", function() { syncFolder() });
/* Rename Album/Photo via Titlebar */ /* Rename Album/Photo via Titlebar */
$("#title.editable").live("click", function() { $("#title.editable").live("click", function() {

@ -13,6 +13,9 @@ var header = $("header"),
$(document).ready(function(){ $(document).ready(function(){
/* Window */
$(window).keydown(key);
/* Infobox */ /* Infobox */
$("#infobox_overlay, #infobox .header a").live("click", function() { hideInfobox() }); $("#infobox_overlay, #infobox .header a").live("click", function() { hideInfobox() });
$("#button_info").live("click", function() { showInfobox() }); $("#button_info").live("click", function() { showInfobox() });
@ -27,6 +30,35 @@ $(document).ready(function(){
}); });
function key(e) {
code = (e.keyCode ? e.keyCode : e.which);
if (code==27&&visibleInfobox()) { hideInfobox(); e.preventDefault(); }
}
function visibleInfobox() {
if (parseInt(infobox.css("right").replace("px", ""))<0) return false;
else return true;
}
function isPhotoSmall(photo) {
size = [
["width", false],
["height", false]
];
if (photo.width<$(window).width()-60) size["width"] = true;
if (photo.height<$(window).height()-100) size["height"] = true;
if (size["width"]&&size["height"]) return true;
else return false;
}
function showInfobox() { function showInfobox() {
$("body").append("<div id='infobox_overlay'></div>"); $("body").append("<div id='infobox_overlay'></div>");
@ -51,7 +83,8 @@ function loadPhotoInfo(photoID) {
headerTitle.html(data.title); headerTitle.html(data.title);
image_view.attr("data-id", photoID); image_view.attr("data-id", photoID);
image_view.html("").append("<div id='image' style='background-image: url(" + data.url + ")'></div>"); if (isPhotoSmall(data)) image_view.html("").append("<div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt(data.height/2) + "px; margin-left: -" + data.width/2 + "px;'></div>");
else image_view.html("").append("<div id='image' style='background-image: url(" + data.url + "); top: 70px; right: 30px; bottom: 30px; left: 30px;'></div>");
image_view.removeClass("fadeOut").addClass("fadeIn").show(); image_view.removeClass("fadeOut").addClass("fadeIn").show();
infobox.html(buildInfobox(data)).show(); infobox.html(buildInfobox(data)).show();

@ -16,7 +16,6 @@ if((isset($_POST["function"])&&$_POST["function"]!="")||(isset($_GET["function"]
// Security // Security
if(isset($_POST["albumID"])&&($_POST["albumID"]==""||$_POST["albumID"]<0)) exit("Wrong parameter type for 'albumID'!"); if(isset($_POST["albumID"])&&($_POST["albumID"]==""||$_POST["albumID"]<0)) exit("Wrong parameter type for 'albumID'!");
if(isset($_POST["photoID"])&&$_POST["photoID"]=="") exit("Wrong parameter type for 'photoID'!"); if(isset($_POST["photoID"])&&$_POST["photoID"]=="") exit("Wrong parameter type for 'photoID'!");
if(isset($_POST["title"])&&$_POST["title"]=="") exit("Wrong parameter type for 'title'!");
if($_SESSION["login"]==true) { if($_SESSION["login"]==true) {
@ -45,11 +44,14 @@ if((isset($_POST["function"])&&$_POST["function"]!="")||(isset($_GET["function"]
if($_POST["function"]=="previousPhoto"&&isset($_POST["photoID"])&&isset($_POST["albumID"])) echo array2json(previousPhoto($_POST["photoID"], $_POST["albumID"])); if($_POST["function"]=="previousPhoto"&&isset($_POST["photoID"])&&isset($_POST["albumID"])) echo array2json(previousPhoto($_POST["photoID"], $_POST["albumID"]));
if($_POST["function"]=="nextPhoto"&&isset($_POST["photoID"])&&isset($_POST["albumID"])) echo array2json(nextPhoto($_POST["photoID"], $_POST["albumID"])); if($_POST["function"]=="nextPhoto"&&isset($_POST["photoID"])&&isset($_POST["albumID"])) echo array2json(nextPhoto($_POST["photoID"], $_POST["albumID"]));
// Upload Function // Upload Function
if($_POST["function"]=="upload"&&isset($_FILES)&&isset($_POST["albumID"])) echo upload($_FILES, $_POST["albumID"]); if($_POST["function"]=="upload"&&isset($_FILES)&&isset($_POST["albumID"])) echo upload($_FILES, $_POST["albumID"]);
// Upload Function // Search Function
if($_POST["function"]=="search"&&isset($_POST["term"])) echo array2json(search($_POST["term"])); if($_POST["function"]=="search"&&isset($_POST["term"])) echo array2json(search($_POST["term"]));
// Sync Function
if($_POST["function"]=="syncFolder") echo syncFolder();
// Session Functions // Session Functions
if($_POST["function"]=="logout") logout(); if($_POST["function"]=="logout") logout();

@ -4,13 +4,14 @@
* @name config.php * @name config.php
* @author Philipp Maurer * @author Philipp Maurer
* @author Tobias Reich * @author Tobias Reich
* @copyright 2012 by Philipp Maurer, Tobias Reich * @copyright 2012 by Philipp Maurer, Tobias Reich
*/ */
//Database configurations //Database configurations
$db = "lychee"; //Database name $db = "lychee"; //Database name
$dbUser = ""; //Username of the database $dbUser = "lychee"; //Username of the database
$dbPassword = ""; //Password of the Database $dbPassword = "lychee_passwd"; //Password of the Database
$dbHost = "localhost"; //Host of the Database
//lychee user configuration //lychee user configuration
$user = "lychee"; //lychee username $user = "lychee"; //lychee username
@ -21,4 +22,4 @@ $thumbQuality = 95; //Quality of the Thumbs (0-100). Default: 95
$bitlyUsername = ""; //Your Bit.ly Username $bitlyUsername = ""; //Your Bit.ly Username
$bitlyApi = ""; //Your Bit.ly API Key $bitlyApi = ""; //Your Bit.ly API Key
?> ?>

@ -11,16 +11,16 @@ include("config.php");
// Database Functions // Database Functions
function dbConnect() { function dbConnect() {
global $db, $dbUser, $dbPassword; global $db, $dbUser, $dbPassword, $dbHost;
$connect = mysql_connect("localhost", $dbUser, $dbPassword); $connect = mysql_connect($dbHost, $dbUser, $dbPassword);
if(!$connect) { if(!$connect) {
echo "No connection: ".mysql_error(); echo "No connection: ".mysql_error();
return false; return false;
} }
$dbSelect = mysql_select_db($db); $dbSelect = mysql_select_db($db);
if(!$dbSelect) { if(!$dbSelect) {
echo "Can not find Database!"; if(createDatabase($db)){$dbSelect = mysql_select_db($db);}
return false; else {echo "Can not create Database!"; return false;}
} }
$query = "SELECT * FROM photos, albums;"; $query = "SELECT * FROM photos, albums;";
if(!mysql_query($query)) createTables(); if(!mysql_query($query)) createTables();
@ -34,6 +34,12 @@ function dbClose() {
} }
return true; return true;
} }
function createDatabase($db) {
$query = "CREATE DATABASE $db;";
$result = mysql_query($query);
if(!$result) return false;
return true;
}
function createTables() { function createTables() {
$query = "CREATE TABLE IF NOT EXISTS `albums` ( $query = "CREATE TABLE IF NOT EXISTS `albums` (
`id` int(11) NOT NULL AUTO_INCREMENT, `id` int(11) NOT NULL AUTO_INCREMENT,
@ -524,7 +530,7 @@ function movePhoto($photoID, $newAlbum) {
} }
function setPhotoTitle($photoID, $title) { function setPhotoTitle($photoID, $title) {
$title = mysql_real_escape_string(urldecode($title)); $title = mysql_real_escape_string(urldecode($title));
if(strlen($title)<3||strlen($title)>30) return false; if(strlen($title)>30) return false;
$query = "UPDATE photos SET title = '$title' WHERE id = '$photoID';"; $query = "UPDATE photos SET title = '$title' WHERE id = '$photoID';";
$result = mysql_query($query); $result = mysql_query($query);
if(!$result) return false; if(!$result) return false;

@ -2,7 +2,10 @@
#### A great looking and easy-to-use Photo-Management-System. #### A great looking and easy-to-use Photo-Management-System.
Lychee is open-source and free to use wherever you want. Just download the source and follow the instructions to install Lychee on your server. ![Lychee ImageView](http://lychee.electerious.com/uploads/big/13511584079432.png)
![Lychee ImageView](http://lychee.electerious.com/uploads/big/13497110451270.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.
## Installation ## Installation
@ -20,15 +23,18 @@ To use Lychee without restrictions, we recommend to increase the values of the f
upload_max_filesize = 100M upload_max_filesize = 100M
max_file_uploads = 100 post_max_size = 100M max_file_uploads = 100 post_max_size = 100M
#### MySQL configuration #### Folder permissions
Change the permissions of `/lychee/uploads` to 777, including all subfolders:
chmod -R 777 /lychee/uploads
Create a new Database and remember the name.
#### Lychee configuration `lychee/php/config.php` #### Lychee configuration `lychee/php/config.php`
Change the following properties with your MySQL information: Change the following properties with your MySQL information:
$db = The name of the Database you want to use $dbUser = Your MySQL username $dbPassword = Your MySQL password $db = The name of the Database you want to use
-> Lychee will create the Database for you $dbUser = Your MySQL username $dbPassword = Your MySQL password $dbHost = Your MySQL host (in most cases you can use localhost)
Your photos are protected by a username and password you need to set: Your photos are protected by a username and password you need to set:

Loading…
Cancel
Save