travlrmap 0.0.14 → 0.0.15

data/views/_map_js.erb

@@ -33,7 +33,7 @@
               gridSize: <%= @map.fetch(:cluster_grid_size, 40) %>,
               minimumClusterSize: <%= @map.fetch(:cluster_minumum_size, 2) %>,
               zoomOnClick: <%= @map.fetch(:cluster_zoom_on_click, true) %>,
-              imagePath: '<%= @map.fetch(:cluster_image_path, "/cluster/t") %>',
+              imagePath: '<%= @map.fetch(:cluster_image_path, "/cluster/m") %>',
               imageExtension: '<%= @map.fetch(:cluster_image_extension, "png") %>',
               <% if @map.include?(:cluster_image_sizes) %>
               imageSizes: [<%= @map[:cluster_image_sizes].join(",") %>],

data/views/_point_comment.erb

@@ -1,17 +1,17 @@
 <p>
 <font size="+2"><%= point[:title] %></font>
 <hr>
-<% if point[:comment] %>
+<% if !point.fetch(:comment, "").empty? %>
 <%=  h point[:comment] %><br /><br />
 <% end %>
 
-<% if point[:href] %>
+<% if !point.fetch(:href, "").empty?  %>
      <a href='<%= point[:href] %>' target='_blank'>
-<%   if point[:linkimg] || point[:linktext] %>
-<%      if point[:linkimg] %>
+<%   if !point.fetch(:linkimg, "").empty? || !point.fetch(:linktext, "").empty? %>
+<%      if !point.fetch(:linkimg, "").empty? %>
           <img src='<%= point[:linkimg] %>'><br />
 <%      end %>
-<%      if point[:linktext] %>
+<%      if !point.fetch(:linktext, "").empty? %>
           <%= h point[:linktext] %>
 <%      end %>
 <%   else %>
@@ -20,3 +20,5 @@
      </a>
 <% end %>
 </p>
+<p>
+<font weight"-2"><%= h @types[ point[:type] ][:description] %><% if point[:date] %> on <%= h point[:date] %><% end %>

data/views/geolocate.erb

@@ -0,0 +1,203 @@
+<div class="row">
+  <form id="search_box">
+    <div class="col-md-9">
+      <input type="text" class="form-control" id="location">
+    </div>
+    <div class="col-md-1">
+      <button type="submit" class="btn btn-primary">Search</button>
+    </div>
+  </form>
+</div>
+<div class="row"><div class="col-md-12">&nbsp;</div></div>
+<div class="row" style="height: 80%">
+  <div class="col-md-9" style="height: 100%">
+    <div class="map" id="main_map"> </div>
+  </div>
+  <div class="col-md-3">
+    <form id="point_info">
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_title" placeholder="Title">
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_comment" placeholder="Comment">
+      </div>
+      <div class="form-group">
+        <select id="point_type" class="form-control">
+          <% @types.each do |name, type| %>
+            <option value="<%= name %>"><%= type[:description] %></option>
+          <% end %>
+        </select>
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_date" placeholder="yyyy-mm-dd">
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_href" placeholder="Link URL">
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_linktext" placeholder="Link Text">
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_linkimg" placeholder="Link Image URL">
+      </div>
+      <div class="form-group">
+        <input type="text" class="form-control" id="point_country" placeholder="Country">
+      </div>
+      <div class="form-group">
+      <button type="submit" class="btn btn-primary">Preview</button>
+      </div>
+    </form>
+  </div>
+</div>
+<div class="row">
+  <div class="col-md-9"><center>Perform a search to place a marker or right click to place one anywhere.</center></div>
+</div>
+
+<script type="text/javascript">
+    var map;
+    var marker;
+
+    function getLocationName(results) {
+      var addrComponents = results[0].address_components;
+
+      for (var i = 0; i < addrComponents.length; i++) {
+        if (addrComponents[i].types[0] == "point_of_interest") {
+          return addrComponents[i].long_name;
+        }
+
+        if (addrComponents[i].types[0] == "postal_town") {
+          return addrComponents[i].long_name;
+        }
+      }
+
+      return results[0].formatted_address;
+    }
+
+    function getCountry(results) {
+      var addrComponents = results[0].address_components;
+
+      for (var i = 0; i < addrComponents.length; i++) {
+        if (addrComponents[i].types[0] == "country") {
+          return addrComponents[i].long_name;
+        }
+
+        if (addrComponents[i].types.length == 2) {
+          if (addrComponents[i].types[0] == "political") {
+            return addrComponents[i].long_name;
+          }
+        }
+      }
+      return "n/a";
+    }
+
+    function updateForm(results, status, createMarker) {
+      if (status == google.maps.GeocoderStatus.OK) {
+        var latlng = results[0].geometry.location;
+
+        if (createMarker) {
+          map.setZoom(15);
+          map.setCenter(latlng.lat(), latlng.lng());
+          marker = map.addMarker({
+            lat: latlng.lat(),
+            lng: latlng.lng(),
+          });
+        }
+
+        document.getElementById('point_title').value = getLocationName(results);
+        document.getElementById('point_country').value = getCountry(results);
+        document.getElementById('point_date').value = moment().format("YYYY-MM-DD");
+      } else {
+        alert("Geocode was not successful for the following reason: " + status);
+      }
+    }
+
+    $(document).ready(function() {
+      map = new GMaps({
+        div: '#main_map',
+        zoom: 3,
+        lat: 20,
+        lng: 0,
+      });
+
+      GMaps.on('rightclick', map.map, function(event) {
+        var lat = event.latLng.lat();
+        var lng = event.latLng.lng();
+
+        map.removeMarkers();
+        map.setCenter(lat, lng);
+
+        marker = map.addMarker({
+          lat: lat,
+          lng: lng,
+        });
+
+        GMaps.geocode({
+          lat: lat,
+          lng: lng,
+          callback: function(results, status) {
+            updateForm(results, status, false)
+          }
+        });
+      });
+
+      $('#point_info').submit(function(e) {
+        e.preventDefault();
+
+        var point = {};
+        point.type = document.getElementById('point_type').value
+        point.title = document.getElementById('point_title').value
+        point.comment = document.getElementById('point_comment').value
+        point.country = document.getElementById('point_country').value
+        point.date = document.getElementById('point_date').value
+        point.href = document.getElementById('point_href').value
+        point.linktext = document.getElementById('point_linktext').value
+        point.linkimg = document.getElementById('point_linkimg').value
+        point.lon = marker.position.lng();
+        point.lat = marker.position.lat();
+
+        document.getElementById('preview_html').innerHTML = "Validating point and fetching preview...";
+        document.getElementById('preview_yaml').innerHTML = "";
+
+        $('#myModal').modal({});
+
+        $.post("/points/validate", JSON.stringify(point), function(data) {
+          alert("Response: " + JSON.stringify(data));
+          document.getElementById('preview_html').innerHTML = data.html;
+          document.getElementById('preview_yaml').innerHTML = "<pre>" + data.yaml + "</pre>";
+        });
+      });
+
+      $('#search_box').submit(function(e) {
+        e.preventDefault();
+        map.removeMarkers();
+
+        GMaps.geocode({
+          address: $('#location').val().trim(),
+          callback: function(results, status) {
+            updateForm(results, status, true)
+          }
+        });
+      });
+    });
+</script>
+
+<!-- modal popup for point preview -->
+<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <h4 class="modal-title" id="myModalLabel">Point Preview</h4>
+      </div>
+      <div class="modal-body">
+        <div id="preview_html" align="center">
+        </div>
+        <div id="preview_yaml">
+        </div>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+      </div>
+    </div>
+  </div>
+</div>

