JavaScript - How Can I Save Page Settings By Generating A New Url?

Hello! I have a question about a concept I'm working with. I want to create an html page that displays several links to different pages on the site. The user would then be able to drag and drop these links into some sort of list. That part I have figured out. Once they've finished creating their list, they would be able to click on the links in the list. The question I have is this: if they click on a link in the list and go to that page, can their list again be displayed on the new page along with the items they added to it on the previous page? If this is a simple cookie thing, that is awesome. I can't utilize a database or anything server-side for this. HTML and javascript only. Any help would be hugely appreciated, as my programmer is out today.

1st, Hi Coding forums!

I'll get to the point, I'm a noob -.-

I'm using greasemonkey for a certain website.

Basically, I'm using gm to refresh the page after a certain time, I was however wondering, If I can set it to a random number between 2 specific times?

The code I'm using atm is

setTimeout(function() { document.location.reload(); } , 10000);

I know I have to use math.random, well, I think I do. But I'm not sure how to do it between 2 certain times?

So to summarise, I'm trying to refresh a page at any given random time between say 5-10 minutes.

Any help is appreciated, thanks!

I'm trying to find a much simpler way than this current script I am using to generate and print a random word. I don't want to have to name each word but instead just include a very large list of about 300,000 words that javascript uses to pull a random word out of. Can you please help me out?? The list of words I have is a straight list with no commas or anything.

I am currently outputting to a text box, but I am looking to generate words according to users input. For example, a user wants 500 words starting with the letter "b" and is less than 5 characters long appended to the character "de."

Any help would be awesome! Even a right direction. I'm also willing to pay some for such a script if need be. Thanks!

Here's my code:

Code:

<SCRIPT LANGUAGE="JavaScript">
<!--

var NumberOfWords = 28

var words = new BuildArray(NumberOfWords)

words[1] = "czarevitch"
words[2] = "brightwork"
words[3] = "verkrampte"
words[4] = "protectrix"
words[5] = "nudibranch"
words[6] = "grandchild"
words[7] = "newfangled"
words[8] = "flugelhorn"
words[9] = "mythologer"
words[10] = "pluperfect"
words[11] = "jellygraph"
words[12] = "quickthorn"
words[13] = "rottweiler"
words[14] = "technician"
words[15] = "cowpuncher"
words[16] = "middlebrow"
words[17] = "jackhammer"
words[18] = "triphthong"
words[19] = "wunderkind"
words[20] = "dazzlement"
words[21] = "jabberwock"
words[22] = "witchcraft"
words[23] = "pawnbroker"
words[24] = "thumbprint"
words[25] = "motorcycle"
words[26] = "cryptogram"
words[27] = "torchlight"
words[28] = "bankruptcy"

function BuildArray(size){
    this.length = size
    for (var i = 1; i <= size; i++){
        this[i] = null}
    return this
}

function PickRandomWord(frm) {
    var rnd = Math.ceil(Math.random() * NumberOfWords)

    // Display the word inside the text box
    frm.WordBox.value = words[rnd]
}
//-->
</SCRIPT>

Hello,

I have this idea, but I wouldn't want to reinvent the wheel if it's already been done. I want to generate perspective grid on canvas depending on browser window size, something like this, but without textures: http://www.123rf.com/photo_2651286_a...rspective.html Do someone of you guys know if some similar script already exists? Or at least some tips on how not to end up writing a 1000 lines script (At this point I would just drop the idea)? All thoughts appreciated.

P.S. even an obscure algorithm would probably suffice, 'cause the main problem I'm struggling with is diminishing size perspective calculations

I'm new to programming,
Here's my problem:

I'm using a for loop to generate a list of hyperlinks

for(i = 100; i < 200; i++)
{

var str = "link";
document.write(str.link('http://someWebsite.com/' + i +'.html'));
document.write("<br />");
}


so the list that is generated looks like...

link
link
link
---------and so on until the loop is finished.

My question: is it possible for each links text to be dependent on the pages title?

for example instead of the the text "link", the program would follow the URL and know in the pages header was the title "Bob's website" or whatever the pages title was and would generate the list.

Example:

bobs website
daves website
rons website
susies website
betsys website
______________________________
Any help to differentiate the links text based on following the URL would be helpful Thank you!

Ok, just to be honest this is for my assignment from my University, I have completed the whole code myself I just can't seem to get just one little thing.



