diff --git a/assets/img/map/map.svg b/assets/img/map/map.svg new file mode 100644 index 0000000..86b6720 --- /dev/null +++ b/assets/img/map/map.svg @@ -0,0 +1,7726 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + R3 + R2 + R1 + Laverie + Amicale + Le Trou + R4 + R7 + BIB + PK + Gymnase + GC + R5 + R6 + Loge + Exam + STPI + GMM + GM + GEI + TP + GP + GP3E + CSH + RU + + diff --git a/assets/img/map/map3D.glb b/assets/img/map/map3D.glb new file mode 100644 index 0000000..3a32258 Binary files /dev/null and b/assets/img/map/map3D.glb differ diff --git a/assets/js/map/map.js b/assets/js/map/map.js new file mode 100644 index 0000000..4d2c5a9 --- /dev/null +++ b/assets/js/map/map.js @@ -0,0 +1,46 @@ + +let hoverColor = "#e9b82f"; +let normalColor = "#efbd95"; + +function get_name(id){ + return id.replace("map-", ""); +} + +function clicked(elem){ + $.alert({ + title: 'Chargement...', + content: function () { + let self = this; + let object = { + "function": 'get_map_info', + 'selector': get_name(elem.id), + }; + return $.ajax({ + url: 'ajax/read', + data: object, + method: 'get' + }).done(function (data) { + if (data.length > 0) { + self.setTitle(data[0]['title']); + self.setContent(data[0]['description']); + } else { + self.setTitle('Erreur'); + self.setContent('Une erreur est survenue') + } + }).fail(function(){ + self.setContent('Something went wrong.'); + }); + }, + }); +} + +function hover_in(elem){ + $(elem).css({ + "fill": hoverColor, + 'cursor': 'pointer', + }); +} + +function hover_out(elem){ + $(elem).css("fill", normalColor); +} \ No newline at end of file diff --git a/assets/js/map/map3d.js b/assets/js/map/map3d.js new file mode 100644 index 0000000..bef5165 --- /dev/null +++ b/assets/js/map/map3d.js @@ -0,0 +1,377 @@ +/* Map 3D +* 3D Model : Matthias Onestras +* Code : Ronan Bonnet +* +*/ + +import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.119.1/build/three.module.js'; + +import { + OrbitControls +} from 'https://cdn.jsdelivr.net/npm/three@0.119.1/examples/jsm/controls/OrbitControls.js'; +import { + GLTFLoader +} from 'https://cdn.jsdelivr.net/npm/three@0.119.1/examples/jsm/loaders/GLTFLoader.js'; + +var container, stats, controls; +var camera, scene, renderer; + +var raycaster, mouse; + +init(); +render(); + +var height, width; + +/** + * Initializes the 3D plan + * Creates and loads every needed things + */ +function init() { + + + // + // Creates HTML + // + container = document.createElement('div'); + container.id = 'map3d'; + + height = document.querySelector('#maps').clientHeight; + width = document.querySelector('#maps').clientWidth; + var svg = document.querySelector('#maps #map'); + document.querySelector('#maps').insertBefore(container, svg); + + + // + // Creates cameras and scene + // + camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.75, 20000); + camera.position.set(500,1500,500); + scene = new THREE.Scene(); + + // + // LIGHTS + // + let sol = new THREE.AmbientLight(0x404040, 1.0); + scene.add(sol); + + var hemiLight = new THREE.HemisphereLight( 0xffffff, 0x444444 ); + hemiLight.position.set( 0, 20, 0 ); + scene.add( hemiLight ); + + var dirLight = new THREE.DirectionalLight( 0xffffff ); + dirLight.position.set( - 3, 10, - 10 ); + scene.add( dirLight ); + + //scene.background = new THREE.Color( 0xff0000 ); + + + raycaster = new THREE.Raycaster(); + mouse = new THREE.Vector2() + + // + // Loading screen + // + const loadingManager = new THREE.LoadingManager( () => { + const loadingScreen = document.getElementById('loading-screen'); + loadingScreen.classList.add('fade-out'); + loadingScreen.addEventListener('transitionend', onTransitionEnd); + }); + + + // + // Load the 3D model + // + var loader = new GLTFLoader(loadingManager); + + loader.load('assets/img/map/map3D.glb', function(gltf) { + var object = gltf.scene; + gltf.scene.scale.set( 2, 2, 2 ); + gltf.scene.position.x = 0; //Position (x = right+ left-) + gltf.scene.position.y = 0; //Position (y = up+, down-) + gltf.scene.position.z = 0; + + scene.add(gltf.scene); + + render(); + + }); + + + + // + // RENDERER + // + renderer = new THREE.WebGLRenderer({ + antialias: true, + }); + renderer.setClearColor( 0x000000 ); + + renderer.setPixelRatio(window.devicePixelRatio); + renderer.setSize(width, window.innerHeight * 0.75); + renderer.toneMapping = THREE.ACESFilmicToneMapping; + renderer.toneMappingExposure = 1; + renderer.outputEncoding = THREE.sRGBEncoding; + container.appendChild(renderer.domElement); + + var pmremGenerator = new THREE.PMREMGenerator(renderer); + pmremGenerator.compileEquirectangularShader(); + + // + // CONTROLS + // + controls = new OrbitControls(camera, renderer.domElement); + controls.addEventListener('change', render); // use if there is no animation loop + controls.minDistance = 0; + controls.maxDistance = 3500; + controls.enablePan = true; + controls.target.set(-110, 300, 0); + controls.maxPolarAngle = Math.PI/2.05; + controls.update(); + + // + // Load Light + // + var ambientLight = new THREE.AmbientLight( 0xcccccc ); + scene.add( ambientLight ); + + var directionalLight = new THREE.DirectionalLight( 0xffffff ); + directionalLight.position.set( 0, 1, 1 ).normalize(); + scene.add( directionalLight ); + + + // + // EVENTS + // + window.addEventListener('resize', onWindowResize, false); + + renderer.domElement.addEventListener('click', onClick, false); // Mouse + //renderer.domElement.addEventListener('mousemove', onMouseOver,false); + renderer.domElement.addEventListener('touchend', onTouchEnd, false); // Smartphone + +} + +/** + * Get all the selectors (buildings identifiers) + * @returns Array with all the selectors + */ +function getSelectors() { + let info = {}; + let object = { + "function": 'get_map_selectors', + 'info': info, + } + return $.ajax({ + url: 'ajax/read', + data: object, + method: 'get', + success: function(data){ + + } + }); +} + +/* + * Show a screen page if the building on which was clicked is in the database + * Display the name of the building and the description of the building + */ +function handleClickOnBuilding(x,y) { + + mouse.x = x; + mouse.y = y; + + raycaster.setFromCamera(mouse, camera); + + var intersects = raycaster.intersectObjects(scene.children, true); + + + // If we clicked on a building + if (intersects.length > 0) { + + var selector = intersects[0].object.name.toString().toLowerCase(); // Name of the building we clicked on + + // Wait for getSelectors() to be done + // If we do not wait, everything will be executed before checking what is inside the database + $.when(getSelectors().done(function(data) { + if (data.map(x => x.selector).includes(selector)){ + // Use the same thing as the one for the 2D map + $.alert({ + title: 'Chargement...', + content: function () { + let self = this; + let object = { + "function": 'get_map_info', + 'selector': selector, + }; + return $.ajax({ + url: 'ajax/read', + data: object, + method: 'get' + }).done(function (data) { + if (data.length > 0) { + self.setTitle(data[0]['title']); + self.setContent(data[0]['description']); + } else { + self.setTitle('Erreur'); + self.setContent('Une erreur est survenue') + return; + } + }).fail(function(){ + self.setContent('Something went wrong.'); + }); + }, + }); + } else { + + } + })); + + } +} + +/** + * Get the position where the user clicked (mouse) on a building and process it + */ +function onClick() { + + event.preventDefault(); + + height = document.querySelector('#maps').clientHeight; + width = document.querySelector('#maps').clientWidth; + + + const rect = renderer.domElement.getBoundingClientRect(); + mouse.x = ( ( event.clientX - rect.left ) / ( rect.right - rect.left ) ) * 2 - 1; + mouse.y = - ( ( event.clientY - rect.top ) / ( rect.bottom - rect.top) ) * 2 + 1; + handleClickOnBuilding(mouse.x, mouse.y); + +} + +/** + * Get the position where the user clicked (smartphone) on a building and process it + */ +function onTouchEnd() { + var clientX, clientY; + + clientX = event.changedTouches[0].clientX; + clientY = event.changedTouches[0].clientY; + + const rect = renderer.domElement.getBoundingClientRect(); + mouse.x = ( ( clientX - rect.left ) / ( rect.right - rect.left ) ) * 2 - 1; + mouse.y = - ( ( clientY - rect.top ) / ( rect.bottom - rect.top) ) * 2 + 1; + + handleClickOnBuilding(mouse.x, mouse.y); +} + + +/** + * Process something when the user moved the mouse over a building + * @todo add text over the building + */ +function onMouseOver() { + + event.preventDefault(); + + height = document.querySelector('#maps').clientHeight; + width = document.querySelector('#maps').clientWidth; + + + const rect = renderer.domElement.getBoundingClientRect(); + mouse.x = ( ( event.clientX - rect.left ) / ( rect.right - rect.left ) ) * 2 - 1; + mouse.y = - ( ( event.clientY - rect.top ) / ( rect.bottom - rect.top) ) * 2 + 1; + + createTextOverBuilding(mouse.x,mouse.y) + +} + +function createTextOverBuilding(x,y) { + mouse.x = x; + mouse.y = y; + + raycaster.setFromCamera(mouse, camera); + + var intersects = raycaster.intersectObjects(scene.children, true); + + + // If we clicked on a building + if (intersects.length > 0) { + console.log(intersects); + + + + } + + +} + +function makeLabelCanvas(baseWidth, size, name) { + const borderSize = 2; + const ctx = document.createElement('canvas').getContext('2d'); + const font = `${size}px bold sans-serif`; + ctx.font = font; + // measure how long the name will be + const textWidth = ctx.measureText(name).width; + + const doubleBorderSize = borderSize * 2; + const width = baseWidth + doubleBorderSize; + const height = size + doubleBorderSize; + ctx.canvas.width = width; + ctx.canvas.height = height; + + // need to set font again after resizing canvas + ctx.font = font; + ctx.textBaseline = 'middle'; + ctx.textAlign = 'center'; + + ctx.fillStyle = 'blue'; + ctx.fillRect(0, 0, width, height); + + // scale to fit but don't stretch + const scaleFactor = Math.min(1, baseWidth / textWidth); + ctx.translate(width / 2, height / 2); + ctx.scale(scaleFactor, 1); + ctx.fillStyle = 'white'; + ctx.fillText(name, 0, 0); + + + const labelBaseScale = 0.01; + const label = new THREE.Sprite(labelMaterial); + scene.add(label); + label.position.y = head.position.y + headRadius + size * labelBaseScale; + + label.scale.x = canvas.width * labelBaseScale; + label.scale.y = canvas.height * labelBaseScale; + return ctx.canvas; +} + + +/** + * Auto-resizes the canvas when window size is updated + */ +function onWindowResize() { + + height = document.querySelector('#main-content .inner').clientHeight; + width = document.querySelector('#main-content .inner').clientWidth; + camera.aspect = window.innerWidth / window.innerHeight; + camera.updateProjectionMatrix(); + + renderer.setSize(width * 0.9, window.innerHeight * 0.75); // 0.9 and 0.75 so it looks comfortable on the screen + + render(); + +} + +/** + * Render the scene + */ +function render() { + + renderer.render(scene, camera); +} + +/* + * Remove the loader when the model loaded + */ +function onTransitionEnd( event) { + event.target.remove(); +} \ No newline at end of file diff --git a/coms.php b/coms.php index d13f7d4..c809b3f 100755 --- a/coms.php +++ b/coms.php @@ -2,9 +2,10 @@ ob_start(); // Start reading html ?>
-

