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