Subversion Repositories eFlore/Applications.cel

Rev

Rev 3881 | 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">
3241 idir 58
              <div class="register-section row" id="basic-details-section">
3174 idir 59
                <h2>Meta-données</h2>
3341 idir 60
                <input type="text" name="email" id="email" placeholder="Your email" title="laisser ce champ vide" autocomplete="off" tabindex="-1" />
3241 idir 61
                <div class="col-sm-12 mb-3">
3376 idir 62
                  <label for="projet">Projet&nbsp;*</label>
3378 idir 63
                  <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 64
                </div>
3164 idir 65
 
3241 idir 66
                <div class="col-sm-12 mb-3">
67
                  <label for="motscles">Autres mots-clés</label>
3376 idir 68
                  <input type="text" name="motscles" id="motscles" class="form-control" <?php echo ( $mode === 'modification' ) ? 'value="' . $widget['motscles'] . '"' : "";?> />
3241 idir 69
                </div>
3164 idir 70
 
3241 idir 71
                <div class="col-sm-12 mb-3">
72
                  <label for="type">Type de widget</label>
3262 idir 73
                  <select  id="type" name="type" class="form-control custom-select">
3197 idir 74
                    <option value=""> ----</option>
3226 idir 75
                    <?php foreach ( $type as $id => $projet ) : ?>
3897 delphine 76
                      <option <?php echo ( isset( $widget['type'] ) && $projet['projet'] === $widget['type'] ) ? 'selected="selected"' : '';?> value="<?php echo $projet['projet'];?>"><?php echo $projet['projet'];?></option>
3376 idir 77
                    <?php endforeach;?>
3174 idir 78
                  </select>
79
                </div>
3164 idir 80
 
3897 delphine 81
                <div class="col-sm-12 radio mb-3">
82
                  <label for="est_type" class="radio-label">
83
                    <input type="checkbox" name="est_type" id="est_type" <?php echo ( isset( $widget['est_type'] ) && $projet['est_type'] === '1' ) ? 'checked="checked"' : '';?>>
84
                    Ce widget est un widget type
85
                  </label>
86
                </div>
3164 idir 87
 
3241 idir 88
                <div class="col-sm-12 mb-3">
89
                  <label for="langue">Langue</label>
90
                  <?php if ( $mode === 'modification' ) : ?>
3376 idir 91
                    <input id="langue" name="langue" class="form-control" readonly value="<?php echo $widget['langue'];?>">
3241 idir 92
                  <?php else : ?>
3262 idir 93
                    <select id="langue" name="langue" class="form-control custom-select">
3226 idir 94
                    <?php foreach ( $langues as $code => $langue ) : ?>
3376 idir 95
                      <option value="<?php echo $code;?>" <?php echo ( $code === 'fr' ) ? 'selected' : '';?>><?php echo $langue['nom'];?></option>
96
                    <?php endforeach;?>
3185 idir 97
                    </select>
3376 idir 98
                  <?php endif;?>
3241 idir 99
                </div>
3174 idir 100
              </div><!-- end #basic-details-section -->
3164 idir 101
 
102
 
3241 idir 103
              <div class="register-section row" id="profile-details-description-section">
3174 idir 104
                <h2>Description</h2>
3241 idir 105
                <div class="col-sm-12 mb-3">
106
                  <label for="titre">Titre</label>
3376 idir 107
                  <input type="text" name="titre" id="titre" class="form-control" value="<?php echo isset( $widget['titre'] ) ? htmlspecialchars( $widget['titre']) : '';?>">
3241 idir 108
                </div>
3164 idir 109
 
3241 idir 110
                <div class="input-file-row row">
111
                  <div class="input-file-container col-sm-10">
3359 idir 112
 
113
                    <?php
3897 delphine 114
                      $info_file_name = [];
115
                      $info_src       = '';
116
                      $info_img       = '';
117
                      $info_hidden    = '';
3359 idir 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
                      else :
124
                        $info_hidden    = ' hidden';
125
                      endif;
126
                    ?>
127
 
3361 idir 128
                    <input type="file" class="input-file" name="info" id="info" accept="image/*">
3241 idir 129
                    <label for="info" class="label-file "><i class="fas fa-download"></i> Aide dans le titre</label>