Code:

function GenerateTables(){
	var start = document.tables.start.value;
	var end = document.tables.end.value;
	var size = document.tables.size.value;
					
	for (start; start <= end; start++) {
	document.write("<table width='100' align='center'>")
	document.write("<caption><b>Table of </b>" + start + "</caption><br>")
	document.write("</table><br>")
						
	for (var i = 1; i <= size; i++) {
							
	document.write("<table border=1 align='center'>")
	document.write("<tr height=40 align='center'>")
	document.write("<td width=40 align='center'>" + start + "</td>")
	document.write("<td width=40 align='center'> * </td>")
	document.write("<td width=40 align='center'>" + i + "</td>")
	document.write("<td width=40 align='center'>  =  </td>")
	document.write("<td width=40 align='center'>" + start * i + "</td>")
	document.write("</tr>")
	document.write("</table>")
  }
 }
}

The function generates multiplication tables depending on the input user provides using this interface (given below).



And it generates them like this (given below).



Now what I want is to generate those tables sideways not downwards. Not all the tables, but it should complete one table downwards, then start the new table on its side.



I can't seem to figure out anything that would make that happen, and ideas would be appreciated, thanks.

Regards,
Papichoolo.

I want a certain amount of image spots to show a certain set of images (specifically 8) in a random order every time the page is refreshed. I do not want the images to be repeated, however. The solution I came up with was to create an array and generate a number one to eight and then compare that number to the numbers previously in the array, and if it matched one that was previously generated, to generate a new number and then compare it. This continues until i have an array of the numbers 1-8 in a random order.
Code:

	var imgs=new Array(8);
	for(i in imgs)
	{ 
		function generate()
		{
			return Math.floor(1+Math.random()*8);
		}

		var rand=generate();

		function compare(i)
		{
			for(var n=i-1; n>=0; n--)
			{ 
				if (n<0)
				{
					imgs[i]=rand;
				}
				
				else
				{
					if (rand==n)
					{
						rand=generate();
						compare(i);
					}
				}
			}
		}
	}

This does not strike me as the most efficient way to go about this. If someone has a better solution, that would help a great deal.

New to JS, and not too good at it.

Trying to take some prewritten code and add script that displays some random text. Having trouble with assignment.

Instructions are to replace a section of the file I am given with a script element. In the script element I am suppose to declare a variable named tipNum equal to a random integer between 1 and 10 returned by the randInt() function (which I made and have shown below). Then I am suppose to use a series of document.write() methods to write the following HTML code into the page:

Code:

<h1>Random Tip<br />title</h1>
<p>tip</p>

(Where "title" is the title of the random text as generated by the tipTitle() function from a external file, and which I did not make; and "tip" is the text of the random tip as genereated by the tipText() function, which is also from the external file, and not made by me)

My code for the randInt() function is
Code:

function randInt(lower, upper) {
	var size = ++(upper - lower);
	var randValue = Math.floor(lower + size*Math.random());
}

The script I made to display the HTML code is
Code:

<script type="text/javascript">
	var tipNum = randInt(1, 10);
	document.write("<h1>Random Tip<br />"+tipTitle(tipNum)+"</h1>");
	document.write("<p>tipText()</p>");
</script>

I am getting nothing on my page where the random text should be. Any help or advice would be great, thanks.

I am working on a work project that requires a 5*5 table, that will generate random letters in each cell upon button click. I have most of the coding complete with the exception of the letter generation. I am currently generating numbers, I would even be fine with having a RandBetween(and listing the 26 letters of the alphabet) at this point.

Any suggestions?

Code:

<script type="text/javascript">

var random1, random2, random3, random4, random5, random6, random7, random8, random9, random10, random11, random12, random13, random14, random15, random16, random17, random18, random19, random20, random21, random22, random23, random24, random25;

var randomArray = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];

//generate the random characters

function CreateCellData() {
for (var i=0; i<randomArray.length; i++) {
randomArray[i] = Math.floor(Math.random()*99 + 1); 
}
}

Hello,

I need help creating a function in javascript that produces random numbers generated from a normal curve distribution with a mean and standard deviation that I can specify (and easily change). I would like only whole numbers and the ability to set reasonable maximum and minimums.

Thanks,
Adrian

I CANNOT GET THIS! I created a for loop to generate a specified number of input type fields onto the page within my form. The for loop will not work! to my knowledge all the code within the for loop is correct... please help me out!

