diff --git a/scanner/.gitignore b/scanner/.gitignore index f1f1c3e..837bdaf 100644 --- a/scanner/.gitignore +++ b/scanner/.gitignore @@ -1,3 +1,4 @@ +upload.sh *.pyc cache/* test/* diff --git a/scanner/PhotoAlbum.py b/scanner/PhotoAlbum.py index 33ea437..b5c6377 100644 --- a/scanner/PhotoAlbum.py +++ b/scanner/PhotoAlbum.py @@ -110,6 +110,7 @@ class Photo(object): self._metadata(image) self._thumbnails(image, thumb_path) def _metadata(self, image): + self._attributes["size"] = image.size try: info = image._getexif() except: @@ -125,8 +126,11 @@ class Photo(object): try: value = datetime.strptime(value, '%Y:%m:%d %H:%M:%S') except: - pass + pass self._attributes[decoded] = value + + if "Orientation" in self._attributes and self._attributes["Orientation"] in range(5, 9): + self._attributes["size"] = (self._attributes["size"][1], self._attributes["size"][0]) def _thumbnail(self, image, thumb_path, size, square=False): thumb_path = os.path.join(thumb_path, image_cache(self._path, size, square)) print "Thumbing %s" % thumb_path diff --git a/web/css/000-controls.css b/web/css/000-controls.css new file mode 100644 index 0000000..e43818e --- /dev/null +++ b/web/css/000-controls.css @@ -0,0 +1,89 @@ +body { + margin: 0; + padding: 0; + background-color: #222222; + font-family: "LM Roman", "Georgia", "Palatino Linotype", "Palatino", "Times New Roman", "Times", serif; + color: #FFFFFF; +} +a { + color: #88EE44; + text-decoration: none; +} +a:hover { + color: #DDDDDD; +} +#title { + position: absolute; + top: 0; + padding: 0.4em; + font-weight: bold; + font-size: 1.2em; +} +#loading { + display: none; +} + + +#album-view { + position: absolute; + top: 2.5em; + padding: 1em; +} +#thumbs { + line-height: 0; +} + +#thumbs img { + border: 0; + margin: 0; + padding: 0; +} +#subalbums { +} +.album-button { + float: left; + display: block; + width: 150px; + height: 150px; + margin-right: 10px; + margin-bottom: 5px; + margin-top: 5px; + text-align: center; + font-style: italic; + border: 1px #86A1B6 dotted; +} + + +#next, #back { + position: absolute; + width: auto; + font-size: 2.5em; + line-height: 0; + padding-top: 0.3em; +} +#back { + left: 0; +} +#next { + right: 0; +} +#photo { + border: 0; +} +#photo-view { + position: absolute; + bottom: 150px; + top: 2.5em; + margin: 0 auto; +} +.photo-view-container { + position: absolute; + height: 150px; + width: 100%; + bottom: 0; + top: auto !important; + overflow-x: auto; + overflow-y: hidden; + white-space: nowrap; + padding: 0 !important; +} diff --git a/web/css/000-main.css b/web/css/000-main.css deleted file mode 100644 index e69de29..0000000 diff --git a/web/css/001-fonts.css b/web/css/001-fonts.css new file mode 100644 index 0000000..20f68e3 --- /dev/null +++ b/web/css/001-fonts.css @@ -0,0 +1,24 @@ +@font-face { + font-family: "LM Roman"; + font-weight: bold; + font-style: normal; + src: url("/fonts/lmroman10-bold.otf"); +} +@font-face { + font-family: "LM Roman"; + font-weight: bold; + font-style: italic; + src: url("/fonts/lmroman10-bolditalic.otf"); +} +@font-face { + font-family: "LM Roman"; + font-weight: normal; + font-style: italic; + src: url("/fonts/lmroman10-italic.otf"); +} +@font-face { + font-family: "LM Roman"; + font-weight: normal; + font-style: normal; + src: url("/fonts/lmroman10-regular.otf"); +} \ No newline at end of file diff --git a/web/fonts/lmroman10-bold.otf b/web/fonts/lmroman10-bold.otf new file mode 100644 index 0000000..7d6afa7 Binary files /dev/null and b/web/fonts/lmroman10-bold.otf differ diff --git a/web/fonts/lmroman10-bolditalic.otf b/web/fonts/lmroman10-bolditalic.otf new file mode 100644 index 0000000..98297be Binary files /dev/null and b/web/fonts/lmroman10-bolditalic.otf differ diff --git a/web/fonts/lmroman10-italic.otf b/web/fonts/lmroman10-italic.otf new file mode 100644 index 0000000..b369873 Binary files /dev/null and b/web/fonts/lmroman10-italic.otf differ diff --git a/web/fonts/lmroman10-regular.otf b/web/fonts/lmroman10-regular.otf new file mode 100644 index 0000000..6a96b46 Binary files /dev/null and b/web/fonts/lmroman10-regular.otf differ diff --git a/web/index.html b/web/index.html index 8e97590..c96bfaa 100644 --- a/web/index.html +++ b/web/index.html @@ -3,21 +3,23 @@ - PhotoFloat + JasonDonenfeld.com – Colors -
-

- -

Photos

-
- -

Sub-albums

-
+
Colors
+
+
+
Loading...
+
+
+
+
+ + ← +
-
diff --git a/web/js/010-control.js b/web/js/010-control.js new file mode 100644 index 0000000..37ca797 --- /dev/null +++ b/web/js/010-control.js @@ -0,0 +1,175 @@ +$(document).ready(function() { + function cachePath(path) { + if (path == "") + return "root"; + if (path[0] == '/') + path = path.substring(1); + return path.replace(/ /g, "_").replace(/\//g, "-"); + } + function imagePath(image, path, size, square) { + var suffix; + if (square) + suffix = size.toString() + "s"; + else + suffix = size.toString(); + return "cache/" + cachePath(path + "/" + image + "_" + suffix + ".jpg"); + } + function loadAlbum() { + if (current_album_cache in album_cache) { + albumLoaded(album_cache[current_album_cache]); + return; + } + $("#loading").show(); + $.ajax({ + type: "GET", + url: "cache/" + current_album_cache + ".json", + error: function() { $(document.body).html("Couldn't fetch it."); }, + success: albumLoaded + }); + } + function albumLoaded(album) { + $("#loading").hide(); + album_cache[cachePath(album.path)] = album; + current_album = album; + if (cachePath(album.path) == current_album_cache) + showAlbum(); + if (current_photo_cache != null) + showPhoto(); + setTitle(); + } + function setTitle() { + var title = ""; + var components; + if (current_album.path.length == 0) + components = [document.title]; + else { + components = current_album.path.split("/"); + components.unshift(document.title); + } + var last = ""; + for (var i = 0; i < components.length; ++i) { + if (i) + last += "/" + components[i]; + if (i < components.length - 1 || current_photo_cache != null) + title += ""; + title += components[i]; + if (i < components.length - 1 || current_photo_cache != null) { + title += ""; + title += " » "; + } + } + if (current_photo_cache != null) + title += current_photo.name; + $("#title").html(title); + } + function showAlbum() { + $("html, body").animate({ scrollTop: 0 }, "slow"); + var photos = ""; + for (var i = 0; i < current_album.photos.length; ++i) + photos += ""; + $("#thumbs").html(photos); + if (current_album.albums.length) + $("#subalbums-title").show(); + else + $("#subalbums-title").hide(); + var subalbums = ""; + for (var i = 0; i < current_album.albums.length; ++i) + subalbums += "
" + current_album.albums[i].path + "
"; + $("#subalbums").html(subalbums); + + $("#album-view").removeClass("photo-view-container"); + $("#subalbums").show(); + $("#photo-view").hide(); + } + function showPhoto() { + currentPhoto(); + if (current_photo == null) { + $(document.body).html("Wrong picture."); + return; + } + var maxSize = 640; + var width = current_photo.size[0]; + var height = current_photo.size[1]; + if (width > height) { + height = height / width * maxSize; + width = maxSize; + } else { + width = width / height * maxSize; + height = maxSize; + } + $("#photo") + .attr("width", width).attr("height", height) + .attr("src", imagePath(current_photo.name, current_album.path, maxSize, false)) + .attr("alt", current_photo.name) + .attr("title", current_photo.name); + var nextLink = "#" + current_album_cache + "/" + cachePath(current_album.photos[ + (current_photo_index + 1 >= current_album.photos.length) ? 0 : (current_photo_index + 1) + ].name); + $("#next-photo").attr("href", nextLink); + $("#next").attr("href", nextLink); + $("#back").attr("href", "#" + current_album_cache + "/" + cachePath(current_album.photos[ + (current_photo_index - 1 < 0) ? (current_album.photos.length - 1) : (current_photo_index - 1) + ].name)); + + $("#album-view").addClass("photo-view-container"); + $("#subalbums").hide(); + $("#photo-view").show(); + var thumb = $("#thumb-" + current_photo_cache.replace(/\./g, "\\.")); + var scroller = $("#album-view"); + scroller.stop(); + scroller.animate({ scrollLeft: thumb.position().left + scroller.scrollLeft() - scroller.width() / 2 + thumb.width() / 2 }, "slow"); + } + function currentPhoto() { + for (current_photo_index = 0; current_photo_index < current_album.photos.length; ++current_photo_index) { + if (cachePath(current_album.photos[current_photo_index].name) == current_photo_cache) + break; + } + if (current_photo_index >= current_album.photos.length) { + current_photo = null; + current_photo_index = -1; + return; + } + current_photo = current_album.photos[current_photo_index]; + } + var current_album_cache = null; + var current_photo_cache = null; + var current_album = null; + var current_photo = null; + var current_photo_index = -1; + var album_cache = new Array(); + $(window).hashchange(function() { + var new_album_cache = location.hash.substring(1); + var index = new_album_cache.lastIndexOf("/"); + if (index != -1 && index != new_album_cache.length - 1) { + current_photo_cache = new_album_cache.substring(index + 1); + new_album_cache = new_album_cache.substring(0, index); + } else + current_photo_cache = null; + if (!new_album_cache.length) + new_album_cache = cachePath("root"); + if (new_album_cache != current_album_cache) { + current_album_cache = new_album_cache; + loadAlbum(); + } else if (current_photo_cache != null) { + showAlbum(); + showPhoto(); + setTitle(); + } else { + showAlbum(); + setTitle(); + } + }); + $(window).hashchange(); + $(document).keydown(function(e){ + if (current_photo_cache == null) + return true; + if (e.keyCode == 39) { + window.location.href = $("#next").attr("href"); + return false; + } else if (e.keyCode == 37) { + window.location.href = $("#back").attr("href"); + return false; + } + return true; + }); +}); diff --git a/web/js/010-debugger.js b/web/js/010-debugger.js deleted file mode 100644 index 31d3db8..0000000 --- a/web/js/010-debugger.js +++ /dev/null @@ -1,102 +0,0 @@ -$(document).ready(function() { - function cachePath(path) { - return path.replace(/ /g, "_").replace(/\//g, "-"); - } - function imagePath(image, path, size, square) { - var suffix; - if (square) - suffix = size.toString() + "s"; - else - suffix = size.toString(); - return "cache/" + cachePath(path + "/" + image + "_" + suffix + ".jpg"); - } - function loadAlbum(path) { - if (path in album_cache) { - albumLoaded(album_cache[path]); - return; - } - $.ajax({ - type: "GET", - url: "cache/" + path + ".json", - error: function() { $(document.body).html("Couldn't fetch it."); }, - success: albumLoaded - }); - } - function albumLoaded(album) { - album_cache[cachePath(album.path)] = album; - current_album = album; - if (current_image_cache != null) - showPhoto(); - else if (cachePath(album.path) == current_album_cache) - showAlbum(); - } - function showAlbum() { - $("html, body").animate({ scrollTop: 0 }, "slow"); - var title = ""; - var components = current_album.path.split("/"); - var last = ""; - for (var i = 0; i < components.length; ++i) { - last += "/" + components[i]; - if (i < components.length - 1) - title += ""; - title += components[i]; - if (i < components.length - 1) { - title += ""; - title += " » "; - } - } - $("#title").html(title); - var photos = ""; - for (var i = 0; i < current_album.photos.length; ++i) - photos += ""; - $("#photos").html(photos); - if (current_album.albums.length) - $("#subalbums-title").show(); - else - $("#subalbums-title").hide(); - var subalbums = ""; - for (var i = 0; i < current_album.albums.length; ++i) - subalbums += "
  • " + current_album.albums[i].path + "
    • "; - $("#subalbums").html(subalbums); - - $("#album").fadeIn(); - $("#photo").fadeOut(); - } - function showPhoto() { - var index; - for (index = 0; index < current_album.photos.length; ++index) { - if (cachePath(current_album.photos[index].name) == current_image_cache) - break; - } - if (index >= current_album.photos.length) { - $(document.body).html("Wrong picture."); - return; - } - $("#photo").html(""); - $("#album").fadeOut(); - $("#photo").fadeIn(); - } - var current_album_cache = ""; - var current_image_cache = ""; - var current_album = null; - var album_cache = new Array(); - $(window).hashchange(function() { - var new_album_cache = location.hash.substring(1); - var index = new_album_cache.lastIndexOf("/"); - if (index != -1 && index != new_album_cache.length - 1) { - current_image_cache = new_album_cache.substring(index + 1); - new_album_cache = new_album_cache.substring(0, index); - } else - current_image_cache = null; - if (!new_album_cache.length) - new_album_cache = cachePath("New York Summer 2009"); //root - if (new_album_cache != current_album_cache) { - current_album_cache = new_album_cache; - loadAlbum(current_album_cache); - } else if (current_image_cache != null) - showPhoto(); - else - showAlbum(); - }); - $(window).hashchange(); -});