summaryrefslogtreecommitdiff
path: root/templates/details/photo_galleries.html
blob: 04e1088b925c88ee0d6b2e060699fcc9d1540356 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Luxagraf | Photos | {{object.set_title}}</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <!--[if IE]>
    <script src="http://media.luxagraf.net/js/html5.js"></script>
    <![endif]-->


    <link rel="alternate" 
          type="application/rss+xml" 
          title="RSS 2.0"
          href="http://feeds2.feedburner.com/luxagraf/blog">


    <link rel="stylesheet" 
          href="{{MEDIA_URL}}css/photos.css" 
          type="text/css" 
          media="screen">
          
    

    <link rel="shortcut icon" 
          href="http://media.luxagraf.net/img/favicon.ico" 
          type="image/vnd.microsoft.icon">

    <link rel="apple-touch-icon" 
          href="http://media.luxagraf.net/img/luxagrafiphoneicon.png">

    <meta name="author" content="luxagraf">
    <meta name="description" 
          content="Slideshow: Photos from {{object.set_title}}">
    <meta name="keywords" 
          content="photos, slideshow, {{object.set_title}}">
    <meta name="copyright" 
          content="Licensed under the Creative Commons Attribution-Noncommercial-Share Alike 3.0  License">

    
    <script type="text/javascript" src="/media/js/jquery.js"></script>
    <script type="text/javascript" src="/media/js/jquery.cycle.pack.js"></script>
    <script type="text/javascript" src="/media/js/jquery.jcarousel.pack.js"></script>
    <script type="text/javascript" src="/media/js/slideshow.pack.js" ></script>
    <!-- if you'd like to see a non-packed version of my slideshow script, see this file: http://media.luxagraf.net/js/slideshow.js (requires jquery, jcarousel and cycle) -->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

</head>
<body>
    <div id="wrapper">
        <ul id="breadcrumbs">
               <li><a href="/" title="luxagraf homepage">Home</a> &rarr;</li>
               <li><a href="/photos/" title="luxagraf photos">Photos</a> &rarr; </li>
               <li>{{object.set_title}}</li>
        </ul>
        <ul id="instructions">
               <li>Hover image to pause,</li>
               <li> &nbsp;&larr; &amp; &rarr; to navigate</li>
        </ul>

        <ul id="slides">
        {%for photo in object.photos.all reversed %}
            <li class="bigimg" id="{{photo.get_local_slideshow_url}}" style="height: {{photo.slideshowimage_height}}px; width:{{photo.slideshowimage_width}}px; margin-top:{{photo.slideshowimage_margintop}}px; margin-left:{{photo.slideshowimage_marginleft}}px;"> 
                <div class="figure">
                    <img src="{{photo.get_local_slideshow_url}}" alt="{{photo.title}}" title="{{photo.title}}" class="imgs" height="{{photo.slideshowimage_height}}" width="{{photo.slideshowimage_width}}" />
                </div>
                <div class="legend">
                    <div class="caption">
                        <h5>{{photo.title}} &nbsp;&nbsp;<span>{{photo.exif_date|date:"M j, Y"}}</span></h5>
                        {%if photo.description %}
                        <p>{{photo.description|safe}}</p>
                        {%endif%}
                    </div>
                    
                    <div class="photo-options">
                        <a class="map-link" href="#" title="{{photo.lat}},{{photo.lon}},{{photo.title}}">Map</a>
                        <a href="#" class="exif-link" title="{{photo.id}}">Camera</a>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="meta" style="display: none;">
                        <dl>
                            <dt>Camera:</dt>
                            <dd>{% if photo.exif_make == 'Canon'%}{{photo.exif_model}}{%endif%}{% if photo.exif_model == 'DMC-LX2'%}{{photo.exif_make}} {{photo.exif_model}}{%endif%}{%if photo.exif_model == 'DMC-GF1' %}<a href="http://amzn.to/cLQozJ" title="Buy on Amazon">{{photo.exif_make}} {{photo.exif_model}}</a>{%endif%}</dd>
                            <dt>Lens: </dt>
                            <dd>{%if photo.exif_lens == 'LUMIX G VARIO 14-45/F3.5-5.6' %}<a href="http://amzn.to/azIr5w" title="buy the {{photo.exif_lens}} on Amazon">{{photo.exif_lens}}</a>{%endif%}{%if photo.exif_lens == 'LUMIX G 20/F1.7' %}<a href="http://amzn.to/daMYOm" title="buy the {{photo.exif_lens}} on Amazon">{{photo.exif_lens}}</a>{%endif%}{%if photo.exif_lens =='' %}Built-in{%endif%}</dd>
                            <dt>Exposure</dt>
                            <dd>{{photo.exif_exposure}}</dd>
                            <dt>Aperture</dt>
                            <dd>{{photo.exif_aperture}}</dd>
                            <dt>Focal Length: </dt>
                            <dd>{{photo.exif_focal_length}}</dd>
                            <dt>ISO: </dt>
                            <dd>{{photo.exif_iso}}</dd>
                            <dt>Comments: </dt>
                            <dd><a href="{{photo.flickr_link}}" title="View this Photo on Flickr.com">View on Flickr</a></dd>
                        </dl>
                 </div>
            </li>
        {% endfor %}
        </ul>
    </div>
</body>

</html>