Here is all the code regarding this problem...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>History Countdown</title>
<style>
	
	div#mainChart {
		display: none;
	}
	
	fieldset#main {
		padding: 20px 0 20px 20px;
		text-align: left;
		width: auto;
		min-width: 400px;
	}

	fieldset#moreInfo {
		padding: 20px 0 20px 20px;
		text-align: left;
		width: auto;
		min-width: 200px;
		margin: 20px;
		display: none;
	}
	
	table {
		margin: 0;
		padding: 0;
	}
	
	td {
		padding-right: 25px;
	}
</style>


<script>
	
function enterData() {
	document.getElementById("moreInfo").style.display = "block";
	var start = document.getElementById("startNumber").value;
	var end = document.getElementById("endNumber").value;
	var thisNumber = Math.abs(start - end);
	var dataFields = thisNumber + 1;
	alert(dataFields);
	
	setTimeout(makeFields, 500);
	
	function makeFields() {
	

	for (var i=1;i<=dataFields;i+=1){
		
		var newNode = createElement("tr");
		var newTD = createElement("td");
		newTD.appendChild(document.createTextNode("Data for field " + i));
		
		newNode.appendChild(newTD);
		
		
		document.getElementById("dataTable").appendChild(newNode);
		
		var newTD2 = createElement("td");
		var newInput = createElement("input");
		newInput.id = "data" + i;
		var attr1 = document.createAttribute("type");
		attr1.nodeValue = "text";
		newInput.setAttribute(attr1);
		newTD2.appendChild(newInput);
		
		newNode.appendChild(newTD2);
		
		document.getElementById("dataTable").appendChild(newNode);
	}
}

}//end makeFields function
</script>



</head>
<body>
<div id="wrapper">

    <form name="dataForm" id="chartCreator">
    	<h1>Countdown Chart</h1><br />
		<fieldset id="main">
        <table>
        <legend>Chart Details</legend>
        <tr><td>Name of chart</td>
        <td><input name="countdownName" id="countDownName" type="text"></td>
		</tr>
        <tr><td>Start Countdown at...</td>
        <td><input name="BeginNumber" id="startNumber" type="text" value="1"></td>
        </tr>
        
        <tr><td>End Countdown at...</td>
        <td><input name="BeginNumber" id="endNumber" type="text" value="2011"></td>
        </tr>
                <tr><td><input type="button" value="Continue..." id="generateChart" onclick="enterData();" /></td>
                </tr>
        </table>
    	
        
                <fieldset id="moreInfo">
                <legend>Data</legend>
                <table id="dataTable">

                <tr><td><input type="button" value="Create Chart!" id="generateChart" onclick="build();" /></td>
                </tr>
                </table>
                </fieldset>
                </fieldset>
    </form>
</div>
</body>
</html>

I'm almost finished with this app for XUL / HTML Table Generation, and i have a really strange problem...

The HTML strings in the Arrays can be changed, and the HTML file saved, and the HTML page reloaded, and the changes will render.
However, i have one array, no matter what i change the HTML strings to, it refuses to render the changes made to the HTML strings.
It's quite confusing...

the array in question is

Code:

// Humidor InnerHTML
HumidorInnerHTML[0] = "<img src='NoImage.gif' style='height:100px; width:100px;'>";
HumidorInnerHTML[1] = "<input type='textbox' id='Others_Caption" + HumidorIndex + "'>";
HumidorInnerHTML[2] = "<input type='textbox' value='85' id='Others_Height" + HumidorIndex +"'>";
HumidorInnerHTML[3] = "<input type='textbox' value='85' id='Others_Width" + HumidorIndex +"'>";
HumidorInnerHTML[4] = "<img src='NoImage.gif' style='height:100px; width:100px;'>";
HumidorInnerHTML[5] = "<img src='NoImage.gif' style='height:100px; width:100px;'>";
HumidorInnerHTML[6] = "<img src='delete.png' onClick=DeleteRow('" + HumidorIndex + "','Humidor_Table');>";
HumidorInnerHTML[7] = "<img src='add.png' onClick=AddRow('" + HumidorIndex + "','Humidor_Table');>";

and the function that generates the HTML Table on the fly (and adds the cell data to them) is he

Code:

function AddRow(index, DIV)
{
MyTable = document.getElementById(DIV);
 
var newCell;
var newRow = MyTable.insertRow(index);

var Length;

switch (DIV)
{
case "Intro_Table" : Length = IntroInnerHTML.length;
break;
case "Image_Table" : Length = ImageInnerHTML.length;
break;
case "Watch_Table" : Length = WatchInnerHTML.length;
break;
case "Others_Table" : Length = OthersInnerHTML.length;
break;
case "Humidor_Table" : Length = HumidorInnerHTML.length;
break;
}

for (var i = 0; i < Length; i++) 
	{
     newCell = newRow.insertCell(i);
	 
	 switch (DIV)
	 {
	  case "Intro_Table": newCell.innerHTML = IntroInnerHTML[i];
	  break;
	  case "Image_Table": newCell.innerHTML = ImageInnerHTML[i];
	  break;
	  case "Watch_Table": newCell.innerHTML = WatchInnerHTML[i];
	  break;
	  case "Others_Table": newCell.innerHTML = OthersInnerHTML[i];
	  break;
	  case "Humidor_Table": newCell.innerHTML = WatchInnerHTML[i];
	  break;
	 }

    }

// Update the Index Counters
switch (DIV)
 {
 case "Intro_Table": IntroIndex++;
 break;
 case "Image_Table": ImageIndex++;
 break;
 case "Watch_Table": WatchIndex++;
 break;
 case "Others_Table": OthersIndex++;
 break;
 case "Humidor_Table": HumidorIndex++;
 break;
 }
}

when the page is loaded, the Init() function is started, that code is he

Code:

function Init()
{
 AddRow(1, "Intro_Table");
 AddRow(1, "Image_Table");
 AddRow(1, "Watch_Table");
 AddRow(1, "Humidor_Table");
 AddRow(1, "Others_Table");
}

Did i miss something? there must be something i've over looking. I have even tried isolating some other external JS, and CSS includes that i have, and isolating them has no change in the result.

the html file is live he

http://kevinjohnson.clanteam.com/XML...anageSite.html

thanks

Hello,

Is it possible to store the edited value in the div tag in the original file, such that next time i open the HTML file the new edited value appears.
Thanks in advance.

Have a Good day.

Hey, I'm trying to make a game, I learned how to do so by reading tutorials but the problem is that I do not know how to implement the save/load function into the game, the tutorial surrounding that area was very unclear to me, and here I am...
Any tips on how to make this work is greatly appreciated, I wouldn't asked if I hadn't tried my best and every way I could think of. I'm still quite new to coding so...

The first piece of code is the game, the second one is what I'm trying to make the game work with.
I tried for a while and got the game to reset back to values, but only the values I set in the code so it never actually worked.
The tutorial doesn't give any live examples and I really am... not that bright when it comes to coding

Sorry and thanks, all inputs are appreciated.

I read tutorial from links below,
Javascript String Compression | Almost Idle Tutorial for save code
Incremental Lesson 9 - For Loops | Almost Idle Tutorial for the game code

Code:

/*Pleae refer to Lesson 9.txt for a full description on this lesson*/

//The timer to run code every second
var Timer = window.setInterval(function(){Tick()}, 1000);
var buildings = [];

//The object declaration for game saves
function GameSave() {
	this.money = 0;
	this.buildings = [];
	for (var i = 0;i < buildings.length;i++) {
		this.buildings[i] = 0;
	}
}

//The object declaration for buildings
function Building() {
	this.Name = "Lemonade Stand";
	this.Cost = 10;
	this.PerSec = 1;
}

//The function to initialise all buildings
function InitBuildings() {
	LoadBuilding("Lemonade Stand",10,1);
}

//The function to automatically load a building into the buildings array
function LoadBuilding(name,cost,persec) {
	var cur = buildings.length;
	
	buildings[cur] = new Building();
	buildings[cur].Name = name;
	buildings[cur].Cost = cost;
	buildings[cur].PerSec = persec;
}

//The function used to gather money
function GatherMoney() {
	game.money++; //++ tells javascript to add 1 to the variable
	
	//Display the player's current money
	document.getElementById("money").innerHTML = game.money;
}

//The function that gets run every second
function Tick() {
	for (var i = 0;i < buildings.length;i++) {
		game.money += game.buildings[i] * buildings[i].PerSec;
	}
	document.getElementById("money").innerHTML = game.money;
}

