• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Bear Bibeault
  • Devaka Cooray
  • Liutauras Vilda
  • Jeanne Boyarsky
Sheriffs:
  • Knute Snortum
  • Junilu Lacar
  • paul wheaton
Saloon Keepers:
  • Ganesh Patekar
  • Frits Walraven
  • Tim Moores
  • Ron McLeod
  • Carey Brown
Bartenders:
  • Stephan van Hulst
  • salvin francis
  • Tim Holloway

html/js Project design question - .js file as an argument  RSS feed

 
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm working on a project to display placemarkers using Google Maps for several trips I've taken.  
There is a utility program that generates a list of the placemarkers in a .js file.
For example LocationsAndNames.js contains:
The list file is referenced in the html file with this statement:
The problem I'm having is how to have one html file be able to read a selected .js file vs a hardcode one in the source.

If the html file were like a program that could run from a commandline like this:
  theHtmlFile theListForTrip1.js
and have the arg from the commandline replace the file referenced by the src= statement in the html.

Then I could create shortcuts for all the different trip .js files.

My current solution is to have a folder for each trip.  The folder contains the html file and the LocationsAndNames.js file for the placemarkers for the trip.  The problem (its small but annoying) is when the html file is updated, all the html files in the trip folders need to be replaced with the new version.

Does anyone have other solutions?

Thanks,
Norm
 
Marshal
Posts: 67164
169
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Why not have the data in JSON files rather than JS?
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Sorry, I have no idea what a JSON file is.  What is the advantage of putting the data in a JSON file vs a js file?
How does an html file chose which file to get its data from?
The files are local, no server is involved.
 
Bear Bibeault
Marshal
Posts: 67164
169
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I made an assumption that you do not want to include this data statically?

A JSON file is basically a JS data construct. So pretty much what you've got in your small JS files, with the var assignment. (And some minor syntax adjustments.)

The benefit is that they are easy to consume with an Ajax request.
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
This is a very simple project: 1 html file, one js file and one browser to read the html which reads the js and displays the placemarkers on a GoogleMap.  Everything is on my PC.

What I'm looking for is a way to use one copy of the html file with a selected js file like using a program in a command prompt can pass a file to a program.
 
Bear Bibeault
Marshal
Posts: 67164
169
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
No server-side includes, correct? (In other words, no JSP, no PHP, and so on)

You can supply the name of the data file using a request param, and parse that out of the URL with JS. e.g. whatever.html?data=something

Once you have the "something", you can make an Ajax request to something.json, or (not how I would go) create a <script> element on the fly that references something.js.
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator

parse that out of the URL with JS. e.g. whatever.html?data=something  


That looks like what I want.  What is the JS to get the parameters following the ?
How would that URL be coded in a shortcut?  When I tried the following as Target in a shortcut I get an error message:  the path is  not valid
D:\Norms\Javascript\GeoLocation\GoogleMapsTesting\Testing\DropPlacemarkersOneByOneVs.html?ListNames.js

No server-side includes, correct?


Correct.  There is no server.  Only an html file and some .js files on my PC's disk.
 
Bear Bibeault
Marshal
Posts: 67164
169
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator

Norm Radder wrote:That looks like what I want.  What is the JS to get the parameters following the ?


Don't have any handy, it's been a long long time since having to do this by hand. (Frameworks like Angular, React and VueJS have routers that take care of URL handling.)

Search parsing query string in JavaScript and you are liable to find something.

How would that URL be coded in a shortcut?  When I tried the following as Target in a shortcut I get an error message:  the path is  not valid
D:\Norms\Javascript\GeoLocation\GoogleMapsTesting\Testing\DropPlacemarkersOneByOneVs.html?ListNames.js


Hmmm, not sure why you'd get that. Do you get that in all browsers?

But you should be using the proper format of name=value.
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator

Do you get that in all browsers?  


That error message was from Win10 after I had changed the target and pressed the Apply button for the Properties of the shortcut.
I have since found a value for a short cut that works:
"C:\Program Files (x86)\Mozilla Firefox\firefox.exe" file:///D:/Norms/Javascript/ReadFile.html?somedata

Now the problem is  how to load the somedata.js file and execute its contents to set the value of the vars defined in it.
 
Bear Bibeault
Marshal
Posts: 67164
169
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
My advice would be to load jQuery and use its $.getJSON method as the easiest approach to suck in a JSON file with the data.

BUT, and it's a big but, you're going to run into trouble using the file:// protocol. You can't use Ajax without HTTP.

Do you not have an HTTP server running on your machine (Apache? NPM server? Tomcat? Anything?)

If you stick with the file protocol, you'll need to go the "add a <script> tag" approach which is a bit more work and has browser-specific weirdnesses. Again, jQuery helps even out the playing field here. If I recall correctly, when you create the script tag via jQuery, and attach it to the DOM, it makes sure it gets executed correctly. You'll need to do some research, my experience with this is over a decade old.
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Here is a first cut:
It works in Firefox on Win10.
 
Norm Radder
Rancher
Posts: 3341
33
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
The above solution continues to work.  Also with Chrome.
As Win10 Shortcut's Target:  
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" file:///D:/Norms/Javascript/GeoLocation/GoogleMapsTesting/Testing/DropPlacemarkersOneByOneVs.html?LocAndNm_Europe1974

Also from a redirect html page:

Now on to the Android tablet.

Thanks Bear.  I got the Google lookup vocabulary from your posts.  
 
Norm Radder
Rancher
Posts: 3341
33
  • Likes 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Tests OK on Android.  This html file works with Firefox and Chrome:
 
Don't get me started about those stupid light bulbs.
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!