Subversion Repositories eFlore/Applications.cel

Rev

Rev 3857 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
3341 idir 1
<?php echo "<noscript>Activer javascript et recharger la page</noscript>";?>
3122 delphine 2
<!DOCTYPE html>
3
<html xmlns="http://www.w3.org/1999/xhtml">
4
  <head>
3376 idir 5
    <title><?php echo $mode;?> de widget de saisie du CeL</title>
3122 delphine 6
 
3226 idir 7
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
3167 idir 8
    <meta http-equiv="Content-style-type" content="text/css" />
9
    <meta http-equiv="Content-script-type" content="text/javascript" />
10
    <meta http-equiv="Content-language" content="fr" />
3341 idir 11
    <meta name="robots" content="noindex, nofollow, noarchive, nosnippet, noodp">
3167 idir 12
    <meta name="author" content="Tela Botanica" />
13
    <meta name="keywords" content="Tela Botanica, CEL" />
14
    <meta name="description" content="Gestion des widgets de saisie du carnet en ligne" />
15
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
3122 delphine 16
 
3167 idir 17
    <!-- Favicones -->
18
    <link rel="shortcut icon" type="image/x-icon" href="https://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
3241 idir 19
    <!-- Jquery-ui custom css-->
3197 idir 20
    <link href="https://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen">
3241 idir 21
    <!-- Bootstrap CSS -->
22
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous" />
23
    <!-- <link rel="stylesheet" type="text/css" href="https://resources.tela-botanica.org/bootstrap/3.1.0/css/bootstrap.min.css" /> -->
24
    <!-- Fontawesome -->
25
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.1/css/all.css" integrity="sha384-O8whS3fhG2OnA5Kas0Y9l3cfpmYjapjI0E4theH4iuMD+pLhbf6JI0jIMfYcK3yZ" crossorigin="anonymous" />
3424 idir 26
    <!-- Carto -->
27
    <link href="<?php echo $url_base; ?>modules/manager/squelettes/js/tb-geoloc/styles.css" rel="stylesheet" type="text/css" media="screen" />
3241 idir 28
    <!-- STYLE MANAGER CREATION -->
3376 idir 29
    <link rel="stylesheet" type="text/css" href="<?php echo $url_base;?>modules/manager/squelettes/css/manager.css" media="screen" />
3175 idir 30
 
3167 idir 31
    <!--  Google Analytics -->
3376 idir 32
    <?php if ( $prod ) : ?>
33
      <?php include "analytics.html";?>
34
    <?php endif;?>
3424 idir 35
    <!-- <link rel="icon" type="image/x-icon" href="favicon.ico" /> -->
36
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
3122 delphine 37
  </head>
38
 
39
  <body>
3167 idir 40
    <div id="zone-appli" class="container">
3376 idir 41
      <h1 id="widget-titre" class="widget-titre"><?php echo ucfirst( $mode );?> de widget de saisie du CEL</h1>
3167 idir 42
      <div id="register-page">
3241 idir 43
        <div id="group-settings-form">
3164 idir 44
 
3241 idir 45
          <div id="left-block" class="widget-blocks">
3164 idir 46
 
3174 idir 47
            <p class="message">
3226 idir 48
              <?php if ( $mode === 'modification' ) : ?>
3181 idir 49
                Attention vous modifiez un widget déjà existant, le tag et la langue ne peuvent pas être changés.
3174 idir 50
                S'il s'agit d'un projet type, en modifiant ce widget vous modifiez tous les widgets de ce type.
51
              <?php else : ?>
52
                Vous créez un widget, si vous choississez de le mettre dans un type, certains champs deviendront
53
                obligatoires et la localisation (point ou rue) sera automatiquement déterminée.
3376 idir 54
              <?php endif;?>
3174 idir 55
            </p>
3164 idir 56
 
3376 idir 57
            <form action="<?php echo $url_base;?>manager?mode=<?php echo $mode.$params;?>" id="basic-widget-form" method="post" enctype="multipart/form-data">
3164 idir 58
 
3241 idir 59
              <div class="register-section row" id="basic-details-section">
3174 idir 60
                <h2>Meta-données</h2>
3164 idir 61
 
3341 idir 62
                <input type="text" name="email" id="email" placeholder="Your email" title="laisser ce champ vide" autocomplete="off" tabindex="-1" />
63
 
3241 idir 64
                <div class="col-sm-12 mb-3">
3376 idir 65
                  <label for="projet">Projet&nbsp;*</label>
