Guide riot

This commit is contained in:
Quentin 2020-04-21 20:00:47 +02:00
parent 2aced0ef7e
commit 930f9581d8
16 changed files with 131 additions and 84 deletions

View file

@ -5,84 +5,6 @@ prepend root
block content block content
.spacing h4.spacing
h2 Rejoindre une réunion | Cette page a changé d'adresse :
.spacing a(href="/Guide/Discussion.html") cliquez ici pour être redirigé
p Veuillez entrer le nom de la réunion que vous souhaitez rejoindre :
input#joinname(type="text", placeholder="Nom de la réunion")
a.button#joinbtn(href="#") rejoindre
p
| Le lien d'accès rapide à cette conférence est
|
a#joinlink
.spacing2
h2 Guide de préparation d'une réunion
h3.spacing Étape 1 : Choisissez un nom de réunion (par exemple : "karaté-lyon")
h3 Étape 2 : Informez vos participants de la date de votre réunion et du nom de la réunion
h3
| Étape 3 : Au moment voulu, pour rejoindre la conversation, les participants devront se rendre sur le site
|
a(href="https://deuxfleurs.fr") deuxfleurs.fr
h3 Étape 4 : Puis, une fois sur la page d'accueil, cliquer sur le bouton "📞 visioconférence" (pour arriver sur cette page)
h3 Étape 5 : Enfin, les participants doivent entrer le nom de la réunion (par exemple : "karaté-lyon") et cliquer sur "rejoindre"
h3 Étape 6 : La conférence commence
p Si vous êtes sur téléphone ou tablette, vous devrez cliquez sur "Download the app" pour installer l'app "Jitsi Meet" la première fois et les fois suivantes sur "Continue to the app" avant de pouvoir commencer la conférence.
p Si vous êtes sur un ordinateur et que vous utilisez Mozilla Firefox, vous allez rencontrer un message d'erreur comme quoi votre navigateur n'est pas encore supporté.<br/>En attendant, vous pouvez installer <a href="https://brave.com/">Brave</a> ou <a href="https://www.google.com/intl/fr_fr/chrome/">Google Chrome</a> (nous déplorons cette situation, <a href="https://www.nextinpact.com/brief/videoconferences---firefox-et-jitsi-travaillent-a-un-meilleur-support-11906.htm">explications</a>).
.spacing2
h2 Conseils pour réussir votre réunion
h3.spacing Bien se préparer
p Vous pouvez rejoindre une réunion n'importe quand. Vous pouvez donc tester les étapes du "guide de préparation" en avance !
h3.spacing Bien s'entendre pendant la réunion
p "Tu m'entends ? Non pas très bien ! Qu'est ce que tu viens de dire ?" : quelques conseils pour bien s'entendre pour éviter ça et passer un bon moment.
p
strong Améliorez le son :
|
| l'idéal est d'avoir un casque avec microphone ou des écouteurs avec microphone pour capter le son au plus près de votre bouche et empêcher l'écho (que votre microphone capte ce qui sort sur les hauts parleurs). Si vous n'avez pas de casques ou d'écouteurs ou que vous êtes plusieurs, les ordinateurs portables récents captent mieux le son que les anciens, et généralement votre téléphone captera mieux le son que votre ordinateur. De plus, si vous êtes plusieurs, vous devez savoir que les microphones sont directifs : si vous êtes proches et bien en face de l'ordinateur, on vous entendra bien, sinon on ne vous entendra pas du tout ! En groupe, tournez l'ordinateur vers la personne qui parle ou mettez-vous bien en face pour parler !
p
strong Améliorez votre connexion :
|
| la visioconférence est très sensible à la qualité de votre connexion internet. Si vous le pouvez, connectez votre ordinateur en filaire (cable ethernet) à votre <em>box</em> (routeur internet). Si vous souhaitez rester en sans-fil (wifi), essayez de vous rapprocher de votre <em>box</em>. Le type de connexion internet influencera également la qualité de votre visioconférence : la fibre est idéale, l'ADSL ou les réseaux mobiles (4G et 3G) sont plus incertains.
p
strong Réduisez vos usages :
|
| Activer la vidéo peut causer des interruptions ou dégrader la qualité du son. Si vous n'avez pas besoin de la vidéo, désactivez là ou garder là seulement pour certains participants. Si vous ne parlez pas, vous pouvez également couper votre microphone. Il est possible de passer en mode "talkie walkie" sur ordinateur avec la touche espace. Vous maintenez la touche espace, votre micro est activé. Vous arrêtez d'appuyer sur la touche espace, votre micro est coupé.
p Si vous appliquez ces conseils, vous devriez arriver à communiquer sans peine. Bonnes communications !
script.
(_ => {
const base_url = 'https://jitsi.deuxfleurs.fr/'
const get_meeting_id = raw => raw.replace( /[^a-zA-Z0-9]/gi, '')
const get_meeting_url = raw => base_url + get_meeting_id(raw)
const joinbtn = document.getElementById('joinbtn')
const joinname = document.getElementById('joinname')
const joinlink = document.getElementById('joinlink')
window.addEventListener('pageshow', e => {
joinbtn.text = "rejoindre"
})
joinbtn.onclick = _ => {
const meetingid = joinname.value
if (!meetingid) return // meetingid is empty
window.location.href = get_meeting_url(meetingid)
joinbtn.text = "chargement..."
}
joinname.addEventListener('input', v => {
const l = v.target.value ? get_meeting_url(v.target.value) : ""
joinlink.textContent = l
joinlink.href = l
})
})()

