Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integration of new map module of PublicLab.editor . #4608

Merged
merged 5 commits into from
Jan 22, 2019
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions app/controllers/editor_controller.rb
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,18 @@ def post
elsif params[:legacy] || params[:template] == 'event'
legacy
else
@lat = 1
@lon = 10
unless params[:tags].nil?
params[:tags]&.tr(' ', ',')&.split(',').each do |tagname|
if tagname.include? "lat:"
@lat = tagname[4..-1]
end
if tagname.include? "lon:"
@lon = tagname[4..-1]
end
end
end
rich
render '/editor/rich'
end
Expand Down
70 changes: 66 additions & 4 deletions app/views/editor/rich.html.erb
Original file line number Diff line number Diff line change
@@ -1,3 +1,11 @@
<!-- required for MapModule -->
<!-- <script src="https://maps.googleapis.com/maps/api/js?libraries=places&language=en&key=AIzaSyDWgc7p4WWFsO3y0MTe50vF4l4NUPcPuwE"></script> -->
<link href="/lib/leaflet/dist/leaflet.css" rel="stylesheet">
<script src="/lib/leaflet/dist/leaflet.js"></script>
<link href="/lib/leaflet-blurred-location/dist/Leaflet.BlurredLocation.css" rel="stylesheet">
<script src="/lib/leaflet-blurred-location/dist/Leaflet.BlurredLocation.js"></script>


<link href="/lib/woofmark/dist/woofmark.min.css" rel="stylesheet">
<link href="/lib/horsey/dist/horsey.min.css" rel="stylesheet">
<link href="/lib/bootstrap-tokenfield/dist/css/tokenfield-typeahead.min.css" rel="stylesheet">
Expand All @@ -12,9 +20,14 @@
<link href="/lib/publiclab-editor/dist/PublicLab.Editor.css" rel="stylesheet">
<script src="/lib/publiclab-editor/dist/PublicLab.Editor.js"></script>

<link href="/lib/publiclab-editor/dist/PublicLab.Editor.css" rel="stylesheet">
<%= javascript_include_tag('/lib/leaflet-spin/example/spin/dist/spin.min.js') %>
<%= javascript_include_tag('/lib/leaflet-spin/example/leaflet.spin.min.js') %>

<script src="/lib/publiclab-editor/dist/PublicLab.Editor.js"></script>
<style type="text/css">
.leaflet-marker-icon {
background: url("https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-black.png") ;
}
</style>

<div class="pl-editor">

Expand Down Expand Up @@ -77,12 +90,51 @@
</div>
<!-- end main_image module -->

<!-- Map Module start-->
<div class="ple-module-map ple-module container">

<div class="ple-module-guide col-md-3">
<h2>3</h2>
</div>

<div class="ple-module-content col-md-9">
<button id="location_button" class="btn btn-lg btn-default"><i class="fa fa-map-marker" aria-hidden="true"></i> Add Location</button>
<p class="ple-help"><span class="ple-help-minor">Search location through place-name , latitude and longitude or by panning the map .</span></p>

<div id="map_content">
<div class="row">
<div class="col-md-6">
<div id="map" class="leaflet-map" style="width: 100% ; height: 300px;"></div>
</div>
<div class="col-md-6">
<h4><b>By place name :</b></h4>
<p>
<input id="placenameInput" type="text" class="form-control" />
</p>
<p>
<h4><b>By entering co-ordinates :</b></h4>
<div class="row">
<div class="col-md-6">
<p><input id="lat" type="text" class="form-control" placeholder="Latitude"></p>
</div>
<div class="col-md-6">
<p><input id="lng" type="text" class="form-control" placeholder="Longitude"></p>
</div>
</div>
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Map Module end -->


<!-- body module -->
<div class="ple-module-body ple-module container">

<div class="ple-module-guide col-md-3">
<h2>3</h2>
<h2>4</h2>
</div>

<div class="ple-module-content col-md-9 container">
Expand All @@ -97,7 +149,7 @@
<div class="ple-module-tags ple-module container">

<div class="ple-module-guide col-md-3">
<h2>4</h2>
<h2>5</h2>
</div>

<div class="ple-module-content col-md-9">
Expand Down Expand Up @@ -186,6 +238,13 @@
</div>
<script>

$( document ).ready(function() {
$("#map_content").hide() ;
$("#location_button").click(function(){
$("#map_content").toggle() ;
}) ;
});

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Down on line ~257, could we insert some params from the tags if they exist? Like, if there are already lat:___ and lon:____ tags in format /post?tags=one,two,lat:90,lon:-90 we could detect them and insert them here? We can just supply them in format:

editor = new PL.Editor({
  lat: 90,
  lon: -90,
  ...

for now, and develop the detection and response code for it later in the Editor itself. How does that sound?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome ! I guess we are trying to solve the case when we edit a document , right ?
Currently default location on map will be shown and not the existing one .

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we might want to do either edit or create new -- both will open with this template. So if we add this option, we'll be able to insert either pre-populated ones from a link, or the default ones if it's editing an existing node. How does that sound?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense 😄 !

var editor;

(function() {
Expand All @@ -196,6 +255,9 @@
token: $('meta[name="csrf-token"]').attr('content')
},

lat: <%= @lat %> ,
lon: <%= @lon %> ,

textarea: $('.ple-textarea')[0],

<% if @main_image %>
Expand Down
4 changes: 1 addition & 3 deletions app/views/layouts/_footer.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,5 @@
<%= feature('footer-notice') %>
<% end %>
<!-- Rails version <%= Rails.version %>-->
<% if Rails.env != "production" %>
sagarpreet-chadha marked this conversation as resolved.
Show resolved Hide resolved
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&language=en&key=AIzaSyAOLUQngEmJv0_zcG1xkGq-CXIPpLQY8iQ"></script>
<% end %>

</footer>
4 changes: 4 additions & 0 deletions app/views/layouts/application.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,10 @@
<meta name="author" content="Public Lab contributors" />
<link href="https://<%= request.host %>/feed.rss" rel="alternate" type="application/rss+xml" title="Public Lab research" />

<% if Rails.env != "production" %>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&language=en&key=AIzaSyAOLUQngEmJv0_zcG1xkGq-CXIPpLQY8iQ"></script>
<% end %>

<script type="text/javascript" async
src="https://cdn.jsdelivr.net/npm/[email protected]/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
Expand Down
2 changes: 1 addition & 1 deletion app/views/users/map.html.erb
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&language=en&key=AIzaSyDWgc7p4WWFsO3y0MTe50vF4l4NUPcPuwE"></script>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&language=en&key=AIzaSyDWgc7p4WWFsO3y0MTe50vF4l4NUPcPuwE"></script>

<div class="container">
<form method="GET" action="/users/map" id="search">
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
"moment": "~> 2.19.3",
"noty": "3.1.4",
"phantomjs-prebuilt": "^2.1.16",
"publiclab-editor": "publiclab/PublicLab.Editor#~1.3.0",
"publiclab-editor": "^1.4.0",
"short-code-forms": "jywarren/short-code-forms#~0.0.1",
"typeahead.js": "twitter/typeahead.js#^0.11.1",
"typeahead.js-browserify": "Javier-Rotelli/typeahead.js-browserify#~1.0.7",
Expand Down