#!/opt/lampp/bin/perl
use CGI;
use JSON;
use utf8;
#####	S	U	B	S	#########
sub speaker {
	my $text = shift;
	print  "Content-type: text/html\n\n";
	print $text;
}
######################################################

	

#Extracts contents from JSON file, no extra mods required
sub extract_json {
	my $file = shift;
	my $jobject = "";
	open ( FH, "< $file") || die "Can`t open file: $!\n";
	while ( <FH> ){
		$jobject .= $_;
	}
	close FH or die "Can`t close FH: $!\n";
	return $jobject;
}
####################################################
sub  record {
	
	my ($name, $mail, $pass, $file) = @_;
	
	if ( $name && $mail && $pass ) {
		my $fromj = extract_json($file);
		
		#all well to here
		my $json =  decode_json($fromj);
		print $json[0]->[0]{"name"};
	}

}
###################################################

my $jobj = extract_json("dat.json");

my $perl_data = decode_json($jobj);
my $jobject = encode_json($perl_data);
my @perl_data2 = decode_json($jobject);
my $len = @perl_data2;
print "Size of perl_data2 is $len \n";
$perl_data2[0]->[6] = {"name","boho", "age",31, "id",987654 };
$perl_data2[0]->[5]={"name","dodo", "age",31, "id", 987654 };
$perl_data2[0]->[4] ={"name","pupo", "age",31, "id", 987654 };
$perl_data2[1]->[0] ={"ver",2222, "beta" ,"yes", "id", 987654 };


$jobject = encode_json($perl_data2[0]);
open(FH, ">df.json");
print FH $jobject;
close(FH);
for ( $i=0; @perl_data2->[0][$i]; $i++ ) {
	print $perl_data2[0]->[$i]{"name"}, "\n";
}

##</code><code>##

window.onload = function() {
	// some code here
		dbg("Window loaded...");
		document.getElementById('send').onclick = sendForm;
		document.getElementById('show').onclick= setRefresher;
			//document.getElementById("jsonp").onload = showData;
	
		document.getElementById("delete").onclick = function() {
			var father = document.getElementById('text');
			if ( father.children ) {
				killKid(father);
			}
		};
	
};
// Debugger function /////////////////////////////////////////////////////////////////////////////////////////////////////////
	function dbg(text) {
		console.log(text[0].name);
	}
// make children and append them to father
	function makeKid(type, data, father) {
		var kido = document.createElement(type);
		kido.innerHTML = data;
		father.appendChild(kido);
	}
//flush all childrem
	function killKid(father) {
		//father.removeChild(father.children[0]);
		for ( var i=father.children.length-1; i >= 0; i-- ) {
				father.removeChild(father.children[i]);
		}
	}	
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/*
	var showData = function (data) {
		console.log("showData() called");
		var div = document.getElementById('text');
	
		if ( ! div.children[0] ) { 			
			for ( var i=0; i < data.length; i++ ) {
			console.log(i);
			makeKid("p", data[i].name, div);
			makeKid("p", data[i].id, div);
			makeKid("p", data[i].age, div);
			}	
		}
	}
	

	
*/		
/*000000000000000000000000000000000000000000000000000000000000000000*/

	function setRefresher() {
		
		
		dbg("setRefresher called");
		var rnd = "&rnd="+Math.floor(Math.random() * 12345);
		var dat = "&time="+new Date().getTime(); 
		var url = "http://localhost/dat.json?callback=dbg";
		var newScript = document.createElement('script');
		newScript.setAttribute('src', url);
		newScript.setAttribute('id', 'jsonp');
		var head = document.getElementsByTagName('head')[0];
		if ( !document.getElementById('jsonp') ) {
			head.appendChild(newScript);
			dbg("setRefresher 1st option");
		}
		else  {
			var oldOne = document.getElementById('jsonp');
			head.replaceChild(newScript, oldOne);
			dbg("setRefresher 2nd option");
		}
		
	}
/***************************************************************************************************************/
	function sendForm() {
		var name = document.getElementById('name').value;
		var mail = document.getElementById('mail').value;
		var pass = document.getElementById('pass').value;
		if ( name && mail && pass ) {
			var url = "http://localhost/serv.pl?name="+name+"&mail="+mail+"&pass="+pass+"&rnd="+Math.floor(Math.random()*12345)+"&dat="+new Date().getTime();
			var form = document.getElementById('form');
			form.method = "get";
			form.action = url;
			form.submit();
			
			//window.location.replace(url);
			}
			
		else {
			// none
			}
		
	}

##</code><code>##

[
 
 { "name": "gosho", "age": 33, "id": 627362 },  
{"name": "ilian", "age": 31, "id": 87637 }, 
{"name": "hr-isto", "age": 31, "id": 1234 },
{"name": "petzata", "age": 31, "id": 83843 }
 
  ]