Binary file not shown.

After

Width:  |  Height:  |  Size: 491 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 565 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,013 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 523 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 392 KiB

37
src/Guide/Discussion.pug Normal file
View file

@ -0,0 +1,37 @@
extends ../_layout.pug
prepend root
- title = "Discussions"
block content
.spacing
h2 Accès rapides
.list
a.service-box.spacing(href='https://riot.deuxfleurs.fr')
div(style='font-size: 80px; height: 120px') 🌐
h3 Accéder via le navigateur
a.service-box.spacing(href='https://play.google.com/store/apps/details?id=im.vector.app&hl=fr')
div(style='font-size: 80px; height: 120px') 📥
h3 Application Android
a.service-box.spacing(href='https://apps.apple.com/fr/app/riot-im/id1083446067')
div(style='font-size: 80px; height: 120px') 📥
h3 Application iOS
br
h2.spacing Premiers pas sur Android
.screenlist
img(src="Assets/riot_install4.png", height="400")
img(src="Assets/riot_install5.png", height="400")
img(src="Assets/riot_connect2.png", height="400")
img(src="Assets/riot_connect25.png", height="400")
img(src="Assets/riot_connect3.png", height="400")
img(src="Assets/riot_connect4.png", height="400")
img(src="Assets/riot_connect5.png", height="400")
style.
.screenlist > img {
padding: 20px;
}

View file

