I am writing a mobile app using open web technologies, primarily targeting the newly-emerging Firefox OS, but planning to support any mobile device with a web browser. The app concerns means of public transport, currently in my city, but with an ability to extend to other areas as well. I want to provide users graphical info on where are the stations for public transport lines, to provide shortest routing information from station A to station B, track vehicle positions using the city's public API and so forth.
Since it is a Firefox OS app, I'm using HTML5/CSS3 for presentation and Javascript for the logic, and keep these files local, thereby never requiring Internet access for the app to work. However, the problem I am facing is rendering city maps (with possible overlays on top, for example highlighted roads and stations). I want to keep the app not depending on an Internet connection to work since I suppose it is sometimes going to be used during transport and in public, where there is no possibility of a persistent WiFi connection and users have to rely on their carrier-provider data connection, which can prove costly and divert potential users.
So far I've been able to find only Kothic-JS (uses an HTML5 canvas) that can render OpenStreetMap data from offline files, but its performance worries me as it stutters in my Firefox OS simulator, even with plenty of computing power available on my desktop computer. I can only imagine what horror would it cause on low-end mobile devices equipped with FxOS—I fear the app would not be usable. Other libraries (such as OpenLayers) tend to all download server-generated tiles, as far as I was able to see.
Is rendering city maps on mobile devices using HTML5 and Javascript feasible? How should I approach this problem? The map files can be transformed to SVG using clever XSLTs and maybe pre-split into SVG tiles, clipping where necessary, but the size of these tiles can never be chosen the right way because of plenty of zoom levels that can be used (i.e. if tiles on zoom level 5 occupy the device screen, on zoom level 2 they occupy only small pieces of it and I end up drawing on the order of 30 tiles to fill the screen). Is there any other way to do this besides turning to online services? I am aware there are great libraries for client-side map rendering, but none of these can be used from within Javascript.
you should try Leaflet JS - it's a great open source mapping library for javascript, with handheld/touch support. I've used it in my project and it works great on Firefox OS.
As for the offline support you may find several blog posts about how to cache tiles for offline use with Leaflet - you should be bundling these tiles with your app (if it is only meant to display local information) or implementing some kind of caching algorithm if you can't bundle these assets.
Related
If you look at the image, there are shared web pages between the 3 applications, Web, Mobile and Touch Browser. I need to report the web pages uniquely per application. So if web page A is loaded, it will need to load different JS libraries for each type of application. Currently a JS bootstrap loader file handles the logic to load the proper JS libraries but that is a 1-to-1 relationship. I now need a way to determine which application is loading the web page and load the appropriate libraries (DTM libraries but irrelevant). The solution would have to reside in the JS bootstrap loader file logic. I’m looking into using the navigator object to sniff out which type of application is requesting the web page but not sure how feasible that is? Maybe feature detection is another way but not sure how/if this would work with the applications? Any ideas?
You might want to take a look at this article: http://www.stucox.com/blog/you-cant-detect-a-touchscreen/
As far as I'm aware, there's no good/reliable ways to specifically detect touch devices, and even if you could, how would you differentiate between a phone and a HP Spectre laptop, for example?
Sniffing for UserAgents can get you some of the results you want, but it's considered to be a suboptimal solution.
Cloudflare gives you the ability to serve different sub-domains for mobile devices, but I'm not sure what criteria they use.
Screen width is a reliable way of detecting whether your content will fit or not.
You can do this in javascript by detecting screen width and redirecting them, but that would be quite inefficient to load the page only to redirect them, so you may want to look into server-side detection: https://webplatform.github.io/docs/concepts/Detecting_device_and_browser/
Hope that helps somewhat.
I have a potential customer who wants an application that can download large amounts of TIFF files locally on a machine for display.
After having discarded Java apps and Windows apps as too difficult to distribute (he has no control over the client computers) I am suggesting an offline HTML5 application.
TIFF is only natively displayed by Safari, and the FileSystem API only works on Google. WebSQL will be too small for the amount of data required (3-4 GB).
I've looked at different plug-ins (AlternaTIFF and BlackIce) but both need to be installed separately, which most of the users will probably find difficult to do.
I am wondering if there was a local TIFF Viewer that I could call from the browser that would open the TIFF from the FileSystem?
If this does not work, the last solution would be a conversion of the TIFFs to something else on the server, but it's going to make my database double in volume.
Any suggestions would be welcome!
UPDATE:
The target computers are not under the control of the client. There is no easy way to distribute the software to all the target computers. I'm assuming they are all windows machines, but it's no guarantee that .NET is installed.
That's the reason I opted for HTML5. At the moment I'm considering a Java Application launched with Java Web Application.
Customer has not yet confirmed the type of files they are using.
The customer is in the construction industry, the TIFFs are scans of large plans which (I assume) will need to be high-quality (zoomable, printable etc) so I don't think a rescaling to JPG will be accepted.
SECOND UPDATE
I'm coming to the conclusion that an HTML5 App is not going to be able to answer all the requirements. In particular there is one requirement that requires a multi-document print (select n documents and have them printed out in a batch). I'm starting to consider standalone applications that can be deployed and updated easily over a wide range of Windows configurations. I'm thinking of a Java Rich Client distribution over Java Web Start or a Microsoft application distributed via one-click-run. I'd simply write the files on the local filesystem and have the client display the images in-line. Would that be a good idea?
Thanks for all the comments.
I've come to the conclusion that it's a bad idea to try and view these files in browsers.
I'm going the way of a separate standalone Windows application. I'll be using the standard viewing and printing functionalities from Windows, which will avoid me all the headache of having to recreate that myself.
I can build all sorts of web applications with common web technologies on both the client and server (JavaScript, PHP, CFML, etc.).
I would like to build some home automation tools and I have no idea how to get from the strictly digital world to the physical world.
Let's say I want a super simple web app to display a bunch of switches in the user interface for some different things in my house. Let's say I'm using X10 hardware (http://www.x10.com/x10-basics.html) that is "listening" for some radio signal.
Is there a way to use web technology to "instruct" my devices (smartphone, tablet, laptop, whatever) to "broadcast signals" to these X10 (or any) physical device in order to make my home more Jetsons-like?
It seems like JavaScript couldn't do any of this because of security stuff, but perhaps a server app running on my local device on my home network could tie into some underlying OS library and do this?
wirelessService = new system.os.superCoolWirelessBroadcasterService();
wirelessService.broadcastSignal("6520 mghz", true); // toaster frequency
All my mobile stuff is an HTML5 front end with an self-hosting asp.net web API backend. I use a https proxy application for security. But I run my stuff on an intranet. It's very easy in my opinion and very rewarding.
Here are a couple of videos:
https://www.youtube.com/watch?v=_2_JSbEytnM
https://www.youtube.com/watch?v=zOhOEWoED4M
Now I did integrate Google Glass which is an app:
https://www.youtube.com/watch?v=vLmPJ9xvfs0
Here you can find a complete listing:
https://www.youtube.com/results?search_query=nick+tullos+home+automation
Here is some of the source code:
https://github.com/NickTullos/CrestJson
Good luck!
You absolutely can. I created several automated processes with Coldfusion. Look at the scheduled tasks section of the Coldfusion administrator.
Many things that are one of specialized tools like barcodes generation or scanner software (just as examples) have third party dlls on Windows with Coldfusion (nothing is perfect mind you) some even required us to extend Internet Explorer via activeX controls. Some of these things included warehousing housekeeping tools, three dimensional boxing interfacing, shipped product checks and payment authorization switches, refund switches, warehousing scale interfaces and U.S. Mail/Endicia/UPS manifest generation.
Nowadays, I do many automated import processes with third party source data. Just formatted CSV or Excel files sent via FTP where I scan and pick of the file for processing.
We also parse raw data from a power inverter and create graphs for review and other statistically useful things for a client. This was not an easy task because there are things in that technology that I am not equipped for and had to learn (power inverter speak). Also the shorthand their technologists used to name data-points made some sense to them, but was immensely obscure and not very easy to translate.
I will tell you that one of the hardest interfaces I worked with was a 1996 serial port based warehouse scale that we got after the DHL bankruptcy. I thought I would lose my mind. There were baud settings like older modems and if there was a failure it didn't do anything (no error nothing).
I would assume you would have to consider that obscure real world interfacing with things that are digital may or may not be feasible.
Coldfusion is very good at automating because it is a dynamic language with an easy to use administrative backend that can access deeper things via Java objects and native .NET support (so anything is possible)!
I am using leaflet to display maps on web site.
I have a known region and known path on that region that I display.
But now I have a requirement to allow viewing that map offline.
My question is do I need to create native app for mobile and in web view display map to do this or this is somehow possible by using JavaScript?
I am using mapbox for map.
For displaying OpenStreetMap offline you will either need pre-rendered raster images (tiles) which you will create beforehand, or you have to put raw or pre-processed data onto your device and render you map during runtime.
The first option requires more space on the device for storing the tiles, but displaying them will be faster. And there is already lots of rendering software available for creating the tiles.
The second option requires more processing power on the device to render the map and you will need some application which does the rendering on the device, but the resulting map data can be a lot smaller compared to the pre-rendered tiles.
Skim through the OSM wiki which has various information about mobile software. I suggest to take a look at already existing solutions in order to get an idea about the various possibilities.
You can do this with Javascript and Mapbox/Leaflet.
For iOS at least you can package your javascript app for mobile with a tool like PhoneGap.
The bigger question in my mind is whether you map relies on a mapping/tile service for your base maps (or your overlays).
If that is the case, then the answer gets a little more complicated. (You could potentially package a few zoom levels of tiles with your app, but that either limits the amount of zooming or the amount of panning that a user will be able to do).
If, on the other hand, you are not using a web mapping service for any of your layers (maybe all your layers are Vector/GeoJSON), then creating an offline map will be just as easy as creating any other offline app.
I have a task to built a simple Digital signage system which will display different kind of information on LCD panels.
I am not sure if Adobe AIR with HTML / Javascript would be a good choice for the desktop part of this application, which will be responsible for displaying the content. The logics could be easily solved and coded in Javascript and the app should run for a long time.
Maybe it would be better to use FLex instead. What do you think?
Thanks for any recommendations.
In my opinion, Flash's strong support for animation and graphics manipulation makes it a clear winner for this sort of application. Digital signage apps thrive on features like objects animating around the screen, transparency effects, glows, etc. Flash does all of these things natively.
AIR's HTML + Javascript support basically lets you turn a web app into a native-looking standalone application. It also gives you some additional APIs (e.g. local file access) but other than that, it's pretty much just a captive version of Safari 4 showing content that comes from the hard disk instead of a web server. (Obviously once the AIR app is up and running, it can go off to a web server (or RSS server, or...) to pull more data.)
Safari 4's HTML5 support is strong, but HTML5 is still not as powerful as Flash when it comes to whizzy graphics and animation.
As for Flex, that's pretty much orthogonal to your main question. Flex just gives you a nice application development framework on top of Flash, which is particularly helpful when developing traditional desktop-like applications. Little of what it provides really has anything to do with your digital signage display application.
That's not to say Flex would be useless in this application. You probably also need some kind of data entry and configuration piece. If that's going to be part of the same AIR app that displays the digital signage, the whole thing should probably be built on the Flex framework. If these are two separate pieces, then maybe it makes more sense for the configuration and data entry piece to be Flex-based and for the signage display piece to be purely Flash.
The answer is YES.
My company developed a Digital Signage software in 2009 assiciated whith C++ and cloud computing, and we keep using and upgrading this software. ;)
The aministrative panel is PHP, and it has differents levels by user.
Today we are creating a new version in Adobe AIR, but keeping the c++ and cloud server.