DGNum/experiENS
6
0
Fork 0
Code Issues 11 Pull requests 1 Projects Releases Packages Wiki Activity Actions

Formulaire choix de lieu plus clair

Browse source
This commit is contained in:
Evarin 2018-12-30 20:33:44 +01:00
parent da3ce8f464
commit 5275e9036a
8 changed files with 361 additions and 119 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
avisstage/api.py
View file

@ -8,6 +8,7 @@ from django.contrib.gis import geos
from django.urls import reverse from django.urls import reverse
from .models import Lieu, Stage, Normalien, StageMatiere from .models import Lieu, Stage, Normalien, StageMatiere
from .utils import approximate_distance
class EnScolariteAuthentication(SessionAuthentication): class EnScolariteAuthentication(SessionAuthentication):
def is_authenticated(self, request, **kwargs): def is_authenticated(self, request, **kwargs):
@ -60,9 +61,10 @@ class LieuResource(ModelResource):
bundle.data['coord'] = {'lat': float(obj.coord.y), bundle.data['coord'] = {'lat': float(obj.coord.y),
'lng': float(obj.coord.x)} 'lng': float(obj.coord.x)}
# Distance au point recherché (inutile en fait) # Distance au point recherché
#if "lat" in bundle.request.GET and "lng" in bundle.request.GET: if "lat" in bundle.request.GET and "lng" in bundle.request.GET:
# bundle.data['distance'] = self.reference_point.distance(bundle.obj.coord) bundle.data['distance'] = approximate_distance(
self.reference_point, bundle.obj.coord)
# Autres infos utiles # Autres infos utiles
bundle.data["pays_nom"] = obj.get_pays_display() bundle.data["pays_nom"] = obj.get_pays_display()

98
avisstage/sass/screen.scss
View file

