michel47/IRP-PromiseThen-example.html

## IRP-PromiseThen-example.html
<!DOCTYPE html>
<html>
    <head>
	<meta charset="utf-8">
	<script src=../lib/js/essential.js></script>
  <title>Dependancy Acycling Graph using IRP method</title>
    </head>
    <body>

<h2>Dependancy Acycling Graph using IRP method</h2>
<p> IRP: Implicit Reference *to* Parameters, is a method to solve the dependency problem
in software development, as it allow a "top-bottom evaluation at runtime of the whole
dependency DAG. This has to direct concequence do make the code much more robust,
indeed the dependency graph is build along with the data flow while it is executed.
<p>read more:
<ul>
<li>
<a href="https://www.lct.jussieu.fr/pagesperso/toulouse/presentations/presentation_champ_15.pdf">
IRP programming paradigmand its implementation in Fortranfor quantum Monte Carlo</a>
<li>
<a href="http://127.0.0.1:8390/ipfs/QmchTojXNn1McpJYQPM4evR6KovxbhTBEgBhaaWpepWBnm/irp.pdf">
Definition of IRP Programming</a>
<li><a href="http://irpf90.ups-tlse.fr/">IRPF90</a>
</ul>
)

	<h3>T = ( d1 + U ); U = ( d2 + V ); V = ( 3 * d3 + d1 ) </h3>
	d1 : <input type="number" name="d1" value="1"><br>
	d2 : <input type="number" name="d2" value="1"><br>
	d3 : <input type="number" name="d3" value="1"><br>
	<br>
	<button onclick="provideT('main')">Compute T</button>
	<br>
	T  : <span id="T"></span>

    </body>
</html>