130
                  </div>
131
                  <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 132
                  <div class="file-return info <?php echo $info_hidden;?>">
133
                    <?php echo $info_file_name;?>
134
                    <?php echo $info_img;?>
3359 idir 135
                  </div>
3226 idir 136
                </div>
137
 
3241 idir 138
                <div class="col-sm-12 mb-3">
139
                  <label for="description">Description</label>
3376 idir 140
                  <textarea name="description" id="description" class="form-control"><?php echo isset( $widget['description'] ) ? htmlspecialchars( $widget['description'] ) : '';?></textarea>
3241 idir 141
                </div>
3164 idir 142
 
3241 idir 143
                <div class="input-file-row row">
144
                  <div class="input-file-container col-sm-10">
3176 idir 145
 
3241 idir 146
                    <?php
3897 delphine 147
                      $logo_file_name = [];
148
                      $logo_src       = '';
149
                      $logo_img       = '';
150
                      $logo_hidden    = '';
3241 idir 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.';
3241 idir 156
                      else :
3359 idir 157
                        $logo_hidden    = ' hidden';
3241 idir 158
                      endif;
159
                    ?>
3176 idir 160
 
3241 idir 161
                    <input type="file" class="input-file" name="logo" id="logo"  accept="image/*" value="">
162
                    <label for="logo" class="label-file"><i class="fas fa-download"></i> Logo</label>
163
                  </div>
164
                  <div class="btn btn-danger btn-sm remove-file" name="remove-file" title="Supprimer le fichier">
165
                    <i class="fas fa-times" aria-hidden="true"></i>
166
                  </div>
3376 idir 167
                  <div class="file-return logo<?php echo $logo_hidden;?>">
168
                    <?php echo $logo_file_name;?>
169
                    <?php echo $logo_img;?>
3241 idir 170
                  </div>
3174 idir 171
                </div>
3164 idir 172
 
3241 idir 173
                <div class="input-file-row row">
174
                  <div class="input-file-container col-sm-10">
3359 idir 175
 
176
                    <?php
3897 delphine 177
                      $image_fond_file_name = [];
178
                      $image_fond_src       = '';
179
                      $image_fond_img       = '';
180
                      $image_fond_hidden    = '';
3359 idir 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
                      else :
187
                        $image_fond_hidden    = ' hidden';
188
                      endif;
189
                    ?>
190
 
3361 idir 191
                    <input type="file" class="input-file" name="image_fond" id="image_fond" accept="image/*">
3235 idir 192
                    <label for="image_fond" class="label-file"><i class="fas fa-download"></i> Image de fond</label>
3241 idir 193
                  </div>
194
                  <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 195
                  <div class="file-return image_fond <?php echo $image_fond_hidden;?>">
196
                    <?php echo $image_fond_file_name;?>
197
                    <?php echo $image_fond_img;?>
3359 idir 198
                  </div>
3174 idir 199
                </div>
3226 idir 200
 
3174 idir 201
              </div><!-- end #profile-details-description-section -->
3164 idir 202
 
3241 idir 203
              <div class="register-section row" id="profile-details-fields-section">
3897 delphine 204
                <h2>Milieux et taxonomie</h2>
3241 idir 205
                <div class="col-sm-12 mb-3">
206
                  <label for="milieux">Milieux</label>
3332 idir 207
                  <p class="message">
208
                    Liste de milieux séparés par un ";".
209
                    <br>
3376 idir 210
                    <i class="fas fa-pen"></i>&nbsp;Pour ajouter une option "autre" ajoutez le mot "autre" dans votre liste de milieux.
3332 idir 211
                    <br>
3376 idir 212
                    <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 213
                    <br>
3332 idir 214
                    <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.
215
                  </p>
3376 idir 216
                  <input type="text" name="milieux" id="milieux" class="form-control" value="<?php echo isset( $widget['milieux'] ) ? $widget['milieux'] : '';?>">
3241 idir 217
                </div>
3167 idir 218
 
3241 idir 219
                <div class="col-sm-12 mb-3">
3376 idir 220
                  <label for="type_especes">Type liste espèce&nbsp;*</label>
