Showing posts with label web app. Show all posts
Showing posts with label web app. Show all posts

Tuesday 18 April 2017

Indexing and publishing web maps

https://wmsviewer-rodis.rhcloud.com/Web maps provide a useful and interactive experience in map handling and this along with the rich available content they offer justifies their extensive spread on the internet. Despite this fact, the protocols that the operation of web maps is based on are not directly supported by internet browsers so additional software is usually required for accessing web maps.
The most popular open web map protocol is WMS and it is used in web sites along with libraries like OpenLayers or Leaflet to support its operation. In order to index web maps or perform general purpose mapping operations, users should either use GIS packages like QGIS or Global Mapper which are desktop applications with limited portability capabilities or turn to applications like ArcGIS Online with restricted usage and subscription based access.
WMS Map Viewer on line is an http/JavaScript general purpose application for accessing and indexing web maps. The application is provided as SaaS (Software as a service) so that the necessary software required for managing web maps is rapidly loaded while accessing the web site of the app. Then the users may open the maps of their choice by simply entering its URL and layer name or choose from a list of preconfigured connections to various map sources.
The application is freely accessible without needing to create an account or subscribe. Also, it is compatible with all modern versions of the WMS protocol providing easy access to any web map. There are also other interesting built-in features like the ability to overlay map layers over other open maps enabling the composition of multilayer maps; the ability to open and display .kml file; the function of drawing on the maps and outputting the drawings as point, line or polygon .kml files.
An important feature of the app that empowers portability is the ability to store all open map layers in a single file that users may share and view from anywhere. The save & share feature is accessible as an option from the Tools drop down menu or from the Layers button. Using this feature the map layers that the user has open are saved in an .html file which contains all the information to load them again on the same or any other device desktop or mobile.
So, the saved .html files may be posted, shared or published on line as part of a website. Accessing the files from any device will open WMS Map Viewer on line with all the layers loaded as they were saved. These features make this application ideal for indexing, sharing and publishing sets of web map layers as third-parties may access and display the map without installing extra software everything will be loaded after double clicking (or tapping) on the .html file.

https://wms-viewer-online.appspot.com/



Saturday 10 December 2016

Create files with Javascript

In web apps (the new trend is to call them progressive apps) it is often useful to create files on the fly. On this I talk about creating files on the user’s computer by executing some piece of code on the user’s browser and then let the user view them and even store them locally. The other alternative is to create files on the cloud so that the user may then download them, but sometimes this is not necessary. So let’s see how this can happen by placing a few lines of Javascript code on the web app.
The following example regards creating text files from text that is inputted by the user. For this we need a web page with basic formation and a textarea with id=”input” where users may type whatever they wish. Then some function that creates a file from input. And finally a function that makes the file downloadable.
The makeTextFile function creates the file on text input. At first it creates a null variable named textFile which will become the text file. Then a Blob named “data”. A blob is an object of immutable data (text or binary) that may be used like a file and Javascript uses blobs in order to manipulate files; in some cases this technique is used in order to prevent direct access of a script to the file system. You may create blobs containing binary or text data but in this example we focus on text files so our blob is of type 'text/plain'. Next step is to create a URL pointing to the blob using function URL.createObjectURL.

var textFile = null;
function makeTextFile (text) {
    var data = new Blob([text], {type: 'text/plain'});
    textFile = URL.createObjectURL(data);
    return textFile;
  };


Function txt() that follows stores user input in variable textbox which will then be the input of makeTextFile function. Then the link with id=”downloadlink” of the web page is declared to point to the output of makeTextFile function. So by clicking on the link, user input is downloaded as a text file.

function txt() {
    var textbox = document.getElementById('input');
    var link = document.getElementById('downloadlink');
    document.getElementById('downloadlink').download='notes.txt';
    link.href = makeTextFile(textbox.value);
}


Find the full source code of the above example in this link. In order to make this example I used various sources and examples from the web so there is no ownership on it; in other words “use it as you wish”.

Thursday 17 September 2015

How to make a hosted web app listed in app stores and installable for the end users

