Develop Reference

Methods to pull data and display on web browser

Please look at my project architecture below.
I intend to use Arduino as Web server and pull data into the SQL database of my PC. I have installed XAMPP, so I have the apache server and MySQL running in my PC. I have verified that data from Arduino is updating a table in the SQL DB.
Question:
I'm not a web-developer and I have been exploring different ways of pulling data from the SQL DB and showing it on web-page.
My requirements:
Pull live data from the SQL DB (as it gets updated) and show it on web page
Plot graphs of recorded parameters from the db as and when required. I understand that Flot is a tool which can do that.
Make a drawing as shown in the image above and populate that with dynamic values (numbers) or change colors of objects (such as green/red)
Methods I have come across so far
Use PHP to pull the data and show on webpage. Use HTML/Javascript/jQuery to create such drawing and populate with image and values
Use Python to pull data and use HTML/Javascript/jQuery (I know only HTML among these)
Use Visual Basic to pull data directly from Arduino and display it in a form. For this option, I'm not sure if plotting data is possible or not.
This of-course is a broad question and as I said I'm not a web developer. But I'm in no hurry. I have couple of months of time to invest and learn the different languages involved.
I wish the answers could guide me to a better solution than I know or chose one among the others or just point out plus-and-minus of each of the options

You can use EventSource at JavaScript to stream data from PHP or Python the the HTML document.

Javascript - how to directly interact with db?

I have an excel sheet, a JS application and a db. excel sheet has data. I need to open the file and read data from the JS application and insert it into the db(say oracle db). How to?
I think we cannot open and close file in JS, pls correct me if i am wrong since it poses a security issue. If that is the case, say if we have updated the data in the grid, or table in the JS application. and we want to insert all the data in to the db, how do we do it?

First- there is pretty good module to read/write excel files in javascript-client or javascript-server:
js-xlsx
Someone has used it and provided a blog on its usage here
Second- You have to involve one more tier (server) to get the work done as per security standards. Or another option is BaaS (Back-end-as-Service) like Parse, Firebase to serve your client as database, it lets you directly save your stuff without involving/writing server. Or other option is to use SaaS like Mongolab, it exposes api for client to directly save into db.
Happy Helping!

You cannot do this safely. You need a webservice that the javascript app can call and that service would write to the database. So you should build a restful web api.

You need a Proxy Service for interacting to DB. There is no db-connectors for JS. The simplest way to achieve your goal is to choose one of the scripting languages which can run on your server. Such as PHP, Python, ASP.NET, ASP etc. I suggest PHP or Python.

Using a server to send/receive information between a mobile phone and web page

I am trying to set up a simple set up as follows:
Have a mobile app with a page consisting of 4 lines (4 html paragraph lines (I am using phonegap)).
I want to use a web page from which I will input the data for those 4 lines. This information is sent to a server and that server transfers this information to that app on that mobile phone. Now, those 4 lines on the mobile phone is filled with the new information.
Similarly user inputs information on another page consisting of 10 lines of li (list). This information is again sent to the server and to the web page where the information is displayed.
I can almost feel the "internet police guys" getting all hyped and ready to vote this question down. But please understand that I have been on this site and various forums desperate to find a tutorial to guide me to do this and not able to find.
I am trying to use ajax to perform this setup. Confused how I would be using the php file. Information such as password n username is going to go in that php file to connect to the server. But php is a server side script thus needs to sit at the public_html folder. How do I use the php file from my desktop? Write a separate javascript to access it?
It is the concept that is confusing me. I am familiar with html,js,php.
I would appreciate any guidance or maybe a link to a tutorial which would help me to do the concept I mentioned. Thanks for listening.