<script>
 var el = {};
 const deps = {};
 const registry = {};

 function getD1(caller) {
     let callee = calleeName();
     console.info(callee+' called by',caller);

     el.d1 = document.getElementsByName("d1")[0];
     let d1 = parseInt(el.d1.value);
     console.log(callee+'.d1:',d1);
         el.d1.addEventListener('change',ev => { invalidate(caller); },false);

     return new Promise( res => {setTimeout(() => {res(d1)}, 300);})
 }
 function provideD1(caller) {
     let callee = calleeName(); dag_build(caller,callee);
     console.info(callee+' called by',caller);
     if (isValid('D1')) { return registry.D1.value; } else { registry.D1 = { valid: false }; }
     const d1 = getD1(callee);

     if (registry.D1.value != d1) { invalidate(caller); }
     registry.D1.value = d1;
     registry.D1.valid = true;
     return d1;
 }

 function getD2(caller) {
     let callee = calleeName();
     console.info(callee+' called by',caller);

     el.d2 = document.getElementsByName("d2")[0];
     let d2 = parseInt(el.d2.value);
     console.log(callee+'.d2:',d2);
         el.d2.addEventListener('change', ev => { invalidate(caller); } ,true);
     return new Promise( res => {setTimeout(() => {res(d2)}, 200);})
 }
 function provideD2(caller) {
     let callee = calleeName(); dag_build(caller,callee)
     console.info(callee+' called by',caller);
     if (isValid('D2')) { return registry.D2.value; } else { registry.D2 = { valid: false }; }
     const d2 = getD2(callee);

     if (registry.D2.value != d2) { invalidate(caller); }
     registry.D2.value = d2;
     registry.D2.valid = true;
     return d2;
 }


 function getD3(caller) {
     let callee = calleeName();
     console.info(callee+' called by',caller);

     el.d3 = document.getElementsByName("d3")[0];
     let d3 = parseInt(el.d3.value);
     console.log(callee+'.d3:',d3);
         el.d3.addEventListener('change', ev => { invalidate(caller); },false);

     return new Promise( res => {setTimeout(() => {res(d3)}, 100);})
 }
 function provideD3(caller) {
     let callee = calleeName(); dag_build(caller,callee);
     console.info(callee+' called by',caller);
     if (isValid('D3')) { return registry.D3.value; } else { registry.D3 = { valid: false }; }
     const d3 = getD3(callee);

     if (registry.D3.value != d3) { invalidate(caller); }
     registry.D3.value = d3;
     registry.D3.valid = true;
     return d3;
 }

 function provideU(caller) {
     let callee = calleeName(); dag_build(caller,callee);
     console.info(callee+' called by',caller);
     if (isValid('U')) { return registry.U.value; } else { registry.U = { valid: false }; }

     const d2 = provideD2(callee);
     const v = provideV(callee);

     const promised_u = Promise.all([d2,v]).
       then( proms => { let [d2,v] = proms;
         console.log(callee+'.d2:',d2);
         console.log(callee+'.v:',v);
         result = d2 + v;
         return result;
       })

     promised_u.then( u => {
       if (registry.U.value != u) { invalidate(caller); }
       console.log(callee+".result: d2+v = U =",u);
      registry['U'].value = u;
      registry['U'].valid = true;
     });

     return promised_u;
 }

 function provideV(caller) {
     let callee = calleeName(); dag_build(caller,callee);
     console.log(callee+' called by',caller);
     if (isValid('V')) { return registry.V.value; } else { registry.V = { valid: false }; }

     const d1 = provideD1(callee);
     const d3 = provideD3(callee);

     const promised_v = Promise.all([d1,d3]).then( proms => { let [d1,d3] = proms
       console.log(callee+'.d1:',d1);
       console.log(callee+'.d3:',d3);
       result = 3 * d3 + d1;
       console.log(callee+'.result 3* d3 + d1 = V =',result);
       if (registry.V.value != result) { invalidate(caller); }
       registry.V.value = result;
       registry.V.valid = true;
       return result;
     })

     return promised_v;
 }

 function provideT(caller) {
     let callee = calleeName();
     dag_build(caller,callee);
     console.info(callee+' called by',caller);
     if (isValid('T') && caller != 'main') { return registry.T.value; } else { registry.T = { valid: false }; }

     const d1 = provideD1(callee);

     const u = provideU(callee);
     const promised_t = Promise.all([d1,u]).
       then( proms => { let [d1,u] = proms;
         console.log(callee+'.d1:',d1);
         console.log(callee+'.u:',u);
         result = d1 + u;
         console.log(callee+'.result: d1+u = T =',result);
         document.getElementById("T").innerHTML = result;
         if (registry.T.value != result) { invalidate(caller); }
         registry.T.value = result;
         registry.T.valid = true;
         console.log("registry: ",registry);
         return result;
       })
    return promised_t;
 }


 function invalidate(parent,indent) {
  const key = parent.replace('provide','');
  if ('undefined' == typeof indent) { indent = 0 };
  spaces = '................................................'.substr(0,indent);
  if ('undefined' != typeof registry[key]) {
    registry[key].valid = false;
    console.debug(spaces+'invalidate.registry.%s: invalidated', key);
  } else {
    registry[key] = { valid: null };
  }
  if ('undefined' != typeof deps[parent]) {
     for (let node of deps[parent]) {
        console.debug(spaces+'invalidate.deps.node:', node);
        invalidate(node,indent+1);
     }
  }
  return void(0);
 }
 function isValid(key) {
    return ('undefined' != typeof(registry[key]) && registry[key].valid);
 }

 // build Deps Acyclic Graph ...
 function dag_build(caller,callee) {
   if ('undefined' == typeof deps[callee]) {
    deps[callee] = [];
   }
   deps[callee].push(caller);
   return deps;
 }

function calleeName() {
   var callee;
   let stack = new Error().stack;
   let stackArray= [];
   let navigator = navigatorName();
   //console.info('navigator:',navigator);
   switch (navigator){
      case "Chrome":
         stackArray = stack.split('at ');
         callee = stackArray[2].split(' ')[0];
         break;

      case "Firefox":
         stackArray = stack.split('\n');
         callee = stackArray[1].split('@')[0];
         console.debug('calleeName.callee',callee);
         break;

      default:
         console.error('calleeName.navigator',navigator);
         throw "unknown navigator "+navigator;
   } // switch
   return callee;
}
function navigatorName () {
   var result = "";
   let navNam = navigator.userAgent;
   if(navNam.match("Firefox")){
      result = "Firefox";
   }
   else if(navNam.match("Chrome")){
      result = "Chrome";
   }
   else {
      throw "Error in navigatorName.unknown navigator "+navNam;
   }
   return result;
}


