Skip to content
This repository has been archived by the owner on Oct 11, 2024. It is now read-only.

Commit

Permalink
Merge pull request #50 from 52North/dev
Browse files Browse the repository at this point in the history
Update from dev branch for release 0.1
  • Loading branch information
Daniel Nüst committed Jun 16, 2014
2 parents 59a6331 + d084e19 commit af07d00
Show file tree
Hide file tree
Showing 13 changed files with 477 additions and 111 deletions.
52 changes: 49 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,49 @@
# wps-js

Standalone JavaScript WPS client.
Standalone Javascript OGC Web Processing Service (WPS) client with the following functions:

* Generation of an HTML form based on WPS process descriptions
* Encoding and parsing of WPS requests (GetCapabilities, DescribeProcess, Execute)

## Installation

wps-js is a plain Javascipt client and all required libraries are shipped with the code. To try out examples follow these steps:

* Start a proxy server so that it serves requests preprended with ``/wps_proxy/wps_proxy?url=``
* Check out the code: ``git clone https://github.com/52North/wps-js.git``
* Change to the directory and build the application with Maven: ``cd wps-js``, then ``mvn clean install``
* Open the file ``../target/wps-js-<version>/index.html`` in a browser to try out the client
* Use the file ``../target/wps-js-<versionjs/wps-js/wps-js.<version>(.min).js`` in your own application.

## Configuration

Configuration of the proxy URL:

```
$(document).ready(function() {
$.wpsSetup({
proxy : {
url : "/wps_proxy/wps_proxy?url=",
type : "parameter"
}
});
});
```

You can also use a template file to pre-configure the contents of the form that is generated - see example ``src/main/webapp/demo/geca-intercomparison/client.html``.

## Documentation

Project and user documentation can be found in the 52°North wiki: https://wiki.52north.org/bin/view/Geoprocessing/Wps-js

## Development

wps-js uses Maven for the build process, which means that the source code is split up across many files in the folder ``src/main/webapp/js/wps-js``. Within this directory, a **Javscript class hierarchy** for reqeusts and responses is implemented in the directories ``request`` and ``response`` respectively.

### Tomcat configuration

A simple configuration of a Tomcat servlet container to develop wps-js is to point the context of the webapp to the Maven target directory.
#### Catalina context
A simple configuration of a Tomcat servlet container to develop wps-js is to point the context of the webapp to the Maven target directory. Put the following lines into a file ``<Tomcat dir>\conf\Catalina\localhost\wps-js.xml`` and restart the servlet container:

```
<Context
Expand All @@ -20,9 +53,13 @@ A simple configuration of a Tomcat servlet container to develop wps-js is to poi

You can then update the deployed copy by running ``mvn package -DskiptTests=true``.

#### Eclipse WTP

Alternatively configuration with the web tools plug-in in Eclipse: Open your server configuration, then the tab "Modules" and add the path ``<your path>/wps-js/target/wps-js-1.0.0-SNAPSHOT`` as the document base and any path, for example ``/wps-js``.

### Proxy

wps-js needs a proxy server to connect to WPS server instances. A simple one is jproxy, see https://github.com/matthesrieke/jprox. wps-js will by default look for a proxy at ``/wps_proxy/wps_proxy?``.
wps-js needs a proxy server to connect to WPS server instances. A simple one is jproxy, see https://github.com/matthesrieke/jprox. wps-js will by default look for a proxy at ``/wps_proxy/wps_proxy?url=``.

#### jprox configuration

Expand All @@ -39,6 +76,8 @@ Make sure you use the following parameters in jprox's ``web.xml`` and deploy it
[...]
```

Alternatively, you can also import jproxy as a project in Eclipse and configure it as a web module for your testing server in the WTP plug-in using the path ``/wps_proxy``.

## License

