I created a canvas and letting user draw many shapes (circle, rectangle etc). I'm storing information of each shape (x, y, w, h, r) in objects and storing them in an array! Now i have an array of all the shapes with all required information to redraw them. What i want is, when user clicks 'save' button, HTML code of the drawn shapes gets saved in an HTML file! I just need to create a .html file and write all the code for drawn shapes in that (hard-coded, in a canvas ofcourse). I've been looking for a method to create new files within JavaScript and write into them.. I thought it's going to be as simple as file reading writing in Java but i am unable to find any easy way to do that... as there are some permission issues and stuff like that! Kindly tell me what to do?
The first line of the page about Javascript on Wikipedia (http://en.wikipedia.org/wiki/JavaScript) is about your issue.
JavaScript is an interpreted computer programming language. As
part of web browsers, implementations allow client-side scripts to
interact with the user.
You can't create, open, remove, write or edit file with Javascript on the client-side.
Barring the use of HTML5, which isn't fully supported yet, you'll want to post the data to the server and then have the user download the file.
For example, you could convert your array to JSON, place the JSON inside a TextArea tag wrapped inside an HTML form, and then submit the form. The page on the server that receives the form posting could respond my downloading a file to the user's browser.
If you tell us a little bit more about what you want to accomplish, we might be able to provide better answers. Do you want to create HTML so that the data can be viewed in the browser? If so, then you can manipulate the existing document in JavaScript. Are you looking to have users save their data and submit it to you for review? If so, a SQL database might be more appropriate.
If you are on local and on windows, you can use FileSysemObject ActiveX, but I don't think it's you are looking for.
Related
My limited experience in web development as a self-taught led me to hit a wall while trying to figure out how to deal with this problem.
I need a form (map_settings.php) where the user should enter some inputs. Those inputs must be saved in a database table (MAPS) and then used to create the final HTML file (e.g. map1.html) for that specific user/inputs.
I know how to deal with using forms and saving submitted data to a database.
What is completely obscure to me is how can I use those inputs to automatically generate the final HTML.
My idea is to have a template HTML (template.html) and each time a user saves new settings via the form, I copy the template and replace some variables inside it with the actual data the user has input in the form.
If this might matter, the variables I need to replace in the template are also JavaScript variables within a <script> tag.
Can anybody help me suggesting one viable way to do this? I am mostly using JavaScript and PHP, without frameworks. I've also red about JavaScript templating engines, but I sincerely did not get if those are useful to me in my case.
Anyway, here is an illustration of what I would need to do, to hopefully clarify better my point.
Creating a static HTML file per user is not the way to go. Instead just have a PHP script like mapdisplay.php or similar.
Make the script so that if you type mapdisplay.php?map=1 in the browser then it will read the map ID, get the relevant settings from the database for the map in question and then generate some HTML to display them - of course you can have most of the HTML ready made like a template, and just use PHP to fill in the details from the database. This idea of getting data on the fly when requested, and plugging it into some HTML is how most web applications work.
If you create a static HTML for each user it quickly becomes unmanageable with a large number of users, plus it's hard to introduce changes or improvements to the template because instead of just updating one script file, you have to back and re-do every existing page. There are other disadvantages to your approach too, but I won't continue here - you get the idea I hope.
If I were you I'll make that in this way:
Don't use template.html
Don't get data from database to new file, but from form
Make database test before make file
To make template use
$template_text = "text...text...html...text...".$php_varible."text...text...html...text";
For other things about php see w3schools
I have a typical HTML form, with some fields of various types on it.
What I'm trying to achieve is the following:
Once the form's input fields are filled out with values, a button to be able to save all the filled-out field/value pairs into a local file of some sort that allows me in a future ocassion to...
Automatically fill the very same HTML form by retriving the field/values pairs from said file instead of typing them manually.
Ideally this would have to be achived thru JavaScript, because the webpage that contains the HTML form is served by an embedded system where PHP or other server side scripting is not available.
Is it possible to achive this thru JavaScript (or any other browser-side effort method)? If so, how?
Many thanks.
EDIT: The target environment is a regular user in a regular PC/laptop using any one of the 4 major browsers. It's acceptable to have "Cookies enabled" and "latest browser version installed" as requisites, but external plugins/addins are not.
Later: NullUserException has achived something in this direction. He's been able to read from a local file using JavaScript:
Using a local file as a data source in JavaScript
I think, for your particular site you can store data in local storage. Only your application will be able to access to that data. Also you can encrypt it before storing.
You can refer
diveintohtml5.info/storage to start with.
Happy coding.
Pretty sure you won't be able to save a file locally and then pick it up again.
However there are obviously cookies but there, and this is only in a modern browser, is also LocalStorage that can hold quite a bit of data that can be retrieved by Javascript and jQuery.
This is probably the way I would go but it does depend on your browser version.
question is some what ambiguous please specify what you are trying to do.
i can't tell if you want to do something just for you if so:
https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/
I am trying to create/improve a microscope stage tracking system. So far I have written a python code (based on an old matlab one) which takes input from a webcam and uses it to calculate the position of the camera (and thus the stage). I now need to work out how to 'pass' data (an x and y position) to an xml file (which acts as the user interface) where certain positions can be saved etc.
Currently the python script constantly updates a text file, which is then constantly read by the xml file, but I'm wondering if there is a better solution. It has been suggested to me that I create a simple, local 'web server' to host the data, but I can only find information on how to host files which would seem to defeat the purpose...
Is there an easier way of doing this? Ive used python a decent amount (mainly for the numpy and scipy packages), but have little to no experience with web servers or xml...
Thanks
edit: I think this is the relevant part?
function getStagePos(xId,yId){
stagePosStr=getFromServer("file:///c:/stagePos.txt");
if(stagePosStr.substr(0,1)!="!"){
data=stagePosStr.split(",");
document.getElementById(xId).value=data[1];
document.getElementById(yId).value=data[2];
process();
}else{
warningNode.innerHTML="Stage Position too inaccurate";
window.setTimeout('warningNode.innerHTML=""',1000);
}
edit2: sorry for not being clear, this is the 'function' of the xml file (written in javascript?) which (I think) is reading in the two fields from the stagepos.txt file. Currently,this txt file is being updated by a matlab script which I have rewritten (and improved) using python. What I am trying to ask is if there is a way to update the two fields that appear when I open the xml file (which is used to save them at certain values to 'mark' locations on the stage) without first saving them to a text file?
edit3: re: changing tag from python to javascript: the code I posted is from the xml file (didnt realise It was javascript..) but my question relates to a python script which generates two constantly updating (at 30fps) fields and how to 'output' them to this file
I'm creating a web-application which will be taking survey-type data.
Users are presented with several files and asked a question. The user, in the hope of not skewing data, must not be able to know the file name of the file.
An empty div is created for a JPlayer instance to sit in, and I have added the "location" attribute to the div, so while setting up the JPlayer instance on the client side the JPlayer knows what .wav to play
<div id="jquery_jplayer" class="jp-jplayer" location="sound.wav"></div>
Here is part of the javascript which sets up the sounds to be played and here its easy to see that the file location is simply dragged from the div
$("#jquery_jplayer").jPlayer("setMedia", {
wav: $(this).attr("location")
});
Basically, the intention is to hide "sound.wav" from the HTML document and keep the javascript dynamic.
A translation file between obfuscated and deobfuscated could be possible but it would be nice to keep this dynamic.
If you want to truly hide logic from your viewers, then you need to do it server-side rather than with client-side javascript. You can "complicate" the dissection of what is happening in the client-side code, but you cannot truly hide it.
If you want further help with the obfuscation, you'll have to describe better what you're really trying to do. The current description doesn't seem to offer enough information. What is this file path? What is it being used for? Why do you need to hide it?
If what you really want is just a Javascript function to obfuscate and de-obfuscate the sound filename, you can find lots of options with Google depending upon how elaborate you want to get. My guess here is that the determined cheat won't be fooled (since all the code is there for deobfuscating) so all you're really trying to do is make it non-obvious at first glance. Thus, any simple algorithm will do.
Since you're already using jQuery, here's a jQuery that does simple string obfuscation: http://plugins.jquery.com/project/RotationalStringObfuscator. You'd have to run the obfuscator yourself in some sort of test app to record what the server should set each filename to and then do the reverse in the client when you want to actually use the filename.
If you ask me, a better solution would be to give the filenames non-meaningful names from the beginning. This would be names like 395678264.wav and just use them that way (on both server and client). Then, the name is meaningless to anyone snooping. No deobfuscation or translation table is required because this is the real filename.
Now, this requirement may seem weird. But i would like to know how to achieve this?
I am having an HTML file, which is having few input box, check box, radio button etc. I would like to retain the changes a user [ actually i ] performs on this page. Like if the user has ticked a checkbox then next time anybody open that file should see that checkbox as ticked.
This thing can be done easily using HTTP cookies. But i don't want to use cookies.
The answer can be as simple as "No you can not do that" :)
Edit
That's the problem with not phrasing the question correctly.
I guess i can't use DB as if i will send my HTML page to someone then he/she will not be able to see my changes. I want my changes to be reflected on other systems also. [ thats the reason i was not going for cookies ]. Other solution what i was thinking was, using FileSystemObject. Any other solution ? again the answer can be "No you can not do that" :D
You could bind the change events of your form elements to an AJAX submit, log the submits to the db and then on any page load grab the latest states from the db for rendering.
Edit
If you want these changes to appear "simultaneously" for other users then you could use jQuery polling to update the page - have the page periodically poll the server for the latest state.
Having said that, if you give them a server link and not the actual file they will see your db changes.
However, it sounds like you want to actually send the file (not send someone to a web server) in which case you could do something like one of these approaches:
Your PHP/whatever file (can possibly even do this with javascript) outputs a HTML file with appropriate checked="checked", selected="selected", value="blah" etc. You send this file.
Your PHP/whatever file outputs a static reference file. Your HTML file has javascript referencing and using the values stored in this file. You send both of these files around (although value updates only require a changed static reference file).
I sounds like you want to change the actual file using Javascript - this should be rather difficult. Javascript was designed from scratch as a web scripting language and as such it doesn't have any built in file/IO functionality.
What you can do in Javascript is load ActiveX objects and plug ins. How this works depends a lot on which browser you're using. For instance in IE you could load an ActiveX object (written in VB or whatever) that could edit your file:
var fileWriter = new ActiveXObject("My.FileWriter");
fileWriter.Update("myFile.htm", "inputName", "newValue");
You'd have to write your FileWriter utility though.
Alternatively you could use HTML5's new data storage stuff - but then you're still limited on browser.
You need some method to identify the user when he or she visits again. A browser cookie is useful, because it is stored on the user's computer, which serves as identification. The other serious option is to store the user's preferences in a database. This would, at least, require a server-side language. In addition, you need some way to identify the user, such as username, or, less reliably, IP address.
I hear other options may exist in HTML5, but I don't think those can be used seriously at this time. You can read about it here in Offline Web Applications. It seems to me like something very similar in spirit, although much more powerful, than cookies.