Subversion Repositories eFlore/Applications.cel

Rev

Rev 1344 | Go to most recent revision | Blame | Last modification | View Log | RSS feed

<?php
$annee = date('Y');
$aujourdhui = date('d/m/Y');
?>
<!DOCTYPE html>
<html lang="fr" manifest="<?=$url_base?>modules/saisie/squelettes/mobile/mobile.appcache"> 
        <head> 
                <title>CEL Mobile</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="Jean-Pascal MILCENT, Mathilde SALTHUN-LASSALLE" />
        <meta name="keywords" content="Tela Botanica, CEL, mobile" />
        <meta name="description" content="Widget de saisie du CEL pour smartphone" />
                
                <!-- Favicones -->
                <link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/favicon.ico" />
                
                <!-- Viewport -->
                <meta name="viewport" content="width=device-width, initial-scale=1"> 
                
                <!-- CSS -->
                <link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
                <link href="<?=$url_base?>modules/saisie/squelettes/mobile/css/<?=isset($_GET['style']) ? $_GET['style'] : 'mobile'?>.css" rel="stylesheet" type="text/css" media="screen" />
                
                <!-- Javascript -->
                <script src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
                
                <!-- Javascript : appli saisie -->
                <script type="text/javascript">
                //<![CDATA[
                        // La présence du parametre 'debug' dans l'URL enclenche le dégogage
                        var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
                //]]>
                </script>
                <script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/mobile/js/mobile.js"></script>
                
                <!-- Javascript : Jquery Mobile -->
                <script src="http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
        </head>
        <body data-theme="b">
                <div id="menu" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">
                        <div data-role="header">
                                <?php if($titre == 'defaut' ) { ?>
                                        <h1>Accueil</h1>
                                <?php } else { ?>
                                        <h1><?= $titre ?></h1>
                                <?php } ?>
                        </div>
                        <div data-role="content" data-theme="g">
                                <ul data-role="listview">
                                        <li>
                                                <img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>
                                                <a href="#saisie" data-role="button">Saisir une observation</a>
                                        </li>
                                        <li>
                                                <img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>
                                                <a href="#liste" data-role="button">Voir mes observations</a>
                                        </li>
                                        <li>
                                                <img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>
                                                <a href="#transmission" data-role="button">Transmettre mes observations</a>
                                        </li>
                                </ul>
                        </div>
                        <div data-role="footer" data-position="fixed">
                                <a href="#infos" data-role="button">Infos</a>
                        </div>
                </div>
                
                <div id="saisie" data-role="page">
                        <div data-role="header" data-position="inline">
                                <a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
                                <h1>Saisie</h1>
                                <a href="#liste" data-icon="notepad" data-iconpos="notext">Liste des obs</a>
                        </div>
                        <form id="form_saisie_observation" method="post" action="#">
                                <div data-role="content">
                                        <div id="obs-saisie-infos"></div>
                                        <div data-role="fieldcontain">
                                                <!-- 
                                                <label for="location">Commune :</label>
                                                <input type="text" name="location" id="location"/>
                                                 -->
                                                <button id="geolocaliser" data-role="button" data-icon="search" data-iconpos="">Trouver ma position</button>
                                                <label for="lat">Latitude :</label>
                                                <input id="lat" type="text" name="lat"/>
                                                
                                                <label for="lng">Longitude :</label>
                                                <input id="lng" type="text" name="lng"/>
                                                
                                                <label for="date">Date :</label>
                                                <input id="date" type="text" name="date" value="<?=$aujourdhui?>"/>
                                                
                                                <label for="nom">Espece :</label>
                                                <input id="nom" type="text" name="nom"/>
                                                
                                                <input id="num_nom" type="hidden" name="num_nom"/>
                                        </div>
                                </div>
                                <div data-role="footer" data-position="fixed">
                                        <button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>
                                </div>
                        </form>
                </div>
                
                <div id="liste" data-role="page">
                        <div data-role="header" data-position="inline">
                                <a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
                                <h1>Observations</h1>
                        </div>
                        <div data-role="content">
                                <ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>
                        </div>
                        <div data-role="footer" data-position="fixed">
                                <div data-role="navbar">
                                        <ul>
                                                <li><a href="#saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
                                                <li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
                                        </ul>
                                </div>
                        </div>
                </div>
                
                <div id="transmission" data-role="page">
                        <div data-role="header">
                                <a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
                                <h1>Transmission</h1>
                                <a href="#saisie" data-icon="notepad" data-iconpos="notext">Saisie</a>
                        </div>
                        <form id="form-transmission" method="post" action="#">
                                <div data-role="content">
                                        <div data-role="fieldcontain"> 
                                                <label for="courriel">Courriel :</label>
                                                <input id="courriel" type="email" name="courriel"/>
                                        </div>
                                </div>
                                <div data-role="footer" data-position="fixed">
                                        <button data-role="button" data-icon="cloud">Transmettre</button>
                                </div>
                        </form>
                </div>
                
                <div id="infos" data-role="page">
                        <div data-role="header">
                                <a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
                                <h1>Infos</h1>
                        </div>
                        <div data-role="content">
                                <p>Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>.</p>
                        </div>
                        <div data-role="footer" data-position="fixed">
                                <p>©Copyright <?=$annee?> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a></p>
                        </div>
                </div>
        </body>
</html>