3378 idir 66
                  <input type="text" name="projet" id="projet" class="form-control" pattern="^[a-z][a-z0-9-]{2,24}" <?php echo ( $mode === 'modification' ) ? 'value="' . $widget['projet'] . '" readonly' : 'required';?> title="Champ obligatoire : Pas d'espaces, de majuscules, de caractères spéciaux, ou d'accents. Caractères acceptés : 1er une lettre de a à z, ensuite : lettres, chiffres, tirets &quot; - &quot;.">
3241 idir 67
                </div>
3164 idir 68
 
3241 idir 69
                <div class="col-sm-12 mb-3">
70
                  <label for="motscles">Autres mots-clés</label>
3376 idir 71
                  <input type="text" name="motscles" id="motscles" class="form-control" <?php echo ( $mode === 'modification' ) ? 'value="' . $widget['motscles'] . '"' : "";?> />
3241 idir 72
                </div>
3164 idir 73
 
3241 idir 74
                <div class="col-sm-12 mb-3">
75
                  <label for="type">Type de widget</label>
3262 idir 76
                  <select  id="type" name="type" class="form-control custom-select">
3197 idir 77
                    <option value=""> ----</option>
3226 idir 78
                    <?php foreach ( $type as $id => $projet ) : ?>
3376 idir 79
                      <option <?php echo ( isset( $widget['projet'] ) && $projet['projet'] === $widget['projet'] ) ? 'selected="selected"' : '';?> value="<?php echo $projet['projet'];?>"><?php echo $projet['projet'];?></option>
80
                    <?php endforeach;?>
3174 idir 81
                  </select>
82
                </div>
3164 idir 83
 
84
 
3241 idir 85
                  <div class="col-sm-12 radio mb-3">
86
                    <label for="est_type" class="radio-label">
3376 idir 87
                      <input type="checkbox" name="est_type" id="est_type" <?php echo ( isset( $widget['est_type'] ) && $projet['est_type'] === '1' ) ? 'checked="checked"' : '';?>>
3241 idir 88
                      Ce widget est un widget type
89
                    </label>
90
                  </div>
91
 
92
                <div class="col-sm-12 mb-3">
93
                  <label for="langue">Langue</label>
94
                  <?php if ( $mode === 'modification' ) : ?>
3376 idir 95
                    <input id="langue" name="langue" class="form-control" readonly value="<?php echo $widget['langue'];?>">
3241 idir 96
                  <?php else : ?>
3262 idir 97
                    <select id="langue" name="langue" class="form-control custom-select">
3226 idir 98
                    <?php foreach ( $langues as $code => $langue ) : ?>
3376 idir 99
                      <option value="<?php echo $code;?>" <?php echo ( $code === 'fr' ) ? 'selected' : '';?>><?php echo $langue['nom'];?></option>
100
                    <?php endforeach;?>
3185 idir 101
                    </select>
3376 idir 102
                  <?php endif;?>
3241 idir 103
                </div>
3174 idir 104
              </div><!-- end #basic-details-section -->
3164 idir 105
 
106
 
3241 idir 107
              <div class="register-section row" id="profile-details-description-section">
3174 idir 108
                <h2>Description</h2>
3241 idir 109
                <div class="col-sm-12 mb-3">
110
                  <label for="titre">Titre</label>
3376 idir 111
                  <input type="text" name="titre" id="titre" class="form-control" value="<?php echo isset( $widget['titre'] ) ? htmlspecialchars( $widget['titre']) : '';?>">
3241 idir 112
                </div>
3164 idir 113
 
3241 idir 114
                <div class="input-file-row row">
115
                  <div class="input-file-container col-sm-10">
3359 idir 116
 
117
                    <?php
118
                      if( isset( $widget['info'] ) ) :
119
                        $info_file_name = 'info.' . preg_replace( '/(?:imag)?e\/?/','',$widget['info']);
120
                        $info_src       = $chemin_images . $widget['projet'] . '/' . $info_file_name;
121
                        $info_img       =
122
                          '<img id="pre-existent-info" src="' . $info_src . '" width="50%"><br>Pour changer, télécharger un nouveau fichier.';
123
                        $info_hidden    = '';
124
                      else :
125
                        $info_file_name = [];
126
                        $info_src       = '';
127
                        $info_img       = '';
128
                        $info_hidden    = ' hidden';
129
                      endif;
130
                    ?>
131
 
3361 idir 132
                    <input type="file" class="input-file" name="info" id="info" accept="image/*">
3241 idir 133
                    <label for="info" class="label-file "><i class="fas fa-download"></i> Aide dans le titre</label>
134
                  </div>
135
                  <div class="btn btn-danger btn-sm remove-file" name="remove-file" title="Supprimer le fichier"><i class="fas fa-times" aria-hidden="true"></i></div>