Les Com's

-

La liste de toutes les com's de ta semaine d'accueil, avec les contacts des responsables.

-
+
+

Les Com's

+

La liste de toutes les com's de ta semaine d'accueil, avec les contacts des responsables.

+

Le Bureau

"; for($i = 0; $i < count($prenom); $i++) { - echo "
    "; + echo "
  • "; echo "

    ".$fonction[$i]."

    "; echo "

    ".$prenom[$i]." ".$nom[$i]."

    "; echo "".$mail[$i].""; - echo "
"; + echo ""; } + echo ""; ?>
@@ -27,12 +30,14 @@ ob_start(); // Start reading html function respo($name, $prenom, $nom, $mail) { echo "
"; echo "

".$name."

"; + echo "
    "; for($i = 0; $i < count($prenom); $i++) { - echo "
      "; + echo "
    • "; echo "

      ".$prenom[$i]." ".$nom[$i]."

      "; echo "".$mail[$i].""; - echo "
    "; + echo ""; } + echo "
"; echo "
"; } ?> @@ -116,9 +121,9 @@ ob_start(); // Start reading html ["Rebejac (resp graphisme)", "Ciaran (resp graphisme)", "Rébillard (resp web)"], ["rebejac@insa-toulouse.fr", "clj.akinlami@gmail.com", "rebillar@insa-toulouse.fr"]); - - ?> + +
- +