wps-js is published under Apache Software License, Version 2.0
Expand All @@ -48,3 +87,10 @@ The used libraries are:
* jQuery - MIT License (https://jquery.org/license/)
* OpenLayers - 2-clause BSD License (http://openlayers.org/)
* js-test-driver - Apache License 2.0 (http://code.google.com/p/js-test-driver/)

## Contact / Support
To get help in running wps-js, please use the Geoprocessing community mailing list and forum: http://geoprocessing.forum.52north.org/

Please leave an issue on GitHub if you have any bug reports or feature requests: https://github.com/52North/sos-js/issues

Contact: Matthes Rieke ([email protected]), Daniel Nüst ([email protected])
5 changes: 3 additions & 2 deletions pom.xml
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<name>52North WPS JavaScript Client</name>

<!-- http://semver.org/ -->
<version>1.0.0-SNAPSHOT</version>
<version>0.1.0</version>

<url>https://wiki.52north.org/bin/view/Processing/Wps-js/</url>
<inceptionYear>2013</inceptionYear>
Expand Down Expand Up @@ -87,6 +87,7 @@
<jsSourceFiles>response/DescribeProcessResponse.js</jsSourceFiles>
<jsSourceFiles>response/ExecuteResponse.js</jsSourceFiles>
<jsSourceFiles>response/ResponseFactory.js</jsSourceFiles>
<jsSourceFiles>response/ExceptionReportResponse.js</jsSourceFiles>

<!-- Request classes -->
<jsSourceFile>request/BaseRequest.js</jsSourceFile>
Expand Down Expand Up @@ -122,7 +123,7 @@
<includes>
<include>html/**</include>
<include>demo/**</include>
<include>index.html</include>
<include>*.html</include>
<include>jstestdriver/**</include>
<include>WEB-INF/**</include>
</includes>
Expand Down
2 changes: 1 addition & 1 deletion src/main/webapp/WEB-INF/web.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@
<display-name>Javascript WPS Client | #${build-commit-abbrev} as of ${build-tstamp}, build at ${buildTimestamp}</display-name>

<welcome-file-list>
<welcome-file>/index.html</welcome-file>
<welcome-file>/example.html</welcome-file>
</welcome-file-list>
</web-app>
21 changes: 19 additions & 2 deletions src/main/webapp/css/wps-js.css
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,13 @@ div.wps-waiting {
height:32px;
}

ul.wps-execute-response-list {
ul.wps-execute-response-list, ul.wps-capabilities-list {
list-style-type: none;
padding: 0;
margin-top: 0;
}

ul.wps-execute-response-list li {
ul.wps-execute-response-list li, ul.wps-capabilities-list li {
margin: 0.2em 0;
}

Expand Down Expand Up @@ -81,6 +81,14 @@ span.wps-item-error-value {
color: red;
}

span.wps-item-error-message-value {
color: red;
display: block;
unicode-bidi: embed;
font-family: monospace;
white-space: pre;
}

textarea.wps-complex-input-textarea {
width: 377px;
height: 17px;
Expand All @@ -98,6 +106,15 @@ div.wps-execute-autoUpdate {
height: 16px;
}

div.wps-execute-response-result {
margin: 0.2em 0;
padding: 0;
}

p.infotext {
color: #afafaf;
}

span.wps-metadata-link {
margin: 0 0.2em 0 0.2em;
}
90 changes: 90 additions & 0 deletions src/main/webapp/example.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery/jquery.1.8.3.min.js"></script>
<script src="js/jquery/jquery-ui.1.8.3.min.js"></script>
<script src="js/openlayers/OpenLayers-closure.js"></script>
<script src="js/wps-js/wps-js.${project.version}.js"></script>
<link type="text/css" rel="stylesheet" href="css/wps-js.css">
<title>wps-js example</title>
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body>
<div id="wrapper">
<div>
<h1>wps-js example</h1>
<p>wps-js is an <a href="https://github.com/52North/wps-js/" title="wps-js on GitHub">open source client library</a> for connecting Javascript client to <a href="http://www.opengeospatial.org/standards/wps" title="WPS @ Open Geospatial Consortium">OGC Web Processing</a> services. This page demonstrates how you can use it. More documentation is available in the <a href="https://wiki.52north.org/bin/view/Geoprocessing/Wps-js" title="wps-js wiki page">52&deg;North Wiki</a> and on <a href="https://github.com/52North/wps-js/blob/master/README.md" title="wps-js readme">GitHub</a>.</p>
</div>
<hl>
<div>
<select id="wps">
<option>Select a WPS</option>
<option>http://geoviqua.stcorp.nl/wps</option>
<option>http://geoprocessing.demo.52north.org:8080/wps/WebProcessingService</option>
<option>http://localhost:8080/wps/WebProcessingService</option>
<!-- pyWPS: -->
<option>http://openwps.statkart.no/skwms1/wps.elevation</option>
</select>
</div>
<div>
<h3>
Capabilities <a href="#" id="wpscaller">Show Capabilities</a>
</h3>
<div class="wps-container">
<div id="capabilitiesByClick"></div>
</div>
</div>
<div>
<h3>Execute Process</h3>
<div class="wps-container">
<select id="processes"><option>Select a process</option></select>
<span id="processDescriptionLink"></span>
<div class="wps-execute-container" id="wps-execute-container"></div>
</div>
<p></p>
<div class="wps-container">
<div id="executeProcess"></div>
</div>
</div>
</div>
<script type="text/javascript">
var capabilities, // the capabilities, read by Format.WPSCapabilities::read
process; // the process description from Format.WPSDescribeProcess::read

$('#wpscaller').click(function() {
var sel = document.getElementById("wps");

$('#capabilitiesByClick').wpsCall({
url : sel.options[sel.selectedIndex].text,
requestType : GET_CAPABILITIES_TYPE
});
});
$(document).ready(function() {
$.wpsSetup({
proxy : {
url : "/wps_proxy/wps_proxy?url=",
type : "parameter"
}
});
});

// add behavior to html elements
document.getElementById("processes").onchange = function() {
var sel = document.getElementById("processes");

describeProcess(sel.options[sel.selectedIndex].text);
};
document.getElementById("wps").onchange = function() {
var sel = document.getElementById("wps");

getCapabilities(sel.options[sel.selectedIndex].text);
};

</script>

<div>
<p class="infotext">${project.build.finalName} #${build-commit-abbrev} as of ${build-tstamp}, build at ${buildTimestamp}</p>
</div>
</body>
</html>
1 change: 1 addition & 0 deletions src/main/webapp/html/test-index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<meta charset="UTF-8">
<script src="../js/jquery/jquery.1.8.3.min.js"></script>
<script src="../js/jquery/jquery-ui.1.8.3.min.js"></script>
<script src="../js/openlayers/OpenLayers-closure.js"></script>
<script src="../js/wps-js/wps-js.${project.version}.js"></script>
<link type="text/css" rel="stylesheet" href="../../../src/main/webapp/css/wps-js.css">
<title>WPS Client Test</title>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery/jquery.1.8.3.min.js"></script>
<script src="js/jquery/jquery-ui.1.8.3.min.js"></script>
<script src="js/openlayers/OpenLayers-closure.js"></script>
<script src="js/wps-js/wps-js.${project.version}.js"></script>
<link type="text/css" rel="stylesheet" href="css/wps-js.css">
<title>wps-js demonstration client</title>
<link rel="shortcut icon" href="favicon.ico" />
<meta charset="UTF-8">
<script src="../js/jquery/jquery.1.8.3.min.js"></script>
<script src="../js/jquery/jquery-ui.1.8.3.min.js"></script>
<script src="../js/openlayers/OpenLayers-closure.js"></script>
<script src="../js/wps-js/wps-js.${project.version}.js"></script>
<link type="text/css" rel="stylesheet" href="../../../src/main/webapp/css/wps-js.css">
<title>WPS Client Test</title>

</head>

<body>
<div id="wrapper">
<div>
<select id="wps">
<option>Select a WPS</option>
<option>http://geoviqua.stcorp.nl/wps</option>
<option>http://geoprocessing.demo.52north.org:8080/wps/WebProcessingService</option>
<option>http://localhost:8080/wps/WebProcessingService</option>
<option>http://localhost:8080/52n-wps-webapp-3.2.0/WebProcessingService</option>
</select>
</div>
<div>
Expand All @@ -29,7 +29,7 @@ <h3>
</div>
</div>
<div>
<h3>Excecute Process</h3>
<h3>Execute Process</h3>
<div class="wps-container">
<select id="processes"><option>Select a process</option></select>
<p id="abstract"></p>
Expand Down Expand Up @@ -80,4 +80,4 @@ <h3>Excecute Process</h3>
<p class="infotext">${project.build.finalName} #${build-commit-abbrev} as of ${build-tstamp}, build at ${buildTimestamp}</p>
</div>
</body>
</html>
</html>
Loading

0 comments on commit af07d00

Please sign in to comment.