3376 idir 136
                  <div class="file-return info <?php echo $info_hidden;?>">
137
                    <?php echo $info_file_name;?>
138
                    <?php echo $info_img;?>
3359 idir 139
                  </div>
3226 idir 140
                </div>
141
 
3241 idir 142
                <div class="col-sm-12 mb-3">
143
                  <label for="description">Description</label>
3376 idir 144
                  <textarea name="description" id="description" class="form-control"><?php echo isset( $widget['description'] ) ? htmlspecialchars( $widget['description'] ) : '';?></textarea>
3241 idir 145
                </div>
3164 idir 146
 
3241 idir 147
                <div class="input-file-row row">
148
                  <div class="input-file-container col-sm-10">
3176 idir 149
 
3241 idir 150
                    <?php
151
                      if( isset( $widget['logo'] ) ) :
3359 idir 152
                        $logo_file_name = 'logo.' . preg_replace( '/(?:imag)?e\/?/','',$widget['logo']);
153
                        $logo_src       = $chemin_images . $widget['projet'] . '/' . $logo_file_name;
154
                        $logo_img       =
155
                          '<img id="pre-existent-logo" src="' . $logo_src . '" width="50%"><br>Pour changer, télécharger un nouveau fichier.';
156
                        $logo_hidden    = '';
3241 idir 157
                      else :
158
                        $logo_file_name = [];
3359 idir 159
                        $logo_src       = '';
160
                        $logo_img       = '';
161
                        $logo_hidden    = ' hidden';
3241 idir 162
                      endif;
163
                    ?>
3176 idir 164
 
3241 idir 165
                    <input type="file" class="input-file" name="logo" id="logo"  accept="image/*" value="">
166
                    <label for="logo" class="label-file"><i class="fas fa-download"></i> Logo</label>
167
                  </div>
168
                  <div class="btn btn-danger btn-sm remove-file" name="remove-file" title="Supprimer le fichier">
169
                    <i class="fas fa-times" aria-hidden="true"></i>
170
                  </div>
3376 idir 171
                  <div class="file-return logo<?php echo $logo_hidden;?>">
172
                    <?php echo $logo_file_name;?>
173
                    <?php echo $logo_img;?>
3241 idir 174
                  </div>
3174 idir 175
                </div>
3164 idir 176
 
3241 idir 177
                <div class="input-file-row row">
178
                  <div class="input-file-container col-sm-10">
3359 idir 179
 
180
                    <?php
181
                      if( isset( $widget['image_fond'] ) ) :
182
                        $image_fond_file_name = 'image_fond.' . preg_replace( '/(?:imag)?e\/?/','',$widget['image_fond']);
183
                        $image_fond_src       = $chemin_images . $widget['projet'] . '/' . $image_fond_file_name;
184
                        $image_fond_img       =
185
                          '<img id="pre-existent-image_fond" src="' . $image_fond_src . '" width="50%"><br>Pour changer, télécharger un nouveau fichier.';
186
                        $image_fond_hidden    = '';
187
                      else :
188
                        $image_fond_file_name = [];
189
                        $image_fond_src       = '';
190
                        $image_fond_img       = '';
191
                        $image_fond_hidden    = ' hidden';
192
                      endif;
193
                    ?>
194
 
3361 idir 195
                    <input type="file" class="input-file" name="image_fond" id="image_fond" accept="image/*">
3235 idir 196
                    <label for="image_fond" class="label-file"><i class="fas fa-download"></i> Image de fond</label>
3241 idir 197
                  </div>
198
                  <div class="btn btn-danger btn-sm remove-file" name="remove-file" title="Supprimer le fichier"><i class="fas fa-times" aria-hidden="true"></i></div>
3376 idir 199
                  <div class="file-return image_fond <?php echo $image_fond_hidden;?>">
200
                    <?php echo $image_fond_file_name;?>
201
                    <?php echo $image_fond_img;?>
3359 idir 202
                  </div>
3174 idir 203
                </div>
3226 idir 204
 
3174 idir 205
              </div><!-- end #profile-details-description-section -->
3164 idir 206
 
3241 idir 207
              <div class="register-section row" id="profile-details-fields-section">
3174 idir 208
                <h2>Champs</h2>
3241 idir 209
 
210
                <div class="col-sm-12 mb-3">
211
                  <label for="type_localisation">Type de localisation</label>
3262 idir 212
                  <select  id="type_localisation" name="type_localisation" class="form-control custom-select">
