diff options
| -rw-r--r-- | mediagoblin/db/mixin.py | 27 | ||||
| -rw-r--r-- | mediagoblin/static/css/base.css | 32 | ||||
| -rw-r--r-- | mediagoblin/templates/mediagoblin/utils/exif.html | 83 |
3 files changed, 139 insertions, 3 deletions
diff --git a/mediagoblin/db/mixin.py b/mediagoblin/db/mixin.py index a0eeff61..8fb9940c 100644 --- a/mediagoblin/db/mixin.py +++ b/mediagoblin/db/mixin.py @@ -237,6 +237,33 @@ class MediaEntryMixin(GenerateSlugMixin): label = re.sub('(.)([A-Z][a-z]+)', r'\1 \2', key) yield label.replace('EXIF', '').replace('Image', ''), exif_all[key] + def exif_display_data_short(self): + """Display a very short practical version of exif info""" + import time, datetime + if not self.media_data: + return + exif_all = self.media_data.get("exif_all") + # format date taken + takendate = datetime.datetime.strptime( + exif_all['Image DateTimeOriginal']['printable'], + '%Y:%m:%d %H:%M:%S').date() + taken = takendate.strftime('%B %d %Y') + fnum = str(exif_all['EXIF FNumber']['printable']).split('/') + # calculate aperture + if len(fnum) == 2: + aperture = "f/%.1f" % (float(fnum[0])/float(fnum[1])) + elif fnum[0] != 'None': + aperture = "f/%s" % (fnum[0]) + else: + aperture = None + return { + "Camera" : exif_all['Image Model']['printable'], + "Exposure" : '%s sec' % exif_all['EXIF ExposureTime']['printable'], + "Aperture" : aperture, + "ISO" : exif_all['EXIF ISOSpeedRatings']['printable'], + "Focal Length" : '%s mm' % exif_all['EXIF FocalLength']['printable'], + "Date Taken" : taken, + } class MediaCommentMixin(object): @property diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css index 0cb36753..096e2522 100644 --- a/mediagoblin/static/css/base.css +++ b/mediagoblin/static/css/base.css @@ -481,6 +481,38 @@ img.media_icon { vertical-align: sub; } +/* EXIF information */ + +#exif_content h3 { + border-bottom: 1px solid #333; +} + +#exif_camera_information { + margin-bottom: 20px; +} + +#exif_additional_info { + display: none; +} + +#exif_additional_info table { + font-size: 11px; + margin-top: 10px; +} + +#exif_additional_info td { + vertical-align: top; + padding-bottom: 5px; +} + +#exif_content .col1 { + padding-right: 20px; +} + +#exif_additional_info table tr { + margin-bottom: 10px; +} + /* navigation */ .navigation { diff --git a/mediagoblin/templates/mediagoblin/utils/exif.html b/mediagoblin/templates/mediagoblin/utils/exif.html index a89e69c8..746dccf5 100644 --- a/mediagoblin/templates/mediagoblin/utils/exif.html +++ b/mediagoblin/templates/mediagoblin/utils/exif.html @@ -17,18 +17,95 @@ #} {% block exif_content %} +<style type="text/css"> +#exif_content h3 { + border-bottom: 1px solid #333; +} +#exif_camera_information { + margin-bottom: 20px; +} + +#exif_additional_info { + display: none; +} +#exif_additional_info table { + font-size: 11px; + margin-top: 10px; +} +#exif_additional_info td { + vertical-align: top; + padding-bottom: 5px; +} +#exif_content .col1 { + padding-right: 20px; +} +#exif_additional_info table tr { + margin-bottom: 10px; +} +</style> +<noscript> + <style type="text/css"> + #exif_additional_info { + display: block; + } + </style> +</noscript> +<div id="exif_content"> {% if app_config['exif_visible'] and media.media_data and media.media_data.exif_all is defined and media.media_data.exif_all %} - <h3>EXIF</h3> - <table> + <h3>Camera Information</h3> + <table id="exif_camera_information"> + <tbody> + <tr> + <td class="col1">Taken on</td> + <td>{{ media.exif_display_data_short()['Date Taken'] }}</td> + </tr> + <tr> + <td class="col1">Camera</td> + <td>{{ media.exif_display_data_short()['Camera'] }}</td> + </tr> + <tr> + <td class="col1">Exposure</td> + <td>{{ media.exif_display_data_short()['Exposure'] }}</td> + </tr> + <tr> + <td class="col1">Aperture</td> + <td>{{ media.exif_display_data_short()['Aperture'] }}</td> + </tr> + <tr> + <td class="col1">ISO</td> + <td>{{ media.exif_display_data_short()['ISO'] }}</td> + </tr> + <tr> + <td class="col1">Focal Length</td> + <td>{{ media.exif_display_data_short()['Focal Length'] }}</td> + </tr> + </tbody> + </table> + <h3 id="exif_additional_info_button" class="button_action"> + Additional Information + </h3> + <div id="exif_additional_info"> + <table class="exif_info"> {% for key, tag in media.exif_display_iter() %} <tr> - <td>{{ key }}</td> + <td class="col1">{{ key }}</td> <td>{{ tag.printable }}</td> </tr> {% endfor %} </table> + </div> {% endif %} +<script type="text/javascript"> +$(document).ready(function(){ + +$("#exif_additional_info_button").click(function(){ + $("#exif_additional_info").slideToggle("slow"); +}); + +}); +</script> +</div> <!-- end exif_content div --> {% endblock %} |