Building a hosted web app has many advantages. One advantage is that it is not necessary to create big software packages containing the whole app where the users will have to download and install. It is only necessary for them to open the main page of the app and work with it. Also the app may be updated whenever it is necessary and the end users receive the update in real time.
Hosted apps do not require to be placed in an app store and follow certain specifications on the way they are built. Just find a host which may be free, paid or the server of your company and put your creation in there.
There is a small down side in this practice. Apps that require installation create a stronger bind to the end users while hosted apps have a more loose attachment to their users. Also, apps that are listed in an app store receive some promotion just by being there; they may be searched and found easier.
The good news are that there are three app stores that list hosted web apps and two of them provide some methods of installing a link or a small app pointing to your hosted app in the end user's computer.
I had to discover all these things I write about in this post after I finished developing WMS Map Viewer on line. It is a web app and it was really easier to develop it than to find out what to do with it afterwards.
An easy choice for listing your app is the Opera Mobile Store. The store lists apps mainly for mobile devices (new, old and very old) but also accepts submissions for HTML5 web apps for desktop computers. The submission procedure is similar to any other app store. The submitted apps are being reviewed before publication (which I find a good idea) and usually it doesn’t take more than one or two days. When you click on a web app you view its store listing and there is a download button which simply opens the homepage of your app. See my listing for example.
The other two app stores are the Chrome Web Store and the Firefox Marketplace. Both stores address to certain browsers and they both share an interesting feature. When a user downloads an app from these stores the app (or at least a link) gets installed on the user’s computer.
In Chrome Web Store you have to pay a onetime fee (like in Play Store) this fee is currently 5$ and you may place up to 20 apps. Then you have to confirm that the web page you submit is yours by logging in to Google web masters and put a metadata file in the root directory of your app. You can do the submission procedure with any browser but the apps are available for download only in Chrome.
During submission it is only necessary for you to provide a .json type manifest file, a description of the app and some screenshots. But as the store accepts submissions of apps, themes and extensions for Chrome with the same procedure, you have to be very careful and submit the correct manifest. Otherwise the submission procedure might assume that you submit an extension and then your store listing will simply not work. The only way to solve this if it happens to you, is to make a new submission. The previous one is characterized as an extension and this cannot be changed and the submission cannot be deleted. Use this tutorial for instructions don’t forget the part

  "app": {
    "urls": [
      "http://mysubdomain.example.com/"
    ],
    "launch": {
      "web_url": "http://mysubdomain.example.com/"
    }


this makes all the difference between an app and an extension.
See the listing of my app as an example.
After listing your app, any Chrome user may download it. Chrome places downloaded apps in the app menu regardless if they are packed or hosted. So the apps are functional in the Chrome environment like any other app or extension.
In Firefox Marketplace you are also required to place a .json type manifest, but as it has to have the .webapp extension you have to declare in the metadata of your server that the manifest is of type
<mime-type>application/x-web-app-manifest+json</mime-type>
this is a platform dependent procedure and there is a lot of documentation about it in the help files of the Marketplace. The syntax of the manifest is quite trivial, unless you wish to put special installation parameters.
The interesting thing is that when a Firefox user downloads an app in Windows, the app is installed like a regular windows app that may be removed only from the Control Panel. In fact, Firefox installs a small app which is basically a browsers window named after the downloaded app with some cache memory. When a user runs this installation the hosted app opens in this window which has different functionality than Firefox normal windows. This feature is useful as your hosted app runs like a local app improving user experience.
The downside of Firefox Marketplace is the review process. It takes a lot of days, a week or more. And some of the reviewers must not be very experienced. The reviewer of my app didn’t know how to run it; despite the help files in it. So I had to send him detailed instructions and wait even more days for the approval of my submission.

Tuesday 25 August 2015

An online map viewing application

WMS Map Viewer on line is a light-weighted client for web map services that use the WMS protocol. It is a web application compatible with all modern versions of WMS and also supports the projection of kml files as overlays in the chosen WMS connections.
It is a follow up of my Android application and I like especially the fact that you can simply open it in a browser and just work with it. Most of the WMS viewers are heavy applications that require to be downloaded installed etc.
Here are a few of the many sites that you  can find and provide WMS maps.

Europe
http://eusoils.jrc.ec.europa.eu/wms/wms.htm
http://ows.terrestris.de/dienste.html
CUZK Geoportal - Orthophoto

America
http://viewer.nationalmap.gov/exa…/services/serviceList.html
http://www.data.gov.bc.ca/dbc/geographic/connect/index.page?