3376 idir 213
                    <option value="<?php echo ( isset( $widget['type_localisation'] ) ) ? $widget['type_localisation'] : 'point';?>"><?php echo ( isset( $widget['type_localisation'] ) ) ? $widget['type_localisation'] : 'point';?></option>
214
                    <option value="<?php echo ( isset( $widget['type_localisation'] ) && $widget['type_localisation'] === 'rue' ) ? 'point' : 'rue';?>"><?php echo ( isset( $widget['type_localisation'] ) && $widget['type_localisation'] === 'rue') ? 'point' : 'rue';?></option>
3174 idir 215
                  </select>
216
                </div>
3164 idir 217
 
3241 idir 218
                <div class="col-sm-12 mb-3">
219
                  <label for="milieux">Milieux</label>
3332 idir 220
                  <p class="message">
221
                    Liste de milieux séparés par un ";".
222
                    <br>
3376 idir 223
                    <i class="fas fa-pen"></i>&nbsp;Pour ajouter une option "autre" ajoutez le mot "autre" dans votre liste de milieux.
3332 idir 224
                    <br>
3376 idir 225
                    <i class="fas fa-check-double"></i>&nbsp;Pour autoriser la sélection de plusieurs milieux ajouter "multimilieux" dans votre liste de milieux (sans fautes&nbsp;!&nbsp;<i class="far fa-smile-beam"></i>&nbsp;).
3351 idir 226
                    <br>
3332 idir 227
                    <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>&nbsp;Les options apparaitront dans l'ordre de saisie de cette liste.
228
                  </p>
3376 idir 229
                  <input type="text" name="milieux" id="milieux" class="form-control" value="<?php echo isset( $widget['milieux'] ) ? $widget['milieux'] : '';?>">
3241 idir 230
                </div>
3167 idir 231
 
3241 idir 232
                <div class="col-sm-12 mb-3">
3376 idir 233
                  <label for="type_especes">Type liste espèce&nbsp;*</label>
3881 delphine 234
                  <?php
235
                    $types_espece = [
236
                      'referentiel' => 'Référentiel',
237
                      'liste' => 'Liste',
238
                      'liste+autre' => 'Liste + autres',
239
                      'fixe' => 'Espèce fixée',
240
                    ];
241
                  ?>
3262 idir 242
                  <select  id="type_especes" name="type_especes" required class="form-control custom-select">
3881 delphine 243
                    <?php foreach( $types_espece as $type_espece => $affichage_type_espece ): ?>
244
                      <option <?php echo (!isset($widget['type_especes']) && 'referentiel' === $type_espece) || $type_espece === $widget['type_especes']? 'selected="selected" ' : '';?>value="<?php echo $type_espece;?>"><?php echo $affichage_type_espece;?></option>
245
                    <?php endforeach;?>
3174 idir 246
                  </select>
3164 idir 247
                </div>
3167 idir 248
 
3241 idir 249
                <div class="col-sm-12 mb-3">
3376 idir 250
                  <label for="referentiel">Référentiel&nbsp;*</label>
251
                  <p class="message">
252
                    Pour une espèce fixée renseigner le num_nom après le référentiel, séparés de ":" suivant le schéma&nbsp;:
253
                    <br>
254
                    <code>référentiel:num_nom</code>
255
                    <br>
256
                    ex&nbsp;: <code>bdtfx:182</code>
257
                  </p>
3378 idir 258
                  <input type="text" name="referentiel" id="referentiel" class="form-control" required pattern="^[a-z]+(:[0-9]+)?$" title="Nom du référentiel ex. bdtfx" value="<?php echo isset( $widget['referentiel'] ) ? $widget['referentiel'] : '';?>">
3241 idir 259
                </div>
3167 idir 260
 
3174 idir 261
                <!-- Bouton fichier-type à compléter -->
3241 idir 262
                <div class="input-file-row row">
263
                  <div class="input-file-container col-sm-10">
264
                    <input type="file" class="input-file" name="especes" id="especes">
3376 idir 265
                    <label for="especes"class="label-file"><i class="fas fa-download"></i> Espèces</label>
3255 idir 266
                    <p class="message mt-2">
267
                      <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
3376 idir 268
                      &nbsp;Format&nbsp;: CSV ou TSV UTF-8.
269
                      <br>
270
                      Séparateur&nbsp;: Tabulation.
3255 idir 271
                    </p>
3241 idir 272
                  </div>
273
                  <div class="btn btn-danger btn-sm remove-file" name="remove-file" title="Supprimer le fichier"><i class="fas fa-times" aria-hidden="true"></i></div>
274
                  <div class="file-return especes hidden"></div>
3174 idir 275
                </div>
3241 idir 276
                <div class="col-sm-12 mb-3">
