webapprentice

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_pinterest_share"></a>
<a class="addthis_button_google_plusone_share"></a>
<a class="addthis_button_compact"></a><a class="addthis_counter addthis_bubble_style"></a>
</div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-527bc84e7d786e11"></script>
<!-- AddThis Button END -->

webapprentice

<style>
  #map_canvas {
    height: 400px;
    width: 600px;
    border: 1px solid black;
  }
</style>

<div id="map_canvas"></div>

webapprentice

<script type="text/javascript">

/***
    Simple jQuery Slideshow Script
    Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc.  Please link out to me if you like it :)

    Original blog post: http://jonraasch.com/blog/a-simple-jquery-slideshow
***/
var intervalId;

webapprentice

<script>
  // Do not use this code in your web site - it won't work - included here for illustration
  (function(i,s,o,g,r,a,m){
    i['GoogleAnalyticsObject']=r;
    i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)
      },
      i[r].l=1*new Date();
      a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];

webapprentice

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDPlbegz3bhu9AnJDCLWsOZM8jF3Hpp8tI&sensor=false"></script>

<script>
$(document).ready(function() {

  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var str =  'Latitude: '  + position.coords.latitude.toString()  + ' deg<br>' +
                 'Longitude: ' + position.coords.longitude.toString() + ' deg<br>';

webapprentice

<script src="https://gist.github.com/webapprentice/7359720.js"></script>

webapprentice

<a href="http://www.flickr.com/photos/floridamemory/4989625093/" title="Child and dog by State Library and Archives of Florida, on Flickr">
<img src="http://farm5.staticflickr.com/4125/4989625093_ff64f876d9_n.jpg" width="229" height="320" alt="Child and dog">
</a>

webapprentice

  # Extract EXIF metadata from a photo on the server
  get '/tutorial_22_demo_1' do

    # load the library file that contains methods used this tutorial
    require 'lib/tutorial_22.rb'

    # Extract the metadata from an image file on the server
    @photo = MiniExiftool.new(File.join(root_dir, "/public/assets/photo_metadata_1_400.jpg"))

    # Get the Latitude and Longitude values and convert to decimal format

webapprentice

<img src='/assets/photo_metadata_1_400.jpg' alt='photo of snow geese in Skagit Valley, WA, USA'>
<br>
<div id="map_canvas"></div>
<br>
Latitude / Longitude &nbsp;  <%= sprintf("%10.5f", @latitude_0) %>, <%= sprintf("%10.5f", @longitude_0) %>
<br>

<br>
<h2>Dump of all the Metadata for this Image</h2>
<table>

webapprentice

# lib/tutorial_22.rb  - methods related to tutorial_22

require 'mini_exiftool_vendored'

# Convert Lat Lon in Deg, Min, Sec to Decimal format
# e.g 122 deg 25' 25.20" W -> 122.42366666
def dms_to_decimal(coordinate)
  decimal = 0.0
  if coordinate =~ /^(\d+)\s+deg\s+(\d+)\'\s+([\d\.]+)\"\s+(\S)\s*$/
    deg = $1.to_f