régate des iut - insa lyon · iv. site web - mise en place configuration du serveur qui va...

CRÉATIS STAGE DUT INFORMATIQUE

CHARPY BASTIEN

Conception et mise œuvre d’un Site Web, d’une Application de

partage de données et d’un Démonstrateur Web

IUT INFORMATIQUE – BOURG-EN-BRESSE

23 Juin 2015

SOMMAIRE

I . Contexte du Stage

II. Introduction

III. Planning

IV. Site Web

V. Gestionnaire de Fichiers

VI. Démonstrateur Web

VII. Conclusion


2/26

I. INTERNSHIP CONTEXT

Presentation of CREATIS – Medical Research Laboratory

INSA at Villeurbanne

Ultrasounds Imaging Team (Signal processing and medical imaging)

AtysCrea project in collaboration with a company (Atys Medical)


3/26

II. INTRODUCTION

Presentation of AtysCrea Project

Answer to a call for projects from ANR

Based on medical devices for transcranial Doppler sonography and high-frequency ultrasound imaging.

Collaboration

Answer to a call for project called LabCom from ANR Creation of AtysCrea

LabCom


4/26

III. PLANNING

Diagramme de Gantt :

3 parties se distinguent : Site Web / Gestionnaire de Fichiers / Démonstrateur Web (Desk)


5/26

IV. SITE WEB - PRÉSENTATION

Objectif : Présentation du LabCom AtysCréa & Portail Collaboratif

Configuration du Serveur pour accueillir le site

Drupal (CMS)

Intègre le Gestionnaire de Fichiers et les Démonstrateurs


6/26

IV. SITE WEB - MISE EN PLACE

Configuration du serveur qui va héberger le Site Web

Partir de Zéro avec seulement un accès à ce serveur (Linux CentOS).

Installation des outils nécessaire pour l’hébergement et le fonctionnement du Site.

PhpMyAdmin & MySQL : Gérer les bases de Données

Apache & PHP : Faire fonctionner le Site Web

FTP : Stocker des données facilement

Demande d’ouverture de port à l’INSA ( domaine « insa-lyon.fr »)


7/26

IV. SITE WEB - FONCTIONNALITÉS

Fonctionnalités attendues dans le Site Web :

Portail Collaboratif

Gestionnaire de Fichiers

Contenu Dynamique

Partie Publique / Intranet Privé

Droits d’accès

Promouvoir le travail des chercheurs

Publications

Mettre en avant le projet AtysCréa

Démonstrateur Web


Nuage de mots !

8/26

IV. SITE WEB - CONCEPTION

Maquette du Site :


9/26

IV. SITE WEB - RÉALISATION

Drupal et ses modules :

~ 100 Modules Installés :

Droits d’accès

Publications

Menu Déroulant

Etc…

Ex : Gestions des droits d’accès :

Fichier Privé / Public

Contenu Privé / Public

Modifications de certains modules

Code JavaScript (ex : Module Publication)


10/26

IV. SITE WEB – RÉSULTAT FINAL - HTTPS://ATYSCREA.INSA-LYON.FR


11/26

V. GESTIONNAIRE DE FICHIERS – PRÉSENTATION

Objectif : Echanger des fichiers simplement entre collaborateurs (Collaboratif)

Pas de module Drupal répondant à toutes les exigences

Intégré directement au Site Web

Développement en JavaScript

FileAPI

IUT INFORMATIQUE – BOURG-EN-BRESSE IUT INFORMATIQUE – BOURG-EN-BRESSE

12/26

V. GESTIONNAIRE DE FICHIERS – FONCTIONNALITÉS

Fonctionnalités attendues dans ce Gestionnaire :

Gestion des Droits d’accès

Accès aux fichiers Privés

Permissions restreintes

Interactions demandées (Non Exhaustif) :

Upload, Download

Drag & Drop

Multi-Fichiers

Contrainte supplémentaire :

Sans Authentification


13/26