Les Telechargements

+

Si jamais t'as perdu quelque chose, pas de problèmes ! Tu pourras trouver tout ce dont tu as besoin ici.

+ +
+

Contact

+

+ Voici la merveilleuse page que personne lit ! Mais t'es là, donc autant en profiter. +

+

+ Pour avoir les news, rejoins le groupe Facebook de la + semaine. On y postera des infos sur les événements à venir. +

+

+ Tu peux également rejoindre l'Instagram : @insat_accueil_2021 +

+
+

Pour les questions concernant la semaine, adresse-toi directement au Prez, il saura surement t'aider :

+ +
+

Pour des questions a propos du site :

+ + +
+

Sinon, si tu veux des infos a propos d'une activite/Com specifique, va sur la page des Com's + pour + contacter les responsables. +

+
+

+ Ta semaine d'accueil est possible grâce à l'Amicale, une + association gérée par des élèves de l'INSA, pour proposer aux étudiants des activités et des services. +

+ + +

Credits

+

+ J'ai repris le site créé par Arnaud et maintenu par Cyprien pour notre semaine d'accueil. Le site est plutôt modulable, donc si + quelqu'un + est chaud pour le reprendre pour l'année prochaine, contactez-moi ! (Y'a pas besoin de connaissances préalables, + c'est assez simple !). +

