ok
This commit is contained in:
GZod01
commit
d938db0cdd
14 changed files with 835 additions and 0 deletions
207
api/css/style.css
Normal file
207
api/css/style.css
Normal file
|
|
@ -0,0 +1,207 @@
|
|||
:root{
|
||||
/*the color that will be switch */
|
||||
--main-bg-color: white;
|
||||
--main-txt-color: black;
|
||||
--scdr-bg-color: lightgray;
|
||||
--scdr-txt-color: var(--main-txt-color);
|
||||
}
|
||||
@media (prefers-color-scheme:dark){
|
||||
body::after{
|
||||
content: 'dark';
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (prefers-color-scheme:light){
|
||||
body::after{
|
||||
content: 'light';
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 890px) {
|
||||
header.nav a:not(:first-child) {display: none;}
|
||||
header.nav a.icon {
|
||||
float: right;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 890px) {
|
||||
header.nav.responsive {position: relative;}
|
||||
header.nav.responsive a.icon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
header.nav.responsive a {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
body {
|
||||
min-height: 100vh;
|
||||
margin: 0;
|
||||
word-break: break-word;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: var(--main-bg-color);
|
||||
color: var(--main-txt-color);
|
||||
}
|
||||
.content{
|
||||
position:relative;
|
||||
min-height:80vh;
|
||||
width:100%
|
||||
}
|
||||
.parent{
|
||||
position:relative;
|
||||
}
|
||||
.fullcentered{
|
||||
text-align:center;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.reallycentered{
|
||||
text-align:center;
|
||||
margin:0;
|
||||
position:fixed;
|
||||
top:50%;
|
||||
left:50%;
|
||||
-ms-transform:translate(-50%,-50%);
|
||||
transform:translate(-50%,-50%);
|
||||
}
|
||||
header.nav{
|
||||
margin:0;
|
||||
background-color: var(--scdr-bg-color);
|
||||
color: var(--scdr-txt-color);
|
||||
padding-bottom: 2px;
|
||||
overflow:hidden;
|
||||
}
|
||||
footer a{
|
||||
color: var(--scdr-txt-color);
|
||||
text-decoration:none;
|
||||
}
|
||||
header.nav a{
|
||||
color: var(--scdr-txt-color);
|
||||
text-decoration: none;
|
||||
float:left;
|
||||
display:block;
|
||||
text-align:center;
|
||||
padding:14px 16px;
|
||||
font-size: 17px
|
||||
}
|
||||
header.nav a:hover{
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
header.nav a.active{
|
||||
background-color: var(--main-bg-color);
|
||||
color: var(--scdr-txt-color)
|
||||
}
|
||||
header.nav .icon{
|
||||
display:none
|
||||
}
|
||||
a{
|
||||
color:var(--main-txt-color);
|
||||
}
|
||||
a:hover{
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
footer{
|
||||
margin-top: auto;
|
||||
border-top:solid var(--scdr-txt-color);
|
||||
/*display: flex ;*/
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
background-color:var(--scdr-bg-color) ;
|
||||
color: var(--scdr-txt-color);
|
||||
}
|
||||
.footerleft{
|
||||
border-right: solid var(--scdr-txt-color);
|
||||
height: 100%;
|
||||
left:0;
|
||||
width:50%;
|
||||
}
|
||||
.footerright{
|
||||
border-left: solid var(--scdr-txt-color);
|
||||
height: 100%;
|
||||
right:0;
|
||||
width:50%
|
||||
}
|
||||
.themebutton{
|
||||
right:0;
|
||||
top:50%;
|
||||
position: fixed;
|
||||
cursor: pointer;
|
||||
text-align:center;
|
||||
border-radius:100%;
|
||||
z-index:3;
|
||||
background-color: var(--scdr-bg-color);
|
||||
color: var(--scdr-txt-color);
|
||||
}
|
||||
.themebutton:hover{
|
||||
background-color: var(--scdr-txt-color);
|
||||
color:var(--scdr-bg-color);
|
||||
}
|
||||
button{
|
||||
border:solid var(--scdr-txt-color);
|
||||
background-color: var(--scdr-bg-color);
|
||||
color: var(--scdr-txt-color);
|
||||
}
|
||||
button:hover{
|
||||
background-color:var(--scdr-txt-color);
|
||||
color:var(--scdr-bg-color);
|
||||
}
|
||||
select{
|
||||
border:solid var(--scdr-txt-color);
|
||||
background-color: var(--scdr-bg-color);
|
||||
color: var(--scdr-txt-color);
|
||||
}
|
||||
select:hover{
|
||||
background-color:var(--scdr-txt-color);
|
||||
color:var(--scdr-bg-color);
|
||||
}
|
||||
form {
|
||||
border: solid var(--scdr-txt-color);
|
||||
background-color: var(--scdr-bg-color);
|
||||
color: var(--scdr-txt-color)
|
||||
}
|
||||
fieldset{
|
||||
border:solid var(--main-txt-color);
|
||||
background-color: var(--main-bg-color);
|
||||
color: var(--main-txt-color);
|
||||
}
|
||||
#switchmodeicon{
|
||||
font-size:200%;
|
||||
}
|
||||
/*** Works on common browsers ***/
|
||||
::selection {
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
|
||||
/*** Mozilla based browsers ***/
|
||||
::-moz-selection {
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
|
||||
/***For Other Browsers ***/
|
||||
::-o-selection {
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
|
||||
::-ms-selection {
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
|
||||
/*** For Webkit ***/
|
||||
::-webkit-selection {
|
||||
background-color:var(--main-txt-color);
|
||||
color:var(--main-bg-color);
|
||||
}
|
||||
1
api/index.html
Normal file
1
api/index.html
Normal file
|
|
@ -0,0 +1 @@
|
|||
api.gzod01.fr= scripts, css, parts of pages (like footers, headers, etc.) etc.
|
||||
14
api/parts/footer.html
Normal file
14
api/parts/footer.html
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
<footer>
|
||||
<div class=footerleft>
|
||||
<a href="/">Accueil</a><br>
|
||||
<a href="/games.html">Jeux</a><br>
|
||||
<a href="/services.html">Services</a><br>
|
||||
<a href="/projects.html">Projets</a><br>
|
||||
</div>
|
||||
<div class=footerright>
|
||||
<a href="/contact.html">Me contacter</a><br>
|
||||
<a href="/sitemap.html">Plan Du Site</a><br>
|
||||
<a href="/about.html">A Propos</a><br>
|
||||
<a href="/legal.html">Mentions Légales</a><br>
|
||||
</div>
|
||||
</footer>
|
||||
13
api/parts/header.html
Normal file
13
api/parts/header.html
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<header>
|
||||
<div class="nav">
|
||||
<a href="/">Accueil</a>
|
||||
<a href="/games.html">Jeux</a>
|
||||
<a href="/services.html">Services</a>
|
||||
<a href="/projects.html">Projets</a>
|
||||
<a href="/contact.html">Me contacter</a>
|
||||
<a href="/sitemap.html">Plan Du Site</a>
|
||||
<a href="/about.html">A Propos</a>
|
||||
<a href="/legal.html">Mentions Légales</a>
|
||||
</div>
|
||||
<span class=themebutton onclick=switchtheme()>Switch the theme</span>
|
||||
</header>
|
||||
BIN
api/pictures/gzod01.ico
Normal file
BIN
api/pictures/gzod01.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
api/pictures/gzod01.png
Normal file
BIN
api/pictures/gzod01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 419 KiB |
BIN
api/pictures/pdpdevmatrix.jpg
Normal file
BIN
api/pictures/pdpdevmatrix.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 519 KiB |
BIN
api/pictures/pdpdevmatrix.png
Normal file
BIN
api/pictures/pdpdevmatrix.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 419 KiB |
86
api/scripts/consoleterm.min.js
vendored
Normal file
86
api/scripts/consoleterm.min.js
vendored
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
export {*}
|
||||
function showdevconsole(){
|
||||
if(document.getElementById('console')=null){document.body.innerHTML += '<div id="console" style="height=100vh; width=100%;"></div>
|
||||
console.log= function(tolog){termshow('&infg&span color="grey"&supd&LOG: '+tolog+'&infg&/span&supd&')}
|
||||
console.error= function(tolog){termshow('&infg&span color="red"&supd&ERROR: '+tolog+'&infg&/span&supd&')}
|
||||
console.warn= function(tolog){termshow('&infg&span color="orange"&supd&WARN: '+tolog+'&infg&/span&supd&')}
|
||||
function consoleloop(){
|
||||
let x= terminput('')
|
||||
termshow('executing : '+x+' ...')
|
||||
try{
|
||||
let nfunc = new Function(x)
|
||||
termshow(nfunc())
|
||||
}catch(e){
|
||||
termshow('error: '+e)
|
||||
}
|
||||
}
|
||||
document.getElementById('console').innerHTML = `
|
||||
<style>
|
||||
#console{
|
||||
--bg-color: black;
|
||||
--txt-color: white;
|
||||
}
|
||||
#console{
|
||||
background-color:var(--bg-color);
|
||||
color: var(--txt-color);
|
||||
margin:0;
|
||||
height:100%;
|
||||
min-height:100vh;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
z-index:2
|
||||
}
|
||||
#console .second {
|
||||
flex-grow: 1;
|
||||
}
|
||||
#console #termcontent{
|
||||
display: fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
height:95%;
|
||||
width:100%;
|
||||
overflow: auto
|
||||
}
|
||||
#console #divinput{
|
||||
display:flex;
|
||||
left:0;
|
||||
bottom:0;
|
||||
height:5%;
|
||||
width:100%
|
||||
}
|
||||
#console #terminpt{
|
||||
border: 0px solid !important;
|
||||
background-color: var(--bg-color);
|
||||
color:var(--txt-color);
|
||||
width:95%
|
||||
}
|
||||
/*#terminptdiv{
|
||||
float: none
|
||||
}*/
|
||||
#console *:focus {
|
||||
outline: none;
|
||||
}
|
||||
/*#divofinfos{
|
||||
float:left
|
||||
}*/
|
||||
#console #matrixcanvas{
|
||||
width:100%;
|
||||
height:100%;
|
||||
position:fixed;
|
||||
z-index:-1
|
||||
}
|
||||
</style>
|
||||
<!--username and ip: green, $ or %: white, commands: white-->
|
||||
<div id="termcontent">
|
||||
</div>
|
||||
<div id="divinput">
|
||||
<span id=spanofinfos><span id="inptindic"></span><span id="inptname"></span></span><span class=second><input id=terminpt type="text"/></span>
|
||||
</div>
|
||||
<canvas id=matrixcanvas style='width:100%; height: 100%'>
|
||||
</canvas>
|
||||
<script src="//api.gzod01.fr/scripts/termapi.js"></script>
|
||||
<script src="console.js"></script>
|
||||
`
|
||||
}
|
||||
37
api/scripts/gameStorage.js
Normal file
37
api/scripts/gameStorage.js
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
Object.prototype.itemSetJSON= function (name, value){
|
||||
this[name]=value
|
||||
}
|
||||
Object.prototype.itemGetJSON = function(name){
|
||||
return this[name]
|
||||
}
|
||||
function getGameStorage(){
|
||||
return JSON.parse(localStorage['games'])
|
||||
}
|
||||
function getGameStorageByName(name){
|
||||
return JSON.parse(localStorage['games'])[name]
|
||||
}
|
||||
function setGameStorage(gamedatas){
|
||||
localStorage['games'] = JSON.stringify(gamedatas)
|
||||
}
|
||||
function setGameStorageByName(name, namedatas){
|
||||
let cgamestorage = JSON.parse(localStorage['games'])
|
||||
cgamestorage[name]=namedatas
|
||||
localStorage['games'] = JSON.stringify(cgamestorage)
|
||||
}
|
||||
function getUSCPMStorage(){
|
||||
initstorage('uscpm')
|
||||
return JSON.parse(localStorage['games'])['uscpm']
|
||||
}
|
||||
function setUSCPMStorage(data){
|
||||
setGameStorageByName('uscpm', data)
|
||||
}
|
||||
function initstorage(name=null){
|
||||
if(localStorage['games']==undefined){
|
||||
setGameStorage({})
|
||||
}
|
||||
if(name !=null){
|
||||
if(getGameStorageByName(name)==undefined){
|
||||
setGameStorageByName(name, {})
|
||||
}
|
||||
}
|
||||
}
|
||||
195
api/scripts/main.js
Normal file
195
api/scripts/main.js
Normal file
|
|
@ -0,0 +1,195 @@
|
|||
var getfooter = `
|
||||
<div style="height:95% width:100%; display:flex; border-bottom: solid var(--scdr-txt-color)">
|
||||
<div class=footerleft>
|
||||
<a href="/">Accueil</a><br>
|
||||
<a href="/games">Jeux</a><br>
|
||||
<a href="/services">Services</a><br>
|
||||
<a href="/projects">Projets</a><br>
|
||||
</div>
|
||||
<div class=footerright>
|
||||
<a href="/contact">Me contacter</a><br>
|
||||
<a href="/sitemap">Plan Du Site</a><br>
|
||||
<a href="/about">A Propos</a><br>
|
||||
<a href="/legal">Mentions Légales</a><br>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height:5%; width:100%;">
|
||||
<p>Copyright © 2023-<current-time type="year"></current-time>
|
||||
| GZod01</p>
|
||||
<script>echo('<a onclick=\'showdevconsole()\' href="javascript:void(0)">Console</a>')</script>
|
||||
</div>
|
||||
<span title="Changer Le Theme" class="themebutton" onclick=switchtheme()><i class="fa fa-star-half-o" aria-hidden="true" id="switchmodeicon"></i></span>
|
||||
`
|
||||
var getheader = `
|
||||
<a href="/">Accueil</a>
|
||||
<a href="/games">Jeux</a>
|
||||
<a href="/services">Services</a>
|
||||
<a href="/projects">Projets</a>
|
||||
<a href="/contact">Me contacter</a>
|
||||
<a href="/sitemap">Plan Du Site</a>
|
||||
<a href="/about">A Propos</a>
|
||||
<a href="/legal">Mentions Légales</a>
|
||||
<a href="javascript:void(0);" class="icon" onclick="barresponsivefunction()">
|
||||
<i class="fa fa-bars"></i>
|
||||
</a>
|
||||
`
|
||||
|
||||
|
||||
function barresponsivefunction(){
|
||||
var x = document.getElementById("headernavbar");
|
||||
if (x.className === "nav") {
|
||||
x.className += " responsive";
|
||||
} else {
|
||||
x.className = "nav";
|
||||
}
|
||||
}
|
||||
function getpartials(){
|
||||
// Bug with the fetch to api.gzod01.fr/parts/... TODO
|
||||
// let default_header = document.createElement('header')
|
||||
// let getheader = fetch('//api.gzod01.fr/parts/header.html').then(function (response) {
|
||||
// // The API call was successful!
|
||||
// return response.text();
|
||||
// }).then(function (html) {
|
||||
// let parser = new DOMParser();
|
||||
// let doc = parser.parseFromString(html, 'text/html');
|
||||
// return doc
|
||||
// }).catch(function (err) {
|
||||
// console.warn('Something went wrong.', err);
|
||||
// });
|
||||
// default_header.appendChild(getheader)
|
||||
// let default_footer = document.createElement('footer')
|
||||
// let getfooter = fetch('//api.gzod01.fr/parts/footer.html').then(function (response) {
|
||||
// // The API call was successful!
|
||||
// return response.text();
|
||||
// }).then(function (html) {
|
||||
// let parser = new DOMParser();
|
||||
// let doc = parser.parseFromString(html, 'text/html');
|
||||
// return doc
|
||||
// }).catch(function (err) {
|
||||
// console.warn('Something went wrong.', err);
|
||||
// });
|
||||
// default_footer.appendChild(getfooter)
|
||||
let default_header = document.createElement('header')
|
||||
let default_footer = document.createElement('footer')
|
||||
default_header.innerHTML = getheader
|
||||
default_header.className = 'nav'
|
||||
default_header.id = 'headernavbar'
|
||||
default_footer.innerHTML = getfooter
|
||||
document.getElementById('header').replaceWith(default_header)
|
||||
document.getElementById('footer').replaceWith(default_footer)
|
||||
}
|
||||
function mainscript(){
|
||||
getpartials()
|
||||
gettheme()
|
||||
cookiepopup()
|
||||
checkProtocol()
|
||||
document.head.innerHTML = document.head.innerHTML + '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">'
|
||||
}
|
||||
window.onload = ()=>{mainscript()}
|
||||
function gettheme(){
|
||||
if(localStorage.getItem('colorscheme')==='dark'){
|
||||
var colorScheme = 'dark'
|
||||
}
|
||||
else if(localStorage.getItem('colorscheme')==='light'){
|
||||
var colorScheme = 'light'
|
||||
}
|
||||
else if(localStorage.getItem('colorscheme')==='matrix'){
|
||||
var colorScheme = 'matrix'
|
||||
}
|
||||
else{
|
||||
var colorScheme = getComputedStyle(document.body,':after').content
|
||||
if(colorScheme==='"dark"'){colorScheme='dark'}
|
||||
else if(colorScheme==='"light"'){colorScheme='light'}
|
||||
else{colorScheme='light'}
|
||||
}
|
||||
let r = document.querySelector(':root')
|
||||
if(colorScheme==='dark'){
|
||||
r.style.setProperty('--main-bg-color','midnightblue')
|
||||
r.style.setProperty('--main-txt-color','white')
|
||||
r.style.setProperty('--scdr-bg-color','darkslateblue')
|
||||
}
|
||||
else if(colorScheme==='light'){
|
||||
r.style.setProperty('--main-bg-color','white')
|
||||
r.style.setProperty('--main-txt-color','black')
|
||||
r.style.setProperty('--scdr-bg-color','lightgray ')
|
||||
}
|
||||
else if(colorScheme==='matrix'){
|
||||
r.style.setProperty('--main-bg-color','#000')
|
||||
r.style.setProperty('--main-txt-color','lime')
|
||||
r.style.setProperty('--scdr-bg-color','#111')
|
||||
}
|
||||
|
||||
}
|
||||
function switchtheme(){
|
||||
let r = document.querySelector(':root')
|
||||
if('white'===r.style.getPropertyValue('--main-txt-color')){
|
||||
localStorage.setItem('colorscheme','light')
|
||||
gettheme()
|
||||
}
|
||||
else if('black'===r.style.getPropertyValue('--main-txt-color')){
|
||||
localStorage.setItem('colorscheme','dark')
|
||||
gettheme()
|
||||
}
|
||||
else{
|
||||
localStorage.setItem('colorscheme','light')
|
||||
gettheme()
|
||||
}
|
||||
}
|
||||
|
||||
function cookiepopup(){
|
||||
if(localStorage.getItem('cookieaccepted')==null){
|
||||
let cookieparentdiv = document.createElement('div')
|
||||
cookieparentdiv.style.backgroundColor= 'rgba(0,0,0,0.5)'
|
||||
cookieparentdiv.style.setProperty('backdrop-filter','blur(5px)')
|
||||
cookieparentdiv.style.width = '100%'
|
||||
cookieparentdiv.style.height= '100%'
|
||||
cookieparentdiv.style.position='fixed'
|
||||
cookieparentdiv.id='cookiepopup'
|
||||
let cookiediv = document.createElement('div')
|
||||
cookiediv.className= 'reallycentered'
|
||||
cookiediv.id = 'cookiepopup'
|
||||
cookiediv.style.backgroundColor = 'var(--scdr-bg-color)'
|
||||
cookiediv.style.border = 'solid 2px var(--scdr-txt-color)'
|
||||
cookiediv.innerHTML= '<p>Ce site utilise des "Cookies" (principalement le localStorage) pour fonctionner (theme de couleurs, données des jeux, etc.).</p><p>Afin que ce site fonctionne vous devez donc accepter les cookies, si vous avez une question sur l\'utilisation des cookies vous pouvez consulter les <a href="/legal">Mentions Légales</a>(contenant aussi la politique de confidentialité).</p><br><button style="background-color:green" onclick="localStorage.setItem(\'cookieaccepted\',\'true\'); document.getElementById(\'cookiepopup\').remove()">Accepter</button>'
|
||||
cookieparentdiv.appendChild(cookiediv)
|
||||
document.body.appendChild(cookieparentdiv)
|
||||
console.log('do')
|
||||
}
|
||||
}
|
||||
class CurrentTime extends HTMLElement {
|
||||
connectedCallback() {
|
||||
let date = new Date()
|
||||
let type = this.getAttribute('type').toLowerCase()
|
||||
if(type==='year'){
|
||||
this.innerHTML=date.getFullYear()
|
||||
} else if(type==='fulldate'){
|
||||
this.innerHTML=date.getDay()+'/'+date.getMonth()+'/'+date.getFullYear()
|
||||
}
|
||||
else if(type==='full'){this.innerHTML=date.getHours()+':'+date.getMinutes()+':'+date.getSeconds()+' '+date.getDay()+'/'+date.getMonth()+'/'+date.getFullYear()}
|
||||
else{this.innerHTML = 'YOU HAVE TO SET THE TYPE ATTRIBUTE TO ONE OF THESE VALUE: YEAR : IT WILL DISPLAY THE CURRENT YEAR ; FULLDATE : IT WILL DISPLAY THE CURRENT DATE (day/month/year) ; FULL : IT WILL DISPLAY tHE FULL CURRENT DATE AND HOUR (hour:minute:seconds day/month/year) ; THERE WILL BE OTHER TYPE IN THE FUTURE'}
|
||||
}
|
||||
}
|
||||
customElements.define("current-time", CurrentTime);
|
||||
function text(url) {
|
||||
return fetch(url).then(res => res.text());
|
||||
}
|
||||
function checkProtocol(){
|
||||
if(localStorage['dangerous']==='OK'){
|
||||
}
|
||||
else if(location.protocol==='http:'){
|
||||
let a = document.querySelector('.content').innerHTML
|
||||
document.querySelector('.content').innerHTML = '<div class=fullcentered>Bonjour, Une nouvelle version plus sécurisée du site est disponible (version https).<br><button onclick="location.protocol=\'https:\'">Se rendre sur la version HTTPS</button> OU <button onclick="localStorage[\'dangerous\']=\'OK\'; window.location.reload()">Je Comprend Les Risques mais Je préfère rester</button>'
|
||||
}
|
||||
}
|
||||
|
||||
// BETA OF FETCH DON'T VERY WORK:
|
||||
//await toawaithtml(url) return the html in the url
|
||||
//so:
|
||||
async function fetchhtml(url){
|
||||
let result = await text(url)
|
||||
let parser = new DOMParser()
|
||||
let finalresult= await parser.parseFromString(result, 'text/html')
|
||||
return finalresult
|
||||
}
|
||||
html =(url,result)=> fetchhtml(url).then(res=>result = res)
|
||||
|
||||
56
api/scripts/old.main.js
Normal file
56
api/scripts/old.main.js
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
let inactivityTime = function() {
|
||||
let time;
|
||||
window.onload = resetTimer;
|
||||
document.onmousemove = resetTimer;
|
||||
document.onkeypress = resetTimer;
|
||||
function resetTimer() {
|
||||
clearTimeout(time);
|
||||
time = setTimeout(matrix, 2000)
|
||||
}
|
||||
};
|
||||
window.onload = function() {
|
||||
inactivityTime();
|
||||
}
|
||||
|
||||
|
||||
function matrix(){
|
||||
let canvasnodecreation = document.createElement('canvas')
|
||||
document.body.innerHTML=''
|
||||
document.body.appendChild(canvasnodecreation)
|
||||
var canvas = document.querySelector('canvas'),
|
||||
ctx = canvas.getContext('2d');
|
||||
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
|
||||
var letters = '010101010101010101010101010101010101010101010101010101010101010101010101010101010101010101010101010101';
|
||||
letters = letters.split('');
|
||||
|
||||
|
||||
var fontSize = 10,
|
||||
columns = canvas.width / fontSize;
|
||||
|
||||
|
||||
var drops = [];
|
||||
for (var i = 0; i < columns; i++) {
|
||||
drops[i] = 1;
|
||||
}
|
||||
|
||||
|
||||
function draw() {
|
||||
ctx.fillStyle = 'rgba(0, 0, 0, .1)';
|
||||
ctx.fillRect(0, 0, canvas.width, canvas.height);
|
||||
for (var i = 0; i < drops.length; i++) {
|
||||
var text = letters[Math.floor(Math.random() * letters.length)];
|
||||
ctx.fillStyle = '#0f0';
|
||||
ctx.fillText(text, i * fontSize, drops[i] * fontSize);
|
||||
drops[i]++;
|
||||
if (drops[i] * fontSize > canvas.height && Math.random() > .95) {
|
||||
drops[i] = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
setInterval(draw, 33);
|
||||
}
|
||||
200
api/scripts/termapi.js
Normal file
200
api/scripts/termapi.js
Normal file
|
|
@ -0,0 +1,200 @@
|
|||
// TERM API BY GZOD01 (FROM CYBERTERMHACK BY GZOD01)
|
||||
const clog = console.log
|
||||
const cwarn = console.warn
|
||||
const cerror = console.error
|
||||
const cclear = console.clear
|
||||
console.log = function(str){if(devmodeenabled){termshowhtml('<span id=console style="background-color:grey; color: black">JS-LOG: '+str+' </span>');}clog(str)}
|
||||
console.warn = function(str){if(devmodeenabled){termshowhtml('<span id= console style="background-color:yellow; color:black">JS-WARN: '+str+' </span>')}cwarn(str)}
|
||||
console.error = function(str){if(devmodeenabled){termshowhtml('<span id= consolestyle="background-color:red; color:white">JS-ERROR: '+str+' </span>')}cerror(str)}
|
||||
console.clear = function(){if(devmodeenabled){let l = document.querySelectorAll('#console'); for(let i=0; i<l.length; i++){l[i].remove()}}cclear()}
|
||||
devmodeenabled = false
|
||||
// the variable to check if the input is complete (if the user press enter)
|
||||
var inputcomplete = false
|
||||
|
||||
// function to choose a random int (random.randint() in python)
|
||||
function randint(min, max){
|
||||
return Math.floor(Math.random() * (max - min + 1) ) + min;
|
||||
}
|
||||
|
||||
// START OF MATRIX CODE
|
||||
// function to stop the matrix (delete the canvas and recreate it)
|
||||
function stopmatrix(){
|
||||
document.getElementById('matrixcanvas').remove()
|
||||
let nc = document.createElement('canvas')
|
||||
nc.setAttribute('id','matrixcanvas')
|
||||
nc.style.width = '100%'
|
||||
nc.style.height ='0%'
|
||||
document.body.appendChild(nc)
|
||||
}
|
||||
//function to start the matrix (start the dropdown of letters etc.)
|
||||
function matrix(color){
|
||||
let tcolor = ''
|
||||
if(color==='cyan'){
|
||||
tcolor ='#0ff'
|
||||
}
|
||||
else if(color==='blue'){
|
||||
tcolor='#00f'
|
||||
}
|
||||
else if(color==='magenta'){
|
||||
tcolor='#f0f'
|
||||
}
|
||||
else if(color==='red'){
|
||||
tcolor='#f00'
|
||||
}
|
||||
else if(color==='green'){
|
||||
tcolor='#0f0'
|
||||
}
|
||||
else if(color==='yellow'){
|
||||
tcolor='#ff0'
|
||||
}
|
||||
else if(color==='white'){
|
||||
tcolor='#fff'
|
||||
}
|
||||
else if(color==='purple'){
|
||||
tcolor='#303'
|
||||
}
|
||||
else{
|
||||
tcolor= '#0f0'
|
||||
}
|
||||
var canvas = document.getElementById('matrixcanvas'),
|
||||
ctx = canvas.getContext('2d');
|
||||
|
||||
canvas.style.height = '100%'
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
var letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890&éèçà@æ€ŧøþ@ßðđŋłĸħłµł»¢µ$£ù%^¨';
|
||||
letters = letters.split('');
|
||||
|
||||
|
||||
var fontSize = 10,
|
||||
columns = canvas.width / fontSize;
|
||||
|
||||
|
||||
var drops = [];
|
||||
for (var i = 0; i < columns; i++) {
|
||||
drops[i] = 1;
|
||||
}
|
||||
|
||||
|
||||
function draw() {
|
||||
ctx.fillStyle = 'rgba(0, 0, 0, .1)';
|
||||
ctx.fillRect(0, 0, canvas.width, canvas.height);
|
||||
for (var i = 0; i < drops.length; i++) {
|
||||
var text = letters[Math.floor(Math.random() * letters.length)];
|
||||
ctx.fillStyle = tcolor;
|
||||
ctx.fillText(text, i * fontSize, drops[i] * fontSize);
|
||||
drops[i]++;
|
||||
if (drops[i] * fontSize > canvas.height && Math.random() > .95) {
|
||||
drops[i] = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
setInterval(draw, 33);
|
||||
}
|
||||
// END OF MATRIX CODE
|
||||
|
||||
// function like the time.sleep in python
|
||||
function sleep(s) {
|
||||
let ms = s*1000
|
||||
return new Promise(resolve => setTimeout(resolve, ms));
|
||||
}
|
||||
// function like random.choice() in python
|
||||
function randchoice(list){
|
||||
console.log(list[randint(0,list.length-1)])
|
||||
return list[randint(0,list.length-1)]
|
||||
}
|
||||
|
||||
// TODO : var historic = []
|
||||
|
||||
// lastx = the last input do (the input you get when you press up arrow) to replace with an historic
|
||||
var lastx = ""
|
||||
|
||||
// the function to execute when up arrow pressed
|
||||
function historic(){
|
||||
// TODO : terminpt.value=historic[historic.lengh-1-index]
|
||||
document.getElementById('terminpt').value = lastx // to replace with an historic (line above) , set the input value (content) to the last input executed
|
||||
}
|
||||
// when a key is down
|
||||
onkeydown = function(e){
|
||||
// if the key is the tab key (keyCode 9)
|
||||
if(e.keyCode==9){
|
||||
// execute the autocomplete function
|
||||
autocomplete()
|
||||
}
|
||||
}
|
||||
// when a key is up
|
||||
onkeyup = function(e){
|
||||
// if the key is enter key (keyCode 13)
|
||||
if(e.keyCode==13){
|
||||
// set the inputcomplete variable to true to inform the terminput function that the user press enter
|
||||
inputcomplete = true
|
||||
}
|
||||
// if the input is up arrow key (keyCode 38)
|
||||
else if(e.keyCode == 38){
|
||||
// execute the historic function
|
||||
historic()
|
||||
}
|
||||
}
|
||||
// function like the print() function in python, add the text to the #termcontent div
|
||||
function termshowhtml(str){
|
||||
let tc = document.getElementById('termcontent')
|
||||
let nchild = document.createElement('div')
|
||||
nchild.innerHTML = str
|
||||
tc.appendChild(nchild)
|
||||
document.getElementById('termcontent').scrollTo(0,document.getElementById('termcontent').scrollHeight)
|
||||
}
|
||||
function termshow(str){
|
||||
str = str.replace('<','<')
|
||||
str= str.replace('>','>')
|
||||
str= str.replace('&infg&','<')
|
||||
str = str.replace('&supd&','>')
|
||||
termshowhtml(str.replace('\n','<br>'))
|
||||
}
|
||||
// the input() function of python, check if the input is complete (see the inputcomplete variable and the onkeyup (e.keyCode == 13) execution
|
||||
function terminput(str){
|
||||
let tiname = document.getElementById('inptname')
|
||||
tiname.innerHTML = str
|
||||
let inpt = document.getElementById('terminpt')
|
||||
if(inputcomplete){
|
||||
console.log(inpt.value)
|
||||
inputcomplete=false
|
||||
let resultat = inpt.value
|
||||
inpt.value = ''
|
||||
return resultat
|
||||
}
|
||||
else{
|
||||
//return 'ERR' if the input isn't complete
|
||||
return 'ERR'
|
||||
}
|
||||
}
|
||||
// replace this list with the list of your commands
|
||||
var list_of_command = ['ls','ssh','pbk','exit','theme','matrix','hack','attack','save','import','help','exit']
|
||||
// autocomplete when tab press show all the command starting with the value in your input
|
||||
function autocomplete(){
|
||||
let inptval = document.getElementById('terminpt').value
|
||||
termshow('List of available commands starting with " '+inptval+' " :')
|
||||
for(let i = 0; i<list_of_command.length; i++){
|
||||
if(list_of_command[i].startsWith(inptval)){
|
||||
termshow('- '+list_of_command[i])
|
||||
}
|
||||
}
|
||||
}
|
||||
// x= the current input
|
||||
var x = ""
|
||||
|
||||
// START OF FUNCTIONS TO USE WITHOUT INTERACT WITH THE INTERFACE
|
||||
// Send the current input (function to set the inputcomplete as true)
|
||||
function sendinput(){inputcomplete=true}
|
||||
// setinput(str) function to set the value of the input from function
|
||||
function setinput(str){document.getElementById('terminpt').value=str}
|
||||
// execcommand(str) set input and send input
|
||||
function execcommand(str){setinput(str); sendinput()}
|
||||
// last() historic and sendinput
|
||||
function last(){historic(); sendinput()}
|
||||
// autoc setinput, autocomplete
|
||||
function autoc(str){setinput(str); autocomplete();}
|
||||
// END OF FUNCTIONS TO USE WITHOUT INTERACT WITH THE INTERFACE
|
||||
// END OF THE API CODE
|
||||
|
||||
26
api/scripts/tranform.js
Normal file
26
api/scripts/tranform.js
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
function transformpage(docstr, titleofdoc){
|
||||
let toreturn = `
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="//api.gzod01.fr/pictures/gzod01.png">
|
||||
<link rel="stylesheet" href="//api.gzod01.fr/css/style.css">
|
||||
<script src="//api.gzod01.fr/scripts/main.js"></script>
|
||||
<title>${titleofdoc}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header"></div>
|
||||
<div class=content>
|
||||
${docstr}
|
||||
</div>
|
||||
<div id="footer"></div>
|
||||
</body>
|
||||
</html>
|
||||
`
|
||||
return toreturn
|
||||
}
|
||||
function transform() {document.querySelector(':root').innerHTML = transformpage(document.getElementById('content'),document.title)}
|
||||
window.onload = () =>{transform()}
|
||||
Reference in a new issue