Subversion Repositories eFlore/Applications.cel

Rev

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

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
        <title><?= $widget['titre']; ?></title>
        
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <meta http-equiv="Content-style-type" content="text/css" />
        <meta http-equiv="Content-script-type" content="text/javascript" />
        <meta http-equiv="Content-language" content="fr" />
        
        <meta name="revisit-after" content="15 days" />
    <meta name="robots" content="index,follow" />
    <meta name="author" content="Tela Botanica" />
    <meta name="keywords" content="Tela Botanica, CEL" />
    <meta name="description" content="Gestion des widgets de saisie du carnet en ligne" />
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

        <!-- OpenGraph pour Facebook, Pinterest, Google+ -->
        <meta property="og:type" content="website" />
        <meta property="og:title" content="Gestion des widgets de saisie du CeL" />
        <meta property="og:site_name" content="Tela Botanica" />
        <meta property="og:description" content="Gestion des widgets de saisie du Carnet en Ligne" />
        <meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
        <meta property="og:image:type" content="image/png" /> 
        <meta property="og:image:width" content="256" /> 
        <meta property="og:image:height" content="256" />
        <meta property="og:locale" content="fr_FR" />

        <!-- Favicones -->
        <link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
        
        <!-- Jquery -->
        <!-- Google Map v3 -->
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?language=fr&amp;region=FR"></script>
        <!-- Jquery -->
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
        <!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
        <!-- Jquery Plugins -->
        <!-- Jquery Validate : nécessaire pour la validation des formulaires -->
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
        <!-- Jquery Form :nécessaire pour l'upload des images -->
        <script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
        <!-- Bootstrap -->
        <script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>

        <script type="text/javascript" src="<?=$url_base?>modules/saisie2/squelettes/js/WidgetSaisie.js"></script>
        <script type="text/javascript">
                //<![CDATA[
           $(document).ready(function() {
                                // OMG un modèle objet !!
                                var widget = new WidgetSaisie();
                                
                                // langue
                                widget.langue = "<?= $widget['langue']; ?>";
                                // Squelette d'URL du web service de l'annuaire.
                                widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
                                // URL de l'icône du chargement en cours
                                widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
                                // URL de l'icône du chargement en cours d'une image
                                widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
                                // URL de l'icône du calendrier
                                widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
                                // URL de l'icône pour une photo manquante
                                widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
                        
                                // Code du référentiel utilisé pour les nom scientifiques.
                                widget.nomSciReferentiel = "<?= strtolower($widget['referentiel']); ?>";
                                // Indication de la présence d'une espèce imposée
                                widget.especeImposee = "<?=$espece_imposee; ?>";
                                // Tableau d'informations sur l'espèce imposée
                                widget.infosEspeceImposee = "<?=$infos_espece; ?>";
                                // Nombre d'élément dans les listes d'auto-complétion
                                widget.autocompletionElementsNbre = 20;
                                // Indication de la présence d'un référentiel imposé
                                widget.referentielImpose = "<?=$referentiel_impose; ?>";
                                // URL du web service permettant l'auto-complétion des noms scientifiques
                                widget.serviceAutocompletionNomSciUrl = "<?= $widget['especes']['url_ws_autocompletion_ns']; ?>?"+
                                        "masque={masque}&"+
                                        "recherche=etendue&"+
                                        "retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
                                        "ns.structure=au"+"&"+
                                        "navigation.limite=" + widget.autocompletionElementsNbre;
                                // Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
                                widget.serviceAutocompletionNomSciUrlTpl = "<?= $widget['especes']['url_ws_autocompletion_ns_tpl']; ?>?"+
                                        "masque={masque}&"+
                                        "recherche=etendue&"+
                                        "retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
                                        "retour.tri=alpharet&"+ // tri "à la CeL"
                                        "ns.structure=au"+"&"+
                                        "navigation.limite=" + widget.autocompletionElementsNbre;

                                
                                // Initialisation du bousin
                                widget.init();
                        });
                //]]>
        </script>
        <!-- Barre de navigation -->
        <?php if ($bar !== false): ?>
                <script src="<?=$url_script_navigation?>"></script>
        <?php endif; ?>
        
        
        <!-- CSS -->
        <link href="http://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" />
        <!-- <link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" /> -->
        <link rel="stylesheet" type="text/css" href="<?=$url_base?>modules/saisie2/squelettes/css/bootstrap-4/css/bootstrap.min.css" />
        <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
        <!--  <link id="telabotanica-style-css" rel="stylesheet" href="https://beta.tela-botanica.org/preprod/wp-content/themes/telabotanica/dist/bundle.css?ver=4.7.5" type="text/css" media="all">
        --><link href="<?= $url_base; ?>modules/saisie2/squelettes/css/saisie.css" rel="stylesheet" type="text/css" media="screen" />
        <!--  Google Analytics -->
        <?php if($prod): ?>
                <?php include "analytics.html"; ?>
        <?php endif; ?>
  </head>

  <body>
                <div id="zone-appli" class="container">
                <?php if ($bar !== false): ?>
                        <div id="tb-navigation" data-courant="widget-cel-saisie" data-squelette="bootstrap4" data-mode="prod">
                        </div>
                        <br/>
                <?php endif; ?>
                <div class="layout-wrapper page">
                        <div class="media">
                                <?= '<img class="d-flex mr-3" src="'.$widget['logo'].'" alt="'.$widget['projet'].'" >';?>
                                <div class="media-body">
                                        <h1 class="mt-0">
                                                <?= $widget['titre']; ?>
                                        </h1>
                                </div>
                        </div>
                        <div class="row align-items-center">
                                <div class="col-md-6">
                                        <div id="description"><?= $widget['description']; ?></div>
                                </div>
                                <div class="col-md-6">
                                        <div id="aide" class="well well-lg hidden-sm-down">
                                                <h3><?= $aide['titre']; ?></h3>
                                                <div id="aide-txt" class="hiden-sm-down">
                                                        <p>
                                                                Cet outil vous permet de partager simplement vos observations avec
                                                                le <a target="_blank" href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
                                                                (<a target="_blank" href="http://www.tela-botanica.org/page:licence">licence CC-BY-SA</a>).
                                                                Identifiez-vous bien pour ensuite retrouver et gérer vos données dans votre
                                                                <a target="_blank" href="http://www.tela-botanica.org/appli:cel"> Carnet en ligne</a>.
                                                                Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
                                                                Elles apparaissent immédiatement sur les
                                                                <a target="_blank" href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
                                                        </p>
                                                        <p class="discretion">
                                                                Pour toute question ou remarque,
                                                                <a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
                                                                        target="_blank"
                                                                        onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
                                                                        contactez-nous</a>
                                                        </p>
                                                </div>
                                        </div>
                                </div>
                        </div>
                        <div id="formulaire">
                                <form id="form-observateur" role="form" autocomplete="on">
                                        <h2><?= $observateur['titre']; ?></h2>
                                        <div id="zone-courriel" class="row align-items-center">
                                                <div class="col-md-6 form-inline">
                                                        <label for="courriel" class="col-sm-3" title="<?= $observateur['courriel-title']; ?>">
                                                                <strong class="obligatoire">*</strong>
                                                                <?= $observateur['courriel']; ?>
                                                        </label>
                                                        <div class="col-sm-8 mb-2 input-group">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-envelope"></span></span>
                                                                <input id="courriel" name="courriel" class="form-control" type="email" title="<?= $observateur['courriel-title']; ?> "/>
                                                                <input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
                                                        </div>
                                                </div>
                                                <div id="zone-courriel-confirmation" class="col-md-6 form-inline" style="display:none;">
                                                        <label for="courriel_confirmation" class="col-sm-3" title="Veuillez confirmer le courriel.">
                                                                <strong class="obligatoire">*</strong> Courriel (confirmation)
                                                        </label>
                                                        <div class="col-sm-8 input-group">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-envelope"></span></span>
                                                                <input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="email"/>
                                                        </div>
                                                </div>
                                        </div>
                                        <div id="zone-prenom-nom" class="row align-items-center" style="display:none;">
                                                <div class="col-md-6 form-inline">
                                                        <label for="prenom" class="col-sm-3"><?= $observateur['prenom']; ?></label>
                                                        <div class="input-group col-sm-8">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-user"></span></span>
                                                                <input id="prenom" name="prenom" class="form-control" type="text"/>
                                                        </div>
                                                </div>
                                                <div class="col-md-6 form-inline">
                                                        <label for="nom" class="col-sm-3"><?= $observateur['nom']; ?></label>
                                                        <div class="input-group col-sm-8">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-user"></span></span>
                                                                <input id="nom" name="nom" class="form-control" type="text"/>
                                                        </div>
                                                </div>
                                        </div>
                                </form>
                                <form id="form-observation" role="form" autocomplete="on">
                                        <h2><?= $observation['titre']; ?></h2>
                                        <div id="zone-observation" class="row align-items-center">
                                                <div class="col-md-6 form-inline">
                                                        <label for="courriel" class="col-sm-3" title="<?= $observateur['courriel-title']; ?>">
                                                                <strong class="obligatoire">*</strong>
                                                                <?= $observation['geolocalisation']; ?>
                                                        </label>
                                                        <div class="col-sm-8 mb-2 input-group">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-envelope"></span></span>
                                                                <input id="courriel" name="courriel" class="form-control" type="email" title="<?= $observateur['courriel-title']; ?> "/>
                                                                <input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
                                                        </div>
                                                        <label for="milieu" class="col-sm-3">
                                                                <?= $observation['milieu']; ?>
                                                        </label>
                                                        <div class="col-sm-8 mb-2 input-group">
                                                        <span class="input-group-addon hidden-xs-down"><span class="fa fa-street-view"></span></span>
                                                                <?php if ($widget['milieux'] != array()) {?>
                                                                        <select id="milieu" class="form-control" >
                                                                        <?php foreach ($widget['milieux'] as $milieu) {?>
                                                                                <option value="<?= $milieu; ?>"><?= $milieu; ?></option>
                                                                        <?php } ?>
                                                                        </select>
                                                                <?php } else { ?>
                                                                        <input id="milieu" name="milieu" class="form-control" type="text" placeholder="bois, champ, falaise, ..."/>
                                                                <?php } ?>
                                                        </div>
                                                </div>
                                                <div class="col-md-6 form-inline">
                                                        <label for="date" class="col-sm-3" title="">
                                                                <strong class="obligatoire">*</strong><?= $observation['date']; ?>
                                                        </label>
                                                        <div class="col-sm-8 input-group date" id="datetimepicker">
                                                                <span  id="date-icone" class="input-group-addon hidden-xs-down"><span class="fa fa-calendar"></span></span>
                                                                <input id="date" name="date" class="form-control" type="date"/>
                                                        </div>
                                                        <?php if($widget['type_especes'] == "referentiel" && $widget['referentiel'] == "") { ?>
                                                                <label for="referentiel" class="col-sm-3" title="">
                                                                        <strong class="obligatoire">*</strong><?= $observation['referentiel']; ?>
                                                                </label>
                                                                <div class="col-sm-8 input-group">
                                                                        <span class="input-group-addon hidden-xs-down"><span class="fa fa-book"></span></span>
                                                                        <select id="referentiel" class="form-control" >
                                                                                <option value="bdtfxr" selected="selected" title="Trachéophytes de France métropolitaine">Métropole (index réduit)</option>
                                                                                <option value="bdtfx" title="Trachéophytes de France métropolitaine">Métropole (BDTFX)</option>
                                                                                <option value="bdtxa" title="Trachéophytes des Antilles">Antilles françaises (BDTXA)</option>
                                                                                <option value="bdtre" title="Trachéophytes de La Réunion">Réunion (BDTRE)</option>
                                                                                <option value="aublet" title="Guyane">Guyane (AUBLET2)</option>
                                                                                <option value="florical" title="Nouvelle-Calédonie">Nouvelle-Calédonie (FLORICAL)</option>
                                                                                <option value="isfan" title="Afrique du Nord">Afrique du Nord (ISFAN)</option>
                                                                                <option value="apd" title="Afrique de l'Ouest et du Centre">Afrique de l'Ouest et du Centre (APD)</option>
                                                                                <option value="lbf" title="Liban">Liban (LBF)</option>
                                                                                <option value="autre" title="Autre/Inconnu">Autre/Inconnu</option>
                                                                        </select>
                                                                </div>
                                                        <?php } else { ?><input id="referentiel" name="referentiel" value="<?= $widget['referentiel']; ?>" type="hidden" /><?php } ?>
                                                        
                                                        <label for="taxon" class="col-sm-3" title="">
                                                                <?= $observation['espece']; ?>
                                                        </label>
                                                        <div class="col-sm-8 input-group date">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-leaf"></span></span>
                                                                <input id="taxon" name="taxon" class="form-control" type="text"/>
                                                        </div>
                                                        <label for="certitude" class="col-sm-3" title="">
                                                                <strong class="obligatoire">*</strong><?= $observation['certitude']; ?>
                                                        </label>
                                                        <div class="col-sm-8 input-group date" id="datetimepicker">
                                                                <span class="input-group-addon hidden-xs-down"><span class="fa fa-question"></span></span>
                                                                <select id="certitude" name="certitude" class="form-control">
                                                                        <option value="aDeterminer" ><?= $observation['certADet']; ?></option>
                                                                        <option value="douteuse" ><?= $observation['certDout']; ?></option>
                                                                        <option value="certaine" selected="selected" ><?= $observation['certCert']; ?></option>
                                                                </select>
                                                        </div>
                                                </div>
                                        </div>
                                </form>
                                <?php if (isset($widget['chpSupp']) && $widget['chpSupp'] != array()) { ?>
                                        <form id="form-supp" role="form" autocomplete="on">
                                                <div id="zone-supp" class="row align-items-center">
                                                        <div class="col-md-6 form-inline">
                                                                <?php print_r(implode($widget['chpSupp']));?>
                                                        </div>
                                                </div>
                                        </form>
                                <?php } ?>
                                <div id="image" class="row align-items-center">
                                </div>
                        </div>
                                
                                <div class="row align-items-end component-tools-item-link">
                                        <a href="http://www.tela-botanica.org/appli:cel" target="" style="color: #e16e37">
                                                <span>Gestion</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/widget:cel:cartoPoint?projet=<?= $widget['projet']; ?>" target="" style="color: #918a6f">
                                                <span>Carto</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/widget:cel:photo?projet=<?= $widget['projet']; ?>" target="" style="color: #964e75">
                                                <span>Photo</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/widget:cel:observation?projet=<?= $widget['projet']; ?>" target="" style="color: #b2cb43">
                                                <span>Observation</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/widget:cel:export?projet=<?= $widget['projet']; ?>" target="" style="color: #009fb8">
                                                <span>Export</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/appli:pictoflora?projet=<?= $widget['projet']; ?>" target="" style="color: #927fa2">
                                                <span>PictoFlora</span>
                                        </a>
                                        <a href="http://www.tela-botanica.org/appli:identiplante?projet=<?= $widget['projet']; ?>" target="" style="color: #f25a52">
                                                <span>IdentiPlante</span>
                                        </a>
                                </div>
                        
                </div>
        </div>
  </body>
</html>