data/views/layout.erb

@@ -17,6 +17,8 @@
     <link rel="stylesheet" href="/travlrmap.css">
     <script src="/gmaps.js"></script>
     <script src="/markerclusterer_compiled.js"></script>
+    <script src="/moment.js"></script>
+    <script src="/js-yaml.min.js"></script>
 
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
@@ -39,7 +41,7 @@
           <a class="navbar-brand" href="/"><%= @map[:title] %></a>
         </div>
         <div id="navbar" class="collapse navbar-collapse">
-          <ul class="nav navbar-nav">
+          <ul class="nav navbar-nav navbar-left">
             <li class="dropdown">
               <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Views <span class="caret"></span></a>
               <ul class="dropdown-menu" role="menu">
@@ -49,6 +51,11 @@
               </ul>
             </li>
           </ul>
+          <% if @map[:show_geocode_link] %>
+          <ul class="nav navbar-nav navbar-right">
+            <li><a href="/geocode">Geocode</a></li>
+          </ul>
+          <% end %>
         </div>
       </div>
     </nav>

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: travlrmap
 version: !ruby/object:Gem::Version 
-  hash: 3
+  hash: 1
   prerelease: false
   segments: 
   - 0
   - 0
-  - 14
-  version: 0.0.14
+  - 15
+  version: 0.0.15
 platform: ruby
 authors: 
 - R.I.Pienaar
@@ -15,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2015-01-04 00:00:00 +00:00
+date: 2015-01-07 00:00:00 +00:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -120,6 +120,22 @@ dependencies:
         version: 1.5.2
   type: :runtime
   version_requirements: *id007
+- !ruby/object:Gem::Dependency 
+  name: rack
+  prerelease: false
+  requirement: &id008 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - "="
+      - !ruby/object:Gem::Version 
+        hash: 7
+        segments: 
+        - 1
+        - 5
+        - 2
+        version: 1.5.2
+  type: :runtime
+  version_requirements: *id008
 description: "description: Sinatra based map builder"
 email: rip@devco.net
 executables: []
@@ -136,8 +152,10 @@ files:
 - views/index.erb
 - views/_point_comment.erb
 - views/_map_js.erb
+- views/geolocate.erb
 - public/travlrmap.css
 - public/favicon.ico
+- public/js-yaml.min.js
 - public/markerclusterer_compiled.js
 - public/gmaps.js
 - public/markers/marker-NAVY-MINI.png
@@ -281,6 +299,7 @@ files:
 - public/cluster/m2.png
 - public/cluster/cluster-PURPLE-5.png
 - public/cluster/cluster-MAROON-4.png
+- public/moment.js
 - config/travlrmap.yaml.dist
 - config.ru
 - Gemfile