Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01
This commit is contained in:
28
.gitignore
vendored
28
.gitignore
vendored
@@ -510,3 +510,31 @@ www/medias/mediasCredits/warframeDuviriRide.mp4
|
||||
www/medias/mediasHistoireDE/warframeRailjackRide.mp4
|
||||
www/multimedia/mediasCredits/warframeDuviriRide.mp4
|
||||
www/multimedia/mediasHistoireDE/warframeRailjackRide.mp4
|
||||
COMPRESS/warframeRailjackRide.mp4
|
||||
COMPRESS/Ember.mp4
|
||||
COMPRESS/Equinox.mp4
|
||||
COMPRESS/Frost.mp4
|
||||
COMPRESS/Koumei.mp4
|
||||
COMPRESS/Rhino.mp4
|
||||
COMPRESS/Sevagoth.mp4
|
||||
COMPRESS/Voruna.mp4
|
||||
COMPRESS/warframeDuviriRide.mp4
|
||||
www/multimediaHQ/we_All_Lift_Together_mPTCq3LiZSE.mp3
|
||||
www/multimediaHQ/mediasAndres/Ember.mp4
|
||||
www/multimediaHQ/mediasAndres/EmberVid.webm
|
||||
www/multimediaHQ/mediasAndres/Equinox.mp4
|
||||
www/multimediaHQ/mediasAndres/equinox.webm
|
||||
www/multimediaHQ/mediasAndres/Frost.mp4
|
||||
www/multimediaHQ/mediasAndres/FrostVid.webm
|
||||
www/multimediaHQ/mediasAndres/Koumei.mp4
|
||||
www/multimediaHQ/mediasAndres/KoumeiVid.webm
|
||||
www/multimediaHQ/mediasAndres/nokko.webm
|
||||
www/multimediaHQ/mediasAndres/Rhino.mp4
|
||||
www/multimediaHQ/mediasAndres/RhinoVid.webm
|
||||
www/multimediaHQ/mediasAndres/Sevagoth.mp4
|
||||
www/multimediaHQ/mediasAndres/SevagothVid.webm
|
||||
www/multimediaHQ/mediasAndres/Voruna.mp4
|
||||
www/multimediaHQ/mediasAndres/VorunaVid.webm
|
||||
www/multimediaHQ/mediasCredits/warframeDuviriRide.mp4
|
||||
www/multimediaHQ/mediasHistoireDE/warframeRailjackRide.mp4
|
||||
www/multimediaHQ/mediasLea/warframeIntro.mp4
|
||||
|
||||
17
README.md
17
README.md
@@ -54,7 +54,7 @@ o <main> – Le contenu principal de la page
|
||||
- [x] Logo
|
||||
- [ ] Une bannière conçue par vous (vous n’êtes pas obligés de garder la même sur toutes vos pages)
|
||||
- [x] Le titre principal de la page Web (vous n’êtes pas obligés de garder le même sur toutes vos pages)
|
||||
- [ ] balise `<nav>`
|
||||
- [x] balise `<nav>`
|
||||
- [x] Un bouton pour chaque page du site Web (sous la forme d’une liste `<ul>`) avec des effets de CSS
|
||||
- [x] Trouvez une façon d’indiquer sur quelle page se trouve actuellement le visiteur. Ou l’implantation d’un fil d’Ariane.
|
||||
- [x] balise `<footer>`
|
||||
@@ -66,16 +66,19 @@ o <main> – Le contenu principal de la page
|
||||
- [x] Inclure les references pour chaques fichier multimedia
|
||||
- [ ] Au moins un lien de téléchargement
|
||||
- [ ] Un tableau
|
||||
- [ ] • La dimension du tableau doit être au moins de 4 colonnes et 4 lignes.
|
||||
- [ ] • Il doit y avoir de la fusion à l’intérieur du tableau.
|
||||
- [ ] • Les bordures doivent être faites par CSS.
|
||||
- [x] • La dimension du tableau doit être au moins de 4 colonnes et 4 lignes.
|
||||
- [x] • Il doit y avoir de la fusion à l’intérieur du tableau.
|
||||
- [x] • Les bordures doivent être faites par CSS.
|
||||
- [ ] Des listes
|
||||
- [ ] • Au moins une liste à puce contenant au moins 3 éléments.
|
||||
- [x] • Au moins une liste à puce contenant au moins 3 éléments.
|
||||
- [ ] • Au moins une liste numérotée contenant au moins 3 éléments.
|
||||
- [ ] • Au moins une d’entre elle doit être une liste imbriquée d’au moins 2 éléments supplémentaires.
|
||||
- [ ] Du contenu multimédia - [ ] • Au moins un fichier audio - [x] • Au moins deux fichiers vidéo - [ ] • Au moins de cinq images différentes (excluant les photos des membres de l’équipe, le logo et la
|
||||
- [ ] Du contenu multimédia
|
||||
- [ ] • Au moins un fichier audio
|
||||
- [x] • Au moins deux fichiers vidéo
|
||||
- [ ] • Au moins de cinq images différentes (excluant les photos des membres de l’équipe, le logo et la
|
||||
bannière)
|
||||
- [ ] Aucun texte bidon de type Lorem Ipsum ne sera accepté dans le site Web.
|
||||
- [x] Aucun texte bidon de type Lorem Ipsum ne sera accepté dans le site Web.
|
||||
- [ ]
|
||||
|
||||
```md
|
||||
|
||||
@@ -392,13 +392,13 @@
|
||||
</div>
|
||||
|
||||
<div class="accueilwiki">
|
||||
<a href="https://wiki.warframe.com/">
|
||||
<a target="_blank" href="https://wiki.warframe.com/">
|
||||
<img src="./images/ImagesAndres/accueilWiki.PNG" alt="jdjj">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="accueilwiki">
|
||||
<a href="https://wiki.warframe.com/w/Warframes">
|
||||
<a target="_blank" href="https://wiki.warframe.com/w/Warframes">
|
||||
<img src="./images/ImagesAndres/warframeWiki.PNG" alt="fsfsf">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -48,7 +48,8 @@
|
||||
Le site internet de Warframe a été consulté afin d’obtenir des images et vidéos authentiques du
|
||||
jeu.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://www.warframe.com/fr/game/about">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://www.warframe.com/fr/game/about">Voir la
|
||||
source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -112,7 +113,8 @@
|
||||
<p class="contenu">
|
||||
Discotools.xyz a permis la création du bouclier présent dans le logo ainsi que le favicon.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://discotools.xyz/fr/icons-editor">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://discotools.xyz/fr/icons-editor">Voir la
|
||||
source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -123,7 +125,7 @@
|
||||
Figma a été utilisé dans la conception du logo, du favicon et de l’image de remerciement pour
|
||||
avoir rempli le formulaire.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://www.figma.com/fr-fr/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://www.figma.com/fr-fr/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -134,7 +136,8 @@
|
||||
Lyco Canario est derrière la poule utilisée dans l’image de remerciement pour avoir rempli le
|
||||
formulaire.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://dribbble.com/lycocanario">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://dribbble.com/lycocanario">Voir la source</a>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -144,7 +147,8 @@
|
||||
<p class="contenu">
|
||||
Visual Studio Code a été l’outil de développement utilisé pour l’ensemble du projet.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://code.visualstudio.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://code.visualstudio.com/">Voir la source</a>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -155,7 +159,7 @@
|
||||
Le documentaire sur Warframe conçu par /noclip a servi à rédiger la page sur l’histoire de
|
||||
Digital Extremes.
|
||||
</p>
|
||||
<div class="bouton"><a
|
||||
<div class="bouton"><a target="_blank"
|
||||
href="https://www.youtube.com/watch?v=UOE6528pwFc&list=PL-THgg8QnvU7Weo1mCM9H2AXljC7UrDm8&index=2">Voir
|
||||
la source</a></div>
|
||||
</div>
|
||||
@@ -167,7 +171,8 @@
|
||||
<p class="contenu">
|
||||
La théorie fournie par le corps professoral a dépanné l’équipe à de multiples reprises.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://moodle.cegepsherbrooke.qc.ca/course/view.php?id=1518">Voir la
|
||||
<div class="bouton"><a target="_blank"
|
||||
href="https://moodle.cegepsherbrooke.qc.ca/course/view.php?id=1518">Voir la
|
||||
source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
@@ -178,7 +183,7 @@
|
||||
<p class="contenu">
|
||||
Les systèmes de Gitea ont permis un travail connecté durant l’ensemble du projet.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://about.gitea.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://about.gitea.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -188,7 +193,7 @@
|
||||
<p class="contenu">
|
||||
ChatGPT a permis la rédaction de certains textes du site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://chatgpt.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://chatgpt.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -198,7 +203,7 @@
|
||||
<p class="contenu">
|
||||
Gemini a permis la rédaction de certains textes du site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://gemini.google.com/app">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://gemini.google.com/app">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -209,7 +214,7 @@
|
||||
Moqups a permis la création de la maquette, afin de rendre prévisible le style artistique du
|
||||
site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://moqups.com/fr/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://moqups.com/fr/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -219,7 +224,7 @@
|
||||
<p class="contenu">
|
||||
Google Maps a permis l’intégration de la carte géographique sur le site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://www.google.com/maps">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://www.google.com/maps">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -229,7 +234,7 @@
|
||||
<p class="contenu">
|
||||
Les valideurs du World Wide Web Consortium ont permis la révision du code de l’ensemble du site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://validator.w3.org/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://validator.w3.org/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -239,7 +244,7 @@
|
||||
<p class="contenu">
|
||||
Le moteur de recherche Brave Search a dépanné a de multiples reprises.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://search.brave.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://search.brave.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -249,7 +254,7 @@
|
||||
<p class="contenu">
|
||||
Le moteur de recherche Google a dépanné à de multiples reprises.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://www.google.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://www.google.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -259,7 +264,7 @@
|
||||
<p class="contenu">
|
||||
Le moteur de recherche DuckDuckGo a dépanné à de multiples reprises.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://duckduckgo.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://duckduckgo.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -269,7 +274,7 @@
|
||||
<p class="contenu">
|
||||
L’outil paint.net a permis l’édition de plusieurs images présentes sur le site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://www.getpaint.net/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://www.getpaint.net/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -279,7 +284,7 @@
|
||||
<p class="contenu">
|
||||
Le site de Google Fonts a permis de trouver une police pour le site.
|
||||
</p>
|
||||
<div class="bouton"><a href="https://fonts.google.com/">Voir la source</a></div>
|
||||
<div class="bouton"><a target="_blank" href="https://fonts.google.com/">Voir la source</a></div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
@@ -1290,6 +1290,10 @@ h2 {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.wf-table-simple li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
/****************************/
|
||||
/* PAGE: Crédits */
|
||||
/* AUTEUR: Jérémy Hébert */
|
||||
|
||||
122
www/js/script.js
122
www/js/script.js
@@ -1,89 +1,11 @@
|
||||
|
||||
/* AUTEUR: Stan
|
||||
DATE : 2025-12-03
|
||||
DESC: Ajout de glitch comme certains evenement dans Warframe
|
||||
*/
|
||||
// https://www.geeksforgeeks.org/html/difference-between-domcontentloaded-and-load-events/
|
||||
// Performance for my useCase (modify NAV and FOOTER)
|
||||
// https://stackoverflow.com/questions/44329324/cannot-read-property-symbolsymbol-iterator-of-undefined
|
||||
/*
|
||||
document.addEventListener("DOMContentLoaded",
|
||||
function(e) {
|
||||
console.log("DOMContentLoaded triggered !");
|
||||
|
||||
var topEl = document.getElementsByTagName("nav"); // maybe header
|
||||
var listLI = topEl[0].getElementsByTagName("li");
|
||||
|
||||
|
||||
document.getElementById("");
|
||||
// var allA = listLI.getElementsByTagName("a");
|
||||
// topEl.
|
||||
|
||||
listLI.forEach(nodeLI => {console.log(nodeLI.innerHTML);});
|
||||
*/
|
||||
/*
|
||||
allA.forEach(node => {
|
||||
console.log(node);
|
||||
});
|
||||
|
||||
*/
|
||||
/*
|
||||
// let myNav = document.getElementsByTagName("nav");
|
||||
// myNav.getElementsByTagName("a")
|
||||
for (child of allA){
|
||||
console.log(child.innerHTML);
|
||||
}
|
||||
*/ // for (document.querySelector("nav")
|
||||
// });
|
||||
|
||||
|
||||
/*!SECTION
|
||||
|
||||
// .textContent
|
||||
// .innerHTML
|
||||
|
||||
|
||||
const parent = document.getElementById("myParent");
|
||||
const children = parent.children;
|
||||
|
||||
for (let i = 0; i < children.length; i++) {
|
||||
const child = children[i];
|
||||
// Perform actions on the child element
|
||||
console.log(child.textContent);
|
||||
}
|
||||
|
||||
|
||||
for (let i = 0; i < children.length; i++) {
|
||||
const child = children[i];
|
||||
// Perform actions on the child element
|
||||
console.log(child.TagName);
|
||||
console.log(child.textContent);…
|
||||
|
||||
|
||||
*/
|
||||
|
||||
// javascript console output DOM tree
|
||||
// https://stackoverflow.com/questions/50305257/how-to-console-log-entire-html-dom-tree-in-order-with-attribute-names
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
|
||||
|
||||
/*
|
||||
var walker = document.createTreeWalker(
|
||||
document.documentElement,
|
||||
NodeFilter.SHOW_ELEMENT // only elements
|
||||
);
|
||||
|
||||
while (walker.nextNode()) {
|
||||
let current = walker.currentNode;
|
||||
console.log(
|
||||
current.tagName,
|
||||
[...current.attributes].map(({value,name}) => `${name}=${value}`).join()
|
||||
);
|
||||
}
|
||||
*/
|
||||
|
||||
// Needed for image loaded and fetched : Not on local computer.
|
||||
/* https://www.geeksforgeeks.org/html/difference-between-domcontentloaded-and-load-events/
|
||||
document.addEventListener("load", function(e) {
|
||||
console.log("The page has completely loaded.");
|
||||
});
|
||||
*/
|
||||
|
||||
// https://www.w3schools.com/js/js_timing.asp
|
||||
// https://stackoverflow.com/questions/62039703/blur-an-image-with-javascript
|
||||
function timerBlur(){
|
||||
var count = 3;
|
||||
var timer2 = setInterval(function(){
|
||||
@@ -126,39 +48,7 @@ function timerGlitch(){
|
||||
|
||||
window.onload = function () {
|
||||
timerGlitch();
|
||||
setTimeout(function () {
|
||||
/* document.getElementById('message').innerHTML =
|
||||
'The page has finished loading! After 2 second'; */
|
||||
// Check if on the test domain and that the text changed, if so display Data.
|
||||
if (window.location.hostname === 's.zkd.ca' && document.getElementById("updateDate").innerHTML != 'DATE_WEBSITE' )
|
||||
{
|
||||
document.getElementById("updateDate").setAttribute("id", "updateDateV");
|
||||
} else
|
||||
{
|
||||
document.getElementById("updateDate").setAttribute("id", "updateDateW");
|
||||
document.getElementById("updateDateW").innerHTML = 'À la prochaine!';
|
||||
}
|
||||
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/Element/children
|
||||
// const myHeader = document.getElementByTagName("header"); // TODO: Make sure only first nav (need <header>)
|
||||
myNav = document.getElementsByTagName("nav");
|
||||
console.log(myNav.length());
|
||||
|
||||
for (var i = 0; i < myNav.children.length(); i++) {
|
||||
var tableChild = myNav.children[i];
|
||||
console.log(tableChild.tagName);
|
||||
// Do stuff
|
||||
}
|
||||
|
||||
/* for (const child of myNav.children) {
|
||||
console.log(child.tagName);
|
||||
}
|
||||
*/
|
||||
}, 2000);
|
||||
// NOTE: Change Current Page based on url in <NAV>
|
||||
|
||||
|
||||
// TODO Add timer for glitch
|
||||
// NOTE Track mouse mouvement and show after a percentage of ?
|
||||
// NOTE une page sur deux, ...
|
||||
};
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Reference in New Issue
Block a user