3376 idir 277
                  <a href="<?php echo $url_base;?>modules/manager/squelettes/img/fichier_type/especes.csv" class="button fichier-type" download><i class="fas fa-file-alt" aria-hidden="true"></i> Fichier type</a>
3241 idir 278
                </div>
3174 idir 279
              </div><!-- end #profile-details-fields-section -->
3171 idir 280
 
3424 idir 281
              <!--localisation-->
282
              <input type="hidden" name="localisation" id="localisation" value="<?php echo isset($widget['localisation']) ? htmlspecialchars($widget['localisation']) : '';?>">
3174 idir 283
              <!--Submit-->
284
              <div class="submit complete-registration" id="submit-button">
3341 idir 285
                <button href="#" type="submit" name="signup_submit" id="signup_submit" class="button" target="" title="Soumettre le nouveau widget" disabled="disabled"><i class="fas fa-trophy" aria-hidden="true"></i>&nbsp;Terminer</button>
3171 idir 286
              </div>
3174 idir 287
              <!--Submit-->
3171 idir 288
 
3174 idir 289
            </form><!-- end #new-widget-form -->
290
 
3424 idir 291
            <form id="form-geolocalisation" autocomplete="off">
292
              <div class="row mb-3">
293
                <label for="geolocalisation" class="obligatoire has-tooltip col-sm-12" data-toggle="tooltip" title="">
294
                  Geolocalisation&nbsp: Déterminer un point gps (facultatif)
295
                </label>
296
              </div>
297
              <div id="geoloc" class="geoloc">
298
                <tb-geolocation-element
299
                  id="tb-geolocation"
300
                  layer='osm'
301
                  zoom_init="4"
302
                  lat_init="46.5"
303
                  lng_init="2.9"
304
                  marker="true"
305
                  polyline="false"
306
                  polygon="false"
307
                  show_lat_lng_elevation_inputs="true"
308
                  osm_class_filter=""
3812 idir 309
                  geometry_filter="point"
3424 idir 310
                  elevation_provider="mapquest"
311
                  map_quest_api_key="mG6oU5clZHRHrOSnAV0QboFI7ahnGg34"
3812 idir 312
                  height="400px"
3424 idir 313
                >
314
                </tb-geolocation-element>
315
              </div>
316
              <div class="control-group mt-3 mb-3">
317
                <div class="row">
318
                  <div id="geoloc-datas" class="col-sm-12 row">
319
                    <div class="col-sm-6 mb-3">
320
                      <label for="latitude">Latitude</label>
321
                      <input type="text" class="form-control latitude" id="latitude" name="latitude" pattern="-?(8[0-5]|[1-7]?[0-9])(,|.)[0-9]{5}" title="Nombre décimal de 6 à 8 chiffres au total, dont exactement 5 chiffres après la virgule" placeholder="+/- 0.00000 à 90.00000" value="">
322
                    </div>
323
                    <div class="col-sm-6 mb-3">
324
                      <label for="longitude">Longitude</label>
325
                      <input type="text" class="form-control longitude" id="longitude" name="longitude" pattern="-?(1(80|[0-7][0-9])|([1-9]?[0-9]))(,|.)[0-9]{5}" title="Nombre décimal de 6 à 8 chiffres au total, dont exactement 5 chiffres après la virgule" placeholder="+/- 0.00000 à 180.00000" value="">
326
                    </div>
327
                    <div class="col-sm-12 mb-3">
328
                      <label for="zoom">Zoom (indépendant des coordonnées)</label>
329
                      <p class="message">
330
                        Quelques exemples de précision zoom&nbsp;:<br>
331
                        Europe&nbsp;:&nbsp;4, France&nbsp;:&nbsp;5, région&nbsp;:&nbsp;7, département&nbsp;:&nbsp;9, ville&nbsp;:&nbsp;12, lieu-dit/quartier&nbsp;:&nbsp;15, rue&nbsp;:&nbsp;18 (=&nbsp;max).
332
                      </p>
333
                      <input type="text" name="zoom" id="zoom" class="form-control" pattern="(0?[1-9]|(1[0-8]))" title="Nombre de 1 à 18" placeholder="1 à 18" value=""  />
334
                    </div>
3881 delphine 335
                    <div class="col-sm-12 mb-3">
336
                  		<label for="fond_carte">Fond de carte</label>
337
                  		<select  id="fond_carte" name="fond_carte" class="form-control custom-select">
338
                        <?php
339
                          $affichage_fonds_carte = [
340
                            'osm' => 'OSM (carte par défaut)',
341
                            'googleHybrid' => 'Photos aériennes',
342
                          ];
