diff --git a/README.md b/README.md index af5aef0..1def692 100644 --- a/README.md +++ b/README.md @@ -1,15 +1,19 @@ # MAP -- zoom : toujours zoomer, pour un seul marqueur pas trop, et enlever les villes -- resoudre probleme mauvais markers de pays -- faire un bouton select (afficher la seletion plutot que le nom du menu) +### verifications: +- api only for this site on fabien's google account +- erased tmp css on site headers #### improvement suggestions: - add a field "more infos" to address - localise on map when form is filled #### questions traitees: +- zoom : toujours zoomer, pour un seul marqueur pas trop, et enlever les villes +- resoudre probleme mauvais markers de pays +- faire un bouton select (afficher la seletion plutot que le nom du menu) + - bound la carte limite pour ne pas voir la zone grise - quelles infos on mets dans les infowindow - adresse en haut (surtout pour les markers avec plusieurs evenements) diff --git a/srcs/plugins/map_prof/mp_create_div.php b/srcs/plugins/map_prof/mp_create_div.php index ea2b268..dfc9b1d 100644 --- a/srcs/plugins/map_prof/mp_create_div.php +++ b/srcs/plugins/map_prof/mp_create_div.php @@ -1,5 +1,60 @@ TOUT DESELECTIONNER

+ + $content = ' + + '; + + return $content; +}; + +function mp_filter_buttons($key, &$filter) { + + //

TOUT DESELECTIONNER

+ + $content = ' + + '; + + return $content; +}; + function mp_create_div(&$filters) { $mp_map_div = '
@@ -8,45 +63,10 @@ function mp_create_div(&$filters) { foreach ($filters as $key => $filter) { - // // version div stick - // // version div switch - // // version div visibility - // - $mp_map_div .= ' - - '; - - // // version div title - // - // $mp_map_div .= ' - // - // '; + if ($key == "mode") + $mp_map_div .= mp_filter_buttons($key, $filter); + else + $mp_map_div .= mp_filter_drop_down($key, $filter); }; @@ -57,42 +77,63 @@ function mp_create_div(&$filters) { '; return $mp_map_div; -} +}; + + + // // version div title + // + // $content .= ' + // + // '; + // // version input checkbox // - // content += ` + // $content .= ' //
// // //
- // `; - // for (value of filters[key]) { - // content += ` - //

${value._name}

- // `; + // '; + // foreach ($filter as $value) { + // $content .= ' + //

'.$value._name.'

+ // '; // } - // content += ` + // $content .= ' //
//
- // `; + // '; + // // version select // - // content += ` + // $content .= ' //
- // + // '; + // foreach ($filter as $value) { + // $content .= ' + // + // '; // } - // content += ` + // $content .= ' // //
- // `; + // '; ?> diff --git a/srcs/plugins/map_prof/styles/mp_filters.css b/srcs/plugins/map_prof/styles/mp_filters.css index 49d3737..578e100 100644 --- a/srcs/plugins/map_prof/styles/mp_filters.css +++ b/srcs/plugins/map_prof/styles/mp_filters.css @@ -33,223 +33,19 @@ } - /* ************************************** - WIP VERSION SELECT -*/ - -/* -#ljdp_map_filters .filter_menu select.filter_menu_drop { - appearance: none; - text-align: center; - background-color: transparent; - border: none; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop option { - appearance: none; - text-align: center; - background-color: transparent; - border: none; -} -*/ - - - -/* ************************************** - VERSION INPUT CHECKBOX -*/ - -/* -#ljdp_map_filters .filter_menu input.filter_menu_title { - display: none; -} - -#ljdp_map_filters .filter_menu label.filter_menu_title { - width: 100%; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop { - display: none; - flex-direction: column; - position: absolute; - top: 100%; - left: 0px; - margin: 0px; - padding: 10px 0px; - width: 100%; - max-height: 400px; - background-color: #ffffff; - overflow-y: scroll; - cursor: pointer; -} - -#ljdp_map_filters .filter_menu input.filter_menu_title:checked -~ .filter_menu_drop { - display: flex; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p { - padding: 0px 10px; - width: 100%; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p:hover { - background-color: #dddddd; -} -*/ - - - - - -/* ************************************** - VERSION DIV STICK -*/ - -/* -#ljdp_map_filters .filter_menu .filter_menu_title { - width: 100%; - cursor: pointer; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop { - display: none; - flex-direction: column; - position: absolute; - top: 100%; - left: 0px; - margin: 0px; - padding: 10px 0px; - width: 100%; - max-height: 400px; - background-color: #ffffff; - overflow-y: scroll; - cursor: pointer; -} - -#ljdp_map_filters .filter_menu:focus-within .filter_menu_drop { - display: flex; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p { - padding: 0px 10px; - width: 100%; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p:hover { - background-color: #dddddd; -} -*/ - - - - - -/* ************************************** - VERSION DIV SWITCH -*/ - -/* -#ljdp_map_filters .filter_menu .filter_menu_title { - width: 100%; - cursor: pointer; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop { - flex-direction: column; - position: absolute; - left: 0px; - margin: 0px; - width: 100%; - max-height: 400px; - cursor: pointer; - - background-color: transparent; - height: 100%; - padding-left: 100%; - top: 0%; - overflow: hidden; - -} - -#ljdp_map_filters .filter_menu .filter_menu_drop:focus { - background-color: #ffffff; - height: auto; - top: 100%; - overflow: scroll; - padding: 10px; - border: 1px solid #ba197a; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p { - padding: 0px 10px; - width: 100%; -} - -#ljdp_map_filters .filter_menu .filter_menu_drop p:hover { - background-color: #dddddd; -} -*/ - - - - - -/* ************************************** - WIP VERSION DIV TITLE -*/ - -/* -#ljdp_map_filters .filter_menu_drop { - flex-direction: column; - width: 100%; - max-height: 400px; - cursor: pointer; - background-color: #ffffff; - overflow: scroll; - - border: 1px solid blue; -} - -#ljdp_map_filters .filter_menu_drop p { - display: none; - cursor: pointer; - padding: 0px 10px; - width: 100%; -} - -#ljdp_map_filters .filter_menu_drop p:hover { - background-color: #dddddd; -} - -#ljdp_map_filters p.filter_menu_drop_title { - display: flex; - text-align: center; -} - -#ljdp_map_filters .filter_menu_drop_title:focus ~ p { - display: flex; -} -*/ - - - - - -/* ************************************** - VERSION DIV VISIBILITY + DROP DOWN MENU */ /* */ -#ljdp_map_filters .filter_menu_title { +#ljdp_map_filters .filter_menu_drop_title { width: 100%; cursor: pointer; pointer-events: none; } -#ljdp_map_filters .filter_menu_drop { +#ljdp_map_filters .filter_menu_drop_items { flex-direction: column; position: absolute; top: 100%; @@ -262,30 +58,55 @@ /* opacity is toogled instantanously, for visual confort, but element is still present and clickable */ /* then, visibility is toogle, after x seconds, letting plainty of times for the browser to catch the 'onclick' event */ + /* opacity: 0; visibility: hidden; transition: visibility 0.5s; + */ + display: none; border: 1px solid #ba197a; } -#ljdp_map_filters .filter_menu:focus .filter_menu_title { +#ljdp_map_filters .filter_menu_drop:focus .filter_menu_drop_title { pointer-events: auto; } -#ljdp_map_filters .filter_menu:focus .filter_menu_drop { +#ljdp_map_filters .filter_menu_drop:focus .filter_menu_drop_items { + display: flex; + /* opacity: 1; visibility: visible; + */ } -#ljdp_map_filters .filter_menu_drop p { +#ljdp_map_filters .filter_menu_drop_items p { padding: 0px 10px; margin: 0px; width: 100%; } -#ljdp_map_filters .filter_menu_drop p:hover { +#ljdp_map_filters .filter_menu_drop_items p:hover { background-color: #dddddd; } + + +/* ************************************** + DROP DOWN MENU +*/ + +/* +*/ + +#ljdp_map_filters .filter_menu_buttons { + flex-direction: row; + border: 1px solid blue; +} + +#ljdp_map_filters .filter_menu_buttons_click { + border: 1px solid green; +} + +