You will need to create an API using PHP. This API is uploaded to your server and is considered "RESTful". Google a tutorial for what fits your needs. You can set all sorts of rules in this API such as requiring any requests to have an ID or access token.
Since you are using PhoneGap, your HTML and JS files rest on the device, so you will need to allow permissions to your API from anywhere. For this you will have to speak to your host provider about unless you know how to configure it yourself (some providers restrict what you want to do by default as an extra security precaution against XSS attacks).
Next, you can either use jQuery, or you can write some AJAX calls by writing the JavaScript yourself.
The most efficient way for this to work is to send JSON objects to and from the API. You will include a "command" in the JSON when you are sending from your app. On the PHP side, you will retrieve this command and use the rest of the data included in your JSON object to process the request. Your API will need to encode a JSON object for return (such as a user's profile information).
Here is a basic PHP API tutorial to get you going that explains some of the features of a RESTful API: PHP API
Here is a simple AJAX function (you will probably want to make this much more modular): AJAX

As broad as your question is, it seems like the best/easiest thing for you to do will be for you to first create a PHP webpage that will access a SQL database to perform the record updating. Actually, this should serve all of your needs for your mobile users assuming you don't need push notifications for live data updates.
I am assuming, since you are using phone gap, that you are more comfortable with web languages. After you get the webpage fully operational, then you should start building your app based on that exact same SQL database. With mobile app development there are a lot more "what if's" (what if the phone rings, what if the app is running in the background, what if there is no cellular service, etc...)
It is always easier to start with what you know and build on that, rather than starting with a new development platform and troubleshooting as problems arise.

Can I access Notes documents/collections via client side JS?

I wanted to know if it's possible to handle notes views and document collections via client side scripting in Xpages?
The story so far....I am building a HR system that includes a full absence section (holidays, sickness, other absence etc). I have coded a button in the notes client that creates an Excel spreadsheet showing a calendar of the last 12 months absences for the current user based on the absence documents (getview, getalldocumentsbykey into collection). It loops the collection using various fields (incuding multi value fields) in each document to calculate absence length, full/half days etc and marks them on the sheet in different colours with hyperlinks to access the documents.
It also calulates other things like the Bradford Factor rating and does calculations around the users working days.
Anywho, I've been challenged to get the entire system working in a browser, removing any need for the notes client, so....back to my original question, I need to be able to get a collection of documents from a notes view via a key that I can then access the field on via client side javascript.
Is this possible? I can provide more info if required...

Have you considered the Notes Browser Plugin? It is supposed to let you run the Notes Based Apps through the browser without modifying the code.
Here is a write up about it

I think you should go for REST. In Domino, it can provide data from views/documents in JSON format which you can use in client side JavaScript natively.
For more info try searching google and ddwiki, for example this tutorial video.

Edited to put emphasis on &ReadViewEntries and add detail
Doing it purely on the browser-side would probably best be done by fetching DXL or JSON using the &ReadViewEntries URL command, and then writing Javascript to process the data and do the equivalent of the CreateObject call locally. You can find the doc for &ReadViewEntries here. (#Panu has already mentioned DDS, which is also a good idea.)
Or see here for some sample code that shows a technique that a Domino web agent written in LotusScript can use to create data that will be sent to the browser with a content-type header that causes it to be opened in Excel. I haven't verified this particular code, but I've seen other references to the technique. This particular code might not give you as much control as you want -- e.g., colors and links, but I think it would also be possible to actually generate the data as XML in the xlsx format and send that down similarly.

You can access all Domino objects from client side JavaScript vith Java and CORBA. You just need a small applet that returns Session to javascript. Here are instructions from Designer help:
http://www-12.lotus.com/ldd/doc/domino_notes/rnext/help6_designer.nsf/9/0d05bb3cec358f7085256c54004bdbff
However as Per suggested nowadays a combination of client and server side Javascript in XPages are usually used instead of CORBA. Domino Data Service is the latest way to get data from server to (for example) client side javascript.
You may also want to take a look at Apache POI with which you can create Excel files in server side. ActiveX works only in IE althought there are plugins to get it working on other browsers.
edit
What I usually do with "combination of client and server side Javascript" is to use dojo.xhrGet (or xhrPost) in client side. On server I have an XPage (earlier agent) which collects the data and returns it in JSON format.
Panu

Reading and writing to an external file using javascript?

I have an online storage account that I`m using for my homepage. Basically I have just made an "index.html" and stored there . and no php , asp is possible .
So If I must create a message form on the homepage and store the message in a separate text file in JSON format ,can it be done using javascript ?
also I need to query the Text file whenver I want to display the messages using javascript .
So far , I tried TaffyDB but realised it doesn`t have a way to persist the data after session closes. or maybe I missed something?
Thanks!

Short answer. No.
The JavaScript is client side. So it can do all sorts of cool stuff on the persons computer that visits your site but unless you're running some server side code that takes the JSON encoded data and does something with it then you're out of luck.
There are many alternatives.
If you don't want to run your own server side code then you could use a separate service like Parse.com that does REST and has a comprehensive API.
A mobile website can access Parse data from Javascript.
A webserver can show data from Parse on a website.
You can upload large amounts of data that will later be consumed in a mobile app.
You can download recent data to run your own custom analytics.
Applications written in any programming language can interact with data on Parse.
You can export all of your data if you no longer want to use Parse.

You can try with jQuery/AJAX. To read:
$.get("path_to_file", null, function(fileData) {
alert(fileData);
/* Your code goes here */
}, "text");
But in order to write, I think the only way is with some server-side language (PHP, ASP, etc)

The short answer is no.
You need to have some server-side support to persist the data on that server. You can, however, use client-side javascript to relay the information to a server that DOES support reading and writing of the data of course.
Technically, node.js is javascript that does support file reading and writing - but I assume that's out of the question for your environment :)
One crazy way (just as a thought experiment) to implement persistent storage for your web application without server side support is to have the clients talk to each other through P2P. This is possible with Flash or some java applet..etc. So as long as one client is up (perhaps your own comupter!), you'll have some form of persistent storage. Your server/webpage simply serves up this embedded object which does the actual work.