3881 delphine 221
                  <?php
222
                    $types_espece = [
223
                      'referentiel' => 'Référentiel',
224
                      'liste' => 'Liste',
225
                      'liste+autre' => 'Liste + autres',
226
                      'fixe' => 'Espèce fixée',
227
                    ];
228
                  ?>
3262 idir 229
                  <select  id="type_especes" name="type_especes" required class="form-control custom-select">
3881 delphine 230
                    <?php foreach( $types_espece as $type_espece => $affichage_type_espece ): ?>
231
                      <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>
232
                    <?php endforeach;?>
3174 idir 233
                  </select>
3164 idir 234
                </div>
3167 idir 235
 
3241 idir 236
                <div class="col-sm-12 mb-3">
3376 idir 237
                  <label for="referentiel">Référentiel&nbsp;*</label>
238
                  <p class="message">
239
                    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;:
240
                    <br>
241
                    <code>référentiel:num_nom</code>
242
                    <br>
243
                    ex&nbsp;: <code>bdtfx:182</code>
244
                  </p>
3378 idir 245
                  <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 246
                </div>
3167 idir 247
 
3174 idir 248
                <!-- Bouton fichier-type à compléter -->
3241 idir 249
                <div class="input-file-row row">
250
                  <div class="input-file-container col-sm-10">
251
                    <input type="file" class="input-file" name="especes" id="especes">
3376 idir 252
                    <label for="especes"class="label-file"><i class="fas fa-download"></i> Espèces</label>
3255 idir 253
                    <p class="message mt-2">
254
                      <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
3376 idir 255
                      &nbsp;Format&nbsp;: CSV ou TSV UTF-8.
256
                      <br>
257
                      Séparateur&nbsp;: Tabulation.
3255 idir 258
                    </p>
3241 idir 259
                  </div>
260
                  <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>
261
                  <div class="file-return especes hidden"></div>
3174 idir 262
                </div>
3241 idir 263
                <div class="col-sm-12 mb-3">
3376 idir 264
                  <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 265
                </div>
3897 delphine 266
                <h2>Champs Imposés</h2>
267
                 <div class="col-sm-12 mb-3">
268
                      <label for="adresse">Adresse obligatoire</label>
269
                      <select  id="adresse" name="adresse" class="form-control custom-select">
270
                        <option value="0" <?php echo ( isset( $widget['adresse'] ) && $widget['adresse'] === '0' ) ? 'selected' : '';?>>Non</option>
271
                        <option value="1" <?php echo ( isset( $widget['adresse'] ) && $widget['adresse'] === '1' ) ? 'selected' : '';?>>Oui</option>
272
                      </select>
273
                  </div>
274
                  <div class="col-sm-12 mb-3">
275
                      <label for="photo_obligatoire">Photo obligatoire</label>
276
                      <select  id="photo_obligatoire" name="photo_obligatoire" class="form-control custom-select">
277
                        <option value="0" <?php echo ( isset( $widget['photo_obligatoire'] ) && $widget['photo_obligatoire'] === '0' ) ? 'selected' : '';?>>Non</option>
278
                        <option value="1" <?php echo ( isset( $widget['photo_obligatoire'] ) && $widget['photo_obligatoire'] === '1' ) ? 'selected' : '';?>>Oui</option>
279
                      </select>
280
                  </div>
281
                  <h2>Localisation</h2>
282
                  <div class="col-sm-12 mb-3">
283
                    <label for="type_localisation">Type de localisation</label>
284
                    <select  id="type_localisation" name="type_localisation" class="form-control custom-select">
285
                      <option value="<?php echo ( isset( $widget['type_localisation'] ) ) ? $widget['type_localisation'] : 'point';?>"><?php echo ( isset( $widget['type_localisation'] ) ) ? $widget['type_localisation'] : 'point';?></option>
286
                      <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>
287
                    </select>
288
                  </div>
289
                  <div class="col-sm-12">
290
                    <label for="fond_carte">Fond de carte</label>
291
                    <select  id="fond_carte" name="fond_carte" class="form-control custom-select">
292
                      <?php
293
                        $affichage_fonds_carte = [
294
                          'osm' => 'OSM (carte par défaut)',
295
                          'googleHybrid' => 'Photos aériennes',
296
                        ];