343
                          $fond_carte = isset($widget['fond_carte']) && isset($affichage_fonds_carte[$widget['fond_carte']]) ? $widget['fond_carte'] : 'osm';
344
                        ?>
345
                        <?php foreach($affichage_fonds_carte  as $nom_base => $nom_affiche) :?>
346
                          <option value="<?php echo $nom_base;?>"<?php echo $nom_base === $fond_carte ? ' selected="selected"' : '';?>><?php echo $nom_affiche;?></option>
347
                    		<?php endforeach;?>
348
 
349
                  		</select>
350
                	</div>
351
                	 <div class="col-sm-12 mb-3">
352
                  		<label for="adresse">Adresse obligatoire</label>
353
                  		<select  id="adresse" name="adresse" class="form-control custom-select">
354
                    		<option value="0" <?php echo ( isset( $widget['adresse'] ) && $widget['adresse'] === '0' ) ? 'selected' : '';?>>Non</option>
355
                    		<option value="1" <?php echo ( isset( $widget['adresse'] ) && $widget['adresse'] === '1' ) ? 'selected' : '';?>>Oui</option>
356
                  		</select>
357
                	</div>
358
                	<div class="col-sm-12 mb-3">
359
                  		<label for="photo_obligatoire">Photo obligatoire</label>
360
                  		<select  id="photo_obligatoire" name="photo_obligatoire" class="form-control custom-select">
361
                    		<option value="0" <?php echo ( isset( $widget['photo_obligatoire'] ) && $widget['photo_obligatoire'] === '0' ) ? 'selected' : '';?>>Non</option>
362
                    		<option value="1" <?php echo ( isset( $widget['photo_obligatoire'] ) && $widget['photo_obligatoire'] === '1' ) ? 'selected' : '';?>>Oui</option>
363
                  		</select>
364
                	</div>
3424 idir 365
                  </div>
366
                </div>
367
              </div>
368
            </form><!-- end #form-geolocalisation -->
369
 
3174 idir 370
            <form id="new-fields" autocomplete="off">
3424 idir 371
              <h2>Ajouter des champs</h2>
372
              <p class="message">
373
                <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
374
                &nbsp;Attention&nbsp;:
375
                <br>
376
                <i class="fa fa-bolt" aria-hidden="true"  style="color:#B3C954"></i>
377
                &nbsp;Le bouton "Valider" sert à valider les champs supplémentaires uniquement
378
                <br>
379
                <i class="fas fa-trophy" aria-hidden="true"  style="color:#B3C954"></i>
380
                &nbsp;Le bouton "Terminer" sert à envoyer la totalité du nouveau widget
381
              </p>
3174 idir 382
            </form><!-- #new-fields = fomulaire oû viennent s'insérer les champs supplémentaires -->
383
 
3241 idir 384
            <div id="new-fields-buttons" class="row">
3174 idir 385
              <div class="col-md-4 col-sm-4 col-xs-4 buttons">
386
                <label class="add-fields">Ajouter</label>
387
                <div class="button" id="add-fields" title="Ajouter un champ"><i class="fa fa-plus" aria-hidden="true"></i></div>
388
              </div>
389
              <div class="col-md-4 col-sm-4 col-xs-4 buttons">
390
                <label for="preview-field">Prévisualiser</label>
391
                <div class="button" id="preview-field" name="preview-field" title="prévisualiser"><i class="fa fa-magic" aria-hidden="true"></i></div>
392
              </div>
393
              <div class="col-md-4 col-sm-4 col-xs-4 buttons">
394
                <label class="validate-new-fields">Valider</label>
395
                <div class="button" id="validate-new-fields" title="Valider les champs supplémentaires"><i class="fa fa-bolt" aria-hidden="true"></i></div>
396
              </div>
3167 idir 397
            </div>
398
 
399
          </div><!-- end .widget-blocks = tout le bloc de gauche-->
400
 
3241 idir 401
          <div id="right-block" class="widget-blocks">
3185 idir 402
            <div class="widget-renderer">
3241 idir 403
              <div id="preview-background"></div>
3167 idir 404
 
3174 idir 405
              <div id="preview-header" class="row">
3189 idir 406
                  <div id="preview-logo" class="col-md-4"></div>
3167 idir 407
                  <div id="preview-title" class="col-md-8">
408
                    <h1></h1>
3378 idir 409
                    <p class="message"><i class="fas fa-info-circle" style="color:#009fb8"></i> Les liens et autres balises html fonctionneront dans le widget</p>
3167 idir 410
                  </div>
411
              </div>
412
 
