{"id":41544,"date":"2018-10-29T03:01:16","date_gmt":"2018-10-28T17:01:16","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=41544"},"modified":"2018-10-28T21:20:11","modified_gmt":"2018-10-28T11:20:11","slug":"php-exif-image-zip-mystery-game-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/php-exif-image-zip-mystery-game-primer-tutorial\/","title":{"rendered":"PHP Exif Image Zip Mystery Game Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php?mystery=y\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"PHP Exif Image Zip Mystery Game Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_mystery.jpg\" title=\"PHP Exif Image Zip Mystery Game Primer Tutorial\"  \/><\/a><p class=\"wp-caption-text\">PHP Exif Image Zip Mystery Game Primer Tutorial<\/p><\/div>\n<p>There&#8217;s a fair bit to the design of a new game we&#8217;re developing that uses the image metadata ideas from <a title='PHP Exif Image Information Rotation Tutorial' href='#phpeiirt'>PHP Exif Image Information Rotation Tutorial<\/a> in its workings.<\/p>\n<p>Our early days work starts down the road by collecting <a target=_blank title='PHP zip_open' href='http:\/\/php.net\/manual\/en\/function.zip-open.php'>zipfile<\/a> and other pertinent Exif data item ideas off &#8230;<\/p>\n<ul>\n<li>first game player, who sets up the game parameters while player 2 is not watching, in a form that is submitted ahead of &#8230;<\/li>\n<li>second player then turns around and tries to guess details of a Start place and End place, and any other places photographed by player 1<\/li>\n<\/ul>\n<p>As you can see to simplify things we are introducing PHP zipfile coding to group together a set of photographs into the one file concept.<\/p>\n<p>It will be tomorrow that you see a more complete and rounded game solution, and by then we can come up with a name for it too!<\/p>\n<p>Feel free to try <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php----GETME\">the changed<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php----GETME\">read_exif_off_image_rotate.php<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php?mystery=y\">live run<\/a> to try out this game in an early incarnation.<\/p>\n<hr>\n<p id='phpeiirt'>Previous relevant <a target=_blank title='PHP Exif Image Information Rotation Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/php-exif-image-information-rotation-tutorial\/'>PHP Exif Image Information Rotation Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php?image=http:\/\/www.rjmprogramming.com.au\/Mindfulness\/clouds.jpg\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"PHP Exif Image Information Rotation Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_followup.jpg\" title=\"PHP Exif Image Information Rotation Tutorial\"  \/><\/a><p class=\"wp-caption-text\">PHP Exif Image Information Rotation Tutorial<\/p><\/div>\n<p>The &#8220;Stop Press&#8221; of <a title='PHP Exif Image Information Primer Tutorial' href='#peiipt'>PHP Exif Image Information Primer Tutorial<\/a> as shown below, introduced us to some PHP able to glean quite a bit of really useful Exif information stored with an image file, perhaps straight off a digital camera or mobile phone or mobile tablet.  We use the great advice of <a target=_blank title=Useful href=http:\/\/www.v-nessa.net\/2010\/08\/02\/using-php-to-extract-image-exif-data>http:\/\/www.v-nessa.net\/2010\/08\/02\/using-php-to-extract-image-exif-data<\/a> to cycle through this information.<\/p>\n<p>This information was of interest regarding &#8230;<\/p>\n<blockquote><p>\nSometimes you&#8217;ll see <a target=_blank title='Gimp' href='http:\/\/gimp.org'>Gimp<\/a> using exif functionality when it becomes aware of the possibility your image could be rotated to advantage\n<\/p><\/blockquote>\n<p> &#8230; as we saw Gimp doing this in relation to a photograph image coming off my Android Mobile Phone that we used, in its &#8220;rotated-by-Gimp&#8221; form, in our recent <a target=_blank title='Mindfulness Follow Up Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/mindfulness-follow-up-tutorial\/'>Mindfulness Follow Up Tutorial<\/a>.  But how about if we want to detect what Gimp detects, to fix this camera orientation issue ourselves?  Well, in amongst the Exif information, we found &#8230;<\/p>\n<ul>\n<li><code>IFD0.Orientation: 6<\/code> &#8230; and then surfing the web we found &#8230;<\/li>\n<li><a target=_blank title='Useful link' href='http:\/\/www.impulseadventure.com\/photo\/exif-orientation.html'>this useful link<\/a> explaining this Exif setting &#8230; thanks<\/li>\n<\/ul>\n<p> &#8230; which gave us the means to apply a rotation the way Gimp does.  How did we decide to apply this rotation?  There are lots of ways, and we decided on this occasion to use CSS and apply a background image, with a transformation, to an HTML div element, also showing all that Exif information.  We do this with new PHP you could call <a target=_blank title='read_exif_off_image_rotate.php' href='http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php-GETME'>read_exif_off_image_rotate.php<\/a> that has this corresponding new <a target=_blank title='Live Run' href='http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php?image=http:\/\/www.rjmprogramming.com.au\/Mindfulness\/clouds.jpg'>live run<\/a> link.  To get there, from where we&#8217;ve last been, take a skeg <a target=_blank title='read_exif_off_image_rotate.php' href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php-GETME'>here<\/a>.<\/p>\n<p>So, coming back to our &#8220;clouds&#8221; photo we saw an Exif IFD0.Orientation value of 6 and consulted <a target=_blank title='Useful link' href='http:\/\/www.impulseadventure.com\/photo\/exif-orientation.html'>this useful link<\/a> to find that we should rotate the image by 90 degrees.  We do this with the HTML and inline CSS that goes, for the encasing HTML div element &#8230;<\/p>\n<p><code><br \/>\n&lt;div style='background-color:yellow; background: url(clouds.jpg); opacity:0.6;  norepeat; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); '&gt;<br \/>\n&lt;\/div&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; in regard to using the original camera image &#8230;<\/p>\n<p><img src='http:\/\/www.rjmprogramming.com.au\/Mindfulness\/clouds.jpg' width='100%'><\/img><\/p>\n<p>Now you may have heard of geographical knowledge stored within photographs, and perhaps you&#8217;ll see the <a target=_blank title='Live Run' href='http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image_rotate.php?image=http:\/\/www.rjmprogramming.com.au\/Mindfulness\/clouds.jpg'>live run<\/a>&#8216;s (turn your head or computer) &#8230;<\/p>\n<p><code><br \/>\nGPS.GPSVersion<br \/>\n<\/code><\/p>\n<p> &#8230; that if fleshed out, with other data elements underneath, would put that image into the category of those where geographical information resides.  You may want to start reading more about (the huge topic of) &#8220;Geotagging&#8221; from this useful Wikipedia <a target=_blank title='Geotagged photograph information from Wikipedia' href='https:\/\/en.wikipedia.org\/wiki\/Geotagged_photograph'>webpage<\/a> &#8230; thanks.<\/p>\n<hr>\n<p id='peiipt'>Previous relevant <a target=_blank title='PHP Exif Image Information Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/php-exif-image-information-primer-tutorial\/'>PHP Exif Image Information Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_tester.php\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"PHP Exif Image Information Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_primer.jpg\" title=\"PHP Exif Image Information Primer Tutorial\"  \/><\/a><p class=\"wp-caption-text\">PHP Exif Image Information Primer Tutorial<\/p><\/div>\n<p>Our (Mac OS X laptop) local <a target=_blank href='https:\/\/www.mamp.info\/' title='MAMP Apache\/PHP\/MySql web server landing page'>MAMP<\/a> web server is an Apache\/PHP\/MySql web server.  In this environment you can find out a lot with some PHP code as per &#8230;<\/p>\n<p><code>&lt;?php <a target=_blank href='http:\/\/php.net\/manual\/en\/function.phpinfo.php' title='PHP phpinfo() method information'>phpinfo();<\/a> ?&gt;<\/code><\/p>\n<p> &#8230; and if, in doing this, you find a reference to the <a target=_blank href='http:\/\/php.net\/manual\/en\/book.exif.php' title='Exchangeable Image Information'>&#8220;exif&#8221;<\/a> Exchangeable Image Information functionality existing, you are a lucky candidate to introduce some image &#8220;interrogation&#8221; (but not <a target=_blank title='?' href='http:\/\/www.youtube.com\/watch?v=vt0Y39eMvpI'>this<\/a>) logic to your PHP code.<\/p>\n<p>We followed a lot of the advice of the very useful <a target=_blank title='PHP exif imagetype information' href='http:\/\/php.net\/manual\/en\/function.exif-imagetype.php'>link<\/a> (thanks) to create some PHP called &#8230;<\/p>\n<ul>\n<li><a target=_blank title='exif_tester.php' href='http:\/\/www.rjmprogramming.com.au\/PHP\/exif_tester.php_GETME'>exif_tester.php<\/a><\/li>\n<\/ul>\n<p> &#8230; where we may (or maybe not) be waking you up (<a target=_blank title='?' href='http:\/\/www.youtube.com\/watch?v=pIgZ7gMze7A'>before we go go<\/a> <i>&#8216;Cause I&#8217;m not plannin&#8217; on going solo<\/i> yo (to be honest, like)) &#8230; it&#8217;s a slow news day &#8230; to the fact that images can show on a web page but may not be all you would understand them to be &#8230; shock, horror!<\/p>\n<p>Yes, an image that is a GIF in all but name will often display fine even if it&#8217;s been given a name like MyNameIs.Jpeg <strike>man<\/strike> person.<\/p>\n<p>If this <i><b>outrage<\/b><\/i> makes you &#8230;<\/p>\n<ul>\n<li>a) fall on the floor laughing<\/li>\n<li>b) cause a road rage incident<\/li>\n<li>c) wake up in a cold sweat<\/li>\n<li>d) wake up in a warmish to lukewarm sweat<\/li>\n<li>e) tear the cat&#8217;s hair out <font size=0>(no animals were harmed in the making of this blog posting)<\/font><\/li>\n<\/ul>\n<p> &#8230; then we&#8217;re here to tell you that you need to take a <a target=_blank title='Take a Bex ... and ...' href='https:\/\/www.youtube.com\/watch?v=BF6ffbz70SY'>Bex<\/a> and have a lie down.<\/p>\n<p>In any case, there is a solution to this in PHP if the exif functionality is available to you, and this matter is of concern, and you can see us showing you how to test for that with the code above and this <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_tester.php\" title='Click picture'>live run<\/a>.  Sometimes you&#8217;ll see <a target=_blank title='Gimp' href='http:\/\/gimp.org'>Gimp<\/a> using exif functionality when it becomes aware of the possibility your image could be rotated to advantage &#8230; we&#8217;ve had this happen and thanked Gimp with more than the usual toast and herbal tea offerings you&#8217;d be used to giving &#8230; we take it?!<\/p>\n<p><b><i>Stop Press<\/i><\/b><\/p>\n<p>As of 8\/8\/2016 (<font size=1>well, what do you know? &#8230; understood everywhere!?<\/font>) we&#8217;re revisiting Exif and PHP to learn more and our <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_primer.jpg\">tutorial picture<\/a> now reflects the early days of the revisit and the new resultant PHP we wrote, that you could call <a target=_blank title='read_exif_off_image.php' href='http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image.php_GETME'>read_exif_off_image.php<\/a>, inspired, largely from <a target=_blank title=Useful href=http:\/\/www.v-nessa.net\/2010\/08\/02\/using-php-to-extract-image-exif-data>http:\/\/www.v-nessa.net\/2010\/08\/02\/using-php-to-extract-image-exif-data<\/a> (thanks), and has this <a target=_blank title='Live Run' href='http:\/\/www.rjmprogramming.com.au\/PHP\/read_exif_off_image.php?image=http:\/\/www.rjmprogramming.com.au\/Mindfulness\/clouds.jpg'>live run<\/a> link, the output of which is pointed to by the red arrow in the <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/exif_primer.jpg\">tutorial picture<\/a>.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d15978' onclick='var dv=document.getElementById(\"d15978\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/?tag=gimp\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d15978' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d23968' onclick='var dv=document.getElementById(\"d23968\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/?tag=rotation\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d23968' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d41544' onclick='var dv=document.getElementById(\"d41544\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/game\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d41544' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>There&#8217;s a fair bit to the design of a new game we&#8217;re developing that uses the image metadata ideas from PHP Exif Image Information Rotation Tutorial in its workings. Our early days work starts down the road by collecting zipfile &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/php-exif-image-zip-mystery-game-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,37],"tags":[406,452,476,477,590,932,997,1319,1497,2344],"class_list":["post-41544","post","type-post","status-publish","format-standard","hentry","category-elearning","category-tutorials","tag-exif","tag-form","tag-game","tag-games-2","tag-image","tag-php","tag-programming","tag-tutorial","tag-zip","tag-zipfile"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/41544"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=41544"}],"version-history":[{"count":5,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/41544\/revisions"}],"predecessor-version":[{"id":41549,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/41544\/revisions\/41549"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=41544"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=41544"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=41544"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}