Switch from Prototype to jQuery
authorTom Hughes <tom@compton.nu>
Mon, 21 Nov 2011 09:15:41 +0000 (09:15 +0000)
committerTom Hughes <tom@compton.nu>
Sat, 26 Nov 2011 00:22:31 +0000 (00:22 +0000)
40 files changed:
Gemfile
Gemfile.lock
app/assets/javascripts/menu.js
app/assets/javascripts/site.js
app/controllers/geocoder_controller.rb
app/controllers/message_controller.rb
app/controllers/user_controller.rb
app/helpers/user_helper.rb
app/views/browse/_map.html.erb
app/views/browse/_sidebar.html.erb [moved from app/views/browse/_start.html.erb with 100% similarity]
app/views/browse/start.js.erb [new file with mode: 0644]
app/views/browse/start.rjs [deleted file]
app/views/changeset/_changeset.html.erb
app/views/changeset/_map.html.erb
app/views/diary_entry/edit.html.erb
app/views/export/_sidebar.html.erb [moved from app/views/export/_start.html.erb with 100% similarity]
app/views/export/start.js.erb [new file with mode: 0644]
app/views/export/start.rjs [deleted file]
app/views/geocoder/_search.html.erb [deleted file]
app/views/geocoder/description.html.erb [moved from app/views/geocoder/_description.html.erb with 69% similarity]
app/views/geocoder/results.html.erb
app/views/geocoder/search.html.erb [new file with mode: 0644]
app/views/layouts/site.html.erb
app/views/message/_message_summary.html.erb
app/views/message/mark.js.erb [new file with mode: 0644]
app/views/site/_key.html.erb
app/views/site/_potlatch.html.erb
app/views/site/_potlatch2.html.erb
app/views/site/_resize.html.erb
app/views/site/_search.html.erb
app/views/site/_sidebar.html.erb
app/views/site/edit.html.erb
app/views/site/index.html.erb
app/views/user/confirm.html.erb
app/views/user/confirm_email.html.erb
app/views/user/login.html.erb
app/views/user/new.html.erb
app/views/user/terms.html.erb
test/functional/browse_controller_test.rb
test/functional/export_controller_test.rb

diff --git a/Gemfile b/Gemfile
index 511bf35e8095976a791b8ceb9d48d80d94d1b3d5..1c8adfd34561af222239370fe9ad621d82c5f3fa 100644 (file)
--- a/Gemfile
+++ b/Gemfile
@@ -7,8 +7,8 @@ gem 'rails', '3.1.3'
 # Require the postgres database driver
 gem 'pg'
 
-# Load prototype support
-gem 'prototype-rails'
+# Load jquery support
+gem 'jquery-rails'
 
 # Load rails plugins
 gem 'rails-i18n-updater'
index c655845bb060d40fb315a2c85fa8af9ee3ed99fa..3343161f9531efc4da5d244daa4f12a9074f3c04 100644 (file)
@@ -53,6 +53,9 @@ GEM
     hike (1.2.1)
     httpclient (2.2.3)
     i18n (0.6.0)
+    jquery-rails (1.0.18)
+      railties (~> 3.0)
+      thor (~> 0.14)
     json (1.6.1)
     libv8 (3.3.10.4)
     libxml-ruby (2.2.2)
@@ -79,8 +82,6 @@ GEM
       rack-openid (~> 1.3)
     pg (0.11.0)
     polyglot (0.3.3)
-    prototype-rails (3.1.0)
-      rails (~> 3.1)
     rack (1.3.5)
     rack-cache (1.1)
       rack (>= 0.4)
@@ -153,13 +154,13 @@ DEPENDENCIES
   composite_primary_keys (>= 4.1.1)
   dynamic_form
   httpclient
+  jquery-rails
   libxml-ruby (>= 2.0.5)
   memcache-client
   memcached
   oauth-plugin (>= 0.4.0.pre7)
   open_id_authentication (>= 1.1.0)
   pg
-  prototype-rails
   rails (= 3.1.3)
   rails-i18n-updater
   rinku (>= 1.2.2)