3174 idir 413
              <div id="preview-messages" class="row">
3167 idir 414
 
3241 idir 415
                <div id="preview-description" class="col-md-6">
416
                  <div class="">
3174 idir 417
                    <p class="preview-description"></p>
418
                  </div>
3226 idir 419
 
3167 idir 420
                </div><!-- end #preview-description -->
421
 
3241 idir 422
                <div id="preview-aide" class="col-md-6">
423
                  <div class="">
3174 idir 424
                    <h3>Aide</h3>
425
                    <p>
426
                      Cet outil vous permet de partager simplement vos observations avec
427
                      le <a target="_blank" href="https://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
428
                      (<a target="_blank" href="https://www.tela-botanica.org/page:licence">licence CC-BY-SA</a>).
429
                      Identifiez-vous bien pour ensuite retrouver et gérer vos données dans votre
430
                      <a target="_blank" href="https://www.tela-botanica.org/appli:cel"> Carnet en ligne</a>.
431
                      Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
432
                      Elles apparaissent immédiatement sur les
433
                      <a target="_blank" href="https://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
434
                    </p>
435
                    <p class="discretion">
436
                      Pour toute question ou remarque,
3376 idir 437
                      <a href="https://www.tela-botanica.org/widget:reseau:remarques?service=cel&pageSource=<?php echo $url_base;?>manager?mode=<?php echo $mode . $params;?>" target="_blank" onclick="
3226 idir 438
                          javascript:window.open(
439
                            this.getAttribute( 'href' ),
440
                            'Tela Botanica - Remarques',
441
                            config = 'height=700, width=640, scrollbars=yes, resizable=yes'
442
                          );
443
                          return false;
3174 idir 444
                      ">contactez-nous</a>
445
                    </p>
446
                  </div>
3167 idir 447
                </div>
448
              </div><!-- end #preview-aide -->
449
 
450
              <div id="preview-formulaire" class="row">
451
 
452
                <form id="preview-form-observateur" role="form" autocomplete="on">
453
 
454
                  <h2>Observateur</h2>
455
 
3241 idir 456
                  <div class="row">
457
                    <div id="bouton-connexion" class="col-md-6 col-sm-8">
458
                      <label for="bouton-connexion">Je me connecte à mon compte&nbsp;:</label>
459
                      <div class="btn btn-success mr-1 mb-1">Connexion</div>
460
                      <div class="btn btn-success mr-1 mb-1">Inscription</div>
3167 idir 461
                    </div>
3241 idir 462
                    <div id="creation-compte" class="col-md-6 col-sm-8">
463
                      <label for="creation-compte">Je ne souhaite pas m'inscrire&nbsp;:</label>
464
                      <div class="btn btn-info mr-1 mb-1">Observation sans inscription</div>
3167 idir 465
                    </div>
466
 
467
                  </div>
468
 
469
                </form>
470
 
471
                <form id="form-observation" role="form" autocomplete="on">
472
 
473
                  <h2>Observation</h2>
474
 
3185 idir 475
                  <div id="zone-observation" class="row">
3167 idir 476
 
3241 idir 477
                    <div class="col-md-6 row">
478
                      <div class="col-md-12">
3424 idir 479
                        <label for="geolocalisation-previs" id="label-geolocalisation" title="Veuillez saisir votre adresse courriel.">
3376 idir 480
                          <i class="fa fa-envelope"></i>&nbsp;Geolocalisation
3241 idir 481
                        </label>
3424 idir 482
                        <div id="geolocalisation-previs">
483
                          <img src="<?php echo $url_base;?>modules/manager/squelettes/img/geoloc/geoloc.png" alt="geolocalisation" width="90%">
3241 idir 484
                        </div>
485
                      </div>
3185 idir 486
 
3241 idir 487
                      <div class="col-md-12">
488
                        <label for="milieu" id="label-milieu">
3376 idir 489
                          <i class="fa fa-street-view"></i>&nbsp;Milieu
3241 idir 490
                        </label>
491
                        <input type="text" id="milieu" name="milieu" class="form-control" placeholder="bois, champ, falaise, ...">
492
                      </div>
3167 idir 493
                    </div>
494
 
3241 idir 495
                    <div class="col-md-6 row">
496
                      <div class="col-md-12">
497
                        <label for="date" id="label-date" title="">
3376 idir 498
                          <i class="fa fa-calendar"></i>&nbsp;Date de relevé
3241 idir 499
                        </label>
500
                        <div class="date">
501
                          <input type="date" id="date" class="form-control" name="date" title="jj/mm/aaaa" required>
502
                        </div>
3167 idir 503
                      </div>