@ -0,0 +1,88 @@
extends ../_layout.pug
prepend root
- title = "Visioconférence"
block content
.spacing
h2 Rejoindre une réunion
.spacing
p Veuillez entrer le nom de la réunion que vous souhaitez rejoindre :
input#joinname(type="text", placeholder="Nom de la réunion")
a.button#joinbtn(href="#") rejoindre
p
| Le lien d'accès rapide à cette conférence est
|
a#joinlink
.spacing2
h2 Guide de préparation d'une réunion
h3.spacing Étape 1 : Choisissez un nom de réunion (par exemple : "karaté-lyon")
h3 Étape 2 : Informez vos participants de la date de votre réunion et du nom de la réunion
h3
| Étape 3 : Au moment voulu, pour rejoindre la conversation, les participants devront se rendre sur le site
|
a(href="https://deuxfleurs.fr") deuxfleurs.fr
h3 Étape 4 : Puis, une fois sur la page d'accueil, cliquer sur le bouton "📞 visioconférence" (pour arriver sur cette page)
h3 Étape 5 : Enfin, les participants doivent entrer le nom de la réunion (par exemple : "karaté-lyon") et cliquer sur "rejoindre"
h3 Étape 6 : La conférence commence
p Si vous êtes sur téléphone ou tablette, vous devrez cliquez sur "Download the app" pour installer l'app "Jitsi Meet" la première fois et les fois suivantes sur "Continue to the app" avant de pouvoir commencer la conférence.
p Si vous êtes sur un ordinateur et que vous utilisez Mozilla Firefox, vous allez rencontrer un message d'erreur comme quoi votre navigateur n'est pas encore supporté.<br/>En attendant, vous pouvez installer <a href="https://brave.com/">Brave</a> ou <a href="https://www.google.com/intl/fr_fr/chrome/">Google Chrome</a> (nous déplorons cette situation, <a href="https://www.nextinpact.com/brief/videoconferences---firefox-et-jitsi-travaillent-a-un-meilleur-support-11906.htm">explications</a>).
.spacing2
h2 Conseils pour réussir votre réunion
h3.spacing Bien se préparer
p Vous pouvez rejoindre une réunion n'importe quand. Vous pouvez donc tester les étapes du "guide de préparation" en avance !
h3.spacing Bien s'entendre pendant la réunion
p "Tu m'entends ? Non pas très bien ! Qu'est ce que tu viens de dire ?" : quelques conseils pour bien s'entendre pour éviter ça et passer un bon moment.
p
strong Améliorez le son :
|
| l'idéal est d'avoir un casque avec microphone ou des écouteurs avec microphone pour capter le son au plus près de votre bouche et empêcher l'écho (que votre microphone capte ce qui sort sur les hauts parleurs). Si vous n'avez pas de casques ou d'écouteurs ou que vous êtes plusieurs, les ordinateurs portables récents captent mieux le son que les anciens, et généralement votre téléphone captera mieux le son que votre ordinateur. De plus, si vous êtes plusieurs, vous devez savoir que les microphones sont directifs : si vous êtes proches et bien en face de l'ordinateur, on vous entendra bien, sinon on ne vous entendra pas du tout ! En groupe, tournez l'ordinateur vers la personne qui parle ou mettez-vous bien en face pour parler !
p
strong Améliorez votre connexion :
|
| la visioconférence est très sensible à la qualité de votre connexion internet. Si vous le pouvez, connectez votre ordinateur en filaire (cable ethernet) à votre <em>box</em> (routeur internet). Si vous souhaitez rester en sans-fil (wifi), essayez de vous rapprocher de votre <em>box</em>. Le type de connexion internet influencera également la qualité de votre visioconférence : la fibre est idéale, l'ADSL ou les réseaux mobiles (4G et 3G) sont plus incertains.
p
strong Réduisez vos usages :
|
| Activer la vidéo peut causer des interruptions ou dégrader la qualité du son. Si vous n'avez pas besoin de la vidéo, désactivez là ou garder là seulement pour certains participants. Si vous ne parlez pas, vous pouvez également couper votre microphone. Il est possible de passer en mode "talkie walkie" sur ordinateur avec la touche espace. Vous maintenez la touche espace, votre micro est activé. Vous arrêtez d'appuyer sur la touche espace, votre micro est coupé.
p Si vous appliquez ces conseils, vous devriez arriver à communiquer sans peine. Bonnes communications !
script.
(_ => {
const base_url = 'https://jitsi.deuxfleurs.fr/'
const get_meeting_id = raw => raw.replace( /[^a-zA-Z0-9]/gi, '')
const get_meeting_url = raw => base_url + get_meeting_id(raw)
const joinbtn = document.getElementById('joinbtn')
const joinname = document.getElementById('joinname')
const joinlink = document.getElementById('joinlink')
window.addEventListener('pageshow', e => {
joinbtn.text = "rejoindre"
})
joinbtn.onclick = _ => {
const meetingid = joinname.value
if (!meetingid) return // meetingid is empty
window.location.href = get_meeting_url(meetingid)
joinbtn.text = "chargement..."
}
joinname.addEventListener('input', v => {
const l = v.target.value ? get_meeting_url(v.target.value) : ""
joinlink.textContent = l
joinlink.href = l
})
})()

View file

@ -107,7 +107,7 @@ header > .container > .menu-item > a, header > .container > .menu-item > span {
} }
.list > br { .list > br {
clear: both; clear: left;
} }
.center { .center {

View file

@ -13,10 +13,10 @@ block content
section.spacing section.spacing
h2 nos services éthiques h2 nos services éthiques
.list .list
a.service-box.spacing(href='https://riot.deuxfleurs.fr') a.service-box.spacing(href='/Guide/Discussion.html')
div(style='font-size: 80px; height: 120px') 💬 div(style='font-size: 80px; height: 120px') 💬
h3 discussions h3 discussions
a.service-box.spacing(href='/@jitsi.html') a.service-box.spacing(href='/Guide/Visioconférence.html')
div(style='font-size: 80px; height: 120px') 📞 div(style='font-size: 80px; height: 120px') 📞
h3 visioconférence h3 visioconférence
a.service-box.spacing(href='https://cloud.deuxfleurs.fr') a.service-box.spacing(href='https://cloud.deuxfleurs.fr')