index 26151775687fc22f22ff5eb6b0e315c00aff2bf9..8db1be4b9acebd6e44bd208e63eb7aecdac4a2eb 100644 (file)
@@ -2,20 +2,21 @@
  * Open a menu.
  */
 function openMenu(anchor, menu, align) {
+  var anchorPosition = anchor.offset();
   var offset;
 
   if (align == "left") {
     offset = 0;
   } else if (align == "right") {
-    offset = anchor.getWidth() - menu.getWidth();
+    offset = menu.outerWidth() - anchor.outerWidth();
   }
 
-  menu.clonePosition(anchor, {
-    setLeft: true, setTop: true, setWidth: false, setHeight: false,
-    offsetLeft: offset, offsetTop: anchor.getHeight()
-  });
+  menu.show();
 
-  menu.style.display = "block";
+  menu.offset({
+    top: anchorPosition.top + anchor.outerHeight(),
+    left: anchorPosition.left - offset
+  });
 }
 
 /*
@@ -23,14 +24,14 @@ function openMenu(anchor, menu, align) {
  */
 function closeMenu(menu) {
   clearTimeout(menu.timer);
-  menu.style.display = "none";
+  menu.hide();
 }
 
 /*
  * Callback called when the mouse enters a menu anchor.
  */
 function enterMenuAnchor(event, anchor, menu, delay, align) {
-  if (!anchor.hasClassName("disabled")) {
+  if (!anchor.hasClass("disabled")) {
     clearTimeout(menu.timer);
 
     if (delay > 0) {
@@ -47,8 +48,8 @@ function enterMenuAnchor(event, anchor, menu, delay, align) {
 function leaveMenuAnchor(event, anchor, menu) {
   var to = event.relatedTarget;
 
-  if (to != menu && !to.descendantOf(menu)) {
-    menu.style.display = "none";
+  if (!menu.is(to) && menu.has(to).length == 0) {
+    menu.hide();
   }
 
   clearTimeout(menu.timer);
@@ -60,8 +61,8 @@ function leaveMenuAnchor(event, anchor, menu) {
 function leaveMenu(event, anchor, menu) {
   var to = event.relatedTarget;
 
-  if (to != anchor && !to.descendantOf(menu)) {
-    menu.style.display = "none";
+  if (!anchor.is(to) && menu.has(to).length == 0) {
+    menu.hide();
   }
 
   clearTimeout(menu.timer);
@@ -71,12 +72,12 @@ function leaveMenu(event, anchor, menu) {
  * Setup a menu, triggered by hovering over an anchor for a given time.
  */
 function createMenu(anchorid, menuid, delay, align) {
-  var anchor = $(anchorid);
-  var menu = $(menuid);
+  var anchor = $("#" + anchorid);
+  var menu = $("#" + menuid);
 
-  anchor.observe("mouseup", function (event) { closeMenu(menu) });
-  anchor.observe("mouseover", function (event) { enterMenuAnchor(anchor, anchor, menu, delay, align) });
-  anchor.observe("mouseout", function (event) { leaveMenuAnchor(event, anchor, menu) });
-  menu.observe("mouseup", function (event) { closeMenu(menu) });
-  menu.observe("mouseout", function (event) { leaveMenu(event, anchor, menu) });
+  anchor.mouseup(function (event) { closeMenu(menu) });
+  anchor.mouseover(function (event) { enterMenuAnchor(anchor, anchor, menu, delay, align) });
+  anchor.mouseout(function (event) { leaveMenuAnchor(event, anchor, menu) });
+  menu.mouseup(function (event) { closeMenu(menu) });
+  menu.mouseout(function (event) { leaveMenu(event, anchor, menu) });
 }
index 9f80bf25d9387a2627f4a623ceabc5c53d2ac4b4..ea7585a44bb894f1775f12855aaa9593ae4e2e82 100644 (file)
@@ -1,8 +1,5 @@
-//= require prototype
-//= require prototype_ujs
-//= require effects
-//= require dragdrop
-//= require controls
+//= require jquery
+//= require jquery_ujs
 
 /*
  * Called as the user scrolls/zooms around to aniplate hrefs of the
@@ -22,50 +19,49 @@ function updatelinks(lon,lat,zoom,layers,minlon,minlat,maxlon,maxlat,objtype,obj
     maxlat = Math.round(maxlat * decimals) / decimals;
   }
 
-  $$(".geolink").each(function (link) {
+  $(".geolink").each(function (index, link) {
     var args = getArgs(link.href);
 
-    if (link.hasClassName("llz")) {
+    if ($(link).hasClass("llz")) {
       args.lat = lat;
       args.lon = lon;
       args.zoom = zoom;
-    } else if (minlon && link.hasClassName("bbox")) {
+    } else if (minlon && $(link).hasClass("bbox")) {
       args.bbox = minlon + "," + minlat + "," + maxlon + "," + maxlat;
     }
 
-    if (layers && link.hasClassName("layers")) {
+    if (layers && $(link).hasClass("layers")) {
       args.layers = layers;
     }
 
-    if (objtype && link.hasClassName("object")) {
+    if (objtype && $(link).hasClass("object")) {
       args[objtype] = objid;
     }
 
-    if (link.hasClassName("minzoom[0-9]+")) {
-      $w(link.className).each(function (classname) {
-        if (match = classname.match(/^minzoom([0-9]+)$/)) {
-          var minzoom = match[1];
-          var name = link.id.replace(/anchor$/, "");
-
-          if (zoom >= minzoom) {
-            link.onclick = null;
-            link.title = i18n("javascripts.site." + name + "_tooltip");
-            link.removeClassName("disabled");
-          } else {
-            link.onclick = function () { alert(i18n("javascripts.site." + name + "_zoom_alert")); return false; };
-            link.title = i18n("javascripts.site." + name + "_disabled_tooltip");
-            link.addClassName("disabled");
-          }
+    var classes = $(link).attr("class").split(" ");
+
+    $(classes).each(function (index, classname) {
+      if (match = classname.match(/^minzoom([0-9]+)$/)) {
+        var minzoom = match[1];
+        var name = link.id.replace(/anchor$/, "");
+
+        if (zoom >= minzoom) {
+          $(link).off("click");
+          $(link).attr("title", i18n("javascripts.site." + name + "_tooltip"));
+          $(link).removeClass("disabled");
+        } else {
+          $(link).click(function () { alert(i18n("javascripts.site." + name + "_zoom_alert")); return false; });
+          $(link).attr("title", i18n("javascripts.site." + name + "_disabled_tooltip"));
+          $(link).addClass("disabled");
         }
-      });
-    }
+      }
+    });
 
     link.href = setArgs(link.href, args);
   });
 
-  node = $("shortlinkanchor");
-  if (node) {
-    var args = getArgs(node.href);
+  $("#shortlinkanchor").each(function () {
+    var args = getArgs(this.href);
     var code = makeShortCode(lat, lon, zoom);
     var prefix = shortlinkPrefix();
 
@@ -87,11 +83,11 @@ function updatelinks(lon,lat,zoom,layers,minlon,minlat,maxlon,maxlat,objtype,obj
     // which encodes lat/lon/zoom. If new URL parameters are added to
     // the main slippy map this needs to be changed.
     if (args["layers"] || args[objtype]) {
-      node.href = setArgs(prefix + "/go/" + code, args);
+      this.href = setArgs(prefix + "/go/" + code, args);
     } else {
-      node.href = prefix + "/go/" + code;
+      this.href = prefix + "/go/" + code;
     }
-  }
+  });
 }
 
 /*
index 29e7648afed5878eecbcdc05bb43a2d2b869e47c..c55c85833b8f6a1a233ce31ea042e0e00303ac1d 100644 (file)
@@ -28,11 +28,6 @@ class GeocoderController < ApplicationController
       @sources.push "osm_nominatim"
       @sources.push "geonames"
     end
-
-    render :update do |page|
-      page.replace_html :sidebar_content, :partial => "search"
-      page.call "openSidebar"
-    end
   end
 
   def search_latlon
@@ -264,9 +259,9 @@ class GeocoderController < ApplicationController
     end
 
     render :action => "results"
-  rescue Exception => ex
-    @error = "Error contacting nominatim.openstreetmap.org: #{ex.to_s}"
-    render :action => "error"
+#  rescue Exception => ex
+#    @error = "Error contacting nominatim.openstreetmap.org: #{ex.to_s}"
+#    render :action => "error"
   end
 
   def search_geonames
@@ -302,11 +297,6 @@ class GeocoderController < ApplicationController
 
     @sources.push({ :name => "osm_nominatim" })
     @sources.push({ :name => "geonames" })
-
-    render :update do |page|
-      page.replace_html :sidebar_content, :partial => "description"
-      page.call "openSidebar"
-    end
   end
 
   def description_osm_namefinder
index 6e0c717b527600c02d208f0d12517e1275dabb79..ec183fc3e7800abe464774e44201e7ed2361cda7 100644 (file)
@@ -103,7 +103,7 @@ class MessageController < ApplicationController
   def mark
     if params[:message_id]
       id = params[:message_id]
-      message = Message.where(:id => id).where("to_user_id = ? OR from_user_id = ?", @user.id, @user.id).first
+      @message = Message.where(:id => id).where("to_user_id = ? OR from_user_id = ?", @user.id, @user.id).first
       if params[:mark] == 'unread'
         message_read = false 
         notice = t 'message.mark.as_unread'
@@ -111,15 +111,9 @@ class MessageController < ApplicationController
         message_read = true
         notice = t 'message.mark.as_read'
       end
-      message.message_read = message_read
-      if message.save
-        if request.xhr?
-          render :update do |page|
-            page.replace "inboxanchor", :partial => "layouts/inbox"
-            page.replace "inbox-count", :partial => "message_count"
-            page.replace "inbox-#{message.id}", :partial => "message_summary", :object => message
-          end
-        else
+      @message.message_read = message_read
+      if @message.save
+        if not request.xhr?
           flash[:notice] = notice
           redirect_to :controller => 'message', :action => 'inbox', :display_name => @user.display_name
         end
index de07e4b53c1938ff4400d5e05d6cb4b7ce16d9c4..07b4f597588b884c9973d39bf8122bc2dcb25ce4 100644 (file)
@@ -23,9 +23,7 @@ class UserController < ApplicationController
     @text = OSM.legal_text_for_country(@legale)
 
     if request.xhr?
-      render :update do |page|
-        page.replace_html "contributorTerms", :partial => "terms"
-      end
+      render :partial => "terms"
     elsif using_open_id?
       # The redirect from the OpenID provider reenters here
       # again and we need to pass the parameters through to
index 8686d5a035c80751081aad9d3f3c1a1b89b2d037..7a9a75c3134d7a1fe36b5a2272e2e19494f84212 100644 (file)
@@ -6,11 +6,8 @@ module UserHelper
   def openid_button(name, url)
     link_to_function(
       image_tag("#{name}.png", :alt => t("user.login.openid_providers.#{name}.alt")),
-      nil,
+      "submitOpenidUrl('#{url}')",
       :title => t("user.login.openid_providers.#{name}.title")
-    ) do |page|
-      page[:login_form][:openid_url][:value] = url
-      page[:login_form].submit()
-    end
+    )
   end
 end
index b84f7a483c9c7a7dd9fcd1a6dcb609b7ffb11ea1..06cc156bab95eaca42a849b3902526ecb691e979 100644 (file)
       var bottom = bbox.bottom - 0.0001;
       var loaded = false;
 
-      $("linkloader").observe("load", function () { loaded = true; });
+      $("#linkloader").load(function () { loaded = true; });
 
       if (select) {
-        $("linkloader").src = "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom + "&select=" + select;
+        $("#linkloader").attr("src", "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom + "&select=" + select);
       } else {
-        $("linkloader").src = "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom;
+        $("#linkloader").attr("src", "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom);
       }
 
       setTimeout(function () {
-        if (!loaded) alert("<%= escape_javascript(t('site.index.remote_failed')) %>");
+        if (!loaded) alert("<%=j t('site.index.remote_failed') %>");
       }, 1000);
 
-      event.stop();
+      return false;
     }
 
     function init() {
@@ -70,7 +70,7 @@
         controls: [ new OpenLayers.Control.Navigation() ]
       });
 
-      <% if map.instance_of? Changeset %>
+      <% if map.instance_of? Changeset -%>
         <% bbox = map.bbox.to_unscaled %>
         var minlon = <%= bbox.min_lon %>;
         var minlat = <%= bbox.min_lat %>;
         setMapExtent(bbox);
         addBoxToMap(bbox);
 
-        $("loading").style.display = "none";
+        $("#loading").hide();
+        $("#browse_map .geolink").show();
 
-        $$("#browse_map .geolink").each(function (link) {
-          link.style.display = "inline";
+        $("#remote_area_edit").click(function (event) {
+          return remoteEditHandler(event, bbox);
         });
 
-        $("remote_area_edit").observe("click", function (event) {
-          remoteEditHandler(event, bbox);
+        <% if preferred_editor == "remote" -%>
+        $("#area_edit").click(function (event) {
+          return remoteEditHandler(event, bbox);
         });
+        <% end -%>
 
-        <% if preferred_editor == "remote" %>
-          $("area_edit").observe("click", function (event) {
-            remoteEditHandler(event, bbox);
-          });
-        <% end %>
-
-        updatelinks(centre.lon, centre.lat, 16, null, minlon, minlat, maxlon, maxlat)
-      <% else %>
+        updatelinks(centre.lon, centre.lat, 16, null, minlon, minlat, maxlon, maxlat);
+      <% else -%>
         var obj_type = "<%= map.class.name.downcase %>";
         var obj_id = <%= map.id %>;
         var obj_version = <%= map.version %>;
         var obj_visible = <%= map.visible %>;
-        var url = "/api/<%= "#{API_VERSION}" %>/<%= map.class.name.downcase %>/<%= map.id %>";
+        var url = "/api/<%= API_VERSION %>/<%= map.class.name.downcase %>/<%= map.id %>";
 
         if (obj_type != "node") {
           url += "/full";
         }
 
         addObjectToMap(url, true, function(extent) {
-          $("loading").style.display = "none";
-
-          $$("#browse_map .geolink").each(function (link) {
-            link.style.display = "inline";
-          });
+          $("#loading").hide();
+          $("#browse_map .geolink").show();
 
           if (extent) {
             extent.transform(map.getProjectionObject(), map.displayProjection);
 
             var centre = extent.getCenterLonLat();
 
-            $("remote_area_edit").observe("click", function (event) {
-              remoteEditHandler(event, extent);
+            $("#remote_area_edit").click(function (event) {
+              return remoteEditHandler(event, extent);
             });
 
-            <% if preferred_editor == "remote" %>
-              $("area_edit").observe("click", function (event) {
-                remoteEditHandler(event, extent);
-              });
-            <% end %>
+            <% if preferred_editor == "remote" -%>
+            $("#area_edit").click(function (event) {
+              return remoteEditHandler(event, extent);
+            });
+            <% end -%>
 
-            <% unless map.instance_of? Changeset %>
-              $("remote_object_edit").observe("click", function (event) {
-                remoteEditHandler(event, extent, "<%= map.class.to_s.downcase + map.id.to_s %>");
-              });
+            <% unless map.instance_of? Changeset -%>
+            $("#remote_object_edit").click(function (event) {
+              return remoteEditHandler(event, extent, "<%= map.class.to_s.downcase + map.id.to_s %>");
+            });
 
-              $("object_larger_map").innerHTML = "<%= t('browse.map.larger.' + map.class.to_s.downcase) %>";
-              $("object_edit").innerHTML = "<%= t('browse.map.edit.' + map.class.to_s.downcase) %>";
-            <% end %>
+            $("#object_larger_map").html("<%=j t('browse.map.larger.' + map.class.to_s.downcase) %>");
+            $("#object_edit").html("<%=j t('browse.map.edit.' + map.class.to_s.downcase) %>");
+            <% end -%>
 
-            updatelinks(centre.lon, centre.lat, 16, null, extent.left, extent.bottom, extent.right, extent.top, "<%= map.class.to_s.downcase %>", <%= map.id %>)
+            updatelinks(centre.lon, centre.lat, 16, null, extent.left, extent.bottom, extent.right, extent.top, "<%= map.class.to_s.downcase %>", <%= map.id %>);
           } else {
-            $("small_map").style.display = "none";
+            $("#small_map").hide();
           }
         });
-      <% end %>
+      <% end -%>
 
       createMenu("area_edit", "area_edit_menu", 1000, "right");
       createMenu("object_edit", "object_edit_menu", 1000, "right");
diff --git a/app/views/browse/start.js.erb b/app/views/browse/start.js.erb
new file mode 100644 (file)
index 0000000..e986213
--- /dev/null
@@ -0,0 +1,545 @@
+var browseBoxControl;
+var browseMode = "auto";
+var browseBounds;
+var browseFeatureList;
+var browseActiveFeature;
+var browseDataLayer;
+var browseSelectControl;
+var browseObjectList;
+var areasHidden = false;
+
+OpenLayers.Feature.Vector.style['default'].strokeWidth = 3;
+OpenLayers.Feature.Vector.style['default'].cursor = "pointer";
+    
+function startBrowse() {
+  map.dataLayer.active = true;
+
+  $("#sidebar_title").html("<%=j t 'browse.start_rjs.data_frame_title' %>");
+  $("#sidebar_content").html("<%=j render :partial => "sidebar" %>");
+
+  openSidebar({ onclose: stopBrowse });
+
+  var vectors = new OpenLayers.Layer.Vector();
+    
+  browseBoxControl = new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.RegularPolygon, { 
+    handlerOptions: {
+      sides: 4,
+      snapAngle: 90,
+      irregular: true,
+      persist: true
+    }
+  });
+  browseBoxControl.handler.callbacks.done = endDrag;
+  map.addControl(browseBoxControl);
+
+  map.events.register("moveend", map, showData);
+  map.events.triggerEvent("moveend");
+
+  $("#browse_select_box").click(startDrag);
+
+  $("#browse_hide_areas_box").html("<%=j t 'browse.start_rjs.hide_areas' %>");
+  $("#browse_hide_areas_box").show();
+  $("#browse_hide_areas_box").click(hideAreas);
+}
+
+function showData() {
+  if (browseMode == "auto") {
+    if (map.getZoom() >= 15) {
+        useMap(false);
+    } else {
+        setStatus("<%=j t 'browse.start_rjs.zoom_or_select' %>");
+    }    
+  }
+}
+
+function stopBrowse() {
+  if (map.dataLayer.active) {
+    map.dataLayer.active = false;
+
+    if (browseSelectControl) {   
+      browseSelectControl.destroy();  
+      browseSelectControl = null;
+    } 
+
+    if (browseBoxControl) {
+      browseBoxControl.destroy();
+      browseBoxControl = null;
+    }          
+
+    if (browseActiveFeature) {
+      browseActiveFeature.destroy(); 
+      browseActiveFeature = null; 
+    }
+
+    if (browseDataLayer) {
+      browseDataLayer.destroy();
+      browseDataLayer = null; 
+    } 
+
+    map.dataLayer.setVisibility(false);
+    map.events.unregister("moveend", map, showData);
+  }    
+}
+
+function startDrag() {
+  $("#browse_select_box").html("<%=j t 'browse.start_rjs.drag_a_box' %>");
+
+  browseBoxControl.activate();
+
+  return false;
+}
+
+function useMap(reload) {
+  var bounds = map.getExtent();
+  var projected = bounds.clone().transform(map.getProjectionObject(), epsg4326);
+
+  if (!browseBounds || !browseBounds.containsBounds(projected)) {
+    var center = bounds.getCenterLonLat();
+    var tileWidth = bounds.getWidth() * 1.2;
+    var tileHeight = bounds.getHeight() * 1.2;
+    var tileBounds = new OpenLayers.Bounds(center.lon - (tileWidth / 2),
+                                           center.lat - (tileHeight / 2),
+                                           center.lon + (tileWidth / 2),
+                                           center.lat + (tileHeight / 2));
+
+    browseBounds = tileBounds;
+    getData(tileBounds, reload);
+
+    browseMode = "auto";
+
+    $("#browse_select_view").hide();
+  }
+
+  return false;
+}
+
+function hideAreas() {
+  $("#browse_hide_areas_box").html("<%=j t 'browse.start_rjs.show_areas' %>");
+  $("#browse_hide_areas_box").show();
+  $("#browse_hide_areas_box").click(showAreas);
+
+  areasHidden = true;
+
+  useMap(true);
+}
+
+function showAreas() {
+  $("#browse_hide_areas_box").html("<%=j t 'browse.start_rjs.hide_areas' %>");
+  $("#browse_hide_areas_box").show();
+  $("#browse_hide_areas_box").click(hideAreas);
+
+  areasHidden = false;
+
+  useMap(true);
+}
+
+$("#browse_select_view").click(useMap);
+
+function endDrag(bbox) {
+  var bounds = bbox.getBounds();
+  var projected = bounds.clone().transform(map.getProjectionObject(), epsg4326);
+
+  browseBoxControl.deactivate();
+  browseBounds = projected;
+  getData(bounds);
+
+  browseMode = "manual";  
+
+  $("#browse_select_box").html("<%=j t 'browse.start_rjs.manually_select' %>");
+  $("#browse_select_view").show();
+}
+
+function displayFeatureWarning() {
+  clearStatus();
+
+  var div = document.createElement("div");
+
+  var p = document.createElement("p");
+  p.appendChild(document.createTextNode(i18n("<%=j t 'browse.start_rjs.loaded_an_area_with_num_features' %>", { num_features: browseFeatureList.length })));
+  div.appendChild(p);
+
+  var input = document.createElement("input");
+  input.type = "submit";
+  input.value = "<%=j t 'browse.start_rjs.load_data' %>";
+  input.onclick = loadFeatureList;
+  div.appendChild(input); 
+
+  $("#browse_content").html("");
+  $("#browse_content").append(div);
+}
+
+function loadFeatureList() {
+  browseDataLayer.addFeatures(browseFeatureList);
+  browseDataLayer.events.triggerEvent("loadend");
+
+  browseFeatureList = []; 
+
+  return false;
+}    
+
+function customDataLoader(request) {
+  if (this.map.dataLayer.active) {
+    var doc = request.responseXML;
+
+    if (!doc || !doc.documentElement) {
+      doc = request.responseText;
+    }
+
+    var options = {};
+
+    OpenLayers.Util.extend(options, this.formatOptions);
+
+    if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
+      options.externalProjection = this.projection;
+      options.internalProjection = this.map.getProjectionObject();
+    }    
+
+    var gml = this.format ? new this.format(options) : new OpenLayers.Format.GML(options);
+
+    browseFeatureList = gml.read(doc);
+
+    if (!this.maxFeatures || browseFeatureList.length <= this.maxFeatures) {
+      loadFeatureList();
+    } else {
+      displayFeatureWarning();
+    }
+  }
+}
+
+function getData(bounds, reload) {
+  var projected = bounds.clone().transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));
+  var size = projected.getWidth() * projected.getHeight();
+
+  if (size > <%= MAX_REQUEST_AREA %>) {
+    setStatus(i18n("<%=j t 'browse.start_rjs.unable_to_load_size', :max_bbox_size => MAX_REQUEST_AREA %>", { bbox_size: size }));
+  } else {
+    loadGML("/api/<%= API_VERSION %>/map?bbox=" + projected.toBBOX(), reload);
+  }
+}
+
+function loadGML(url, reload) {
+  setStatus("<%=j t 'browse.start_rjs.loading' %>");
+
+  $("#browse_content").empty();
+
+  var formatOptions = {
+    checkTags: true,
+    interestingTagsExclude: ['source','source_ref','source:ref','history','attribution','created_by','tiger:county','tiger:tlid','tiger:upload_uuid']
+  };
+
+  if (areasHidden) formatOptions.areaTags = [];
+
+  if (!browseDataLayer || reload) {
+    var style = new OpenLayers.Style();
+
+    style.addRules([new OpenLayers.Rule({
+      symbolizer: {
+        Polygon: { fillColor: '#ff0000', strokeColor: '#ff0000' },
+        Line: { fillColor: '#ffff00', strokeColor: '#000000', strokeOpacity: '0.4' },
+        Point: { fillColor: '#00ff00', strokeColor: '#00ff00' }
+      }
+    })]);
+
+    if (browseDataLayer) browseDataLayer.destroyFeatures();
+
+    browseDataLayer = new OpenLayers.Layer.GML("Data", url, {
+      format: OpenLayers.Format.OSM,
+      formatOptions: formatOptions,
+      maxFeatures: 100,
+      requestSuccess: customDataLoader,
+      displayInLayerSwitcher: false,
+      styleMap: new OpenLayers.StyleMap({
+        'default': style,
+        'select': { strokeColor: '#0000ff', strokeWidth: 8 }
+      })
+    });
+    browseDataLayer.events.register("loadend", browseDataLayer, dataLoaded );
+    map.addLayer(browseDataLayer);
+            
+    browseSelectControl = new OpenLayers.Control.SelectFeature(browseDataLayer, { onSelect: onFeatureSelect });
+    browseSelectControl.handlers.feature.stopDown = false;
+    browseSelectControl.handlers.feature.stopUp = false;
+    map.addControl(browseSelectControl);
+    browseSelectControl.activate();
+  } else {
+    browseDataLayer.destroyFeatures();
+    browseDataLayer.format(formatOptions);
+    browseDataLayer.setUrl(url);
+  }
+
+  browseActiveFeature = null;
+}
+
+function dataLoaded() {
+  if (this.map.dataLayer.active) {
+    clearStatus();
+
+    browseObjectList = document.createElement("div");
+
+    var heading = document.createElement("p");
+    heading.className = "browse_heading";
+    heading.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.object_list.heading' %>"));
+    browseObjectList.appendChild(heading);
+
+    var list = document.createElement("ul");
+
+    for (var i = 0; i < this.features.length; i++) {
+      var feature = this.features[i]; 
+            
+      // Type, for linking
+      var type = featureType(feature);
+      var typeName = featureTypeName(feature);
+      var li = document.createElement("li");
+      li.appendChild(document.createTextNode(typeName + " "));
+            
+      // Link, for viewing in the tab
+      var link = document.createElement("a");
+      link.href =  "/browse/" + type + "/" + feature.osm_id; 
+      var name = featureName(feature);
+      link.appendChild(document.createTextNode(name));
+      link.feature = feature;
+      link.onclick = OpenLayers.Function.bind(viewFeatureLink, link);   
+      li.appendChild(link);
+
+      list.appendChild(li);
+    }
+
+    browseObjectList.appendChild(list);
+
+    var link = document.createElement("a");
+    link.href = this.url;
+    link.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.object_list.api' %>"));
+    browseObjectList.appendChild(link);
+
+    $("#browse_content").html(browseObjectList); 
+  }
+}
+    
+function viewFeatureLink() {
+  var layer = this.feature.layer;
+
+  for (var i = 0; i < layer.selectedFeatures.length; i++) {
+    var f = layer.selectedFeatures[i]; 
+    layer.drawFeature(f, layer.styleMap.createSymbolizer(f, "default"));
+  }
+
+  onFeatureSelect(this.feature);
+
+  if (browseMode != "auto") {
+    map.setCenter(this.feature.geometry.getBounds().getCenterLonLat()); 
+  }
+
+  return false;
+}
+    
+function loadObjectList() {
+  $("#browse_content").empty();
+  $("#browse_content").append(browseObjectList);
+
+  return false;
+}
+      
+function onFeatureSelect(feature) {
+  // Unselect previously selected feature
+  if (browseActiveFeature) {
+    browseActiveFeature.layer.drawFeature(
+      browseActiveFeature, 
+      browseActiveFeature.layer.styleMap.createSymbolizer(browseActiveFeature, "default")
+    );
+  }
+
+  // Redraw in selected style
+  feature.layer.drawFeature(
+    feature, feature.layer.styleMap.createSymbolizer(feature, "select")
+  );
+
+  // If the current object is the list, don't innerHTML="", since that could clear it.
+  if ($("#browse_content").firstChild == browseObjectList) { 
+    $("#browse_content").removeChild(browseObjectList);
+  } else { 
+    $("#browse_content").empty();
+  }   
+        
+  // Create a link back to the object list
+  var div = document.createElement("div");
+  div.style.textAlign = "center";
+  div.style.marginBottom = "20px";
+  $("#browse_content").append(div);
+  var link = document.createElement("a");
+  link.href = "#";
+  link.onclick = loadObjectList;
+  link.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.object_list.back' %>"));
+  div.appendChild(link);
+
+  var table = document.createElement("table");
+  table.width = "100%";
+  table.className = "browse_heading";
+  $("#browse_content").append(table);
+
+  var tr = document.createElement("tr");
+  table.appendChild(tr);
+
+  var heading = document.createElement("td");
+  heading.appendChild(document.createTextNode(featureNameSelect(feature)));
+  tr.appendChild(heading);
+
+  var td = document.createElement("td");
+  td.align = "right";
+  tr.appendChild(td);
+
+  var type = featureType(feature);
+  var link = document.createElement("a");   
+  link.href = "/browse/" + type + "/" + feature.osm_id;
+  link.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.object_list.details' %>"));
+  td.appendChild(link);
+
+  var div = document.createElement("div");
+  div.className = "browse_details";
+
+  $("#browse_content").append(div);
+
+  // Now the list of attributes
+  var ul = document.createElement("ul");
+  for (var key in feature.attributes) {
+    var li = document.createElement("li");
+    var b = document.createElement("b");
+    b.appendChild(document.createTextNode(key));
+    li.appendChild(b);
+    li.appendChild(document.createTextNode(": " + feature.attributes[key]));
+    ul.appendChild(li);
+  }
+        
+  div.appendChild(ul);
+        
+  var link = document.createElement("a");   
+  link.href =  "/browse/" + type + "/" + feature.osm_id + "/history";
+  link.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.show_history' %>"));
+  link.onclick = OpenLayers.Function.bind(loadHistory, {
+    type: type, feature: feature, link: link
+  });
+        
+  div.appendChild(link);
+
+  // Stash the currently drawn feature
+  browseActiveFeature = feature; 
+}   
+
+function loadHistory() {
+  this.link.href = "";
+  this.link.innerHTML = "<%=j t 'browse.start_rjs.wait' %>";
+
+  new Ajax.Request("/api/<%= API_VERSION %>/" + this.type + "/" + this.feature.osm_id + "/history", {
+    onComplete: OpenLayers.Function.bind(displayHistory, this)
+  });
+
+  return false;
+}
+
+function displayHistory(request) {
+  if (browseActiveFeature.osm_id != this.feature.osm_id || $("#browse_content").firstChild == browseObjectList)  { 
+      return false;
+  } 
+
+  this.link.parentNode.removeChild(this.link);
+
+  var doc = request.responseXML;
+
+  var table = document.createElement("table");
+  table.width = "100%";
+  table.className = "browse_heading";
+  $("#browse_content").append(table);
+
+  var tr = document.createElement("tr");
+  table.appendChild(tr);
+
+  var heading = document.createElement("td");
+  heading.appendChild(document.createTextNode(i18n("<%=j t 'browse.start_rjs.history_for_feature' %>", { feature: featureNameHistory(this.feature) })));
+  tr.appendChild(heading);
+
+  var td = document.createElement("td");
+  td.align = "right";
+  tr.appendChild(td);
+
+  var link = document.createElement("a");   
+  link.href = "/browse/" + this.type + "/" + this.feature.osm_id + "/history";
+  link.appendChild(document.createTextNode("<%=j t 'browse.start_rjs.details' %>"));
+  td.appendChild(link);
+
+  var div = document.createElement("div");
+  div.className = "browse_details";
+
+  var nodes = doc.getElementsByTagName(this.type);
+  var history = document.createElement("ul");  
+  for (var i = nodes.length - 1; i >= 0; i--) {
+    var user = nodes[i].getAttribute("user") || "<%=j t 'browse.start_rjs.private_user' %>";
+    var timestamp = nodes[i].getAttribute("timestamp");
+    var item = document.createElement("li");
+    item.appendChild(document.createTextNode(i18n("<%=j t 'browse.start_rjs.edited_by_user_at_timestamp' %>", { user: user, timestamp: timestamp })));
+    history.appendChild(item);
+  }
+  div.appendChild(history);
+
+  $("#browse_content").append(div); 
+}
+
+function featureType(feature) {
+  if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+    return "node";
+  } else {
+    return "way";
+  }
+}
+
+function featureTypeName(feature) {
+  if (featureType(feature) == "node") {
+    return "<%=j t 'browse.start_rjs.object_list.type.node' %>";
+  } else if (featureType(feature) == "way") {
+    return "<%=j t 'browse.start_rjs.object_list.type.way' %>";
+  }
+}
+
+function featureName(feature) {
+  if (feature.attributes['name:<%= I18n.locale %>']) {
+    return feature.attributes['name:<%= I18n.locale %>'];
+  } else if (feature.attributes.name) {
+    return feature.attributes.name;
+  } else {
+    return feature.osm_id;
+  }
+}
+
+function featureNameSelect(feature) {
+  if (feature.attributes['name:<%= I18n.locale %>']) {
+    return feature.attributes['name:<%= I18n.locale %>'];
+  } else if (feature.attributes.name) {
+    return feature.attributes.name;
+  } else if (featureType(feature) == "node") {
+    return i18n("<%=j t 'browse.start_rjs.object_list.selected.type.node' %>", { id: feature.osm_id });
+  } else if (featureType(feature) == "way") {
+    return i18n("<%=j t 'browse.start_rjs.object_list.selected.type.way' %>", { id: feature.osm_id });
+  }
+}
+
+function featureNameHistory(feature) {
+  if (feature.attributes['name:<%= I18n.locale %>']) {
+    return feature.attributes['name:<%= I18n.locale %>'];
+  } else if (feature.attributes.name) {
+    return feature.attributes.name;
+  } else if (featureType(feature) == "node") {
+    return i18n("<%=j t 'browse.start_rjs.object_list.history.type.node' %>", { id: feature.osm_id });
+  } else if (featureType(feature) == "way") {
+    return i18n("<%=j t 'browse.start_rjs.object_list.history.type.way' %>", { id: feature.osm_id });
+  }
+}
+
+function setStatus(status) {
+  $("#browse_status").html(status);
+  $("#browse_status").show();
+}
+  
+function clearStatus() {
+  $("#browse_status").html("");
+  $("#browse_status").hide();
+}
+
+startBrowse();
diff --git a/app/views/browse/start.rjs b/app/views/browse/start.rjs
deleted file mode 100644 (file)
index b96e8c3..0000000
+++ /dev/null
@@ -1,546 +0,0 @@
-page.replace_html :sidebar_title, t('browse.start_rjs.data_frame_title')
-page.replace_html :sidebar_content, :partial => 'start'
-page << <<EOJ
-  var browseBoxControl;
-  var browseMode = "auto";
-  var browseBounds;
-  var browseFeatureList;
-  var browseActiveFeature;
-  var browseDataLayer;
-  var browseSelectControl;
-  var browseObjectList;
-  var areasHidden = false;
-
-  OpenLayers.Feature.Vector.style['default'].strokeWidth = 3;
-  OpenLayers.Feature.Vector.style['default'].cursor = "pointer";
-    
-  function startBrowse() {
-    map.dataLayer.active = true;
-
-    openSidebar({ onclose: stopBrowse });
-
-    var vectors = new OpenLayers.Layer.Vector();
-    
-    browseBoxControl = new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.RegularPolygon, { 
-      handlerOptions: {
-        sides: 4,
-        snapAngle: 90,
-        irregular: true,
-        persist: true
-      }
-    });
-    browseBoxControl.handler.callbacks.done = endDrag;
-    map.addControl(browseBoxControl);
-
-    map.events.register("moveend", map, showData);
-    map.events.triggerEvent("moveend");
-
-    $("browse_hide_areas_box").innerHTML = "#{I18n.t('browse.start_rjs.hide_areas')}";
-    $("browse_hide_areas_box").style.display = "inline";
-    $("browse_hide_areas_box").onclick = hideAreas;
-  }
-
-  function showData() {
-    if (browseMode == "auto") {
-      if (map.getZoom() >= 15) {
-          useMap(false);
-      } else {
-          setStatus("#{I18n.t('browse.start_rjs.zoom_or_select')}");
-      }    
-    }
-  }
-
-  function stopBrowse() {
-    if (map.dataLayer.active) {
-      map.dataLayer.active = false;
-
-      if (browseSelectControl) {   
-        browseSelectControl.destroy();  
-        browseSelectControl = null;
-      } 
-
-      if (browseBoxControl) {
-       browseBoxControl.destroy();
-        browseBoxControl = null;
-      }                
-
-      if (browseActiveFeature) {
-        browseActiveFeature.destroy(); 
-        browseActiveFeature = null; 
-      }
-
-      if (browseDataLayer) {
-        browseDataLayer.destroy();
-        browseDataLayer = null; 
-      } 
-
-      map.dataLayer.setVisibility(false);
-      map.events.unregister("moveend", map, showData);
-    }    
-  }
-
-  function startDrag() {
-    $("browse_select_box").innerHTML="#{I18n.t('browse.start_rjs.drag_a_box')}";
-
-    browseBoxControl.activate();
-
-    return false;
-  };
-
-  $("browse_select_box").onclick = startDrag;
-
-  function useMap(reload) {
-    var bounds = map.getExtent();
-    var projected = bounds.clone().transform(map.getProjectionObject(), epsg4326);
-
-    if (!browseBounds || !browseBounds.containsBounds(projected)) {
-      var center = bounds.getCenterLonLat();
-      var tileWidth = bounds.getWidth() * 1.2;
-      var tileHeight = bounds.getHeight() * 1.2;
-      var tileBounds = new OpenLayers.Bounds(center.lon - (tileWidth / 2),
-                                             center.lat - (tileHeight / 2),
-                                             center.lon + (tileWidth / 2),
-                                             center.lat + (tileHeight / 2));
-
-      browseBounds = tileBounds;
-      getData(tileBounds, reload);
-
-      browseMode = "auto";
-
-      $("browse_select_view").style.display = "none";
-    }
-
-    return false;
-  }
-
-  function hideAreas() {
-      $("browse_hide_areas_box").innerHTML = "#{I18n.t('browse.start_rjs.show_areas')}";
-      $("browse_hide_areas_box").style.display = "inline";
-      $("browse_hide_areas_box").onclick = showAreas;
-
-      areasHidden = true;
-
-      useMap(true);
-  }
-
-  function showAreas() {
-      $("browse_hide_areas_box").innerHTML = "#{I18n.t('browse.start_rjs.hide_areas')}";
-      $("browse_hide_areas_box").style.display = "inline";
-      $("browse_hide_areas_box").onclick = hideAreas;
-
-      areasHidden = false;
-
-      useMap(true);
-  }
-
-  $("browse_select_view").onclick = useMap;
-
-  function endDrag(bbox) {
-    var bounds = bbox.getBounds();
-    var projected = bounds.clone().transform(map.getProjectionObject(), epsg4326);
-
-    browseBoxControl.deactivate();
-    browseBounds = projected;
-    getData(bounds);
-
-    browseMode = "manual";  
-
-    $("browse_select_box").innerHTML = "#{I18n.t('browse.start_rjs.manually_select')}";
-    $("browse_select_view").style.display = "inline";
-  }
-
-  function displayFeatureWarning() {
-    clearStatus();
-
-    var div = document.createElement("div");
-
-    var p = document.createElement("p");
-    p.appendChild(document.createTextNode(i18n("#{I18n.t('browse.start_rjs.loaded_an_area_with_num_features')}", { num_features: browseFeatureList.length })));
-    div.appendChild(p);
-
-    var input = document.createElement("input");
-    input.type = "submit";
-    input.value = "#{I18n.t('browse.start_rjs.load_data')}";
-    input.onclick = loadFeatureList;
-    div.appendChild(input); 
-
-    $("browse_content").innerHTML = "";
-    $("browse_content").appendChild(div);
-  }
-
-  function loadFeatureList() {
-    browseDataLayer.addFeatures(browseFeatureList);
-    browseDataLayer.events.triggerEvent("loadend");
-
-    browseFeatureList = []; 
-
-    return false;
-  }    
-
-  function customDataLoader(request) {
-    if (this.map.dataLayer.active) {
-      var doc = request.responseXML;
-
-      if (!doc || !doc.documentElement) {
-        doc = request.responseText;
-      }
-
-      var options = {};
-
-      OpenLayers.Util.extend(options, this.formatOptions);
-
-      if (this.map && !this.projection.equals(this.map.getProjectionObject())) {
-        options.externalProjection = this.projection;
-        options.internalProjection = this.map.getProjectionObject();
-      }    
-
-      var gml = this.format ? new this.format(options) : new OpenLayers.Format.GML(options);
-
-      browseFeatureList = gml.read(doc);
-
-      if (!this.maxFeatures || browseFeatureList.length <= this.maxFeatures) {
-        loadFeatureList();
-      } else {
-        displayFeatureWarning();
-      }
-    }
-  }
-
-  function getData(bounds, reload) {
-    var projected = bounds.clone().transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));
-    var size = projected.getWidth() * projected.getHeight();
-
-    if (size > #{MAX_REQUEST_AREA}) {
-      setStatus(i18n("#{I18n.t('browse.start_rjs.unable_to_load_size', :max_bbox_size => MAX_REQUEST_AREA)}", { bbox_size: size }));
-    } else {
-      loadGML("/api/#{API_VERSION}/map?bbox=" + projected.toBBOX(), reload);
-    }
-  }
-
-  function loadGML(url, reload) {
-    setStatus("#{I18n.t('browse.start_rjs.loading')}");
-    $("browse_content").innerHTML = "";
-
-    var formatOptions = {
-      checkTags: true,
-      interestingTagsExclude: ['source','source_ref','source:ref','history','attribution','created_by','tiger:county','tiger:tlid','tiger:upload_uuid']
-    };
-
-    if (areasHidden) formatOptions.areaTags = [];
-
-    if (!browseDataLayer || reload) {
-      var style = new OpenLayers.Style();
-
-      style.addRules([new OpenLayers.Rule({
-        symbolizer: {
-          Polygon: { fillColor: '#ff0000', strokeColor: '#ff0000' },
-          Line: { fillColor: '#ffff00', strokeColor: '#000000', strokeOpacity: '0.4' },
-          Point: { fillColor: '#00ff00', strokeColor: '#00ff00' }
-        }
-      })]);
-
-      if (browseDataLayer) browseDataLayer.destroyFeatures();
-
-      browseDataLayer = new OpenLayers.Layer.GML("Data", url, {
-        format: OpenLayers.Format.OSM,
-        formatOptions: formatOptions,
-        maxFeatures: 100,
-        requestSuccess: customDataLoader,
-        displayInLayerSwitcher: false,
-        styleMap: new OpenLayers.StyleMap({
-          'default': style,
-          'select': { strokeColor: '#0000ff', strokeWidth: 8 }
-        })
-      });
-      browseDataLayer.events.register("loadend", browseDataLayer, dataLoaded );
-      map.addLayer(browseDataLayer);
-            
-      browseSelectControl = new OpenLayers.Control.SelectFeature(browseDataLayer, { onSelect: onFeatureSelect });
-      browseSelectControl.handlers.feature.stopDown = false;
-      browseSelectControl.handlers.feature.stopUp = false;
-      map.addControl(browseSelectControl);
-      browseSelectControl.activate();
-    } else {
-      browseDataLayer.destroyFeatures();
-      browseDataLayer.format(formatOptions);
-      browseDataLayer.setUrl(url);
-    }
-
-    browseActiveFeature = null;
-  }
-
-  function dataLoaded() {
-    if (this.map.dataLayer.active) {
-      clearStatus();
-
-      browseObjectList = document.createElement("div")
-
-      var heading = document.createElement("p");
-      heading.className = "browse_heading";
-      heading.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.object_list.heading')}"));
-      browseObjectList.appendChild(heading);
-
-      var list = document.createElement("ul");
-
-      for (var i = 0; i < this.features.length; i++) {
-        var feature = this.features[i]; 
-            
-        // Type, for linking
-        var type = featureType(feature);
-        var typeName = featureTypeName(feature);
-        var li = document.createElement("li");
-        li.appendChild(document.createTextNode(typeName + " "));
-            
-        // Link, for viewing in the tab
-        var link = document.createElement("a");
-        link.href =  "/browse/" + type + "/" + feature.osm_id; 
-        var name = featureName(feature);
-        link.appendChild(document.createTextNode(name));
-        link.feature = feature;
-        link.onclick = OpenLayers.Function.bind(viewFeatureLink, link);   
-        li.appendChild(link);
-
-        list.appendChild(li);
-      }
-
-      browseObjectList.appendChild(list)
-
-      var link = document.createElement("a");
-      link.href = this.url;
-      link.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.object_list.api')}"));
-      browseObjectList.appendChild(link);
-
-      $("browse_content").innerHTML = "";
-      $("browse_content").appendChild(browseObjectList); 
-    }
-  }
-    
-  function viewFeatureLink() {
-    var layer = this.feature.layer;
-
-    for (var i = 0; i < layer.selectedFeatures.length; i++) {
-      var f = layer.selectedFeatures[i]; 
-      layer.drawFeature(f, layer.styleMap.createSymbolizer(f, "default"));
-    }
-
-    onFeatureSelect(this.feature);
-
-    if (browseMode != "auto") {
-      map.setCenter(this.feature.geometry.getBounds().getCenterLonLat()); 
-    }
-
-    return false;
-  }
-    
-  function loadObjectList() {
-    $("browse_content").innerHTML="";
-    $("browse_content").appendChild(browseObjectList);
-
-    return false;
-  }
-      
-  function onFeatureSelect(feature) {
-    // Unselect previously selected feature
-    if (browseActiveFeature) {
-      browseActiveFeature.layer.drawFeature(
-        browseActiveFeature, 
-        browseActiveFeature.layer.styleMap.createSymbolizer(browseActiveFeature, "default")
-      );
-    }
-
-    // Redraw in selected style
-    feature.layer.drawFeature(
-      feature, feature.layer.styleMap.createSymbolizer(feature, "select")
-    );
-
-    // If the current object is the list, don't innerHTML="", since that could clear it.
-    if ($("browse_content").firstChild == browseObjectList) { 
-      $("browse_content").removeChild(browseObjectList);
-    } else { 
-      $("browse_content").innerHTML = "";
-    }   
-        
-    // Create a link back to the object list
-    var div = document.createElement("div");
-    div.style.textAlign = "center";
-    div.style.marginBottom = "20px";
-    $("browse_content").appendChild(div);
-    var link = document.createElement("a");
-    link.href = "#";
-    link.onclick = loadObjectList;
-    link.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.object_list.back')}"));
-    div.appendChild(link);
-
-    var table = document.createElement("table");
-    table.width = "100%";
-    table.className = "browse_heading";
-    $("browse_content").appendChild(table);
-
-    var tr = document.createElement("tr");
-    table.appendChild(tr);
-
-    var heading = document.createElement("td");
-    heading.appendChild(document.createTextNode(featureNameSelect(feature)));
-    tr.appendChild(heading);
-
-    var td = document.createElement("td");
-    td.align = "right";
-    tr.appendChild(td);
-
-    var type = featureType(feature);
-    var link = document.createElement("a");   
-    link.href = "/browse/" + type + "/" + feature.osm_id;
-    link.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.object_list.details')}"));
-    td.appendChild(link);
-
-    var div = document.createElement("div");
-    div.className = "browse_details";
-
-    $("browse_content").appendChild(div);
-
-    // Now the list of attributes
-    var ul = document.createElement("ul");
-    for (var key in feature.attributes) {
-      var li = document.createElement("li");
-      var b = document.createElement("b");
-      b.appendChild(document.createTextNode(key));
-      li.appendChild(b);
-      li.appendChild(document.createTextNode(": " + feature.attributes[key]));
-      ul.appendChild(li);
-    }
-        
-    div.appendChild(ul);
-        
-    var link = document.createElement("a");   
-    link.href =  "/browse/" + type + "/" + feature.osm_id + "/history";
-    link.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.show_history')}"));
-    link.onclick = OpenLayers.Function.bind(loadHistory, {
-      type: type, feature: feature, link: link
-    });
-        
-    div.appendChild(link);
-
-    // Stash the currently drawn feature
-    browseActiveFeature = feature; 
-  }   
-
-  function loadHistory() {
-    this.link.href = "";
-    this.link.innerHTML = "#{I18n.t('browse.start_rjs.wait')}";
-
-    new Ajax.Request("/api/#{API_VERSION}/" + this.type + "/" + this.feature.osm_id + "/history", {
-      onComplete: OpenLayers.Function.bind(displayHistory, this)
-    });
-
-    return false;
-  }
-
-  function displayHistory(request) {
-    if (browseActiveFeature.osm_id != this.feature.osm_id || $("browse_content").firstChild == browseObjectList)  { 
-        return false;
-    } 
-
-    this.link.parentNode.removeChild(this.link);
-
-    var doc = request.responseXML;
-
-    var table = document.createElement("table");
-    table.width = "100%";
-    table.className = "browse_heading";
-    $("browse_content").appendChild(table);
-
-    var tr = document.createElement("tr");
-    table.appendChild(tr);
-
-    var heading = document.createElement("td");
-    heading.appendChild(document.createTextNode(i18n("#{I18n.t('browse.start_rjs.history_for_feature')}", { feature: featureNameHistory(this.feature) })));
-    tr.appendChild(heading);
-
-    var td = document.createElement("td");
-    td.align = "right";
-    tr.appendChild(td);
-
-    var link = document.createElement("a");   
-    link.href = "/browse/" + this.type + "/" + this.feature.osm_id + "/history";
-    link.appendChild(document.createTextNode("#{I18n.t('browse.start_rjs.details')}"));
-    td.appendChild(link);
-
-    var div = document.createElement("div");
-    div.className = "browse_details";
-
-    var nodes = doc.getElementsByTagName(this.type);
-    var history = document.createElement("ul");  
-    for (var i = nodes.length - 1; i >= 0; i--) {
-      var user = nodes[i].getAttribute("user") || "#{I18n.t('browse.start_rjs.private_user')}";
-      var timestamp = nodes[i].getAttribute("timestamp");
-      var item = document.createElement("li");
-      item.appendChild(document.createTextNode(i18n("#{I18n.t('browse.start_rjs.edited_by_user_at_timestamp')}", { user: user, timestamp: timestamp })));
-      history.appendChild(item);
-    }
-    div.appendChild(history);
-
-    $("browse_content").appendChild(div); 
-  }
-
-  function featureType(feature) {
-    if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
-      return "node";
-    } else {
-      return "way";
-    }
-  }
-
-  function featureTypeName(feature) {
-    if (featureType(feature) == "node") {
-      return "#{I18n.t('browse.start_rjs.object_list.type.node')}";
-    } else if (featureType(feature) == "way") {
-      return "#{I18n.t('browse.start_rjs.object_list.type.way')}";
-    }
-  }
-
-  function featureName(feature) {
-    if (feature.attributes['name:#{I18n.locale}']) {
-      return feature.attributes['name:#{I18n.locale}'];
-    } else if (feature.attributes.name) {
-      return feature.attributes.name;
-    } else {
-      return feature.osm_id;
-    }
-  }
-
-  function featureNameSelect(feature) {
-    if (feature.attributes['name:#{I18n.locale}']) {
-      return feature.attributes['name:#{I18n.locale}'];
-    } else if (feature.attributes.name) {
-      return feature.attributes.name;
-    } else if (featureType(feature) == "node") {
-      return i18n("#{I18n.t('browse.start_rjs.object_list.selected.type.node')}", { id: feature.osm_id });
-    } else if (featureType(feature) == "way") {
-      return i18n("#{I18n.t('browse.start_rjs.object_list.selected.type.way')}", { id: feature.osm_id });
-    }
-  }
-
-  function featureNameHistory(feature) {
-    if (feature.attributes['name:#{I18n.locale}']) {
-      return feature.attributes['name:#{I18n.locale}'];
-    } else if (feature.attributes.name) {
-      return feature.attributes.name;
-    } else if (featureType(feature) == "node") {
-      return i18n("#{I18n.t('browse.start_rjs.object_list.history.type.node')}", { id: feature.osm_id });
-    } else if (featureType(feature) == "way") {
-      return i18n("#{I18n.t('browse.start_rjs.object_list.history.type.way')}", { id: feature.osm_id });
-    }
-  }
-
-  function setStatus(status) {
-    $("browse_status").innerHTML = status;
-    $("browse_status").style.display = "block";
-  }
-  
-  function clearStatus() {
-    $("browse_status").innerHTML = "";
-    $("browse_status").style.display = "none";
-  }
-
-  startBrowse();
-EOJ
index dfa5bc8069c9474a01d7d0cf9939f4eb782994f0..88447dde6957718a77d085a23c058ce8b0c2d5d7 100644 (file)
 </tr>
 
 <script type="text/javascript">
-$("tr-changeset-<%= changeset.id%>").observe("mouseover", function() {
+$("#tr-changeset-<%= changeset.id%>").mouseover(function() {
   highlightChangeset("<%= changeset.id %>");
 });
 
-$("tr-changeset-<%= changeset.id%>").observe("mouseout", function() {
+$("#tr-changeset-<%= changeset.id%>").mouseout(function() {
   unHighlightChangeset("<%= changeset.id %>");
 });
 </script>
index bc1e795b0fa4026963e144af6125775670b0842f..d0d65d9d77153bd85a31a6a0e3ac72e77efa1246 100644 (file)
 
     vectors.addFeatures(highlight);
 
-    $("tr-changeset-" + id).addClassName("selected");
+    $("#tr-changeset-" + id).addClass("selected");
   }
 
   function unHighlightChangeset(id) {
     vectors.removeFeatures(highlight);
 
-    $("tr-changeset-" + id).removeClassName("selected");
+    $("#tr-changeset-" + id).removeClass("selected");
   }
 
   function init() {
index 8c054bb8bfc795549c2de0634eefaec176ae5a9e..f6273a828a849b0dc3d77fafbe167ee80538b56b 100644 (file)
@@ -63,8 +63,8 @@
 
     var lonlat = getEventPosition(e);
 
-    $("latitude").value = lonlat.lat;
-    $("longitude").value = lonlat.lon;
+    $("#latitude").val(lonlat.lat);
+    $("#longitude").val(lonlat.lon);
 
     if (marker) {
       removeMarkerFromMap(marker);
@@ -74,8 +74,8 @@
   }
 
   function openMap() {
-    $("map").style.display = "block";
-    $("usemap").style.display = "none";
+    $("#map").show();
+    $("#usemap").hide();
 
     var centre = new OpenLayers.LonLat(<%= lon %>, <%= lat %>);
     var zoom = <%= zoom %>;
diff --git a/app/views/export/start.js.erb b/app/views/export/start.js.erb
new file mode 100644 (file)
index 0000000..80e9de1
--- /dev/null
@@ -0,0 +1,347 @@
+var vectors;
+var box;
+var markerLayer;
+var markerControl;
+
+function startExport() {
+  vectors = new OpenLayers.Layer.Vector("Vector Layer", {
+    displayInLayerSwitcher: false
+  });
+  map.addLayer(vectors);
+
+  box = new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.RegularPolygon, {
+    handlerOptions: {
+      sides: 4,
+      snapAngle: 90,
+      irregular: true,
+      persist: true
+    }
+  });
+  box.handler.callbacks.done = endDrag;
+  map.addControl(box);
+
+  map.events.register("moveend", map, mapMoved);
+  map.events.register("changebaselayer", map, htmlUrlChanged);
+
+  $("#sidebar_title").html("<%=j t 'export.start_rjs.export' %>");
+  $("#sidebar_content").html("<%=j render :partial => "sidebar" %>");
+
+  $("#maxlat").change(boundsChanged);
+  $("#minlon").change(boundsChanged);
+  $("#maxlon").change(boundsChanged);
+  $("#minlat").change(boundsChanged);
+
+  $("#drag_box").click(startDrag);
+
+  $("#add_marker").click(startMarker);
+
+  $("#format_osm").click(formatChanged);
+  $("#format_mapnik").click(formatChanged);
+  $("#format_osmarender").click(formatChanged);
+  $("#format_html").click(formatChanged);
+
+  $("#mapnik_scale").change(mapnikSizeChanged);
+
+  openSidebar({ onclose: stopExport });
+
+  if (map.baseLayer.name == "Mapnik") {
+    $("#format_mapnik").prop("checked", true);
+  } else if (map.baseLayer.name == "Osmarender") {
+    $("#format_osmarender").prop("checked", true);
+  }
+
+  formatChanged();
+  setBounds(map.getExtent());
+
+  $("#viewanchor").removeClass("active");
+  $("#exportanchor").addClass("active");
+}
+
+function stopExport() {
+  $("#viewanchor").addClass("active");
+  $("#exportanchor").removeClass("active");
+
+  clearBox();
+  clearMarker();
+  map.events.unregister("moveend", map, mapMoved);
+  map.events.unregister("changebaselayer", map, htmlUrlChanged);
+  map.removeLayer(vectors);
+}
+
+function boundsChanged() {
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(),
+                                     $("#maxlon").val(), $("#maxlat").val());
+
+  bounds.transform(epsg4326, map.getProjectionObject());
+
+  map.events.unregister("moveend", map, mapMoved);
+  map.zoomToExtent(bounds);
+
+  clearBox();
+  drawBox(bounds);
+
+  validateControls();
+  mapnikSizeChanged();
+}
+
+function startDrag() {
+  $("#drag_box").html("<%=j t 'export.start_rjs.drag_a_box' %>");
+
+  clearBox();
+  box.activate();
+};
+
+function endDrag(bbox) {
+  var bounds = bbox.getBounds();
+
+  map.events.unregister("moveend", map, mapMoved);
+  setBounds(bounds);
+  drawBox(bounds);
+  box.deactivate();
+  validateControls();
+
+  $("#drag_box").html("<%=j t 'export.start_rjs.manually_select' %>");
+}
+
+function startMarker() {
+  $("#add_marker").html("<%=j t 'export.start_rjs.click_add_marker' %>");
+
+  if (!markerLayer) {
+    markerLayer = new OpenLayers.Layer.Vector("",{
+      displayInLayerSwitcher: false,
+      style: {
+        externalGraphic: OpenLayers.Util.getImagesLocation() + "marker.png",
+        graphicXOffset: -10.5,
+        graphicYOffset: -25,
+        graphicWidth: 21,
+        graphicHeight: 25
+      }
+    });
+    map.addLayer(markerLayer);
+
+    markerControl = new OpenLayers.Control.DrawFeature(markerLayer, OpenLayers.Handler.Point);
+    map.addControl(markerControl);
+
+    markerLayer.events.on({ "featureadded": endMarker });
+  }
+
+  markerLayer.destroyFeatures();
+  markerControl.activate();
+
+  return false;
+}
+
+function endMarker(event) {
+  markerControl.deactivate();
+
+  $("#add_marker").html("<%=j t 'export.start_rjs.change_marker' %>");
+  $("#marker_inputs").show();
+
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var epsg900913 = new OpenLayers.Projection("EPSG:900913");
+  var geom = event.feature.geometry.clone().transform(epsg900913, epsg4326);
+
+  $("#marker_lon").val(geom.x.toFixed(5));
+  $("#marker_lat").val(geom.y.toFixed(5));
+
+  htmlUrlChanged();
+}
+
+function clearMarker() {
+  $("#marker_lon").val("");
+  $("#marker_lat").val("");
+  $("#marker_inputs").hide();
+  $("#add_marker").html("<%=j t 'export.start_rjs.add_marker' %>");
+
+  if (markerLayer) {
+    markerControl.destroy();
+    markerLayer.destroy();
+    markerLayer = null;
+    markerControl = null;
+  }
+}
+
+function mapMoved() {
+  setBounds(map.getExtent());
+  validateControls();
+}
+
+function setBounds(bounds) {
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var decimals = Math.pow(10, Math.floor(map.getZoom() / 3));
+
+  bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326);
+
+  $("#minlon").val(Math.round(bounds.left * decimals) / decimals);
+  $("#minlat").val(Math.round(bounds.bottom * decimals) / decimals);
+  $("#maxlon").val(Math.round(bounds.right * decimals) / decimals);
+  $("#maxlat").val(Math.round(bounds.top * decimals) / decimals);
+
+  mapnikSizeChanged();
+  htmlUrlChanged();
+}
+
+function clearBox() {
+  vectors.destroyFeatures();
+}
+
+function drawBox(bounds) {
+  var feature = new OpenLayers.Feature.Vector(bounds.toGeometry());
+
+  vectors.addFeatures(feature);
+}
+
+function validateControls() {
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(), $("#maxlon").val(), $("#maxlat").val());
+
+  if (bounds.getWidth() * bounds.getHeight() > <%= MAX_REQUEST_AREA %>) {
+    $("#export_osm_too_large").show();
+  } else {
+    $("#export_osm_too_large").hide();
+  }
+
+  var max_scale = maxMapnikScale();
+
+  if ($("#format_osm").prop("checked") && bounds.getWidth() * bounds.getHeight() > <%= MAX_REQUEST_AREA %>) {
+    $("#export_commit").prop("disabled", true);
+  } else if ($("#format_mapnik").prop("checked") && $("#mapnik_scale").val() < max_scale) {
+    $("#export_commit").prop("disabled", true);
+  } else {
+    $("#export_commit").prop("disabled", false);
+  }
+
+  $("#mapnik_max_scale").html(roundScale(max_scale));
+
+  var max_zoom = maxOsmarenderZoom();
+
+  $("#osmarender_zoom option").each(function () {
+    if ($(this).val() > max_zoom) {
+      $(this).prop("disabled", true);
+    } else {
+      $(this).prop("disabled", false);
+    }
+  });
+
+  if ($("#osmarender_zoom option").is(":disabled:selected")) {
+    $("#osmarender_zoom option").filter(":enabled").last().prop("selected", true);
+  }
+}
+
+function htmlUrlChanged() {
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(), $("#maxlon").val(), $("#maxlat").val());
+  var layerName = map.baseLayer.keyid;
+  var url = "http://<%= SERVER_URL %>/export/embed.html?bbox=" + bounds.toBBOX() + "&amp;layer=" + layerName;
+  var markerUrl = "";
+
+  if ($("#marker_lat").val() && $("#marker_lon").val()) {
+    markerUrl = "&amp;mlat=" + $("#marker_lat").val() + "&amp;mlon=" + $("#marker_lon").val();
+    url += "&amp;marker=" + $("#marker_lat").val() + "," + $("#marker_lon").val();
+  }
+
+  var html = '<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="'+url+'" style="border: 1px solid black"></iframe>';
+
+  // Create "larger map" link
+  var center = bounds.getCenterLonLat();
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var epsg900913 = new OpenLayers.Projection("EPSG:900913");
+
+  bounds.transform(epsg4326, epsg900913);
+  var zoom = map.getZoomForExtent(bounds);
+
+  var layers = getMapLayers();
+
+  html += '<br /><small><a href="http://<%= SERVER_URL %>/?lat='+center.lat+'&amp;lon='+center.lon+'&amp;zoom='+zoom+'&amp;layers='+layers+markerUrl+'">'+"<%= html_escape_unicode(I18n.t('export.start_rjs.view_larger_map')) %>"+'</a></small>';
+
+  $("#export_html_text").val(html);
+
+  if ($("#format_html").prop("checked")) {
+    $("#export_html_text").prop("selected", true);
+  }
+}
+
+function formatChanged() {
+  $("#export_commit").show();
+
+  if ($("#format_osm").prop("checked")) {
+    $("#export_osm").show();
+  } else {
+    $("#export_osm").hide();
+  }
+
+  if ($("#format_mapnik").prop("checked")) {
+    $("#mapnik_scale").val(roundScale(map.getScale()));
+    $("#export_mapnik").show();
+  } else {
+    $("#export_mapnik").hide();
+  }
+
+  if ($("#format_osmarender").prop("checked")) {
+    var zoom = Math.min(map.getZoom(), maxOsmarenderZoom());
+
+    $("#osmarender_zoom option[value=" + zoom + "]").prop("selected", true);
+    $("#export_osmarender").show();
+  } else {
+    $("#export_osmarender").hide();
+  }
+
+  if ($("#format_html").prop("checked")) {
+    $("#export_html").show();
+    $("#export_commit").hide();
+    $("#export_html_text").prop("selected", true);
+  } else {
+    $("#export_html").hide();
+
+    clearMarker();
+  }
+
+  validateControls();
+}
+
+function maxMapnikScale() {
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(), $("#maxlon").val(), $("#maxlat").val());
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var epsg900913 = new OpenLayers.Projection("EPSG:900913");
+
+  bounds.transform(epsg4326, epsg900913);
+
+  return Math.floor(Math.sqrt(bounds.getWidth() * bounds.getHeight() / 0.3136));
+}
+
+function mapnikImageSize(scale) {
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(), $("#maxlon").val(), $("#maxlat").val());
+  var epsg4326 = new OpenLayers.Projection("EPSG:4326");
+  var epsg900913 = new OpenLayers.Projection("EPSG:900913");
+
+  bounds.transform(epsg4326, epsg900913);
+
+  return new OpenLayers.Size(Math.round(bounds.getWidth() / scale / 0.00028),
+                             Math.round(bounds.getHeight() / scale / 0.00028));
+}
+
+function maxOsmarenderZoom() {
+  var bounds = new OpenLayers.Bounds($("#minlon").val(), $("#minlat").val(), $("#maxlon").val(), $("#maxlat").val());
+  var xzoom = Math.LOG2E * Math.log(2000 * 1.40625 / bounds.getWidth());
+  var ymin = bounds.bottom * Math.PI / 180;
+  var ymax = bounds.top * Math.PI / 180;
+  var yzoom = Math.LOG2E * (Math.log(2000 * 2 * Math.PI) - Math.log(Math.log((Math.tan(ymax) + 1 / Math.cos(ymax)) / (Math.tan(ymin) + 1 / Math.cos(ymin)))))
+
+  return Math.min(Math.floor(Math.min(xzoom, yzoom)), 17);
+}
+
+function roundScale(scale) {
+  var precision = 5 * Math.pow(10, Math.floor(Math.LOG10E * Math.log(scale)) - 2);
+
+  return precision * Math.ceil(scale / precision);
+}
+
+function mapnikSizeChanged() {
+  var size = mapnikImageSize($("#mapnik_scale").val());
+
+  $("#mapnik_image_width").html(size.w);
+  $("#mapnik_image_height").html(size.h);
+
+  validateControls();
+}
+
+startExport();
diff --git a/app/views/export/start.rjs b/app/views/export/start.rjs
deleted file mode 100644 (file)
index dbbf584..0000000
+++ /dev/null
@@ -1,351 +0,0 @@
-page.replace_html :sidebar_title, t('export.start_rjs.export')
-page.replace_html :sidebar_content, :partial => 'start'
-page << <<EOJ
-  var vectors;
-  var box;
-  var markerLayer;
-  var markerControl;
-
-  function startExport() {
-    vectors = new OpenLayers.Layer.Vector("Vector Layer", {
-      displayInLayerSwitcher: false
-    });
-    map.addLayer(vectors);
-
-    box = new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.RegularPolygon, { 
-      handlerOptions: {
-        sides: 4,
-        snapAngle: 90,
-        irregular: true,
-        persist: true
-      }
-    });
-    box.handler.callbacks.done = endDrag;
-    map.addControl(box);
-
-    map.events.register("moveend", map, mapMoved);
-    map.events.register("changebaselayer", map, htmlUrlChanged);
-
-    openSidebar({ onclose: stopExport });
-
-    if (map.baseLayer.name == "Mapnik") {
-      $("format_mapnik").checked = true;
-    } else if (map.baseLayer.name == "Osmarender") {
-      $("format_osmarender").checked = true;
-    }
-
-    formatChanged();
-    setBounds(map.getExtent());
-
-    $("viewanchor").className = "";
-    $("exportanchor").className = "active";
-  }
-
-  function stopExport() {
-    $("viewanchor").className = "active";
-    $("exportanchor").className = "";
-
-    clearBox();
-    clearMarker();
-    map.events.unregister("moveend", map, mapMoved);
-    map.events.unregister("changebaselayer", map, htmlUrlChanged);
-    map.removeLayer(vectors);
-  }
-
-  function boundsChanged() {
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var bounds = new OpenLayers.Bounds($("minlon").value,
-                                       $("minlat").value,
-                                       $("maxlon").value,
-                                       $("maxlat").value);
-    bounds.transform(epsg4326, map.getProjectionObject());
-
-    map.events.unregister("moveend", map, mapMoved);
-    map.zoomToExtent(bounds);
-
-    clearBox();
-    drawBox(bounds);
-
-    validateControls();
-    mapnikSizeChanged();
-  }
-
-  $("maxlat").onchange = boundsChanged;
-  $("minlon").onchange = boundsChanged;
-  $("maxlon").onchange = boundsChanged;
-  $("minlat").onchange = boundsChanged;
-
-  function startDrag() {
-    $("drag_box").innerHTML="#{I18n.t('export.start_rjs.drag_a_box')}";
-
-    clearBox();
-    box.activate();
-  };
-
-  $("drag_box").onclick = startDrag;
-
-  function endDrag(bbox) {
-    var bounds = bbox.getBounds();
-
-    map.events.unregister("moveend", map, mapMoved);
-    setBounds(bounds);
-    drawBox(bounds);
-    box.deactivate();
-    validateControls();
-
-    $("drag_box").innerHTML = "#{I18n.t('export.start_rjs.manually_select')}";
-  }
-
-  function startMarker() {
-    $("add_marker").innerHTML='#{I18n.t('export.start_rjs.click_add_marker')}';
-
-    if (!markerLayer) {
-      markerLayer = new OpenLayers.Layer.Vector("",{
-        displayInLayerSwitcher: false,
-        style: { 
-          externalGraphic: OpenLayers.Util.getImagesLocation() + "marker.png",
-          graphicXOffset: -10.5,
-          graphicYOffset: -25, 
-          graphicWidth: 21,
-          graphicHeight: 25
-        } 
-      });
-      map.addLayer(markerLayer);
-
-      markerControl = new OpenLayers.Control.DrawFeature(markerLayer, OpenLayers.Handler.Point);
-      map.addControl(markerControl);
-
-      markerLayer.events.on({ "featureadded": endMarker });
-    }
-
-    markerLayer.destroyFeatures();
-    markerControl.activate();
-
-    return false;
-  }
-
-  $("add_marker").onclick = startMarker;
-
-  function endMarker(event) {
-    markerControl.deactivate();
-
-    $("add_marker").innerHTML = "#{I18n.t('export.start_rjs.change_marker')}";
-    $("marker_inputs").style.display = "block";
-    
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var epsg900913 = new OpenLayers.Projection("EPSG:900913");
-    var geom = event.feature.geometry.clone().transform(epsg900913, epsg4326);
-
-    $("marker_lon").value = geom.x.toFixed(5);
-    $("marker_lat").value = geom.y.toFixed(5);
-
-    htmlUrlChanged(); 
-  }
-
-  function clearMarker() {
-    $("marker_lon").value = "";
-    $("marker_lat").value = "";
-    $("marker_inputs").style.display = "none";
-    $("add_marker").innerHTML = "#{I18n.t('export.start_rjs.add_marker')}";
-
-    if (markerLayer) { 
-      markerControl.destroy();
-      markerLayer.destroy();
-      markerLayer = null;
-      markerControl = null;
-    }
-  }  
-
-  function mapMoved() {
-    setBounds(map.getExtent());
-    validateControls();
-  }
-
-  function setBounds(bounds) {
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var decimals = Math.pow(10, Math.floor(map.getZoom() / 3));
-
-    bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326);
-
-    $("minlon").value = Math.round(bounds.left * decimals) / decimals;
-    $("minlat").value = Math.round(bounds.bottom * decimals) / decimals;
-    $("maxlon").value = Math.round(bounds.right * decimals) / decimals;
-    $("maxlat").value = Math.round(bounds.top * decimals) / decimals;
-
-    mapnikSizeChanged();
-    htmlUrlChanged();
-  }
-
-  function clearBox() {
-    vectors.destroyFeatures();
-  }
-
-  function drawBox(bounds) {
-    var feature = new OpenLayers.Feature.Vector(bounds.toGeometry());
-
-    vectors.addFeatures(feature);
-  }
-
-  function validateControls() {
-    var bounds = new OpenLayers.Bounds($("minlon").value, $("minlat").value, $("maxlon").value, $("maxlat").value);
-
-    if (bounds.getWidth() * bounds.getHeight() > #{MAX_REQUEST_AREA}) {
-      $("export_osm_too_large").style.display = "block";
-    } else {
-      $("export_osm_too_large").style.display = "none";
-    }
-
-    var max_scale = maxMapnikScale();
-
-    if ($("format_osm").checked && bounds.getWidth() * bounds.getHeight() > #{MAX_REQUEST_AREA}) {
-      $("export_commit").disabled = true;
-    } else if ($("format_mapnik").checked && $("mapnik_scale").value < max_scale) {
-      $("export_commit").disabled = true;
-    } else {
-      $("export_commit").disabled = false;
-    }
-
-    $("mapnik_max_scale").innerHTML = roundScale(max_scale);
-  
-    var max_zoom = maxOsmarenderZoom();
-
-    for (var o = 0; o < $("osmarender_zoom").options.length; o++) {
-      var option = $("osmarender_zoom").options[o];
-
-      if (option.value > max_zoom) {
-        option.disabled = true;
-      } else {
-        option.disabled = false;
-      }
-    }
-
-    if ($("osmarender_zoom").options.selectedIndex + 4 > max_zoom) {
-      $("osmarender_zoom").options.selectedIndex = max_zoom - 4;
-    }
-  }
-
-  function htmlUrlChanged() {
-    var bounds = new OpenLayers.Bounds($("minlon").value, $("minlat").value, $("maxlon").value, $("maxlat").value);
-    var layerName = map.baseLayer.keyid;
-    var url = "http://#{SERVER_URL}/export/embed.html?bbox=" + bounds.toBBOX() + "&amp;layer=" + layerName;
-    var markerUrl = "";
-
-    if ($("marker_lat").value && $("marker_lon").value) {
-      markerUrl = "&amp;mlat=" + $("marker_lat").value + "&amp;mlon=" + $("marker_lon").value;
-      url += "&amp;marker=" + $("marker_lat").value + "," + $("marker_lon").value;
-    } 
-    
-    var html = '<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="'+url+'" style="border: 1px solid black"></iframe>';
-   
-    // Create "larger map" link
-    var center = bounds.getCenterLonLat();
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var epsg900913 = new OpenLayers.Projection("EPSG:900913");
-
-    bounds.transform(epsg4326, epsg900913);
-    var zoom = map.getZoomForExtent(bounds);
-    
-    var layers = getMapLayers();
-
-    html += '<br /><small><a href="http://#{SERVER_URL}/?lat='+center.lat+'&amp;lon='+center.lon+'&amp;zoom='+zoom+'&amp;layers='+layers+markerUrl+'">'+"#{html_escape_unicode(I18n.t('export.start_rjs.view_larger_map'))}"+'</a></small>';
-
-    $("export_html_text").value = html;
-
-    if ($("format_html").checked) {
-      $("export_html_text").select();
-    }
-  }
-
-  function formatChanged() {
-    $("export_commit").style.display = "inline";
-
-    if ($("format_osm").checked) {
-      $("export_osm").style.display = "inline";
-    } else {
-      $("export_osm").style.display = "none";
-    }
-
-    if ($("format_mapnik").checked) {
-      $("mapnik_scale").value = roundScale(map.getScale());
-      $("export_mapnik").style.display = "inline";
-    } else {
-      $("export_mapnik").style.display = "none";
-    }
-
-    if ($("format_osmarender").checked) {
-      var zoom = Math.min(map.getZoom(), maxOsmarenderZoom());
-
-      $("osmarender_zoom").options.selectedIndex = zoom - 4;
-      $("export_osmarender").style.display = "inline";
-    } else {
-      $("export_osmarender").style.display = "none";
-    }
-
-    if ($("format_html").checked) { 
-      $("export_html").style.display = "inline";
-      $("export_commit").style.display = "none";
-      $("export_html_text").select();
-    } else {
-      $("export_html").style.display = "none";
-      clearMarker();
-    }
-        
-    validateControls();
-  }
-
-  $("format_osm").onclick = formatChanged;
-  $("format_mapnik").onclick = formatChanged;
-  $("format_osmarender").onclick = formatChanged;
-  $("format_html").onclick = formatChanged;
-
-  function maxMapnikScale() {
-    var bounds = new OpenLayers.Bounds($("minlon").value, $("minlat").value, $("maxlon").value, $("maxlat").value);
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var epsg900913 = new OpenLayers.Projection("EPSG:900913");
-
-    bounds.transform(epsg4326, epsg900913);
-
-    return Math.floor(Math.sqrt(bounds.getWidth() * bounds.getHeight() / 0.3136));
-  }
-
-  function mapnikImageSize(scale) {
-    var bounds = new OpenLayers.Bounds($("minlon").value, $("minlat").value, $("maxlon").value, $("maxlat").value);
-    var epsg4326 = new OpenLayers.Projection("EPSG:4326");
-    var epsg900913 = new OpenLayers.Projection("EPSG:900913");
-
-    bounds.transform(epsg4326, epsg900913);
-
-    return new OpenLayers.Size(Math.round(bounds.getWidth() / scale / 0.00028),
-                               Math.round(bounds.getHeight() / scale / 0.00028));
-  }
-
-  function maxOsmarenderZoom() {
-    var bounds = new OpenLayers.Bounds($("minlon").value, $("minlat").value, $("maxlon").value, $("maxlat").value);
-    var xzoom = Math.LOG2E * Math.log(2000 * 1.40625 / bounds.getWidth());
-    var ymin = bounds.bottom * Math.PI / 180;
-    var ymax = bounds.top * Math.PI / 180;
-    var yzoom = Math.LOG2E * (Math.log(2000 * 2 * Math.PI) - Math.log(Math.log((Math.tan(ymax) + 1 / Math.cos(ymax)) / (Math.tan(ymin) + 1 / Math.cos(ymin)))))
-
-    return Math.min(Math.floor(Math.min(xzoom, yzoom)), 17);
-  }
-
-  function roundScale(scale) {
-    var precision = 5 * Math.pow(10, Math.floor(Math.LOG10E * Math.log(scale)) - 2);
-
-    return precision * Math.ceil(scale / precision);
-  }
-
-  function mapnikSizeChanged() {
-    var size = mapnikImageSize($("mapnik_scale").value);
-
-    $("mapnik_image_width").innerHTML = size.w;
-    $("mapnik_image_height").innerHTML = size.h;
-
-    validateControls();
-  }
-
-  $("mapnik_scale").onchange = mapnikSizeChanged;
-
-  startExport();
-EOJ
diff --git a/app/views/geocoder/_search.html.erb b/app/views/geocoder/_search.html.erb
deleted file mode 100644 (file)
index 8a58c03..0000000
+++ /dev/null
@@ -1,9 +0,0 @@
-<% @sources.each do |source| %>
-  <p class="search_results_heading"><%= raw(t "geocoder.search.title.#{source}") %></p>
-  <div class='search_results_entry' id='<%= "search_#{source}" %>'>
-    <%= image_tag "searching.gif", :class => "search_searching" %>
-  </div>
-  <script type="text/javascript">
-    <%= remote_function(:update => "search_#{source}", :url => raw(url_for(:action => "search_#{source}", :query => @query, :minlat => params[:minlat], :minlon => params[:minlon], :maxlat => params[:maxlat], :maxlon => params[:maxlon]))) %>
-  </script>
-<% end %>
similarity index 69%
rename from app/views/geocoder/_description.html.erb
rename to app/views/geocoder/description.html.erb
index 88b3bcc5f133598f187ec881cc7498710d76712f..a01954d72b34884e4f3e5b4e722783f4884a2af9 100644 (file)
@@ -8,6 +8,6 @@
     <%= image_tag "searching.gif", :class => "search_searching" %>
   </div>
   <script type="text/javascript">
-    <%= remote_function :update => "description_#{source[:name]}_#{source[:types]}", :url => { :action => "description_#{source[:name]}", :lat => params[:lat], :lon => params[:lon], :zoom => params[:zoom], :types => source[:types], :max => source[:max] } %>
+    $("#description_<%= source[:name] %>_<%= source[:types] %>").load("<%= raw url_for :action => "description_#{source[:name]}", :lat => params[:lat], :lon => params[:lon], :zoom => params[:zoom], :types => source[:types], :max => source[:max] %>");
   </script>
 <% end %>
index b4bbdc267f40e4bd2f3983ef07f4b2b0f3b18822..61d28697d715f6caf99568ae9c3afcd0e2a9267f 100644 (file)
@@ -6,12 +6,20 @@
   <% end %>
   <% if @more_params %>
     <div id="search_more_<%= @more_params.hash %>">
-      <p class="search_results_entry"><%=
-        link_to_function(t('geocoder.results.more_results')) do |page|
-          page.replace_html "search_more_#{@more_params.hash}", image_tag("searching.gif", :class => "search_searching")
-          page << remote_function(:update => "search_more_#{@more_params.hash}", :url => raw(url_for(@more_params)))
-        end
-      %></p>
+      <p class="search_results_entry">
+        <%= link_to t('geocoder.results.more_results'), "#" %>
+      </p>
+      <%= image_tag "searching.gif", :class => "search_searching" %>
     </div>
+    <script type="text/javascript">
+    $("#search_more_<%= @more_params.hash %> .search_searching").hide();
+
+    $("#search_more_<%= @more_params.hash %> a").click(function () {
+      $("#search_more_<%= @more_params.hash %> .search_results_entry").hide();
+      $("#search_more_<%= @more_params.hash %> .search_searching").show();
+
+      $("#search_more_<%= @more_params.hash %>").load("<%= raw url_for(@more_params) %>");
+    });
+    </script>
   <% end %>
 <% end %>
diff --git a/app/views/geocoder/search.html.erb b/app/views/geocoder/search.html.erb
new file mode 100644 (file)
index 0000000..7bc8fcd
--- /dev/null
@@ -0,0 +1,9 @@
+<% @sources.each do |source| %>
+  <p class="search_results_heading"><%= raw(t "geocoder.search.title.#{source}") %></p>
+  <div class="search_results_entry" id="<%= "search_#{source}" %>">
+    <%= image_tag "searching.gif", :class => "search_searching" %>
+  </div>
+  <script type="text/javascript">
+    $("#search_<%= source %>").load("<%= raw url_for :action => "search_#{source}", :query => @query, :minlat => params[:minlat], :minlon => params[:minlon], :maxlat => params[:maxlat], :maxlon => params[:maxlon] %>");
+  </script>
+<% end %>
index 9927782ca66f49c825aaaa2a8f13a5023e066332..9e602b193628afb9753357654bf1c64c073fc847 100644 (file)
     </div>
 
     <script type="text/javascript">
-    document.observe("dom:loaded", function () {
-      var auth_token = $$("meta[name=csrf-token]")[0].content;
+    $(document).ready(function () {
+      var auth_token = $("meta[name=csrf-token]").attr("content");
 
-      $$("form input[name=authenticity_token]").each(function (input) {
-        input.value = auth_token;
-      });
+      $("form input[name=authenticity_token]").val(auth_token);
     });
     </script>
 
index f2021d2d5eb9ff220007d426507f4aa90ac7dd52..70fd4403505c75a2b474b458adb0d88e13015873 100644 (file)
@@ -5,9 +5,9 @@
   <td class="inbox-subject" bgcolor="<%= this_colour %>"><%= link_to h(message_summary.title), :controller => 'message', :action => 'read', :message_id => message_summary.id  %></td>
   <td class="inbox-sent nowrap" bgcolor="<%= this_colour %>"><%= l message_summary.sent_on, :format => :friendly %></td>
   <% if message_summary.message_read? %>
-    <td><%= button_to t('message.message_summary.unread_button'), {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'unread'}, { :onclick => remote_function(:url => {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'unread'}) + "; return false;" } %></td>
+    <td><%= button_to t('message.message_summary.unread_button'), {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'unread'}, { :remote => true } %></td>
   <% else %>
-    <td><%= button_to t('message.message_summary.read_button'), {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'read'}, { :onclick => remote_function(:url => {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'read'}) + "; return false;" } %></td>
+    <td><%= button_to t('message.message_summary.read_button'), {:controller => 'message', :action => 'mark', :message_id => message_summary.id, :mark => 'read'}, { :remote => true } %></td>
   <% end %>
   <td><%= button_to t('message.message_summary.reply_button'), :controller => 'message', :action => 'reply', :message_id => message_summary.id %></td>
   <td><%= button_to t('message.message_summary.delete_button'), :controller => 'message', :action => 'delete', :message_id => message_summary.id, :referer => request.fullpath %></td>
diff --git a/app/views/message/mark.js.erb b/app/views/message/mark.js.erb
new file mode 100644 (file)
index 0000000..2e545b6
--- /dev/null
@@ -0,0 +1,3 @@
+$("#inboxanchor").replaceWith("<%=j render :partial => "layouts/inbox" %>");
+$("#inbox-count").replaceWith("<%=j render :partial => "message_count" %>");
+$("#inbox-<%= @message.id %>").replaceWith("<%=j render :partial => "message_summary", :object => @message %>");
index 6fc70ef46f1b1d71092fffe40b2af5761eebc8af..54bbca6a7727d667fd39f8cdcd3b20df00e665a7 100644 (file)
   }
 
   function updateMapKey() {
-    var layer = map.baseLayer.keyid;
-    var zoom = map.getZoom();
-
-    <%= remote_function :update => "sidebar_content",
-                        :url => { :action => "key" },
-                        :with => "'layer=' + layer + '&zoom=' + zoom",
-                        :method => :get
-    %>
+    $("#sidebar_content").load("<%= url_for :action => :key %>", {
+      layer: map.baseLayer.keyid,
+      zoom: map.getZoom()
+    });
   }
 </script>
 
index c4df0021f5d099ef3bad8e2d7bc20b7372488a1a..9dcceeb9b014ee4e2fad7784748b2015522b16b8 100644 (file)
@@ -7,7 +7,6 @@
 <% session[:token] = @user.tokens.create.token unless session[:token] and UserToken.find_by_token(session[:token]) %>
 
 <script type="text/javascript" defer="defer">
-  var brokenContentSize = $("content").offsetWidth == 0;
   var changesaved=true;
   var winie=false; if (document.all && window.print) { winie=true; }
   
index da68e0ba6d94c1a18b6c751fa36266bba3d319ab..e7a2564f916eb97118ffba9433147f9f752b2b7a 100644 (file)
@@ -13,7 +13,6 @@
 <% locale = request.compatible_language_from(Potlatch2::LOCALES.keys) || "en" %>
 
 <script type="text/javascript" defer="defer">
-  var brokenContentSize = $("content").offsetWidth == 0;
   var changesaved=true;
   
   window.onbeforeunload=function() {
@@ -64,7 +63,9 @@
   doSWF(<%= @lat || 'null' %>,<%= @lon || 'null' %>,<%= @zoom %>);
 
   function setPosition(lat, lon, zoom) {
-    $("potlatch").setPosition(lat, lon, Math.max(zoom || 15, 13));
+    $("#potlatch").each(function () {
+      this.setPosition(lat, lon, Math.max(zoom || 15, 13));
+    });
   }
 
   function mapMoved(lon, lat, zoom, minlon, minlat, maxlon, maxlat) {
index a4975e14fc7fea867ea7bcf700519d53aab4f03a..aa64e1d2b2344606e53a60a068dd2c03b621a7af 100644 (file)
@@ -1,34 +1,34 @@
 <script type="text/javascript">
-  var brokenContentSize = $("content").offsetWidth == 0;
+  var brokenContentSize = $("#content").prop("offsetWidth") == 0;
 
   function resizeContent() {
-    var content = $("content");
-    var leftMargin = parseInt(getStyle(content, "left"));
-    var rightMargin = parseInt(getStyle(content, "right"));
-    var bottomMargin = parseInt(getStyle(content, "bottom"));
+    var content = $("#content");
+    var leftMargin = parseInt(content.css("left"));
+    var rightMargin = parseInt(content.css("right"));
+    var bottomMargin = parseInt(content.css("bottom"));
 
     <% if t('html.dir') == "ltr" -%>
-    content.style.width = document.documentElement.clientWidth - content.offsetLeft - rightMargin;
+    content.width($(window).width() - content.prop("offsetLeft") - rightMargin);
     <% else -%>
-    content.style.width = document.documentElement.clientWidth - content.offsetRight - leftMargin;
+    content.width($(window).width() - content.prop("offsetRight") - leftMargin);
     <% end -%>
-    content.style.height = document.documentElement.clientHeight - content.offsetTop - bottomMargin;
+    content.height($(window).height() - content.prop("offsetTop") - bottomMargin);
   }
 
   function resizeMap() {
-    var sidebar_width = $("sidebar").offsetWidth;
+    var sidebar_width = 0 + $("#sidebar:visible").width();
 
     if (sidebar_width > 0) {
       sidebar_width = sidebar_width + 5
     }
 
     <% if t('html.dir') == "ltr" -%>
-    $("map").style.left = (sidebar_width) + "px";
+    $("#map").css("left", (sidebar_width) + "px");
     <% else -%>
-    $("map").style.right = (sidebar_width) + "px";
+    $("#map").css("right", (sidebar_width) + "px");
     <% end -%>
-    $("map").style.width = ($("content").offsetWidth - sidebar_width) + "px";
-    $("map").style.height = ($("content").offsetHeight - 2) + "px";
+    $("#map").width($("#content").width() - sidebar_width);
+    $("#map").height($("#content").height() - 2);
   }
 
   function handleResize() {
index dcb7301d9cc9a19760e2994674cf531dfe085789..3391a102bb6f8a8231bae7e0d24bdb989c8c03ad 100644 (file)
@@ -1,70 +1,43 @@
 <script type="text/javascript">
 <!--
   function describeLocation() {
-    var args = getArgs($("viewanchor").href);
-
-    <%= remote_function(:loading => "startSearch()",
-                        :url => { :controller => :geocoder, :action => :description },
-                        :with => "'lat=' + args['lat'] + '&lon=' + args['lon'] + '&zoom=' + args['zoom']") %>
+    var args = getArgs($("#viewanchor").attr("href"));
+
+    $("#sidebar_title").html("<%= t 'site.sidebar.search_results' %>");
+    $("#sidebar_content").load("<%= url_for :controller => :geocoder, :action => :description %>", {
+      lat: args["lat"],
+      lon: args["lon"],
+      zoom: args["zoom"]
+    }, openSidebar);
   }
 
-  function setSearchViewbox() {
-    <% if params[:action] == 'index' %>
-    var extent = getMapExtent();
-
-    var minlon = document.createElement("input");
-    minlon.type = "hidden";
-    minlon.id = "minlon";
-    minlon.name = "minlon";
-    minlon.value = extent.left;
-    $("search_form").appendChild(minlon);
+  function doSearch(query) {
+    $("#sidebar_title").html("<%= t 'site.sidebar.search_results' %>");
 
-    var minlat = document.createElement("input");
-    minlat.type = "hidden";
-    minlat.id = "minlat";
-    minlat.name = "minlat";
-    minlat.value = extent.bottom;
-    $("search_form").appendChild(minlat);
-
-    var maxlon = document.createElement("input");
-    maxlon.type = "hidden";
-    maxlon.id = "maxlon";
-    maxlon.name = "maxlon";
-    maxlon.value = extent.left;
-    $("search_form").appendChild(maxlon);
-
-    var maxlat = document.createElement("input");
-    maxlat.type = "hidden";
-    maxlat.id = "maxlat";
-    maxlat.name = "maxlat";
-    maxlat.value = extent.bottom;
-    $("search_form").appendChild(maxlat);
-    <% end %>
-  }
+    <% if params[:action] == 'index' -%>
+    var extent = getMapExtent();
 
-  function startSearch() {
-    updateSidebar("<%= t 'site.sidebar.search_results' %>", "");
+    $("#sidebar_content").load("<%= url_for :controller => :geocoder, :action => :search %>", {
+      query: $("#query").val(),
+      minlon: extent.left,
+      minlat: extent.bottom,
+      maxlon: extent.right,
+      maxlat: extent.top
+    }, openSidebar);
+    <% else -%>
+    $("#sidebar_content").load("<%= url_for :controller => :geocoder, :action => :search %>", {
+      query: $("#query").val()
+    }, openSidebar);
+    <% end -%>
   }
 
-  function endSearch() {
-    <% if params[:action] == 'index' %>
-    $("minlon").remove();
-    $("minlat").remove();
-    $("maxlon").remove();
-    $("maxlat").remove();
-    <% end %>
-  }
+  $(document).ready(function () {
+    $("#search_form").submit(function (event) {
+      doSearch($("#query").val());
 
-  document.observe("dom:loaded", function () {
-    $("search_form").observe("ajax:before", setSearchViewbox);
-    $("search_form").observe("ajax:loading", startSearch);
-    $("search_form").observe("ajax:complete", endSearch);
+      return false;
+    });
   });
-
-  <% if params[:query] %>
-  <%= remote_function(:loading => "startSearch()",
-                      :url => { :controller => :geocoder, :action => :search, :query => h(params[:query]) }) %>
-  <% end %>
 // -->
 </script>
 
@@ -74,8 +47,7 @@
     <h1><%= t 'site.search.search' %></h1>
     <div class="search_container">
     <div id="search_field">
-    <%= form_tag({ :controller => :geocoder, :action => :search },
-                 { :id => "search_form", :remote => true, :method => "get", :action => url_for(:action => "index") }) do %>
+    <%= form_tag "#", :id => "search_form" do %>
       <%= text_field_tag :query, h(params[:query]), :tabindex => "1" %>
       <%= submit_tag t('site.search.submit_text') %>
     <% end %>
index f7e7229c89432bcb9b0835965534b5c090b58e98..3b1b547b62f1d97d6bd27b96fbfaaae4a3b38b66 100644 (file)
        onclose = null;
     }
 
-    if (options.title) { $("sidebar_title").innerHTML = options.title; }
+    if (options.title) { $("#sidebar_title").html(options.title); }
 
-    if (options.width) { $("sidebar").style.width = options.width; }
-    else { $("sidebar").style.width = "30%"; }
+    if (options.width) { $("#sidebar").width(options.width); }
+    else { $("#sidebar").width("30%"); }
 
-    $("sidebar").style.display = "block";
+    $("#sidebar").css("display", "block");
 
     <%= onopen %>
 
@@ -34,7 +34,7 @@
   }
 
   function closeSidebar() {
-    $("sidebar").style.display = "none";
+    $("#sidebar").css("display", "none");
 
     <%= onclose %>
 
@@ -45,8 +45,8 @@
   }
 
   function updateSidebar(title, content) {
-    $("sidebar_title").innerHTML = title;
-    $("sidebar_content").innerHTML = content;
+    $("#sidebar_title").html(title);
+    $("#sidebar_content").html(content);
   }
 // -->
 </script>
index 207cbdef4a26eca401f06b1b09bce60350d3f920..84de929541dfc2235571a3d4617677f136f012ba 100644 (file)
 
 <script type="text/javascript">
   function maximiseMap() {
-    $("left").style.display = "none";
-    $("greeting").style.display = "none";
-    $("tabnav").style.display = "none";
+    $("#left").hide();
+    $("#greeting").hide();
+    $("#tabnav").hide();
 
-    $("content").style.top = "10px";
+    $("#content").css("top", "10px");
     <% if t('html.dir') == "ltr" -%>
-    $("content").style.left = "10px";
+    $("#content").css("left", "10px");
     <% else -%>
-    $("content").style.right = "10px";
+    $("#content").css("right", "10px");
     <% end -%>
 
     handleResize();
   }
   
   function minimiseMap() {
-    $("left").style.display = "";
-    $("greeting").style.display = "";
-    $("tabnav").style.display = "";
+    $("#left").show();
+    $("#greeting").show();
+    $("#tabnav").show();
 
-    $("content").style.top = "35px";
+    $("#content").css("top", "35px");
     <% if t('html.dir') == "ltr" -%>
-    $("content").style.left = "192px";
+    $("#content").css("left", "192px");
     <% else -%>
-    $("content").style.right = "192px";
+    $("#content").css("right", "192px");
     <% end -%>
 
     handleResize();
   }
 
-  document.observe("dom:loaded", handleResize);
-
-  Event.observe(window, "resize", handleResize);
+  $(document).ready(handleResize);
+  $(window).resize(handleResize);
 </script>
 <% end %>
index ee95bf7913aca7c938c95f4ad7b1811dfbdf866d..38242da0094e34048937a9c0a48edb36e66b186d 100644 (file)
@@ -147,7 +147,7 @@ end
         setMapExtent(bbox);
 
         <% if box %>
-          Event.observe(window, "load", function() { addBoxToMap(bbox) });
+          $(window).load(function() { addBoxToMap(bbox) });
         <% end %>
       <% else %>
         var centre = new OpenLayers.LonLat(<%= lon %>, <%= lat %>);
@@ -176,7 +176,7 @@ end
         url += "/full";
       <% end %>
 
-      Event.observe(window, "load", function() { addObjectToMap(url, <%= object_zoom %>) });
+      $(window).load(function() { addObjectToMap(url, <%= object_zoom %>) });
     <% end %>
 
     map.events.register("moveend", map, updateLocation);
@@ -188,7 +188,7 @@ end
 
   function toggleData() {
     if (map.dataLayer.visibility) {
-      <%= remote_function :url => { :controller => 'browse', :action => 'start' } %>
+      $.ajax({ url: "<%= url_for :controller => :browse, :action => :start %>" });
     } else if (map.dataLayer.active) {
       closeSidebar();
     }
@@ -243,21 +243,21 @@ end
     var extent = getMapExtent();
     var loaded = false;
 
-    $("linkloader").observe("load", function () { loaded = true; });
-    $("linkloader").src = "http://127.0.0.1:8111/load_and_zoom?left=" + extent.left + "&top=" + extent.top + "&right=" + extent.right + "&bottom=" + extent.bottom;
+    $("#linkloader").load(function () { loaded = true; });
+    $("#linkloader").attr("src", "http://127.0.0.1:8111/load_and_zoom?left=" + extent.left + "&top=" + extent.top + "&right=" + extent.right + "&bottom=" + extent.bottom);
 
     setTimeout(function () {
-      if (!loaded) alert("<%= escape_javascript(t('site.index.remote_failed')) %>");
+      if (!loaded) alert("<%=j t('site.index.remote_failed') %>");
     }, 1000);
 
-    event.stop();
+    return false;
   }
 
   function installEditHandler() {
-    $("remoteanchor").observe("click", remoteEditHandler);
+    $("#remoteanchor").click(remoteEditHandler);
 
     <% if preferred_editor == "remote" %>
-      $("editanchor").observe("click", remoteEditHandler);
+      $("#editanchor").click(remoteEditHandler);
 
       <% if params[:action] == "edit" %>
         remoteEditHandler();
@@ -265,11 +265,11 @@ end
     <% end %>
   }
 
-  document.observe("dom:loaded", mapInit);
-  document.observe("dom:loaded", installEditHandler);
-  document.observe("dom:loaded", handleResize);
+  $(document).ready(mapInit);
+  $(document).ready(installEditHandler);
+  $(document).ready(handleResize);
 
-  Event.observe(window, "resize", function() {
+  $(window).resize(function() {
     var centre = map.getCenter();
     var zoom = map.getZoom();
 
@@ -278,14 +278,18 @@ end
     map.setCenter(centre, zoom);
   });
 
-  document.observe("dom:loaded", function () {
-    $("exportanchor").observe("click", function (e) {
-      <%= remote_function :url => { :controller => 'export', :action => 'start' } %>;
+  $(document).ready(function () {
+    $("#exportanchor").click(function (e) {
+      $.ajax({ url: "<%= url_for :controller => :export, :action => :start %>" });
       Event.stop(e);
     });
 
-    <% if params[:action] == 'export' %>
-    <%= remote_function :url => { :controller => 'export', :action => 'start' } %>;
+    <% if params[:action] == 'export' -%>
+    $.ajax({ url: "<%= url_for :controller => :export, :action => :start %>" });
+    <% end -%>
+
+    <% if params[:query] -%>
+    doSearch("<%= params[:query] %>");
     <% end %>
   });
 // -->
index 551719f55afe8dc59aebfd759bd8064dcb7620e0..f48cd8867db2ed82c29eb51976ba725076fad0a9 100644 (file)
@@ -1,5 +1,5 @@
 <script>
-$("content").style.display = "none";
+$("#content").hide();
 </script>
 
 <h1><%= t 'user.confirm.heading' %></h1>
@@ -13,5 +13,5 @@ $("content").style.display = "none";
 <% end %>
 
 <script>
-$("confirm").submit();
+$("#confirm").submit();
 </script>
index 7acb85a98003dab2934419838f9dfea2cca6a5db..5efc6a2c533dca97d9a6c40e8784d28fd9e36eee 100644 (file)
@@ -1,5 +1,5 @@
 <script>
-$("content").style.display = "none";
+$("#content").hide();
 </script>
 
 <h1><%= t 'user.confirm_email.heading' %></h1>
@@ -12,5 +12,5 @@ $("content").style.display = "none";
 <% end %>
 
 <script>
-$("confirm").submit();
+$("#confirm").submit();
 </script>
index 9a4f50abc62b3822799bed00010dc6499191f275..dc330feaeecb36ab58724200a989f81f04913f46 100644 (file)
 
       <table id="login_openid_buttons">
         <tr>
-          <td>
-            <%=
-              link_to_function(image_tag("openid.png", :alt => t("user.login.openid_providers.openid.title")), nil, :title => t("user.login.openid_providers.openid.title")) do |page|
-                page[:login_form][:openid_url].value = "http://"
-                page[:login_openid_buttons].hide
-                page[:login_openid_url].show
-                page[:login_openid_submit].show
-              end
-            %>
-          </td>
+          <td><%= link_to_function(image_tag("openid.png", :alt => t("user.login.openid_providers.openid.title")), "showOpenidUrl()", :title => t("user.login.openid_providers.openid.title")) %></td>
           <td><%= openid_button "google", "gmail.com" %></td>
           <td><%= openid_button "yahoo", "me.yahoo.com" %></td>
           <td><%= openid_button "myopenid", "myopenid.com" %></td>
 
 </div>
 
-<%=
-  update_page_tag do |page|
-    page[:login_openid_url].hide
-    page[:login_openid_submit].hide
-  end
-%>
+<script type="text/javascript">
+function showOpenidUrl() {
+  $("#openid_url").val("http://");
+  $("#login_openid_buttons").hide();
+  $("#login_openid_url").show();
+  $("#login_openid_submit").show();
+}
+
+function submitOpenidUrl(url) {
+  $("#openid_url").val(url);
+  $("#login_form").submit();
+}
+
+$("#login_openid_url").hide();
+$("#login_openid_submit").hide();
+</script>
index 104a889591d287eb77023a09a9100c0ffc948222..2bf6f528114601e04efc89df4a9e475221c4856b 100644 (file)
 <script type="text/javascript">
 function enableOpenID()
 {
-  $("openid_prompt").hide();
+  $("#openid_prompt").hide();
 
-  $("openid_spacer").show();
-  $("openid_field").show();
-  $("openid_note").show();
+  $("#openid_spacer").show();
+  $("#openid_field").show();
+  $("#openid_note").show();
 
-  $("openid_url").disabled = false;
+  $("#openid_url").prop("disabled", false);
 }
 
 function disableOpenID()
 {
-  $("openid_prompt").show();
+  $("#openid_prompt").show();
 
-  $("openid_spacer").hide();
-  $("openid_field").hide();
-  $("openid_note").hide();
+  $("#openid_spacer").hide();
+  $("#openid_field").hide();
+  $("#openid_note").hide();
 
-  $("openid_url").disabled = true;
+  $("#openid_url").prop("disabled", true);
 }
 
 <% if params[:openid] or (@user and @user.openid_url and not @user.openid_url.empty?) -%>
index 24f0f5bb6ccbe4ea2ccdc1f3e4da881e0f6a81c7..849005274fc0e2ccdef8c0b867497c925b567fa5 100644 (file)
       <%= label_tag "legale_#{legale}", t('user.terms.legale_names.' + name) %>
       <script type="text/javascript">
       <!--
-        $("legale_<%= legale %>").observe("change", function () {
-          <%= remote_function(
-                :before => update_page do |page|
-                  page.replace_html 'contributorTerms', image_tag('searching.gif')
-                end,
-                :url => { :legale => legale }
-              )
-          %>
+        $("#legale_<%= legale %>").change(function () {
+          $("#contributorTerms").html("<%=j image_tag 'searching.gif' %>");
+          $("#contributorTerms").load("<%= url_for :legale => legale %>");
         });
       // -->
       </script>
index 525c879f1118923d36753a20ff43c5f19e99563d..f4da4c1a84b27cba9fcc95c7249299607b5318da 100644 (file)
@@ -5,7 +5,7 @@ class BrowseControllerTest < ActionController::TestCase
   api_fixtures
 
   def test_start
-    get :start
+    xhr :get, :start
     assert_response :success
   end
   
index a23963ee281b2dbb4ca8ab5c82b41dba72be17fb..0fa6398c16d0bd4aff69c220539740c284f59863 100644 (file)
@@ -3,7 +3,7 @@ require File.dirname(__FILE__) + '/../test_helper'
 class ExportControllerTest < ActionController::TestCase
   # Replace this with your real tests.
   def test_start
-    get :start
+    xhr :get, :start
     assert_response :success
     assert_template 'start'
   end