Tenthrow
Tenthrow

Reputation: 51

Store very small amount of data with javascript

I have one of those websites that basically gives you a yes or no response to a question posed by the url. An example being http://isnatesilverawitch.com.

My site is more of an in-joke and the answer changes frequently. What I would like to be able to do is store a short one or two word string and be able to change it without editing the source on my site if that is possible using only javascript. I don't want to set up an entire database just to hold a single string.

Is there a way to write to a file without too much trouble, or possibly a web service designed to retrieve and change a single string that I could use to power such a site? I know it's a strange question, but the people in my office will definitely get a kick out of it. I am even considering building a mobile app to manipulate the answer on the fly.

ADDITIONAL: To be clear I just want to change the value of a single string but I can't just use a random answer. Without being specific, think of it as a site that states if the doctor is IN or OUT, but I don't want it to spit out a random answer, it needs to say IN when he is IN and OUT when he is out. I will change this value manually, but I would like to make the process simple and something I can do on a mobile device. I can't really edit source (nor do I want to) from a phone.

Upvotes: 0

Views: 374

Answers (4)

Tomáš Zato
Tomáš Zato

Reputation: 53139

Though javascript solution is possible it is discouraged. PHP is designed to do such things like changing pieces of sites randomly. Assuming you know that, I will jump to javascript solution.
Because you want to store word variation in a text file, you will need to download this file using AJAX or store it in .js file using array or string.
Then you will want to change the words. Using AJAX will make it possible to change the words while page is loaded (so they may, but do not have to, change in front of viewers eyes).

Changing page HTML

Possible way of changing (words are in array):

wordlist.js

var status = "IN";   //Edit IN to OUT whenever you want

index.html

<script src="wordlist.js"></script>
<div>Doctor is <span id="changing">IN</span></div>
<script>
   function changeWord(s) {   //Change to anything

       document.getElementById("changing").innerHTML = s;

   }
   changeWord(status);  //Get the status defined in wordlist.js
</script>

Reloading from server

If you want to change answer dynamically and have the change effect visible on all open pages, you will need AJAX or you will have to make browser reload the word list, as following:

Reloading script

function reloadWords() {
    var script = document.createElement("script");  //Create <script>
    script.type="text/javascript";
    script.src = "wordlist.js";                   //Set the path
    script.onload = function() {changeWord(status)};    //Change answer after loading
    document.getElementsByTagName("head")[0].appendChild(script);  //Append to <head> so it loads as script. Can be appended anywhere, but I like to use <head>
}

Using AJAX

Here we assume use of text file. Simplest solution I guess. With AJAX it looks much like this:

http = ActiveXObject==null?(new XMLHttpRequest()):(new ActiveXObject("Microsoft.XMLHTTP"));
http.onloadend = function() {
     document.getElementById("changing").innerHTML = this.responseText;  //Set the new response, "IN" or "OUT"
}
http.open("GET", "words.txt")
http.send();

Performance of AJAX call may be improved using long-poling. I will not introduce this feature more here, unless someone is interested.

Upvotes: 0

Amit
Amit

Reputation: 738

Since you don't want to have server-side code or a database, one option is to have javascript retrieve values from a Google Spreadsheet. Tabletop (http://builtbybalance.com/Tabletop/) is one library designed to let you do this. You simply make a public Google Spreadsheet and enable "Publish to web", which gives you a public URL. Here's a simplified version of the code you'd then use on your site:

function init() {
  Tabletop.init( { url: your_public_spreadshseet_url,
  callback: function (data) {
    console.log(data);
  },
  simpleSheet: true } )
}

Upvotes: 1

Aaron Blenkush
Aaron Blenkush

Reputation: 3059

Two ideas for you:

1) Using only JavaScript, generate the value randomly (or perhaps based on a schedule, which you can hard code ahead of time once and the script will take care of the changes over time).

2) Using Javascript and a server-side script, you can change the value on the fly.

Use JavaScript to make an AJAX request to a text file that contains the value. Shanimal's answer gives you the code to achieve that.

To change the value on the fly you'll need another server-side script that writes the value to some sort of data store (your text file in this case). I'm not sure what server-side scripting (e.g. PHP, Perl, ASP, Python) runtime you have on your web server, but I could help you out with the code for PHP where you could change the value by pointing to http://yoursite.com/changeValue.php?Probably in a browser. The PHP script would simply write Probably to the text file.

Upvotes: 1

Shanimal
Shanimal

Reputation: 11718

If I understand correctly you want a simple text file that you change a simple string value in and have it appear someplace on your site.

var string = "loading;"
$.get('filename.txt',function(result){
    string = result;
    // use string
})

Upvotes: 2

Related Questions