3185 idir 504
 
3241 idir 505
                      <div class="col-md-12">
506
                        <label for="taxon" id="label-taxon" title="">
3376 idir 507
                          <i class="fa fa-leaf"></i>&nbsp;Espèce<span></span>
3241 idir 508
                        </label>
509
                        <div class="taxon">
510
                          <input type="text" name="taxon" id="taxon" class="form-control">
511
                        </div>
3167 idir 512
                      </div>
3185 idir 513
 
3241 idir 514
                      <div class="col-md-12">
515
                        <label for="certitude" id="label-certitude" title="">
3376 idir 516
                          <i class="fa fa-question"></i>&nbsp;Certitude
3241 idir 517
                        </label>
3262 idir 518
                        <select id="certitude" name="certitude" class="form-control custom-select" required>
3241 idir 519
                          <option value="" >À déterminer</option>
520
                          <option value="" >Douteuse</option>
521
                          <option value="" selected="selected" >Certaine</option>
522
                        </select>
3167 idir 523
                      </div>
3185 idir 524
 
3241 idir 525
                      <div class="col-md-12">
526
                        <label for="notes" id="label-notes" title="">
3376 idir 527
                          <i class="fa fa-pen" aria-hidden="true"></i>&nbsp;Notes
3241 idir 528
                        </label>
529
                        <div class="notes">
530
                            <textarea id="notes" name="notes" class="form-control" placeholder="Vous pouvez éventuellement ajouter des informations complémentaires à votre observation."></textarea>
531
                        </div>
3167 idir 532
                      </div>
533
                    </div>
534
 
535
                  </div>
536
 
537
                </form>
538
 
3185 idir 539
                <!-- formulaire d'affichage des bouveaux champs -->
3167 idir 540
                <form id="form-supp" role="form" autocomplete="on">
541
                  <div id="zone-supp" class="row align-items-center">
3241 idir 542
                    <div class="col-md-6 preview-container row"></div>
3167 idir 543
                  </div>
544
                </form>
545
 
3241 idir 546
                <!-- formulaire d'upload d'images -->
547
                <form id="form-upload" class="" action="" method="" enctype="multipart/form-data">
548
                  <h2>Image(s) de cette plante</h2>
549
                  <p class="miniature-info" class="discretion help-inline">
550
                    Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.
551
                  </p>
552
                  <div>
553
                      <div class="btn btn-large btn-info mb-3">
3376 idir 554
                        <span class=""><i class="fas fa-download"></i>&nbsp;Ajouter une image</span>
3241 idir 555
                      </div>
556
                  </div>
557
                </form>
558
 
3167 idir 559
              </div><!-- end #preview-formulaire -->
560
 
561
            </div><!-- end #widget-renderer-->
562
 
563
          </div><!-- #widget-blocks = tout le bloc de droite-->
564
 
3164 idir 565
        </div>
3167 idir 566
      </div>
567
    </div>
3174 idir 568
    <div id="help-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="help-modal-label" style="display: none;" aria-hidden="true">
569
      <div class="modal-dialog modal-dialog-centered" role="document">
570
        <div class="modal-content">
571
          <div class="modal-header">
572
            <h5 class="modal-title" id="help-modal-label"></h5>
573
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
3241 idir 574
              <span aria-hidden="true">&times;</span>
3174 idir 575
            </button>
576
          </div>
577
          <div class="modal-body" id="print_content"></div>
578
          <div class="modal-footer">
579
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
580
          </div>
581
        </div>
582
      </div>
583
    </div>
3424 idir 584
    <!-- carto -->
585
    <script type="text/javascript" src="<?php echo $url_base; ?>modules/manager/squelettes/js/tb-geoloc/tb-geoloc-lib-app.js"></script>
3226 idir 586
    <!-- Jquery -->
587
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
588
    <!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
589
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
590
    <!-- <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script> -->
591
    <!-- Jquery Plugins -->
592
    <!-- Jquery Validate : nécessaire pour la validation des formulaires -->
593
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
594
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
595
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
596
    <!-- Jquery Form :nécessaire pour l'upload des images -->
597
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
598
    <!-- Bootstrap -->
3241 idir 599
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
3226 idir 600
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
3376 idir 601
    <script type="text/javascript" src="<?php echo $url_base;?>modules/manager/squelettes/js/manager.js"></script>
3226 idir 602
      <!-- Barre de navigation -->
603
    <?php if ( $bar !== false ) : ?>
3376 idir 604
      <script src="<?php echo $url_script_navigation;?>"></script>
605
    <?php endif;?>
3167 idir 606
  </body>
3164 idir 607
</html>