//The function to buy a lemonade stand
function Build(id) {
	if (game.money >= buildings[id].Cost) { //Check if the player has enough money, then subtract it and add a new building if they do
		game.money -= buildings[id].Cost;
		game.buildings[id] = game.buildings[id] + 1;
		document.getElementById("money").innerHTML = game.money;
		document.getElementById("Building1Qty").innerHTML = game.buildings[id];
	}
}

//Run this code once the page has loaded fully
window.onload = function() {
	InitBuildings();
	window.game = new GameSave();
};

Code:

/*Pleae refer to Compression.txt for a full description on this lesson*/

function NewGame() {
	this.name = "Our Game";
	this.description = "Our Game's Description";
	this.numbers = [];
	for (var i=0;i<10;i++) {
		this.numbers[i] = i;
	}
}

var Game = new NewGame();

window.onload = function() {
	var SaveGame = JSON.stringify(Game);
	SaveGame = encode_utf8(SaveGame);
	SaveGame = lzw_encode(SaveGame);
	window.localStorage['SaveName'] = SaveGame;
	
	
	SaveGame = window.localStorage['SaveName'];
	SaveGame = lzw_decode(SaveGame);
	SaveGame = decode_utf8(SaveGame);
	window.GameTwo = JSON.parse(SaveGame);
	
	document.getElementById("name").innerHTML = "Name: " + GameTwo.name;
	document.getElementById("desc").innerHTML = "Description: " + GameTwo.description;
	var numbers = "";
	for (var i=0;i<10;i++) {
		if (numbers.length == 0) {numbers = i;} else {numbers += ", " + i;}
	}
	document.getElementById("numbers").innerHTML = "Numbers: " + numbers;
}

// LZW-compress a string
function lzw_encode(s) {
    var dict = {};
    var data = (s + "").split("");
    var out = [];
    var currChar;
    var phrase = data[0];
    var code = 256;
    for (var i=1; i<data.length; i++) {
        currChar=data[i];
        if (dict['_' + phrase + currChar] != null) {
            phrase += currChar;
        }
        else {
            out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
            dict['_' + phrase + currChar] = code;
            code++;
            phrase=currChar;
        }
    }
    out.push(phrase.length > 1 ? dict['_'+phrase] : phrase.charCodeAt(0));
    for (var i=0; i<out.length; i++) {
        out[i] = String.fromCharCode(out[i]);
    }
    return out.join("");
}

// Decompress an LZW-encoded string
function lzw_decode(s) {
    var dict = {};
    var data = (s + "").split("");
    var currChar = data[0];
    var oldPhrase = currChar;
    var out = [currChar];
    var code = 256;
    var phrase;
    for (var i=1; i<data.length; i++) {
        var currCode = data[i].charCodeAt(0);
        if (currCode < 256) {
            phrase = data[i];
        }
        else {
           phrase = dict['_'+currCode] ? dict['_'+currCode] : (oldPhrase + currChar);
        }
        out.push(phrase);
        currChar = phrase.charAt(0);
        dict['_'+code] = oldPhrase + currChar;
        code++;
        oldPhrase = phrase;
    }
    return out.join("");
}

function encode_utf8(s) {
  return unescape(encodeURIComponent(s));
}

function decode_utf8(s) {
  return decodeURIComponent(escape(s));
}

Reply With Quote




01-16-2015, 05:52 PM #2
Dormilich View Profile View Forum Posts

Senior Coder Join Date Jan 2010 Location Behind the Wall Posts 3,532 Thanks 13 Thanked 372 Times in 368 Posts


the problem is that I do not know how to implement the save/load function into the game


save it where? that particular question is important as JavaScript has only limited places where it can save something at all.

1) save it on the server => call a server script with the appropriate data (e.g. via AJAX)
2) cookies, very limited storage space, only works on the same browser
3) WebStorage, more space than cookies, but still only the same browser
4) IndexedDB (same as above)

I have a long survey form and once its submitted it gets recorded into a database. I would love to be able to save a PDF version of the HTML form with all their radio buttons and textfields filled out at the same time its submitted. It would need a unique name that matches their record in the database (maybe it pulls the data that was entered into one of the form fields for the name).

Whether it gets uploaded to an ftp or just emailed to a mailbox doesn't really matter. The purpose of this is to basically have a visual interpretation of the data by a single user.

Is something like this even possible?