diff --git a/web/css/000-controls.css b/web/css/000-controls.css index 3c3d986..2a8ea33 100644 --- a/web/css/000-controls.css +++ b/web/css/000-controls.css @@ -103,6 +103,34 @@ a:hover { -webkit-border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; } +#metadata { + background-color: #000000; + width: 220px; + font-size: 12px; + line-height: 12px; + padding-top: 3px; + padding-bottom: 3px; + padding-right: 10px; + padding-left: 10px; + display: none; + margin: 0 auto; + margin-top: 1px; + border-top-right-radius: 5px; + border-top-left-radius: 5px; + -moz-border-top-right-radius: 5px; + -moz-border-top-left-radius: 5px; + -webkit-border-top-right-radius: 5px; + -webkit-border-top-left-radius: 5px; + opacity: 0.5; + -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; + filter: alpha(opacity=50); +} +#metadata table { + text-align: left; +} +#metadata tr { + height: 14px; +} #photo-bar { position: absolute; bottom: 0; diff --git a/web/index.html b/web/index.html index dabc3f6..99a6460 100644 --- a/web/index.html +++ b/web/index.html @@ -20,8 +20,9 @@
diff --git a/web/js/010-control.js b/web/js/010-control.js index d41d41d..9c08eba 100644 --- a/web/js/010-control.js +++ b/web/js/010-control.js @@ -150,7 +150,22 @@ $(document).ready(function() { (current_photo_index - 1 < 0) ? (current_album.photos.length - 1) : (current_photo_index - 1) ].name)); $("#original-link").attr("target", "_blank").attr("href", "albums/" + current_album.path + "/" + current_photo.name); - $("#metadata-link").attr("href", "javascript:alert('Coming soon...')"); + + var text = "Camera Maker | " + current_photo.make + " |
Camera Model | " + current_photo.model + " |
Time Taken | " + current_photo.date + " |
Resolution | " + current_photo.size[0] + " x " + current_photo.size[1] + " |
Shutter Speed | " + current_photo.shutterSpeed + " |
Aperture | " + current_photo.aperture + " |
Focal Length | " + current_photo.focalLength + " |
ISO Sensitivity | " + current_photo.iso + " |
Exposure Compenstation | " + current_photo.exposureCompenstaion + " |
Metering Mode | " + current_photo.meteringMode + " |
Flash Fired | " + current_photo.flashFired + " |
Orientation | " + current_photo.orientation + " |