297
                        $fond_carte = isset($widget['fond_carte']) && isset($affichage_fonds_carte[$widget['fond_carte']]) ? $widget['fond_carte'] : 'osm';
298
                      ?>
299
                      <?php foreach($affichage_fonds_carte  as $nom_base => $nom_affiche) :?>
300
                        <option value="<?php echo $nom_base;?>"<?php echo $nom_base === $fond_carte ? ' selected="selected"' : '';?>><?php echo $nom_affiche;?></option>
301
                      <?php endforeach;?>
302
 
303
                    </select>
304
                  </div>
3174 idir 305
              </div><!-- end #profile-details-fields-section -->
3171 idir 306
 
3424 idir 307
              <!--localisation-->
308
              <input type="hidden" name="localisation" id="localisation" value="<?php echo isset($widget['localisation']) ? htmlspecialchars($widget['localisation']) : '';?>">
3174 idir 309
              <!--Submit-->
310
              <div class="submit complete-registration" id="submit-button">
3341 idir 311
                <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 312
              </div>
3174 idir 313
              <!--Submit-->
3171 idir 314
 
3174 idir 315
            </form><!-- end #new-widget-form -->
316
 
3424 idir 317
            <form id="form-geolocalisation" autocomplete="off">
3897 delphine 318
              <div class="row">
3424 idir 319
                <label for="geolocalisation" class="obligatoire has-tooltip col-sm-12" data-toggle="tooltip" title="">
320
                  Geolocalisation&nbsp: Déterminer un point gps (facultatif)
321
                </label>
322
              </div>
323
              <div id="geoloc" class="geoloc">
324
                <tb-geolocation-element
325
                  id="tb-geolocation"
326
                  layer='osm'
3897 delphine 327
                  zoom_init="<?php echo $widget['tableau-localisation']['zoom'] ?? '4' ;?>"
328
                  lat_init="<?php echo $widget['tableau-localisation']['latitude'] ?? '46.5' ;?>"
329
                  lng_init="<?php echo $widget['tableau-localisation']['longitude'] ?? '2.9' ;?>"
3424 idir 330
                  marker="true"
331
                  polyline="false"
332
                  polygon="false"
333
                  show_lat_lng_elevation_inputs="true"
334
                  osm_class_filter=""
3812 idir 335
                  geometry_filter="point"
3424 idir 336
                  elevation_provider="mapquest"
337
                  map_quest_api_key="mG6oU5clZHRHrOSnAV0QboFI7ahnGg34"
3812 idir 338
                  height="400px"
3424 idir 339
                >
340
                </tb-geolocation-element>
341
              </div>
342
              <div class="control-group mt-3 mb-3">
343
                <div class="row">
344
                  <div id="geoloc-datas" class="col-sm-12 row">
345
                    <div class="col-sm-6 mb-3">
346
                      <label for="latitude">Latitude</label>
3897 delphine 347
                      <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="<?php echo $widget['tableau-localisation']['latitude'] ?? '' ;?>">
3424 idir 348
                    </div>
349
                    <div class="col-sm-6 mb-3">
350
                      <label for="longitude">Longitude</label>
3897 delphine 351
                      <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="<?php echo $widget['tableau-localisation']['longitude'] ?? '' ;?>">
3424 idir 352
                    </div>
353
                    <div class="col-sm-12 mb-3">
354
                      <label for="zoom">Zoom (indépendant des coordonnées)</label>
355
                      <p class="message">
356
                        Quelques exemples de précision zoom&nbsp;:<br>
357
                        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).
358
                      </p>
3897 delphine 359
                      <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="<?php echo $widget['tableau-localisation']['zoom'] ?? '' ;?>"  />
3424 idir 360
                    </div>
361
                  </div>
362
                </div>
363
              </div>
364
            </form><!-- end #form-geolocalisation -->
365
 
3897 delphine 366
            <?php if ( !isset( $widget['type'] ) ):?>
367
              <form id="new-fields" autocomplete="off">
368
                <h2>Ajouter des champs</h2>
369
                <p id="infos-validation-boutons" class="message">
370
                  <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
371
                  &nbsp;Attention&nbsp;:
372
                  <br>
373
                  <i class="fa fa-bolt" aria-hidden="true"  style="color:#B3C954"></i>
374
                  &nbsp;Le bouton "Valider" sert à valider les champs supplémentaires uniquement
375
                  <br>
376
                  <i class="fas fa-trophy" aria-hidden="true"  style="color:#B3C954"></i>
377
                  &nbsp;Le bouton "Terminer" sert à envoyer la totalité du nouveau widget
378
                </p>
379
              </form><!-- #new-fields = fomulaire oû viennent s'insérer les champs supplémentaires -->
380
 
381
              <div id="new-fields-buttons" class="row">
382
                <div class="col-md-4 col-sm-4 col-xs-4 buttons">
383
                  <label class="add-fields">Ajouter</label>
384
                  <div class="button" id="add-fields" title="Ajouter un champ"><i class="fa fa-plus" aria-hidden="true"></i></div>
385
                </div>
386
                <div class="col-md-4 col-sm-4 col-xs-4 buttons">
387
                  <label for="preview-field">Prévisualiser</label>
388
                  <div class="button" id="preview-field" name="preview-field" title="prévisualiser"><i class="fa fa-magic" aria-hidden="true"></i></div>
389
                </div>
390
                <div class="col-md-4 col-sm-4 col-xs-4 buttons">
391
                  <label class="validate-new-fields">Valider</label>
392
                  <div class="button" id="validate-new-fields" title="Valider les champs supplémentaires"><i class="fa fa-bolt" aria-hidden="true"></i></div>
393
                </div>
394
              </div>
395
            <?php else:?>
3424 idir 396
              <p class="message">
397
                <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
3897 delphine 398
                &nbsp;Ce widget est de type "<?php echo ( $widget['type'] );?>"&nbsp;:
3424 idir 399
                <br>
3897 delphine 400
                &nbsp;si vous souhaitez ajouter ou modifier des champs supplémentaires, vous devez le faire sur <a href="<?php echo $url_base ;?>manager?mode=modification&projet=<?php echo $widget['type'];?>&langue=fr">le widget type</a> lui même.
3424 idir 401
                <br>
3897 delphine 402
                <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i>
403
                &nbsp;cela modifiera les champs supplémentaires de tous les tous les autres widgets du même type.
3424 idir 404
              </p>
3897 delphine 405
            <?php endif;?>
3174 idir 406
 
3167 idir 407
          </div><!-- end .widget-blocks = tout le bloc de gauche-->
408
 
3241 idir 409
          <div id="right-block" class="widget-blocks">
3185 idir 410
            <div class="widget-renderer">
3241 idir 411
              <div id="preview-background"></div>
3167 idir 412
 
3174 idir 413
              <div id="preview-header" class="row">
3189 idir 414
                  <div id="preview-logo" class="col-md-4"></div>
3167 idir 415
                  <div id="preview-title" class="col-md-8">
416
                    <h1></h1>
3378 idir 417
                    <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 418
                  </div>
419
              </div>
420
 
3174 idir 421
              <div id="preview-messages" class="row">
3167 idir 422
 
3241 idir 423
                <div id="preview-description" class="col-md-6">
424
                  <div class="">
3174 idir 425
                    <p class="preview-description"></p>
426
                  </div>
3226 idir 427
 
3167 idir 428
                </div><!-- end #preview-description -->
429
 
3241 idir 430
                <div id="preview-aide" class="col-md-6">
431
                  <div class="">
3174 idir 432
                    <h3>Aide</h3>
433
                    <p>
434
                      Cet outil vous permet de partager simplement vos observations avec
435
                      le <a target="_blank" href="https://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
436
                      (<a target="_blank" href="https://www.tela-botanica.org/page:licence">licence CC-BY-SA</a>).
437
                      Identifiez-vous bien pour ensuite retrouver et gérer vos données dans votre
438
                      <a target="_blank" href="https://www.tela-botanica.org/appli:cel"> Carnet en ligne</a>.
439
                      Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
440
                      Elles apparaissent immédiatement sur les
441
                      <a target="_blank" href="https://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
442
                    </p>
443
                    <p class="discretion">