+
+

Voici les différentes technologies et ressources utilisées pour ce site :

+ + +

Vie Privee

+

+ Le site utilise Matomo pour analyser la + fréquentation. Ces données sont anonymes et permettent de savoir quelles pages sont utiles ainsi que ton pays + d'origine (pour voir si les étrangers ont reçu les infos). Pour ne pas + être traqué, tu peux simplement activer l'option "Indiquer aux sites que je + ne souhaite pas être traqué" de ton navigateur. + Si jamais ça marche pas, envoie-moi un mail. +

+
- +
+

Izly et Lydia : les applis pour te simplifier la vie

+ Pour payer au Pk, au RU ou encore à la cafet’ tu vas avoir deux applis pour te + simplifier la vie.

+ Izly, c’est comme un mini-compte bancaire que tu peux recharger avec ta carte ou + ton compte perso avec lequel tu vas pouvoir payer tes repas au RU et à la cafet’. Il est aussi + relié à ta carte étudiante, ce qui te permet de payer même si ton téléphone est déchargé. + C’est aussi l’appli essentielle pour prendre un café entre deux TD.

+ Lydia, c’est un peu pareil que Izly, mais là elle te servira plus pour achter des paninis + au Pôle Huma, ce qui n’est pas rien. Crois moi PPA, quand tu es un Petit Paresseux Affamé + qui part pour 3h d’expression, le panini fait du bien ! Avec Lydia tu peux aussi faire de + nombreuses économies sur plein de frais sur le campus. Ton entrée aux évènements, ton + inscription à l’Amicale… Souvent, on t’offrira 2€ si tu payes avec Lydia ! Alors télécharge + cette appli aussi vite que possible, elle te sauvera ! C’est grâce à elle que tu pourras + rembourser tes potes aussi ! Que ce soit pour les cadeaux communs pour Michel, ou pour + payer ta dette si t’as oublié tes sous un jour… Ça peut toujours servir + Tu n'as jamais entendu parler de Lydia ni d’Izly et tu te demandes comment ça fonctionne ? + Ne t’en fais, on a pensé à toi ! Nous t’avons concocté un joli tuto rien que pour toi.

+ +

+
+
+

Le Plan

+

+ Voici le plan de ton nouveau campus, que tu vas connaître par cœur en quelques jours ! +

+

+ Clique sur un bâtiment pour voir les infos. +

+
+ + +
+
+ +
+ +
+
+ + + +
+ +

+ Une petite note sur le numéro des salles : sur ton emploi du temps, le bâtiment est marqué en premier, et + ensuite le chiffre des centaines pour l'étage, et après à toi de trouver ! +

+

+ Par exemple, GM 212, c'est au GM, deuxième étage. +
+ Et si t'as Amphi 108, c'est au premier étage du STPI. En gros STPI=bâtiment des amphis. +

+

Fond de carte issu du site Open Street + Map. +

+
+ + + + ", "map"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6 include("structure/template.php"); ?> \ No newline at end of file