V. GESTIONNAIRE DE FICHIERS – CONCEPTION

Maquette & Diagramme du Gestionnaire de Fichiers :


Diagramme Cas Utilisation - Interactions Maquette du Gestionnaire de fichiers 14/26

V. GESTIONNAIRE DE FICHIERS – RÉALISATION

Libraire JavaScript FileAPI :

Propose des outils pour une meilleure prise en main :

Fonctions facile d’utilisation

Fonctions préconçues :

Upload / Download / Copier / Coller…

Adaptation du Drag & Drop

Droits d’accès

Disponible sur Github : http://mailru.github.io/FileAPI/


15/26

V. GESTIONNAIRE DE FICHIERS – RÉALISATION

Gestion des Droits sans Authentification :

Requête SQL sur la base de Drupal


Schéma de fonctionnement des Droits pour le Gestionnaire de Fichiers

16/26

V. GESTIONNAIRE DE FICHIERS - RÉSULTAT FINAL

Disponible sur l’Intranet du Site


17/26

SOMMAIRE

I . Contexte du Stage

II. Introduction

III. Planning

IV. Site Web

V. Gestionnaire de Fichiers

VI. Démonstrateur Web

VII. Conclusion


18/26

VI. DÉMONSTRATEUR ECHO 3D - PRÉSENTATION

Objectif : Mettre en avant le savoir-faire des chercheurs

Tester les algorithmes des chercheurs directement en ligne

Exemple d’utilisation avec des données Echographiques 3D de la peau


19/26

VI. DÉMONSTRATEUR ECHO 3D - PRÉSENTATION

Librairies utilisées pour le Démonstrateur :

Desk – Interactions en JavaScript

QooxDoo – Interface Graphique (Fenetre, bouton…)

Three JS & WebGL – Afficher des volumes 3D

Node Js – Utilisé par Desk


20/26

VI. DÉMONSTRATEUR ECHO 3D – INSTALLATION

Configuration de l’environnement :

Installation des librairies requises

Installation en Local pour la prise en main

Via Github

… puis sur un serveur distant

Serveur de Sébastien Valette


21/26

VI. DÉMONSTRATEUR ECHO 3D – CONCEPTION

Mise en place de l’interface : Qooxdoo

Inspiré du démonstrateur actuel

Sur le site de Créatis, mais pas le même

type de donnée.


22/26

VI. DÉMONSTRATEUR ECHO 3D – RÉALISATION

Chaine de traitement, de la donnée brut au volume 3D :

Paramètres d’entrées choisi par l’utilisateur

Zone de sélection

Copie des paramètres dans un fichier

Fichier json

Fichier 3D en sortie

Format VTK affichable depuis Desk


23/26

VI. DÉMONSTRATEUR ECHO 3D – RÉSULTAT FINAL


24/26

VII. CONCLUSION


Points to improve : Design of WebSite

Demonstrator

AtysCrea, a concrete project

Relation with IUT

Variety of missions

Capacity to adapt

Project Management

Thanks to all in the Creatis team for hosting and support 25/26

BILAN PERSONNEL


Stage :

Première expérience dans le monde du travail

o Gestion de Projet

o Responsabilités

Acquérir de nouvelles compétences

o JavaScript

o Drupal

o Configuration de Serveur

Et ensuite… : Licence Professionnelle Réseaux & Sécurité à Lyon (ESSIR)

Administrateur Réseau & Sécurité

26/26

DÉMONSTRATION


Site Gestionnaire de

fichiers

Démonstrateur

https://atyscrea.insa-lyon.fr/fr/

https://atyscrea.insa-lyon.fr/fr/fileManager_atyscrea

https://atyscrea.insa-lyon.fr/fr/fileManager_atyscrea

https://desk.creatis.insa-lyon.fr/charpy/

QUESTIONS & RÉPONSES

28

régate des iut - insa lyon · iv. site web - mise en place configuration du serveur qui va...

Documents