@ -270,19 +270,19 @@ p.warning {
} }
} }
} }
a.hoverlink {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
} }
} }
a.hoverlink {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
ul.infos { ul.infos {
margin: 0 -3px; margin: 0 -3px;
padding: 0; padding: 0;
@ -516,15 +516,20 @@ form {
// taggit autosuggest // taggit autosuggest
ul.as-selections { ul.as-selections,
.selectize-control.multi {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
li { li {
display:inline-block; display:inline-block;
} }
.selectize-input, .selectize-dropdown {
.as-selection-item { font-size: 100%;
line-height: 1.1;
}
.as-selection-item,
.selectize-input > div {
padding: 0 5px; padding: 0 5px;
background: $compl; background: $compl;
color: #fff; color: #fff;
@ -648,8 +653,16 @@ div.as-results {
// Widget choix et ajout de lieux // Widget choix et ajout de lieux
#lieu_widget { #lieu_widget {
.window-content {
max-width: 800px;
}
.lieu-ui { .lieu-ui {
position: relative; position: relative;
width: 100%;
min-width: 150px;
flex: 2;
.map { .map {
height: 400px; height: 400px;
width: 100%; width: 100%;
@ -662,10 +675,67 @@ div.as-results {
} }
} }
.lieu-choixmodif { .lieu-choixmodif, .lieu-options {
display: none; display: none;
} }
.lieu-global {
display: flex;
width: 100%;
flex-wrap: wrap;
&.with-options {
.lieu-options {
display: block;
}
}
}
&.modif, &.edit {
.lieu-global.with-options .lieu-options {
display: none;
}
}
.lieu-options {
padding: 7px;
max-width: 350px;
flex: 3;
.lieu-suggestions {
max-height: 300px;
overflow-y: auto;
li {
position: relative;
background: #fff;
margin: 2px;
padding: 4px;
font-size: 0.9em;
&:hover {
background: #ccc;
}
p {
margin: 2px 0;
}
.lieu-nom {
font-weight: bold;
}
.lieu-infos {
font-size: 0.8em;
display:flex;
width: 100%;
justify-content: space-between;
span {
display: inline-block;
text-overflow: ellipsis;
overlow: hidden;
}
}
}
}
}
&.modif { &.modif {
.lieu-choixmodif { .lieu-choixmodif {
display: unset; display: unset;

242
avisstage/static/css/screen.css
View file

@ -399,8 +399,9 @@ p.warning {
.stage-liste li .misc-hdr .dates svg text { .stage-liste li .misc-hdr .dates svg text {
font-size: 0.8; font-size: 0.8;
} }
/* line 274, ../../sass/screen.scss */
.stage-liste li a.hoverlink { /* line 276, ../../sass/screen.scss */
a.hoverlink {
position: absolute; position: absolute;
display: block; display: block;
top: 0; top: 0;
@ -929,16 +930,28 @@ form .field .input {
} }
/* line 519, ../../sass/screen.scss */ /* line 519, ../../sass/screen.scss */
ul.as-selections { ul.as-selections,
.selectize-control.multi {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
} }
/* line 523, ../../sass/screen.scss */ /* line 524, ../../sass/screen.scss */
ul.as-selections li { ul.as-selections li,
.selectize-control.multi li {
display: inline-block; display: inline-block;
} }
/* line 527, ../../sass/screen.scss */ /* line 527, ../../sass/screen.scss */
ul.as-selections .as-selection-item { ul.as-selections .selectize-input, ul.as-selections .selectize-dropdown,
.selectize-control.multi .selectize-input,
.selectize-control.multi .selectize-dropdown {
font-size: 100%;
line-height: 1.1;
}
/* line 531, ../../sass/screen.scss */
ul.as-selections .as-selection-item,
ul.as-selections .selectize-input > div,
.selectize-control.multi .as-selection-item,
.selectize-control.multi .selectize-input > div {
padding: 0 5px; padding: 0 5px;
background: #f99b20; background: #f99b20;
color: #fff; color: #fff;
@ -946,53 +959,61 @@ ul.as-selections .as-selection-item {
border-radius: 2px; border-radius: 2px;
font-weight: 500; font-weight: 500;
} }
/* line 535, ../../sass/screen.scss */ /* line 540, ../../sass/screen.scss */
ul.as-selections .as-selection-item a.as-close { ul.as-selections .as-selection-item a.as-close,
ul.as-selections .selectize-input > div a.as-close,
.selectize-control.multi .as-selection-item a.as-close,
.selectize-control.multi .selectize-input > div a.as-close {
color: #fff; color: #fff;
-webkit-cursor: pointer; -webkit-cursor: pointer;
cursor: pointer; cursor: pointer;
margin-right: 5px; margin-right: 5px;
} }
/* line 542, ../../sass/screen.scss */ /* line 547, ../../sass/screen.scss */
ul.as-selections .as-selection-item.selected { ul.as-selections .as-selection-item.selected,
ul.as-selections .selectize-input > div.selected,
.selectize-control.multi .as-selection-item.selected,
.selectize-control.multi .selectize-input > div.selected {
background: #8fcc33; background: #8fcc33;
} }
/* line 547, ../../sass/screen.scss */ /* line 552, ../../sass/screen.scss */
ul.as-selections .as-original { ul.as-selections .as-original,
.selectize-control.multi .as-original {
flex-grow: 1; flex-grow: 1;
min-width: 200px; min-width: 200px;
} }
/* line 551, ../../sass/screen.scss */ /* line 556, ../../sass/screen.scss */
ul.as-selections .as-original input { ul.as-selections .as-original input,
.selectize-control.multi .as-original input {
width: 100%; width: 100%;
} }
/* line 557, ../../sass/screen.scss */ /* line 562, ../../sass/screen.scss */
div.as-results { div.as-results {
position: relative; position: relative;
z-index: 2; z-index: 2;
} }
/* line 561, ../../sass/screen.scss */ /* line 566, ../../sass/screen.scss */
div.as-results ul { div.as-results ul {
position: absolute; position: absolute;
width: 100%; width: 100%;
background: #fff; background: #fff;
border: 1px solid #d2ebad; border: 1px solid #d2ebad;
} }
/* line 568, ../../sass/screen.scss */ /* line 573, ../../sass/screen.scss */
div.as-results ul li { div.as-results ul li {
padding: 3px 5px; padding: 3px 5px;
} }
/* line 574, ../../sass/screen.scss */ /* line 579, ../../sass/screen.scss */
div.as-results ul li.as-result-item.active { div.as-results ul li.as-result-item.active {
background: #fddeb5; background: #fddeb5;
} }
/* line 579, ../../sass/screen.scss */ /* line 584, ../../sass/screen.scss */
div.as-results ul li.as-message { div.as-results ul li.as-message {
font-style: italic; font-style: italic;
} }
/* line 589, ../../sass/screen.scss */ /* line 594, ../../sass/screen.scss */
.window { .window {
display: none; display: none;
position: fixed; position: fixed;
@ -1003,11 +1024,11 @@ div.as-results ul li.as-message {
left: 0; left: 0;
z-index: 50; z-index: 50;
} }
/* line 599, ../../sass/screen.scss */ /* line 604, ../../sass/screen.scss */
.window.visible { .window.visible {
display: block; display: block;
} }
/* line 603, ../../sass/screen.scss */ /* line 608, ../../sass/screen.scss */
.window .window-bg { .window .window-bg {
background: #000; background: #000;
opacity: 0.7; opacity: 0.7;
@ -1018,7 +1039,7 @@ div.as-results ul li.as-message {
top: 0; top: 0;
z-index: -1; z-index: -1;
} }
/* line 614, ../../sass/screen.scss */ /* line 619, ../../sass/screen.scss */
.window .window-content { .window .window-content {
position: relative; position: relative;
margin: 0 auto; margin: 0 auto;
@ -1032,11 +1053,11 @@ div.as-results ul li.as-message {
max-height: 100%; max-height: 100%;
overflow: auto; overflow: auto;
} }
/* line 628, ../../sass/screen.scss */ /* line 633, ../../sass/screen.scss */
.window .window-content form label, .window .window-content form .label { .window .window-content form label, .window .window-content form .label {
width: 150px; width: 150px;
} }
/* line 634, ../../sass/screen.scss */ /* line 639, ../../sass/screen.scss */
.window .window-closer { .window .window-closer {
position: absolute; position: absolute;
top: 0; top: 0;
@ -1044,65 +1065,130 @@ div.as-results ul li.as-message {
padding: 12px; padding: 12px;
z-index: 3; z-index: 3;
} }
/* line 640, ../../sass/screen.scss */ /* line 645, ../../sass/screen.scss */
.window .window-closer:after { .window .window-closer:after {
content: "×"; content: "×";
} }
/* line 651, ../../sass/screen.scss */ /* line 656, ../../sass/screen.scss */
#lieu_widget .window-content {
max-width: 800px;
}
/* line 660, ../../sass/screen.scss */
#lieu_widget .lieu-ui { #lieu_widget .lieu-ui {
position: relative; position: relative;
width: 100%;
min-width: 150px;
flex: 2;
} }
/* line 653, ../../sass/screen.scss */ /* line 666, ../../sass/screen.scss */
#lieu_widget .lieu-ui .map { #lieu_widget .lieu-ui .map {
height: 400px; height: 400px;
width: 100%; width: 100%;
} }
/* line 657, ../../sass/screen.scss */ /* line 670, ../../sass/screen.scss */
#lieu_widget .lieu-ui.hidden { #lieu_widget .lieu-ui.hidden {
display: none; display: none;
} }
/* line 660, ../../sass/screen.scss */ /* line 673, ../../sass/screen.scss */
#lieu_widget .lieu-ui .masked { #lieu_widget .lieu-ui .masked {
visibility: hidden; visibility: hidden;
} }
/* line 665, ../../sass/screen.scss */ /* line 678, ../../sass/screen.scss */
#lieu_widget .lieu-choixmodif { #lieu_widget .lieu-choixmodif, #lieu_widget .lieu-options {
display: none;
}
/* line 670, ../../sass/screen.scss */
#lieu_widget.modif .lieu-choixmodif {
display: unset;
}
/* line 675, ../../sass/screen.scss */
#lieu_widget.modif .lieu-ui, #lieu_widget.attente .lieu-ui {
display: none; display: none;
} }
/* line 682, ../../sass/screen.scss */ /* line 682, ../../sass/screen.scss */
#lieu_widget .lieu-global {
display: flex;
width: 100%;
flex-wrap: wrap;
}
/* line 687, ../../sass/screen.scss */
#lieu_widget .lieu-global.with-options .lieu-options {
display: block;
}
/* line 694, ../../sass/screen.scss */
#lieu_widget.modif .lieu-global.with-options .lieu-options, #lieu_widget.edit .lieu-global.with-options .lieu-options {
display: none;
}
/* line 699, ../../sass/screen.scss */
#lieu_widget .lieu-options {
padding: 7px;
max-width: 350px;
flex: 3;
}
/* line 704, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions {
max-height: 300px;
overflow-y: auto;
}
/* line 708, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li {
position: relative;
background: #fff;
margin: 2px;
padding: 4px;
font-size: 0.9em;
}
/* line 714, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li:hover {
background: #ccc;
}
/* line 717, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li p {
margin: 2px 0;
}
/* line 720, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li .lieu-nom {
font-weight: bold;
}
/* line 723, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li .lieu-infos {
font-size: 0.8em;
display: flex;
width: 100%;
justify-content: space-between;
}
/* line 729, ../../sass/screen.scss */
#lieu_widget .lieu-options .lieu-suggestions li .lieu-infos span {
display: inline-block;
text-overflow: ellipsis;
overlow: hidden;
}
/* line 740, ../../sass/screen.scss */
#lieu_widget.modif .lieu-choixmodif {
display: unset;
}
/* line 745, ../../sass/screen.scss */
#lieu_widget.modif .lieu-ui, #lieu_widget.attente .lieu-ui {
display: none;
}
/* line 752, ../../sass/screen.scss */
#lieu_widget.edit .lieu-ui .lieu-acinput { #lieu_widget.edit .lieu-ui .lieu-acinput {
display: none; display: none;
} }
/* line 685, ../../sass/screen.scss */ /* line 755, ../../sass/screen.scss */
#lieu_widget.edit .lieu-ui .map { #lieu_widget.edit .lieu-ui .map {
height: 200px; height: 200px;
} }
/* line 691, ../../sass/screen.scss */ /* line 761, ../../sass/screen.scss */
#lieu_widget #avis_lieu_vide { #lieu_widget #avis_lieu_vide {
display: none; display: none;
} }
/* line 695, ../../sass/screen.scss */ /* line 765, ../../sass/screen.scss */
#lieu_widget .message { #lieu_widget .message {
background: #fddeb5; background: #fddeb5;
padding: 5px; padding: 5px;
font-style: italic; font-style: italic;
font-size: 0.9em; font-size: 0.9em;
} }
/* line 701, ../../sass/screen.scss */ /* line 771, ../../sass/screen.scss */
#lieu_widget .message.hidden { #lieu_widget .message.hidden {
display: none; display: none;
} }
/* line 707, ../../sass/screen.scss */ /* line 777, ../../sass/screen.scss */
a.lieu-change { a.lieu-change {
color: #fff; color: #fff;
background: #f99b20; background: #f99b20;
@ -1115,25 +1201,25 @@ a.lieu-change {
border-radius: 5px; border-radius: 5px;
margin-right: 7px; margin-right: 7px;
} }
/* line 719, ../../sass/screen.scss */ /* line 789, ../../sass/screen.scss */
a.lieu-change.ajout:before { a.lieu-change.ajout:before {
content: "+"; content: "+";
margin-right: 5px; margin-right: 5px;
} }
/* line 725, ../../sass/screen.scss */ /* line 795, ../../sass/screen.scss */
#stages-map { #stages-map {
width: 100%; width: 100%;
height: 600px; height: 600px;
max-height: 90vh; max-height: 90vh;
} }
/* line 732, ../../sass/screen.scss */ /* line 802, ../../sass/screen.scss */
#id_stage-thematiques { #id_stage-thematiques {
display: none; display: none;
} }
/* line 738, ../../sass/screen.scss */ /* line 808, ../../sass/screen.scss */
.homeh1 { .homeh1 {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -1143,26 +1229,26 @@ a.lieu-change.ajout:before {
border-bottom: 3px solid #000; border-bottom: 3px solid #000;
margin-bottom: 15px; margin-bottom: 15px;
} }
/* line 747, ../../sass/screen.scss */ /* line 817, ../../sass/screen.scss */
.homeh1 h1 { .homeh1 h1 {
margin-bottom: 3px; margin-bottom: 3px;
} }
/* line 751, ../../sass/screen.scss */ /* line 821, ../../sass/screen.scss */
.homeh1 > * { .homeh1 > * {
display: inline-block; display: inline-block;
} }
/* line 754, ../../sass/screen.scss */ /* line 824, ../../sass/screen.scss */
.homeh1 p { .homeh1 p {
text-align: right; text-align: right;
} }
/* line 759, ../../sass/screen.scss */ /* line 829, ../../sass/screen.scss */
.betacadre { .betacadre {
background: #fa6cae; background: #fa6cae;
padding: 10px; padding: 10px;
} }
/* line 764, ../../sass/screen.scss */ /* line 834, ../../sass/screen.scss */
.entrer { .entrer {
background: #fff; background: #fff;
max-width: 500px; max-width: 500px;
@ -1170,7 +1256,7 @@ a.lieu-change.ajout:before {
text-align: center; text-align: center;
margin: 15px auto; margin: 15px auto;
} }
/* line 771, ../../sass/screen.scss */ /* line 841, ../../sass/screen.scss */
.entrer .archicubes { .entrer .archicubes {
border-top: 2px solid #1a82dd; border-top: 2px solid #1a82dd;
margin-top: 5px; margin-top: 5px;
@ -1178,84 +1264,84 @@ a.lieu-change.ajout:before {
font-size: 0.9em; font-size: 0.9em;
} }
/* line 779, ../../sass/screen.scss */ /* line 849, ../../sass/screen.scss */
article.promo { article.promo {
display: block; display: block;
font-size: 1.1em; font-size: 1.1em;
} }
/* line 783, ../../sass/screen.scss */ /* line 853, ../../sass/screen.scss */
article.promo .explications { article.promo .explications {
display: table; display: table;
} }
/* line 786, ../../sass/screen.scss */ /* line 856, ../../sass/screen.scss */
article.promo .explications:first-child { article.promo .explications:first-child {
direction: rtl; direction: rtl;
} }
/* line 788, ../../sass/screen.scss */ /* line 858, ../../sass/screen.scss */
article.promo .explications:first-child > * { article.promo .explications:first-child > * {
direction: ltr; direction: ltr;
} }
/* line 793, ../../sass/screen.scss */ /* line 863, ../../sass/screen.scss */
article.promo .explications > div { article.promo .explications > div {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
} }
/* line 798, ../../sass/screen.scss */ /* line 868, ../../sass/screen.scss */
article.promo .explications > div p { article.promo .explications > div p {
margin: 15px 15px; margin: 15px 15px;
} }
/* line 806, ../../sass/screen.scss */ /* line 876, ../../sass/screen.scss */
.faq-toc { .faq-toc {
font-family: "Lato", sans-serif; font-family: "Lato", sans-serif;
display: block; display: block;
max-width: 700px; max-width: 700px;
margin: 0 auto; margin: 0 auto;
} }
/* line 811, ../../sass/screen.scss */ /* line 881, ../../sass/screen.scss */
.faq-toc ul { .faq-toc ul {
margin: 20px; margin: 20px;
} }
/* line 815, ../../sass/screen.scss */ /* line 885, ../../sass/screen.scss */
.faq-toc ul li a { .faq-toc ul li a {
color: #000; color: #000;
display: block; display: block;
padding: 5px; padding: 5px;
} }
/* line 821, ../../sass/screen.scss */ /* line 891, ../../sass/screen.scss */
.faq-toc ul li.toc-h1 { .faq-toc ul li.toc-h1 {
display: none; display: none;
} }
/* line 825, ../../sass/screen.scss */ /* line 895, ../../sass/screen.scss */
.faq-toc ul li.toc-h2 a { .faq-toc ul li.toc-h2 a {
background: #fcc883; background: #fcc883;
} }
/* line 829, ../../sass/screen.scss */ /* line 899, ../../sass/screen.scss */
.faq-toc ul li.toc-h3 a { .faq-toc ul li.toc-h3 a {
padding-left: 10px; padding-left: 10px;
background: #fff; background: #fff;
font-weight: normal; font-weight: normal;
} }
/* line 835, ../../sass/screen.scss */ /* line 905, ../../sass/screen.scss */
.faq-toc ul li a:hover { .faq-toc ul li a:hover {
color: #395214; color: #395214;
background: #bce085 !important; background: #bce085 !important;
} }
/* line 844, ../../sass/screen.scss */ /* line 914, ../../sass/screen.scss */
.faq article { .faq article {
background: #fff; background: #fff;
padding: 15px; padding: 15px;
} }
/* line 847, ../../sass/screen.scss */ /* line 917, ../../sass/screen.scss */
.faq article h2 { .faq article h2 {
background-color: #fcc883; background-color: #fcc883;
color: #ae6505; color: #ae6505;
margin: -15px; margin: -15px;
padding: 15px; padding: 15px;
} }
/* line 854, ../../sass/screen.scss */ /* line 924, ../../sass/screen.scss */
.faq article h3 { .faq article h3 {
color: #0f4c82; color: #0f4c82;
background-color: #9dcbf3; background-color: #9dcbf3;
@ -1263,19 +1349,19 @@ article.promo .explications > div p {
margin-top: 30px; margin-top: 30px;
padding: 10px 15px; padding: 10px 15px;
} }
/* line 861, ../../sass/screen.scss */ /* line 931, ../../sass/screen.scss */
.faq article h3:nth-child(2) { .faq article h3:nth-child(2) {
margin-top: 0; margin-top: 0;
} }
/* line 866, ../../sass/screen.scss */ /* line 936, ../../sass/screen.scss */
.faq article ul { .faq article ul {
padding-left: 20px; padding-left: 20px;
} }
/* line 868, ../../sass/screen.scss */ /* line 938, ../../sass/screen.scss */
.faq article ul li { .faq article ul li {
list-style: initial; list-style: initial;
} }
/* line 873, ../../sass/screen.scss */ /* line 943, ../../sass/screen.scss */
.faq article p, .faq article ul { .faq article p, .faq article ul {
font-family: "Lato", sans-serif; font-family: "Lato", sans-serif;
font-size: 18px; font-size: 18px;
@ -1284,20 +1370,20 @@ article.promo .explications > div p {
margin-right: 5%; margin-right: 5%;
} }
/* line 887, ../../sass/screen.scss */ /* line 957, ../../sass/screen.scss */
table.stats { table.stats {
width: 100%; width: 100%;
background: #fff; background: #fff;
margin: 20px 0; margin: 20px 0;
cellspacing: 1px; cellspacing: 1px;
} }
/* line 892, ../../sass/screen.scss */ /* line 962, ../../sass/screen.scss */
table.stats th { table.stats th {
font-weight: bold; font-weight: bold;
border-top: 1px solid #000; border-top: 1px solid #000;
border-bottom: 1px solid #999; border-bottom: 1px solid #999;
} }
/* line 897, ../../sass/screen.scss */ /* line 967, ../../sass/screen.scss */
table.stats td, table.stats th { table.stats td, table.stats th {
padding: 5px 3px; padding: 5px 3px;
text-align: center; text-align: center;

96
avisstage/static/js/select_lieu.js
View file

@ -15,6 +15,10 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
var message_el = $el.find(".lieu-message"); var message_el = $el.find(".lieu-message");
var closer = $el.find(".window-closer"); var closer = $el.find(".window-closer");
var cmodif_el = $el.find(".lieu-choixmodif"); var cmodif_el = $el.find(".lieu-choixmodif");
var lieuglobal_el = $el.find(".lieu-global");
var lieuoptions_el = $el.find(".lieu-options");
var suggestions_el = $el.find(".lieu-suggestions");
var newlieubtn_el = $el.find(".new-lieu-btn");
var marqueurs = L.markerClusterGroup(); var marqueurs = L.markerClusterGroup();
// Variables globales // Variables globales
@ -59,7 +63,12 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
// Affiche la carte // Affiche la carte
map = L.map(map_el[0]).setView([48.8422411,2.3430553], 15); map = L.map(map_el[0]).setView([48.8422411,2.3430553], 15);
var layer = new L.TileLayer("https://korona.geog.uni-heidelberg.de/tiles/roads/x={x}&y={y}&z={z}", {attribution: 'Map tiles by <a href="http://korona.geog.uni-heidelberg.de/">GIScience Heidelberg</a>'}); var layer = new L.TileLayer(
"https://korona.geog.uni-heidelberg.de/"
+ "tiles/roads/x={x}&y={y}&z={z}",
{attribution: 'Map tiles by ' +
'<a href="http://korona.geog.uni-heidelberg.de/">' +
'GIScience Heidelberg</a>'});
map.addLayer(layer); map.addLayer(layer);
map.addLayer(marqueurs); map.addLayer(marqueurs);
@ -149,8 +158,10 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
lieux_db.suggestion = data; lieux_db.suggestion = data;
map.panTo(data.coord); panMapTo(data.coord);
lieuSurCarte(data, redIcon); lieuSurCarte(data, redIcon);
newlieubtn_el.prop("_lieustage_data", data)
.on("click", choixLieuStage);
// Affichage des suggestions // Affichage des suggestions
askForSuggestions(place.geometry.location); askForSuggestions(place.geometry.location);
@ -166,17 +177,52 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
// Callback suggestions // Callback suggestions
function showPropositions(data) { function showPropositions(data) {
showMessage("Cliquez sur un des lieux déjà existants (en bleu) pour le choisir, ou sur votre recherche (en rouge) pour créer un nouveau lieu"); showMessage("Cliquez sur un des lieux déjà existants (en bleu) " +
"pour le choisir, ou sur votre recherche (en rouge) " +
"pour créer un nouveau lieu");
suggestions_el.html("");
lieuglobal_el.addClass("with-options");
map.invalidateSize();
data.objects.sort(function(a,b){ return a.distance-b.distance; });
function showdistance (dist) {
if(dist<1000) return Math.round(dist) + "m";
else return (Math.round(dist/100)/10) + "km";
}
// Affichage sur la carte // Affichage sur la carte
$.each(data.objects, function(i, item) { $.each(data.objects, function(i, item) {
var plieu = lieux_db[item.id]; var plieu = lieux_db[item.id];
if(plieu !== undefined) if(plieu !== undefined) {
plieu.distance = item.distance;
item = plieu; item = plieu;
else } else
lieux_db[item.id] = item; lieux_db[item.id] = item;
var option_el = $("<li>", {class: "lieu-option"})
.append($("<p>", {class: "lieu-nom"}).text(item.nom))
.append($("<p>", {class: "lieu-infos"})
.append($("<span>", {class: "numstages"})
.text((item.num_stages || 0) + " stage"
+ (item.num_stages>1 ? "s" : "") + " ici"))
.append($("<span>", {class: "ville"})
.text(item.ville+", "+item.pays_nom))
.append($("<span>", {class: "distance"})
.text("à "+showdistance(item.distance))))
.append($("<a>", {class: "hoverlink",
href: "javascript:void(0)"}))
.prop("_lieustage_data", item)
.on("click", choixLieuStage);
suggestions_el.append(option_el);
lieuSurCarte(item, blueIcon); lieuSurCarte(item, blueIcon);
}); });
if (data.objects.length == 0) {
var option_el = $("<li>", {class: "lieu-option"})
.append($("<p>", {class: "lieu-infos"})
.text("Aucun lieu déjà connu à proximité"));
suggestions_el.append(option_el);
}
panMapTo(lieux_db.suggestion.coord);
} }
// Affiche un lieu sur la carte // Affiche un lieu sur la carte
@ -201,10 +247,14 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
data.marqueur = marqueur; data.marqueur = marqueur;
// Création de la description // Création de la description
var desc = $("<div>").append($("<h3>").text(data.nom)) var desc = $("<div>").append($("<h4>").text(data.nom))
.append($("<p>").text(data.ville+", "+data.pays_nom)); .append($("<p>")
.text(data.ville+", "+data.pays_nom));
if (data.num_stages !== undefined) if (data.num_stages !== undefined)
desc.append($("<p>").text(data.num_stages + (data.num_stages > 1 ? " stages" : " stage") + " à cet endroit")); desc.append($("<p>")
.text(data.num_stages
+ (data.num_stages > 1 ? " stages" : " stage")
+ " à cet endroit"));
var activeBtn = $("<a>", {href:"javascript:void(0);"}) var activeBtn = $("<a>", {href:"javascript:void(0);"})
.prop("_lieustage_data", data) .prop("_lieustage_data", data)
@ -229,7 +279,7 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
function resetOrigLieu() { function resetOrigLieu() {
var data = this._lieustage_data; var data = this._lieustage_data;
data.marqueur.setLatLng(data.orig_coord); data.marqueur.setLatLng(data.orig_coord);
map.panTo(data.orig_coord); panMapTo(data.orig_coord);
} }
// //
@ -248,12 +298,15 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
if (modification == true) { if (modification == true) {
setUIMode("ajout"); setUIMode("ajout");
form_el.find("#id_id").val(choix.id); form_el.find("#id_id").val(choix.id);
form_el.find("h3").text("Modifier un lieu"); form_el.find(".form-title").text("Modifier un lieu");
} else { } else {
setUIMode("edit"); setUIMode("edit");
form_el.find("#id_id").val(''); form_el.find("#id_id").val('');
form_el.find("h3").text("Créer un lieu"); form_el.find(".form-title").text("Créer un lieu");
} }
map.invalidateSize();
panMapTo(choix.coord);
} }
// Envoi du formulaire // Envoi du formulaire
@ -306,7 +359,7 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
var lieu = lieux_db[modiflieu_id]; var lieu = lieux_db[modiflieu_id];
lieu.fromSuggestion = true; lieu.fromSuggestion = true;
map.panTo(lieu.coord); panMapTo(lieu.coord);
lieuSurCarte(lieu, greenIcon); lieuSurCarte(lieu, greenIcon);
showForm(lieu, true); showForm(lieu, true);
@ -318,9 +371,13 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
var lieu = lieux_db[modiflieu_id]; var lieu = lieux_db[modiflieu_id];
lieu.fromSuggestion = false; lieu.fromSuggestion = false;
map.panTo(lieu.coord);
lieuSurCarte(lieu, greenIcon);
map.invalidateSize();
panMapTo(lieu.coord);
lieuSurCarte(lieu, greenIcon);
newlieubtn_el.prop("_lieustage_data", lieu)
.on("click", choixLieuStage);
lieux_db.suggestion = lieu;
askForSuggestions(lieu.coord); askForSuggestions(lieu.coord);
} }
@ -332,6 +389,7 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
initUI(); initUI();
input.val(''); input.val('');
lieuglobal_el.removeClass("with-options");
// Nettoyage // Nettoyage
hideMessage(); hideMessage();
@ -344,14 +402,14 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
if (lieu_id === undefined) { if (lieu_id === undefined) {
// Choix d'un nouveau lieu : pas grand-chose à faire // Choix d'un nouveau lieu : pas grand-chose à faire
ui_mode_creation = true; ui_mode_creation = true;
$el.find("h3").text("Ajouter un lieu"); $el.find(".window-title").text("Ajouter un lieu");
map_el.addClass("masked"); map_el.addClass("masked");
} else { } else {
// Lieu déjà existant // Lieu déjà existant
lieu_id = lieu_id * 1; lieu_id = lieu_id * 1;
ui_mode_creation = false; ui_mode_creation = false;
modiflieu_id = lieu_id; modiflieu_id = lieu_id;
$el.find("h3").text("Modifier le lieu"); $el.find(".window-title").text("Modifier le lieu");
// Chargement des infos // Chargement des infos
if(lieux_db[lieu_id] === undefined) { if(lieux_db[lieu_id] === undefined) {
@ -364,6 +422,10 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
} }
} }
function panMapTo(coord) {
map.panTo(coord);
}
// Fermeture du widget // Fermeture du widget
function closeWidget () { function closeWidget () {
$el.removeClass("visible"); $el.removeClass("visible");
@ -373,7 +435,7 @@ function SelectLieuWidget(STATIC_ROOT, API_LIEU, target, callback) {
// Le lieu est choisi, on appelle le callback // Le lieu est choisi, on appelle le callback
function choixLieuStage() { function choixLieuStage() {
var choix = this._lieustage_data; var choix = this._lieustage_data;
if(!choix.fromSuggestion) if(!choix.fromSuggestion && this !== newlieubtn_el[0])
callback(choix); callback(choix);
else else
showForm(choix); showForm(choix);

5
avisstage/templates/avisstage/base.html
View file

@ -5,8 +5,6 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>{% block title %}ExperiENS{% endblock %}</title> <title>{% block title %}ExperiENS{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0;"> <meta name="viewport" content="width=device-width, initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0;">
<link type="text/css" rel="stylesheet" href="{% static 'css/jquery-ui.min.css' %}" />
<link type="text/css" rel="stylesheet" href="{% static 'css/screen.css' %}" />
<script type="text/javascript" src="{% static "js/jquery-3.2.0.min.js" %}"></script> <script type="text/javascript" src="{% static "js/jquery-3.2.0.min.js" %}"></script>
<script type="text/javascript" src="{% static "js/jquery-ui.min.js" %}"></script> <script type="text/javascript" src="{% static "js/jquery-ui.min.js" %}"></script>
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
@ -16,6 +14,9 @@
{% endif %} {% endif %}
{% block extra_head %}{% endblock %} {% block extra_head %}{% endblock %}
<link type="text/css" rel="stylesheet" href="{% static 'css/jquery-ui.min.css' %}" />
<link type="text/css" rel="stylesheet" href="{% static 'css/screen.css' %}" />
</head> </head>
<body class="{% block bodyclass %}{% endblock %}"> <body class="{% block bodyclass %}{% endblock %}">

2
avisstage/templates/avisstage/formulaires/stage.html
View file

@ -17,7 +17,7 @@
<script type="text/javascript" src="{% static "js/selectize.min.js" %}"></script> <script type="text/javascript" src="{% static "js/selectize.min.js" %}"></script>
<link rel="stylesheet" type="text/css" href="{% static "css/selectize.css" %}" /> <link rel="stylesheet" type="text/css" href="{% static "css/selectize.css" %}" />
<link href="{% static "jquery-autosuggest/css/autoSuggest-upshot.css" %}" type="text/css" media="all" rel="stylesheet" /> <link href="{% static "jquery-autosuggest/css/autoSuggest-upshot.css" %}" type="text/css" media="all" rel="stylesheet" />
<script type="text/javascript" src="{% static "js/editstage.js" %}"></script> <script type="text/javascript" src="{% static "js/editstage.js" %}?v2"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function(){ $(function(){
initEditStage( initEditStage(

17
avisstage/templates/avisstage/templatetags/widget_lieu.html
View file

@ -4,14 +4,25 @@
<div class="window-bg"></div> <div class="window-bg"></div>
<div class="window-content"> <div class="window-content">
<a class="window-closer" href="javascript:void(0);"></a> <a class="window-closer" href="javascript:void(0);"></a>
<h2>Choisir un lieu</h2> <h2 class="window-title">Choisir un lieu</h2>
<p>Restez général dans le lieu : choisissez l'université plutôt que le laboratoire, l'incubateur plutôt que la startup...</p> <p>Restez général dans le lieu : choisissez l'université plutôt que le laboratoire, l'incubateur plutôt que la startup...</p>
<div class="message"></div> <div class="message"></div>
{# UI avec carte et autocomplete #} {# UI avec carte et autocomplete #}
<div class="lieu-ui"> <div class="lieu-global">
<div class="lieu-ui">
</div>
<div class="lieu-options">
<h3>Choisir un lieu existant</h3>
<ul class="lieu-suggestions">
</ul>
<h3>Aucune suggestion correcte ?</h3>
<a href="javascript:void(0)" class="btn new-lieu-btn">
Créer un nouveau lieu ici</a>
</div>
</div> </div>
{# En cas de modification #} {# En cas de modification #}
@ -26,7 +37,7 @@
{# Formulaire de création/modification #} {# Formulaire de création/modification #}
<div class="lieu-form">{% load staticfiles %} <div class="lieu-form">{% load staticfiles %}
<form action="{% url 'avisstage:lieu_ajout' %}" method="post" id="lieu_ajout"> <form action="{% url 'avisstage:lieu_ajout' %}" method="post" id="lieu_ajout">
<h2>Ajouter un lieu</h2> <h2 class="form-title">Ajouter un lieu</h2>
<p class="help_text">Vous pouvez déplacer le curseur pour indiquer précisément la bonne position</p> <p class="help_text">Vous pouvez déplacer le curseur pour indiquer précisément la bonne position</p>
{% csrf_token %} {% csrf_token %}
{% for field in form.hidden_fields %} {% for field in form.hidden_fields %}

10
avisstage/utils.py
View file

@ -2,9 +2,19 @@
from allauth.socialaccount.models import SocialAccount from allauth.socialaccount.models import SocialAccount
from functools import reduce from functools import reduce
from math import cos, radians, sqrt
def choices_length (choices): def choices_length (choices):
return reduce (lambda m, choice: max (m, len (choice[0])), choices, 0) return reduce (lambda m, choice: max (m, len (choice[0])), choices, 0)
def en_scolarite(user): def en_scolarite(user):
return user.profil.en_scolarite return user.profil.en_scolarite
def approximate_distance(a, b):
lat_a = radians(a.y)
lat_b = radians(b.y)
dlon = radians(b.x - a.x)
dlon = dlon * cos((lat_a + lat_b)/2)
dlat = (lat_a - lat_b)
distance = 6371000 * sqrt(dlon*dlon + dlat*dlat)
return distance