JSFiddle - React, Tailwind, and code Playground

by Erik East

HTML

<h2>Module 03</h2>
<h3>Assignment 1</h3>
<p>Add a link: <input style="width: 100px;" type="text" id="linkname" onkeypress="captureEnter(event);"/></p>
<p id="demo"></p>

JavaScript

function Link(_id, _value, _next) {
	this.id = _id; //id of current link
	this.value = _value; //value of current link
	this.next = _next; //pointer to next link
}//function Link

Link.prototype.outPut = function() {
	return "" + this.id + ": " + this.value + " &#8680; " + this.next + "<br>";
};//prototype.outPut

function Chain(_firstValue) {
	this.length = 1;
	this.head = new Link(1, _firstValue, null);
	this.linkStorage = [];
	this.linkStorage.push(this.head);
}//function Chain

Chain.prototype.lastLink = function() {
	return this.linkStorage[this.length - 1];
};//prototype.lastLink

Chain.prototype.Finder = function(searchFor) {
	for(var i = 0; i < this.length; i++){
		if(searchFor == this.linkStorage[i].id){
			return this.linkStorage[i];
		}//if match
	}//for loop
};//prototype.Finder

Chain.prototype.Push = function (_linkValue) {
	this.length++;
	var addLink = new Link(this.length, _linkValue, null);
	this.linkStorage.push(addLink);
	this.linkStorage[this.length - 2].next = this.length;
	return addLink;
};//prototype.Push

Chain.prototype.Pop = function (_linkValue) {
	var hold = this.head;
	var thenext = this.Finder(this.head.next);
	this.head = thenext;
	return hold;
};//prototype.Pop

Chain.prototype.theOutput = function () {
	var printer = "";
	for(var i = 0; i < this.length; i++){
		var link = this.linkStorage[i];
		printer += link.outPut();
	}//for loop
	return printer;
};//prototype.theOutput

var chain = new Chain("First Node");
chain.Push("Second Node");
chain.Push("Third Node");
document.getElementById("demo").innerHTML = chain.theOutput();

function newNode() {
	chain.Push(document.getElementById("linkname").value);
	document.getElementById("demo").innerHTML = chain.theOutput();
	document.getElementById("linkname").value = "";
}//newNode

function captureEnter(e){
	if(e.keyCode === 13){
		newNode();
	}//if keyCode === enter(13)
	return false;
}//captureEnter