{% extends "base.html" %}

{% block og_title %}{{object.title}}{% endblock %}
{% block og_type %}Article{% endblock %}
{% block og_url %}{{object.get_absolute_url}}{% endblock %}
{% block og_description %}{% if object.description %}{{object.description}}{% else %}{{object.title}}{% endif %}{% endblock %}
{% block og_image %}{% for photo in object.photos.all|dictsortreversed:"weight" %}{% if forloop.first %}{{photo.get_facebook_og_image_url}}{% endif %}{% endfor %}{% endblock %}

{% block title %}{{object.title}}{% endblock %}
{% block rel-img %}{% for photo in object.photos.all|dictsortreversed:"weight" %}{% if forloop.first %}{{photo.get_square_url}}{% endif %}{% endfor %}{% endblock %}
{% block description %}{{object.description}}{% endblock %}

{% block content %}
<div style="width:100%; margin:0; padding:0">
	<div class="main_content_left">
	<div style="padding-left:12px; padding-right:12px; padding-top:12px">
		<h2 class="sectionhead_wide">Photo Gallery</h2>
		{% for e in object.visitorsedition_set.all %}
			<div align="center">
				<a href="{% url vs-index %}" class="return">Return to the Seasonal Guide Visitor's Portal</a>
			</div>
		{% endfor %}
		<p><span class="headline">{{object.title}}</span></p>
		{% if object.description %}
		{% load markup typogrify humanize  %}
			<p>{{object.description|urlize|markdown|typogrify}}</p>
		{% endif %}
	</div>

	<div style="padding-left:12px; width:756px">
	{% for photo in object.photos.all|dictsortreversed:"weight" %}
		{% if photo.image.width >= photo.image.height %}
		<div style="float:left; padding-right:14px; padding-bottom:12px; width:100px; display:table; clear:both">
			<img src="{{photo.get_detail_url}}" alt="{{photo.title}}" order="0">
		<div style="padding-top:15px">
			{% load markup typogrify humanize  %}
			<div class="newcutline"><p class="newcuthead">{{photo.title}}</p></div>
			<div class="newcutline">{{photo.description|urlize|markdown|typogrify}}</div>
			{% if photo.photographer %}
				<p class="photobyline">Photo by {{photo.photographer}}</p>
			{% endif %}
			{% if photo.courtesy %}
				<p class="photobyline">Photo courtesy of {{photo.courtesy}}</p>
			{% endif %}
			{% if photo.file_photo %}
				<p class="photobyline">Penobscot Bay Press file photo</p>
			{% endif %}
			{% if photo.story_set.all %}
				<p class="relatedstory" style="text-align:left"> 
				{% for s in photo.story_set.all %}
					<a href="{{s.get_absolute_url}}" alt="{{s}}">Related story</a><br>
				{% endfor %}
				</p>
			{% endif %}
		</div>
		</div>
		{% endif %}
	
		{% if photo.image.width < photo.image.height %}
		<div style="float:left; padding-right:14px; padding-bottom:12px; clear:both">
			<img src="{{photo.get_detail_url}}" alt="{{photo.title}}" order="0">
		</div>	
		<div style="float:left; padding-top:150px; width:225px">
			{% load markup typogrify humanize  %}
			<div class="newcutline"><p class="newcuthead">{{photo.title}}</p></div>
			<div class="newcutline">{{photo.description|urlize|markdown|typogrify}}</div>
			{% if photo.photographer %}
				<p class="photobyline">Photo by {{photo.photographer}}</p>
			{% endif %}
			{% if photo.courtesy %}
				<p class="photobyline">Photo courtesy of {{photo.courtesy}}</p>
			{% endif %}
			{% if photo.file_photo %}
				<p class="photobyline">Penobscot Bay Press file photo</p>
			{% endif %}
			{% if photo.story_set.all %}
				<p class="relatedstory" style="text-align:left"> 
				{% for s in photo.story_set.all %}
					<a href="{{s.get_absolute_url}}" alt="{{s}}">Related story</a><br>
				{% endfor %}
				</p>
			{% endif %}
		</div>
		{% endif %}
	{% endfor %}
	</div>
</div>

<div class="sidebar_right_media" style="background-color:#99CCFF; padding:0px">
	<div style="padding:4px; text-align:center; margin:0px 0px 10px 0px">
		<p class="relatedstory"><a href="http://penobscotbaypress.smugmug.com/">Order Photos</a></p>
		<div class="newcutline"><strong>Order many of the photos you see on our website and then some!</strong><br><br>
		Most prints start at $1 and are delivered directly to you. Print your favorite newspaper photos on a mug, a t-shirt, or even poster size. Browse by publication date, keyword search or the individual galleries. Share your favorite photos to social media or download a link to share with all your friends and family.</span></div>
		<a href="http://penobscotbaypress.smugmug.com/" class="head_link"><img src="https://penobscotbaypress.com/static/images/headers/2013/smugmug_teaser_img_2014_blue.jpg"></a>
	</div>
</div>
	<div class="sidebar_right_media">
		<!-- Google AdSense BEGIN -->
		<div style="clear:both; text-align:center">
			<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
			<!-- Square ad for right of pages -->
			<ins class="adsbygoogle"
			style="display:inline-block;width:250px;height:250px"
			data-ad-client="ca-pub-7616595738812584"
			data-ad-slot="7790117357"></ins>
			<script>
			(adsbygoogle = window.adsbygoogle || []).push({});
			</script>
		</div>
		<!-- Google AdSense END -->
		<br>
		<!-- Google AdSense BEGIN -->
		<div style="clear:both; text-align:center">
			<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
			<!-- Square ad for right of pages -->
			<ins class="adsbygoogle"
			style="display:inline-block;width:250px;height:250px"
			data-ad-client="ca-pub-7616595738812584"
			data-ad-slot="7790117357"></ins>
			<script>
			(adsbygoogle = window.adsbygoogle || []).push({});
			</script>
		</div>
		<!-- Google AdSense END -->
	</div>
	</div>
		<div style="padding-left:12px; padding-right:12px; padding-bottom:0px; clear:both">
			<!-- AddThis Button BEGIN -->
			<div>
				<a class="addthis_button_facebook_like" fb:like:layout="standard"></a>
			</div>
			<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
			<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=penbaypress"></script>
			<!-- AddThis Button END -->
		</div>
		
<div style="padding:20px; text-align:center; margin-left:auto; margin-right:auto; clear:both">
	<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
	<!-- Large banner for bottom of pages -->
	<ins class="adsbygoogle"
		 style="display:inline-block;width:728px;height:90px"
		 data-ad-client="ca-pub-7616595738812584"
		 data-ad-slot="1750256958"></ins>
	<script>
	(adsbygoogle = window.adsbygoogle || []).push({});
	</script>		
</div>

<!-- AddThis Smart Layers BEGIN -->
<!-- Go to http://www.addthis.com/get/smart-layers to customize -->
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=penbaypress"></script>
<script type="text/javascript">
  addthis.layers({
    'theme' : 'transparent',
    'share' : {
      'position' : 'right',
      'services' : 'facebook,twitter,email,print,gmail,tumblr,more',
    }, 
    'follow' : {
      'services' : [
        {'service': 'facebook', 'id': 'penobscotbaypress'},
        {'service': 'youtube', 'id': 'penobscotbaypress'},
        {'service': 'rss', 'id': 'http://https://penobscotbaypress.com/news/feed.xml'}
      ]
    }   
  });
</script>
<!-- AddThis Smart Layers END -->

{% endblock %}