444
                      Pour toute question ou remarque,
3376 idir 445
                      <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 446
                          javascript:window.open(
447
                            this.getAttribute( 'href' ),
448
                            'Tela Botanica - Remarques',
449
                            config = 'height=700, width=640, scrollbars=yes, resizable=yes'
450
                          );
451
                          return false;
3174 idir 452
                      ">contactez-nous</a>
453
                    </p>
454
                  </div>
3167 idir 455
                </div>
456
              </div><!-- end #preview-aide -->
457
 
458
              <div id="preview-formulaire" class="row">
459
 
460
                <form id="preview-form-observateur" role="form" autocomplete="on">
461
 
462
                  <h2>Observateur</h2>
463
 
3241 idir 464
                  <div class="row">
465
                    <div id="bouton-connexion" class="col-md-6 col-sm-8">
466
                      <label for="bouton-connexion">Je me connecte à mon compte&nbsp;:</label>
467
                      <div class="btn btn-success mr-1 mb-1">Connexion</div>
468
                      <div class="btn btn-success mr-1 mb-1">Inscription</div>
3167 idir 469
                    </div>
3241 idir 470
                    <div id="creation-compte" class="col-md-6 col-sm-8">
471
                      <label for="creation-compte">Je ne souhaite pas m'inscrire&nbsp;:</label>
472
                      <div class="btn btn-info mr-1 mb-1">Observation sans inscription</div>
3167 idir 473
                    </div>
474
 
475
                  </div>
476
 
477
                </form>
478
 
479
                <form id="form-observation" role="form" autocomplete="on">
480
 
481
                  <h2>Observation</h2>
482
 
3185 idir 483
                  <div id="zone-observation" class="row">
3167 idir 484
 
3241 idir 485
                    <div class="col-md-6 row">
486
                      <div class="col-md-12">
3424 idir 487
                        <label for="geolocalisation-previs" id="label-geolocalisation" title="Veuillez saisir votre adresse courriel.">
3376 idir 488
                          <i class="fa fa-envelope"></i>&nbsp;Geolocalisation
3241 idir 489
                        </label>
3424 idir 490
                        <div id="geolocalisation-previs">
491
                          <img src="<?php echo $url_base;?>modules/manager/squelettes/img/geoloc/geoloc.png" alt="geolocalisation" width="90%">
3241 idir 492
                        </div>
493
                      </div>
3185 idir 494
 
3241 idir 495
                      <div class="col-md-12">
496
                        <label for="milieu" id="label-milieu">
3376 idir 497
                          <i class="fa fa-street-view"></i>&nbsp;Milieu
3241 idir 498
                        </label>
499
                        <input type="text" id="milieu" name="milieu" class="form-control" placeholder="bois, champ, falaise, ...">
500
                      </div>
3167 idir 501
                    </div>
502
 
3241 idir 503
                    <div class="col-md-6 row">
504
                      <div class="col-md-12">
505
                        <label for="date" id="label-date" title="">
3376 idir 506
                          <i class="fa fa-calendar"></i>&nbsp;Date de relevé
3241 idir 507
                        </label>
508
                        <div class="date">
509
                          <input type="date" id="date" class="form-control" name="date" title="jj/mm/aaaa" required>
510
                        </div>
3167 idir 511
                      </div>
3185 idir 512
 
3241 idir 513
                      <div class="col-md-12">
514
                        <label for="taxon" id="label-taxon" title="">
3376 idir 515
                          <i class="fa fa-leaf"></i>&nbsp;Espèce<span></span>
3241 idir 516
                        </label>
517
                        <div class="taxon">
518
                          <input type="text" name="taxon" id="taxon" class="form-control">
519
                        </div>
3167 idir 520
                      </div>
3185 idir 521
 
3241 idir 522
                      <div class="col-md-12">
523
                        <label for="certitude" id="label-certitude" title="">
3376 idir 524
                          <i class="fa fa-question"></i>&nbsp;Certitude
3241 idir 525
                        </label>
3262 idir 526
                        <select id="certitude" name="certitude" class="form-control custom-select" required>
3241 idir 527
                          <option value="" >À déterminer</option>
528
                          <option value="" >Douteuse</option>
