<?php http_response_code(404); die(1); // It is a template file, not a code to execute directly. This line is used to avoid to execute or read it. ?>
<!DOCTYPE html>
<html lang="en">
<head>
<style>
.textarea {
background-color: #000;
border: 1px solid #000;
color: #ffffff;
font-family: monospace;
font-size:14px;
width: _WIDTH_;
height:_HEIGHT_;
overflow-y:scroll;
}
.divgeneral {display: inline-block}
.divgreen { color: #00ff00;}
.divbgreen { background-color: #00ff00;}
.divred { color: #ff0000;}
.divbred { background-color: #ff0000;}
.divblue { color: #0000ff;}
.divbblue { background-color: #0000ff;}
.divyellow { color: #ffff00;}
.divbyellow {background-color: #ffff00;}
.divmagenta {color: #ff00ff;}
.divbmagenta {background-color: #ff00ff;}
.divcyan {color: #00ffff;}
.divbcyan {background-color: #00ffff;}
.divwhite {color: #ffffff;}
.divbwhite {background-color: #ffffff;}
.divblack {color: #000000;}
.divbblack {background-color: #000000;}
.fieldInput {
background-color: #000;
border: 1px solid #000;
color: #ffffff;
font-family: monospace;
font-size:14px;
width: 100%;
}
</style>
</head>
<body>
HTMLPREFIX
<div id='textarea_PREFIX_' class="textarea">BODYINIT</div>
<input type='text' id='editField_PREFIX_' value="_DEFAULTPROMPT_" class="fieldInput" /><br>
<script>
const objcli_PREFIX_={
results:'',
prompt:'_DEFAULTPROMPT_',
defaultprompt:'_DEFAULTPROMPT_',
editField:document.getElementById('editField_PREFIX_'),
textAreaField:document.getElementById('textarea_PREFIX_'),
afterFetchWorker:AFTERFETCHWORKER,
afterFetchWorkerError:AFTERFETCHERROR,
init:function () {
this.textAreaField.readOnly=true;
let lastLine=this.editField.value.substring(this.prompt.length);
this.editField.value= this.prompt;
let bodyJson=JSON.stringify({line:lastLine
,width:Math.floor(this.textAreaField.offsetWidth/9),height:Math.floor(this.textAreaField.offsetHeight/16)});
fetch("CURRENTWEB?type=PREFIX_init&worker=cli",{'method':'post', body: bodyJson,headers:{SES:"SESSIONID"}})
.then((response) => {
if(response.ok) {
return response.json();
}
return Promise.reject(response);
})
.then((json) => {
this.prompt=(json.ui===null)?this.defaultprompt: json.ui;
this.editField.value=this.prompt;
if(json.type==='error') {
this.results += json.error + "<br>";
this.textAreaField.innerHTML +=json.error+"<br>";
} else {
this.results += json.result + "<br>";
this.textAreaField.innerHTML +=json.result+"<br>";
}
this.textAreaField.scrollTop = this.textAreaField.scrollHeight
this.textAreaField.readOnly=false;
})
.catch((response) => {
console.log(response);
response=this.afterFetchWorkerError('cli',response);
this.textAreaField.innerHTML +=response.statusText+"<br>";
this.textAreaField.scrollTop = this.textAreaField.scrollHeight
this.textAreaField.readOnly=false;
this.results += response.statusText+"\\n";
});
},
start:function () {
this.textAreaField.readOnly=true;
let lastLine=this.editField.value.substring(this.prompt.length);
this.editField.value= this.prompt;
let bodyJson=JSON.stringify({line:lastLine
,width:Math.floor(this.textAreaField.offsetWidth/9),height:Math.floor(this.textAreaField.offsetHeight/16)});
fetch("CURRENTWEB?type=PREFIX_load&worker=cli",{'method':'post', body: bodyJson,headers:{SES:"SESSIONID"}})
.then((response) => {
if(response.ok) {
return response.json();
}
return Promise.reject(response);
})
.then((json) => {
json=this.afterFetchWorker('cli',json);
this.prompt=(json.ui===null)?this.defaultprompt: json.ui;
this.editField.value=this.prompt;
switch (json.type) {
case 'error':
this.results += json.error + "<br>";
this.textAreaField.innerHTML +=json.error+"<br>";
break;
case 'full':
this.results = json.result + "<br>";
this.textAreaField.innerHTML =json.result+"<br>";
break;
default:
this.results += json.result + "<br>";
this.textAreaField.innerHTML +=json.result+"<br>";
}
this.textAreaField.scrollTop = this.textAreaField.scrollHeight
this.textAreaField.readOnly=false;
})
.catch((response) => {
console.log(response);
response=this.afterFetchWorkerError('cli',response);
this.textAreaField.innerHTML +=response.statusText+"<br>";
this.textAreaField.scrollTop = this.textAreaField.scrollHeight
this.textAreaField.readOnly=false;
this.results += response.statusText+"\\n";
});
}
}
function ready(fn) {
if (document.readyState !== 'loading') {
fn();
return;
}
document.addEventListener('DOMContentLoaded', fn);
}
ready(function() {
objcli_PREFIX_.init();
document.getElementById('editField_PREFIX_').onkeydown=function(v) {
var oldvalue=this.value;
var field=this;
setTimeout(function () {
if(field.value.indexOf(objcli_PREFIX_.prompt) !== 0) {
field.value=oldvalue;
}
}, 1);
if(v.key==='Enter') {
objcli_PREFIX_.start(v);
return false;
}
};
})
</script>
</body>
</html>
|