</script>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<script src=../lib/js/essential.js></script>
	<title>Dependancy Acycling Graph using IRP method</title>
	</head>
	<body>

	<h2>Dependancy Acycling Graph using IRP method</h2>
	<p> IRP: Implicit Reference to Parameters, is a method to solve the dependency problem
	in software development, as it allow a "top-bottom evaluation at runtime of the whole
	dependency DAG. This has to direct concequence do make the code much more robust,
	indeed the dependency graph is build along with the data flow while it is executed.
	<p>read more:
	<ul>
	<li>
	<a href="https://www.lct.jussieu.fr/pagesperso/toulouse/presentations/presentation_champ_15.pdf">
	IRP programming paradigmand its implementation in Fortranfor quantum Monte Carlo</a>
	<li>
	<a href="http://127.0.0.1:8390/ipfs/QmchTojXNn1McpJYQPM4evR6KovxbhTBEgBhaaWpepWBnm/irp.pdf">
	Definition of IRP Programming</a>
	<li><a href="http://irpf90.ups-tlse.fr/">IRPF90</a>
	</ul>
	)

	<h3>T = ( d1 + U ); U = ( d2 + V ); V = ( 3 * d3 + d1 ) </h3>
	d1 : <input type="number" name="d1" value="1"><br>
	d2 : <input type="number" name="d2" value="1"><br>
	d3 : <input type="number" name="d3" value="1"><br>
	<br>
	<button onclick="provideT('main')">Compute T</button>
	<br>
	T : <span id="T"></span>

	</body>
	</html>

	<script>
	var el = {};
	const deps = {};
	const registry = {};

	function getD1(caller) {
	let callee = calleeName();
	console.info(callee+' called by',caller);

	el.d1 = document.getElementsByName("d1")[0];
	let d1 = parseInt(el.d1.value);
	console.log(callee+'.d1:',d1);
	el.d1.addEventListener('change',ev => { invalidate(caller); },false);

	return new Promise( res => {setTimeout(() => {res(d1)}, 300);})
	}
	function provideD1(caller) {
	let callee = calleeName(); dag_build(caller,callee);
	console.info(callee+' called by',caller);
	if (isValid('D1')) { return registry.D1.value; } else { registry.D1 = { valid: false }; }
	const d1 = getD1(callee);

	if (registry.D1.value != d1) { invalidate(caller); }
	registry.D1.value = d1;
	registry.D1.valid = true;
	return d1;
	}

	function getD2(caller) {
	let callee = calleeName();
	console.info(callee+' called by',caller);

	el.d2 = document.getElementsByName("d2")[0];
	let d2 = parseInt(el.d2.value);
	console.log(callee+'.d2:',d2);
	el.d2.addEventListener('change', ev => { invalidate(caller); } ,true);
	return new Promise( res => {setTimeout(() => {res(d2)}, 200);})
	}
	function provideD2(caller) {
	let callee = calleeName(); dag_build(caller,callee)
	console.info(callee+' called by',caller);
	if (isValid('D2')) { return registry.D2.value; } else { registry.D2 = { valid: false }; }
	const d2 = getD2(callee);

	if (registry.D2.value != d2) { invalidate(caller); }
	registry.D2.value = d2;
	registry.D2.valid = true;
	return d2;
	}


	function getD3(caller) {
	let callee = calleeName();
	console.info(callee+' called by',caller);

	el.d3 = document.getElementsByName("d3")[0];
	let d3 = parseInt(el.d3.value);
	console.log(callee+'.d3:',d3);
	el.d3.addEventListener('change', ev => { invalidate(caller); },false);

	return new Promise( res => {setTimeout(() => {res(d3)}, 100);})
	}
	function provideD3(caller) {
	let callee = calleeName(); dag_build(caller,callee);
	console.info(callee+' called by',caller);
	if (isValid('D3')) { return registry.D3.value; } else { registry.D3 = { valid: false }; }
	const d3 = getD3(callee);

	if (registry.D3.value != d3) { invalidate(caller); }
	registry.D3.value = d3;
	registry.D3.valid = true;
	return d3;
	}

	function provideU(caller) {
	let callee = calleeName(); dag_build(caller,callee);
	console.info(callee+' called by',caller);
	if (isValid('U')) { return registry.U.value; } else { registry.U = { valid: false }; }

	const d2 = provideD2(callee);
	const v = provideV(callee);

	const promised_u = Promise.all([d2,v]).
	then( proms => { let [d2,v] = proms;
	console.log(callee+'.d2:',d2);
	console.log(callee+'.v:',v);
	result = d2 + v;
	return result;
	})

	promised_u.then( u => {
	if (registry.U.value != u) { invalidate(caller); }
	console.log(callee+".result: d2+v = U =",u);
	registry['U'].value = u;
	registry['U'].valid = true;
	});

	return promised_u;
	}

	function provideV(caller) {
	let callee = calleeName(); dag_build(caller,callee);
	console.log(callee+' called by',caller);
	if (isValid('V')) { return registry.V.value; } else { registry.V = { valid: false }; }

	const d1 = provideD1(callee);
	const d3 = provideD3(callee);

	const promised_v = Promise.all([d1,d3]).then( proms => { let [d1,d3] = proms
	console.log(callee+'.d1:',d1);
	console.log(callee+'.d3:',d3);
	result = 3 * d3 + d1;
	console.log(callee+'.result 3* d3 + d1 = V =',result);
	if (registry.V.value != result) { invalidate(caller); }
	registry.V.value = result;
	registry.V.valid = true;
	return result;
	})

	return promised_v;
	}

	function provideT(caller) {
	let callee = calleeName();
	dag_build(caller,callee);
	console.info(callee+' called by',caller);
	if (isValid('T') && caller != 'main') { return registry.T.value; } else { registry.T = { valid: false }; }

	const d1 = provideD1(callee);

	const u = provideU(callee);
	const promised_t = Promise.all([d1,u]).
	then( proms => { let [d1,u] = proms;
	console.log(callee+'.d1:',d1);
	console.log(callee+'.u:',u);
	result = d1 + u;
	console.log(callee+'.result: d1+u = T =',result);
	document.getElementById("T").innerHTML = result;
	if (registry.T.value != result) { invalidate(caller); }
	registry.T.value = result;
	registry.T.valid = true;
	console.log("registry: ",registry);
	return result;
	})
	return promised_t;
	}



	function invalidate(parent,indent) {
	const key = parent.replace('provide','');
	if ('undefined' == typeof indent) { indent = 0 };
	spaces = '................................................'.substr(0,indent);
	if ('undefined' != typeof registry[key]) {
	registry[key].valid = false;
	console.debug(spaces+'invalidate.registry.%s: invalidated', key);
	} else {
	registry[key] = { valid: null };
	}
	if ('undefined' != typeof deps[parent]) {
	for (let node of deps[parent]) {
	console.debug(spaces+'invalidate.deps.node:', node);
	invalidate(node,indent+1);
	}
	}
	return void(0);
	}
	function isValid(key) {
	return ('undefined' != typeof(registry[key]) && registry[key].valid);
	}

	// build Deps Acyclic Graph ...
	function dag_build(caller,callee) {
	if ('undefined' == typeof deps[callee]) {
	deps[callee] = [];
	}
	deps[callee].push(caller);
	return deps;
	}

	function calleeName() {
	var callee;
	let stack = new Error().stack;
	let stackArray= [];
	let navigator = navigatorName();
	//console.info('navigator:',navigator);
	switch (navigator){
	case "Chrome":
	stackArray = stack.split('at ');
	callee = stackArray[2].split(' ')[0];
	break;

	case "Firefox":
	stackArray = stack.split('\n');
	callee = stackArray[1].split('@')[0];
	console.debug('calleeName.callee',callee);
	break;

	default:
	console.error('calleeName.navigator',navigator);
	throw "unknown navigator "+navigator;
	} // switch
	return callee;
	}
	function navigatorName () {
	var result = "";
	let navNam = navigator.userAgent;
	if(navNam.match("Firefox")){
	result = "Firefox";
	}
	else if(navNam.match("Chrome")){
	result = "Chrome";
	}
	else {
	throw "Error in navigatorName.unknown navigator "+navNam;
	}
	return result;
	}



	</script>