From 711719ce0ce340fbcda7559bf20582e85e4b1e3d Mon Sep 17 00:00:00 2001
From: root <root@bawker.net>
Date: Wed, 7 May 2014 12:01:12 -0700
Subject: [PATCH 1/4] Made some changes to img tags to enforce max-width
 everywhere, and to the page headers to allow user scaling.

---
 include/bbcode.php      | 12 ++++++------
 view/tpl/head.tpl       |  2 +-
 view/tpl/photo_view.tpl |  2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/include/bbcode.php b/include/bbcode.php
index 326676b72..92d979638 100644
--- a/include/bbcode.php
+++ b/include/bbcode.php
@@ -606,24 +606,24 @@ function bbcode($Text,$preserve_nl = false, $tryoembed = true) {
 	// Images
 	// [img]pathtoimage[/img]
 	if (strpos($Text,'[/img]') !== false) {
-		$Text = preg_replace("/\[img\](.*?)\[\/img\]/ism", '<img src="$1" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[img\](.*?)\[\/img\]/ism", '<img style="max-width=100%;" src="$1" alt="' . t('Image/photo') . '" />', $Text);
 	}
 	if (strpos($Text,'[/zmg]') !== false) {
-		$Text = preg_replace("/\[zmg\](.*?)\[\/zmg\]/ism", '<img class="zrl" src="$1" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[zmg\](.*?)\[\/zmg\]/ism", '<img class="zrl" style="max-width=100%;" src="$1" alt="' . t('Image/photo') . '" />', $Text);
 	}
 
 	// [img float={left, right}]pathtoimage[/img]
 	if (strpos($Text,'[/img]') !== false) {
-		$Text = preg_replace("/\[img float=left\](.*?)\[\/img\]/ism", '<img src="$1" style="float: left;" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[img float=left\](.*?)\[\/img\]/ism", '<img style="max-width=100%;" src="$1" style="float: left;" alt="' . t('Image/photo') . '" />', $Text);
 	}
 	if (strpos($Text,'[/img]') !== false) {
-		$Text = preg_replace("/\[img float=right\](.*?)\[\/img\]/ism", '<img src="$1" style="float: right;" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[img float=right\](.*?)\[\/img\]/ism", '<img style="max-width=100%;" src="$1" style="float: right;" alt="' . t('Image/photo') . '" />', $Text);
 	}
 	if (strpos($Text,'[/zmg]') !== false) {
-		$Text = preg_replace("/\[zmg float=left\](.*?)\[\/zmg\]/ism", '<img class="zrl" src="$1" style="float: left;" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[zmg float=left\](.*?)\[\/zmg\]/ism", '<img style="max-width=100%;" class="zrl" src="$1" style="float: left;" alt="' . t('Image/photo') . '" />', $Text);
 	}
 	if (strpos($Text,'[/zmg]') !== false) {
-		$Text = preg_replace("/\[zmg float=right\](.*?)\[\/zmg\]/ism", '<img class="zrl" src="$1" style="float: right;" alt="' . t('Image/photo') . '" />', $Text);
+		$Text = preg_replace("/\[zmg float=right\](.*?)\[\/zmg\]/ism", '<img style="max-width=100%;" class="zrl" src="$1" style="float: right;" alt="' . t('Image/photo') . '" />', $Text);
 	}
 
 	// [img=widthxheight]pathtoimage[/img]
diff --git a/view/tpl/head.tpl b/view/tpl/head.tpl
index e7b41523f..54aa5d41c 100755
--- a/view/tpl/head.tpl
+++ b/view/tpl/head.tpl
@@ -1,6 +1,6 @@
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <base href="{{$baseurl}}/" />
-<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=0">
+<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=1">
 <meta name="generator" content="{{$generator}}" />
 
 <!--[if IE]>
diff --git a/view/tpl/photo_view.tpl b/view/tpl/photo_view.tpl
index 01f135522..099c5cd17 100755
--- a/view/tpl/photo_view.tpl
+++ b/view/tpl/photo_view.tpl
@@ -9,7 +9,7 @@
 </div>
 
 {{if $prevlink}}<div id="photo-prev-link"><a href="{{$prevlink.0}}"><i class="icon-backward photo-icons"></i></div>{{/if}}
-<div id="photo-photo"><a href="{{$photo.href}}" title="{{$photo.title}}" onclick="$.colorbox({href: '{{$photo.href}}'}); return false;" ><img src="{{$photo.src}}" /></a></div>
+<div id="photo-photo"><a href="{{$photo.href}}" title="{{$photo.title}}"; return false;" ><img style="max-width: 100%;" src="{{$photo.src}}" /></a></div>
 {{if $nextlink}}<div id="photo-next-link"><a href="{{$nextlink.0}}"><i class="icon-forward photo-icons"></i></a></div>{{/if}}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">{{$desc}}</div>

From ed5cebd3d6b87a5c2254f3fa48b03d93558fa7bc Mon Sep 17 00:00:00 2001
From: root <root@bawker.net>
Date: Sat, 10 May 2014 11:15:27 -0700
Subject: [PATCH 2/4] Made code changes to serve higher resolution images in
 displays with high pixel density.

---
 mod/photo.php     | 35 ++++++++++++++++++++++++++++++++++-
 view/tpl/head.tpl |  3 +++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/mod/photo.php b/mod/photo.php
index 1319f9569..b351ce17f 100644
--- a/mod/photo.php
+++ b/mod/photo.php
@@ -80,6 +80,22 @@ function photo_init(&$a) {
 		 * Other photos
 		 */
 
+	        /* Check for a cookie to indicate display pixel density, in order to detect high-resolution
+		   displays. This procedure was derived from the "Retina Images" by Jeremey Worboys,
+		   used in accordance with the Creative Commons Attribution 3.0 Unported License.
+		   Project link: https://github.com/Retina-Images/Retina-Images
+		   License link: http://creativecommons.org/licenses/by/3.0/
+		*/
+		$cookie_value = false;
+		if (isset($_COOKIE['devicePixelRatio'])) {
+		  $cookie_value = intval($_COOKIE['devicePixelRatio']);
+		}
+		else {
+		  // Force revalidation of cache on next request
+		  $cache_directive = 'no-cache';
+		  $status = 'no cookie';
+		}
+
 		$resolution = 0;
 
 		if(strpos($photo,'.') !== false)
@@ -88,7 +104,24 @@ function photo_init(&$a) {
 		if(substr($photo,-2,1) == '-') {
 			$resolution = intval(substr($photo,-1,1));
 			$photo = substr($photo,0,-2);
+			// Serve high-resolution images regardless (this is rude):
+			// [Note: this can be improved by setting a cookie to indicate that the user is viewing on a high-resolution display]
+			if ($resolution == 2 && ($cookie_value > 1))
+			  {
+			    $resolution = 1;
+			  }
 		}
+		
+		// If using resolution 1, make sure it exists before proceeding:
+		if ($resolution == 1)
+		  {
+		    $r = q("SELECT uid FROM photo WHERE resource_id = '%s' AND scale = %d LIMIT 1",
+			   dbesc($photo),
+			   intval($resolution)
+			   );
+		    if (!($r))
+		      $resolution = 2;
+		  }
 
 		$r = q("SELECT uid FROM photo WHERE resource_id = '%s' AND scale = %d LIMIT 1",
 			dbesc($photo),
@@ -125,7 +158,7 @@ function photo_init(&$a) {
 					dbesc($photo),
 					intval($resolution)
 				);
-
+ 
 				if($r) {
 					logger('mod_photo: forbidden. ' . $a->query_string);
 					$observer = $a->get_observer();
diff --git a/view/tpl/head.tpl b/view/tpl/head.tpl
index 54aa5d41c..496758079 100755
--- a/view/tpl/head.tpl
+++ b/view/tpl/head.tpl
@@ -7,6 +7,9 @@
 <script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->
 
+<script>(function(w){var dpr=((w.devicePixelRatio===undefined)?1:w.devicePixelRatio);if(!!w.navigator.standalone){var r=new XMLHttpRequest();r.open('GET','/retinaimages.php?devicePixelRatio='+dpr,false);r.send()}else{document.cookie='devicePixelRatio='+dpr+'; path=/'}})(window)</script>
+<noscript><style id="devicePixelRatio" media="only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2)">html{background-image:url("/retinaimages.php?devicePixelRatio=2")}</style></noscript>
+
 {{$head_css}}
 
 {{$js_strings}}

From 874b8d40ff14e39bac4875efbaee2f24121d20bd Mon Sep 17 00:00:00 2001
From: root <root@bawker.net>
Date: Sat, 10 May 2014 11:22:00 -0700
Subject: [PATCH 3/4] Changed some comments.

---
 mod/photo.php | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/mod/photo.php b/mod/photo.php
index b351ce17f..9302278b6 100644
--- a/mod/photo.php
+++ b/mod/photo.php
@@ -104,8 +104,7 @@ function photo_init(&$a) {
 		if(substr($photo,-2,1) == '-') {
 			$resolution = intval(substr($photo,-1,1));
 			$photo = substr($photo,0,-2);
-			// Serve high-resolution images regardless (this is rude):
-			// [Note: this can be improved by setting a cookie to indicate that the user is viewing on a high-resolution display]
+			// If viewing on a high-res screen, attempt to serve a higher resolution image:
 			if ($resolution == 2 && ($cookie_value > 1))
 			  {
 			    $resolution = 1;

From d1e0479f58e32c63160c7ad9dbd0c1c2363a1b6c Mon Sep 17 00:00:00 2001
From: root <root@bawker.net>
Date: Sat, 10 May 2014 11:35:16 -0700
Subject: [PATCH 4/4] Removed some unnecessary changes.

---
 view/tpl/head.tpl       | 2 +-
 view/tpl/photo_view.tpl | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/view/tpl/head.tpl b/view/tpl/head.tpl
index 496758079..a212fd486 100755
--- a/view/tpl/head.tpl
+++ b/view/tpl/head.tpl
@@ -1,6 +1,6 @@
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <base href="{{$baseurl}}/" />
-<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=1">
+<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=0">
 <meta name="generator" content="{{$generator}}" />
 
 <!--[if IE]>
diff --git a/view/tpl/photo_view.tpl b/view/tpl/photo_view.tpl
index 099c5cd17..b34f3fcf5 100755
--- a/view/tpl/photo_view.tpl
+++ b/view/tpl/photo_view.tpl
@@ -9,7 +9,7 @@
 </div>
 
 {{if $prevlink}}<div id="photo-prev-link"><a href="{{$prevlink.0}}"><i class="icon-backward photo-icons"></i></div>{{/if}}
-<div id="photo-photo"><a href="{{$photo.href}}" title="{{$photo.title}}"; return false;" ><img style="max-width: 100%;" src="{{$photo.src}}" /></a></div>
+<div id="photo-photo"><a href="{{$photo.href}}" title="{{$photo.title}}" onclick="$.colorbox({href: '{{$photo.href}}'}); return false;" ><img style="max-width: 100%;" src="{{$photo.src}}" /></a></div>
 {{if $nextlink}}<div id="photo-next-link"><a href="{{$nextlink.0}}"><i class="icon-forward photo-icons"></i></a></div>{{/if}}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">{{$desc}}</div>