Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Updated README

  • Loading branch information...
commit 201e922cd2989a5a53cce29a657f89c5fe30bd0d 1 parent 3a54503
Cliff Ingham inghamn authored
Showing with 24 additions and 5 deletions.
  1. +24 −5 README → README.md
29 README → README.md
View
@@ -1,7 +1,7 @@
-An open311-proxy web application intended to keep api_keys secure from HTML clients.
+# Open311 Proxy
+A proxy web application intended to keep api_keys secure from HTML clients.
-Background
-----------------
+## Background
On our websites we have many web pages where we would like to embed
an Open311 form. This is instead of setting up a seperate "Open311 forms" web
application that we send the user to.
@@ -11,8 +11,7 @@ Challenges with this approach
* The website shouldn't need to know anything about Open311
* Users should not leave the website when they post
-Intended Solution
------------------
+## Intended Solution
The webpage will embed an iframe on the page with src pointing to the
open311-proxy's forms. (Similar to Wufoo) The open311-proxy can be at any domain.
The user, inside the iframe, is interacting directly with the client proxy.
@@ -24,3 +23,23 @@ additional client identification system for the api_key system. It means we
only need to write the web client code once for all the places we want
to put it. But we can still track each of the places we put it as a
separate api_key according to the Open311 Server.
+
+## Embedding
+There are two steps to embed the proxy forms into a webpage.
+
+* As an admin, register the webpage as a client
+* Include an iframe and some javascript in the webpage
+
+The open311-proxy embed website will use postMessage() to tell the parent site the new content size. The parent site should listen for the messages and resize the iframe accordingly
+
+ <script type="text/javascript">
+ function handleHeightResponse(e) {
+ document.getElementById('open311Client').height = parseInt(e.data + 60);
+ }
+ if (window.addEventListener) window.addEventListener('message', handleHeightResponse, false);
+ </script>
+ <iframe id="open311Client"
+ src="http://OPEN311_PROXY/embed?client=XXXX"
+ height=\"720\"
+ onload=\"this.contentWindow.postMessage('height','http://OPEN311_PROXY');\"></iframe>
+
Please sign in to comment.
Something went wrong with that request. Please try again.