529
                          <option value="" selected="selected" >Certaine</option>
530
                        </select>
3167 idir 531
                      </div>
3185 idir 532
 
3241 idir 533
                      <div class="col-md-12">
534
                        <label for="notes" id="label-notes" title="">
3376 idir 535
                          <i class="fa fa-pen" aria-hidden="true"></i>&nbsp;Notes
3241 idir 536
                        </label>
537
                        <div class="notes">
538
                            <textarea id="notes" name="notes" class="form-control" placeholder="Vous pouvez éventuellement ajouter des informations complémentaires à votre observation."></textarea>
539
                        </div>
3167 idir 540
                      </div>
541
                    </div>
542
 
543
                  </div>
544
 
545
                </form>
546
 
3185 idir 547
                <!-- formulaire d'affichage des bouveaux champs -->
3167 idir 548
                <form id="form-supp" role="form" autocomplete="on">
549
                  <div id="zone-supp" class="row align-items-center">
3241 idir 550
                    <div class="col-md-6 preview-container row"></div>
3167 idir 551
                  </div>
552
                </form>
553
 
3241 idir 554
                <!-- formulaire d'upload d'images -->
555
                <form id="form-upload" class="" action="" method="" enctype="multipart/form-data">
556
                  <h2>Image(s) de cette plante</h2>
557
                  <p class="miniature-info" class="discretion help-inline">
558
                    Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.
559
                  </p>
560
                  <div>
561
                      <div class="btn btn-large btn-info mb-3">
3376 idir 562
                        <span class=""><i class="fas fa-download"></i>&nbsp;Ajouter une image</span>
3241 idir 563
                      </div>
564
                  </div>
565
                </form>
566
 
3167 idir 567
              </div><!-- end #preview-formulaire -->
568
 
569
            </div><!-- end #widget-renderer-->
570
 
571
          </div><!-- #widget-blocks = tout le bloc de droite-->
572
 
3164 idir 573
        </div>
3167 idir 574
      </div>
575
    </div>
3174 idir 576
    <div id="help-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="help-modal-label" style="display: none;" aria-hidden="true">
577
      <div class="modal-dialog modal-dialog-centered" role="document">
578
        <div class="modal-content">
579
          <div class="modal-header">
580
            <h5 class="modal-title" id="help-modal-label"></h5>
581
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
3241 idir 582
              <span aria-hidden="true">&times;</span>
3174 idir 583
            </button>
584
          </div>
585
          <div class="modal-body" id="print_content"></div>
586
          <div class="modal-footer">
587
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
588
          </div>
589
        </div>
590
      </div>
591
    </div>
3424 idir 592
    <!-- carto -->
593
    <script type="text/javascript" src="<?php echo $url_base; ?>modules/manager/squelettes/js/tb-geoloc/tb-geoloc-lib-app.js"></script>
3226 idir 594
    <!-- Jquery -->
595
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
596
    <!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
597
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
598
    <!-- <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script> -->
599
    <!-- Jquery Plugins -->
600
    <!-- Jquery Validate : nécessaire pour la validation des formulaires -->
601
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
602
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
603
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
604
    <!-- Jquery Form :nécessaire pour l'upload des images -->
605
    <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
606
    <!-- Bootstrap -->
3241 idir 607
    <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 608
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
3897 delphine 609
   <!--  <script type="text/javascript" src="<?php echo $url_base;?>modules/manager/squelettes/js/manager.js"></script> -->
610
    <script type="module" src="<?php echo $url_base; ?>modules/manager/squelettes/js/manager.js"></script>
611
    <script type="text/javascript">
612
      const CHAMPS_SUPP_JSON = <?php echo $widget['chpSupp'][$widget['projet']]['champs-supp-json'] ?? '""';?>;
613
      const URLS_IMAGES = "<?php echo $url_base;?>modules/manager/squelettes/img/images_projets/<?php echo $widget['projet'];?>/";
614
    </script>
3226 idir 615
      <!-- Barre de navigation -->
616
    <?php if ( $bar !== false ) : ?>
3376 idir 617
      <script src="<?php echo $url_script_navigation;?>"></script>
618
    <?php endif;?>
3167 idir 619
  </body>
3164 idir 620
</html>