index.html 46.9 KB
Newer Older
Brouillon's avatar
Brouillon committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
<!doctype html>
<!--
   This file is part of myBiometer.

   Copyright 2017 Brouillon <brouillon@eftar.net>

   This program is free software; you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
   the Free Software Foundation; either version 3 of the License, or
   (at your option) any later version.

   This program is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.

   You should have received a copy of the GNU General Public License
   along with this program; if not, write to the Free Software
   Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
   MA 02110-1301, USA.
-->
<html lang="fr">
<head>

    <meta charset="utf-8">
    <title>MyBiometer</title>
Brouillon's avatar
Brouillon committed
27

Brouillon's avatar
Brouillon committed
28 29
    <link rel="icon" type="image/png" href="favicon.png" />
    <link rel="stylesheet" href="css/bootstrap.min.css">
30
    <link rel="stylesheet" href="css/smalltalk.min.css">
Brouillon's avatar
Brouillon committed
31

32
    <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
Brouillon's avatar
Brouillon committed
33
    <script src="js/jquery-2.2.1.min.js"></script>
34
    <script src="js/smalltalk.min.js"></script>
Brouillon's avatar
Brouillon committed
35
    <!--<script src="js/jquery.translate.js"></script>-->
Brouillon's avatar
Brouillon committed
36

Brouillon's avatar
Brouillon committed
37 38 39
    <script src="js/bootstrap.min.js"></script>

    <script src="js/vue.min.js"></script>
Brouillon's avatar
Brouillon committed
40
    <script src="js/Sortable.min.js"></script>
Brouillon's avatar
Brouillon committed
41

42 43
    <script>if (window.module) module = window.module;</script>

Brouillon's avatar
Brouillon committed
44 45 46 47 48 49 50 51 52 53 54 55 56 57
    <style type="text/css">
        html, body {
            height: 100%;
            margin: 0;
            padding: 0;
            font-family: helvetica, verdana, sans;
        }
        body {
            height: 100%;
            overflow: hidden;
        }

        h1 {
            text-align: center;
Brouillon's avatar
Brouillon committed
58
            padding: 0;
Brouillon's avatar
Brouillon committed
59 60 61 62 63
            margin-top: 10px;

        }

        #myBiometer {
Brouillon's avatar
Brouillon committed
64 65
            float:left;
            width:400px;
Brouillon's avatar
Brouillon committed
66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82
            background-color: #f5f5f5;
            height:100%;
            overflow-y: scroll;
        }
        #myBiometer > div {
            padding: 5px;
        }
        #myBiometer .panel, #myBiometer .panel-heading {
            border-radius: 0;
        }
        #myBiometer .panel-footer, #myBiometer .panel-heading {
            padding: 10px;
        }

        #myBiometer .group .input-group-sm > .form-control, #myBiometer .group .input-group-sm > .input-group-addon, #myBiometer .group .input-group-sm > .input-group-btn > .btn {
            border-radius: 0;
        }
Brouillon's avatar
Brouillon committed
83 84 85
        #myBiometer #biometerList .panel-primary .panel-heading a {
            color: #fff;
        }
Brouillon's avatar
Brouillon committed
86 87

        #biometer {
Brouillon's avatar
Brouillon committed
88
            margin-left: 400px;
Brouillon's avatar
Brouillon committed
89 90 91
            padding: 0;
            overflow: auto;
        }
Brouillon's avatar
Brouillon committed
92 93 94 95 96 97
        #biometer #homeScreen {
            padding: 0 20px;
        }
        #biometer #homeScreen li {
            padding: 5px;
        }
Brouillon's avatar
Brouillon committed
98 99 100 101 102 103
        #biometer canvas.big {
            height: 100%;
            width: 100%;
            object-fit: contain;
        }

Brouillon's avatar
Brouillon committed
104 105
        .cryptedmail:after {
            content: attr(data-name) "@" attr(data-domain) "." attr(data-tld);
Brouillon's avatar
Brouillon committed
106 107
        }

108 109 110 111 112 113 114 115 116 117 118
        div.smalltalk:after{
            content:'';
            width:100%;
            height:100%;
            position:absolute;
            z-index:-99;
            top:0;
            left:0;
            opacity:0.75;
            background-color: #000;
        }
Brouillon's avatar
Brouillon committed
119 120 121 122 123 124 125
    </style>

</head>
<body>
    <div id="myBiometer">
        <div>
            <form id="formControl" onsubmit="return false;">
126
                <h1><img src="favicon.png" style="width:47px" /> My Biometer</h1>
Brouillon's avatar
Brouillon committed
127 128 129

                <div id="biometerList">
                    <br />
Brouillon's avatar
Brouillon committed
130
                    <div class="panel panel-primary" style="margin:-10px -5px 0 -5px;">
Brouillon's avatar
Brouillon committed
131 132 133 134
                        <div class="panel-heading">
                            <span class="glyphicon glyphicon-folder-open"></span>
                            &nbsp;<a href="#" v-on:click="displayBiometerList()">Mes biomètres</a>
                        </div>
Brouillon's avatar
Brouillon committed
135 136
                        <div class="panel-body" style="padding:0;">
                            <table style="border-bottom:1px solid #ccc" class="table table-striped table-hover table-condensed" id="groupItems">
Brouillon's avatar
Brouillon committed
137 138 139
                                <tbody>
                                    <tr v-for="item in biometerList">
                                        <td>
140 141 142 143
                                            <a href="#" v-on:click="openBiometer(item.biometerID)">
                                                <span v-if="item.biometerTitle">{{ item.biometerTitle }}</span>
                                                <span v-else>Biomètre sans nom</span>
                                            </a>
Brouillon's avatar
Brouillon committed
144 145 146 147 148 149 150 151
                                        </td>
                                        <td style="width:40px;">
                                            <a href="#" class="btn btn-default" v-on:click="removeBiometer(item.biometerID)"><span class="glyphicon glyphicon-remove"></span></a>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>

Brouillon's avatar
Brouillon committed
152 153 154 155 156 157 158 159 160 161 162 163
                            <div style="padding: 10px">
                                <a class="btn btn-primary btn-sm btn-block" id="newBiometer" v-on:click="newBiometer()"><span class="glyphicon glyphicon-plus"></span> Créer un nouveau biomètre</a>
                                <br />
                                <div class="alert alert-info" role="alert">
                                    Les données sont enregistrées automatiquement sur votre navigateur,
                                    vous pouvez aussi les <a id="downloadBiometersData" href="#" v-on:click="downloadBiometersData()"><u>télécharger</u></a>
                                    et/ou les <a href="#" v-on:click="displayImport()"><u>importer</u></a>.</div>

                                <div id="importDataDiv" class="form-group collapse">
                                    <label>Importer mes données</label>
                                    <input type="file" class="btn btn-default btn-sm btn-block" v-on:change="importBiometerData($event)">
                                </div>
Brouillon's avatar
Brouillon committed
164 165 166 167 168 169 170
                            </div>

                        </div>
                    </div>
                </div>

                <div id="biometerDetail" class="collapse">
Brouillon's avatar
Brouillon committed
171

Brouillon's avatar
Brouillon committed
172
                    <div class="panel panel-primary" style="margin:5px -5px 0 -5px;">
Brouillon's avatar
Brouillon committed
173

Brouillon's avatar
Brouillon committed
174
                        <div class="panel-heading"><span class="glyphicon glyphicon-edit"></span> &nbsp;Détail du biomètre</div>
Brouillon's avatar
Brouillon committed
175
                        <div class="panel-body" style="padding:10px;">
Brouillon's avatar
Brouillon committed
176

Brouillon's avatar
Brouillon committed
177 178
                            <div class="form-group">
                                <label>Titre :</label><br />
Brouillon's avatar
Brouillon committed
179 180 181 182 183 184
                                <div class="input-group input-group-sm">
                                    <input type="text" v-model="mybiometer.biometerTitle" v-on:focus="focusTitle($event)" v-on:change="changeTitle($event)" class="form-control input-sm" name="biometerTitle" id="biometerTitle" />
                                    <span class="input-group-btn">
                                        <a href="#" class="btn btn-default" v-on:click="openTitleSettings" /><span class="glyphicon glyphicon-cog"></span></a>
                                    </span>
                                </div>
Brouillon's avatar
Brouillon committed
185 186
                            </div>

Brouillon's avatar
Brouillon committed
187 188 189
                            <div class="form-group">
                                <label>Bordure / Couleur :</label>
                                 <div class="input-group input-group-sm">
Brouillon's avatar
Brouillon committed
190
                                    <input type="text" v-model="mybiometer.biometerBorderWidth" v-on:focus="focusBorder($event)" v-on:change="changeBorder($event)" class="form-control input-sm" id="biometerBorderWidth" name="biometerBorderWidth" >
Brouillon's avatar
Brouillon committed
191
                                    <span class="input-group-btn">
Brouillon's avatar
Brouillon committed
192
                                        <input type="color" v-model="mybiometer.biometerBorderColor" id="biometerBorderColor" class="btn btn-default" />
Brouillon's avatar
Brouillon committed
193 194 195 196
                                    </span>
                                </div>
                            </div>

Brouillon's avatar
Brouillon committed
197
                            <div class="panel panel-default" style="margin:0 -10px;">
Brouillon's avatar
Brouillon committed
198 199 200 201 202
                                <div class="panel-heading">
                                    <span class="glyphicon glyphicon-move hide"></span>
                                    <span class="caret hide"></span>
                                        Groupe
                                    <div class="pull-right">
Brouillon's avatar
Brouillon committed
203
                                        <button type="button" class="btn btn-default btn-sm groupFontSetting" v-on:click="openGroupFontSetting()" style="margin-top:-5px;"><span class="glyphicon glyphicon-cog"></span></button>
Brouillon's avatar
Brouillon committed
204 205 206 207 208 209 210 211 212
                                    </div>
                                </div>
                                <div class="panel-body" style="padding:0;">
                                    <table style="width:100%;" class="group" id="groupItems">
                                        <tbody id="rows" v-sortable="{ handle: '.handle', onEnd: reorderItems, cancel: '' }">
                                            <tr v-for="item in mybiometer.currentGroup.items" :key="item.id">
                                                <td>
                                                    <div class="input-group input-group-sm">
                                                        <span class="input-group-btn">
Brouillon's avatar
Brouillon committed
213
                                                            <a href="#" class="btn btn-default handle"v-on:focus="focusHandle($event)"><span class="glyphicon glyphicon-move"></span></a>
Brouillon's avatar
Brouillon committed
214 215 216 217 218 219 220 221 222 223 224 225 226
                                                        </span>
                                                        <input v-model="item.text" type="text" class="form-control input-sm" placeholder="">
                                                        <span class="input-group-btn">
                                                            <button type="button" class="btn btn-default" v-on:click="removeItem(item)"><span class="glyphicon glyphicon-remove"></span></button>
                                                        </span>
                                                    </div>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="panel-footer" >
                                    <div class="input-group input-group-sm" id="groupCounter">
Brouillon's avatar
Brouillon committed
227 228 229 230 231 232 233
                                        <span class="input-group-btn">
                                            <button type="button" v-on:click="removeLastItem()" class="btn btn-default" type="button"><span class="glyphicon glyphicon-minus"></span></button>
                                        </span>
                                        <input type="text" v-on:click="setItemNumber()" v-model="mybiometer.currentGroup.items.length" class="form-control input-sm" readonly="readonly">
                                        <span class="input-group-btn">
                                            <button type="button" v-on:click="addItem()" class="btn btn-default" type="button"><span class="glyphicon glyphicon-plus"></span></button>
                                        </span>
Brouillon's avatar
Brouillon committed
234 235
                                    </div>
                                </div>
Brouillon's avatar
Brouillon committed
236 237 238

                            </div>

Brouillon's avatar
Brouillon committed
239
                            <br />
Brouillon's avatar
Brouillon committed
240

Brouillon's avatar
Brouillon committed
241 242 243 244 245 246 247 248 249
                            <div class="form-group">
                                <label for="biometerWidthHelper">Largeur :</label><br />
                                <select class="form-control input-sm" v-on:change="changeWidthHelper($event)" id="biometerWidthHelper">
                                    <option value="A5">A5</option>
                                    <option value="A4">A4</option>
                                    <option value="CUSTOM">Personnalisée</option>
                                </select>
                            </div>

Brouillon's avatar
Brouillon committed
250
                            <div class="form-group">
Brouillon's avatar
Brouillon committed
251 252
                                <label>Largeur en pixel :</label><br />
                                <input type="text" v-model="mybiometer.biometerWidth" v-on:focus="focusWidth($event)" v-on:change="changeWidth($event)" class="form-control input-sm" name="biometerWidth" id="biometerWidth" />
Brouillon's avatar
Brouillon committed
253
                            </div>
Brouillon's avatar
Brouillon committed
254

Brouillon's avatar
Brouillon committed
255 256 257
                            <div>
                                <a class="btn btn-primary btn-sm btn-block" id="downloadBiometer"  v-on:click="downloadBiometer()">Télécharger en png</a>
                            </div>
Brouillon's avatar
Brouillon committed
258

Brouillon's avatar
Brouillon committed
259 260 261 262 263 264 265 266 267 268 269
                        </div>

                        <div class="modal fade" id="titleSettingModal" tabindex="-1" role="dialog">
                            <div class="modal-dialog modal-md" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                        <h4 class="modal-title">Réglages du titre</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="form-inline">
Brouillon's avatar
Brouillon committed
270
                                            <div class="form-group">
Brouillon's avatar
Brouillon committed
271 272 273 274 275 276 277 278 279 280 281
                                                <label for="biometerTitleDisplay">Afficher le titre :</label>
                                                <input type="checkbox" v-model="mybiometer.biometerTitleDisplay" v-on:focus="focusTitleFontSize($event)" v-on:change="changeTitleFontSize($event)" class="form-control input-sm" id="biometerTitleDisplay" />
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="biometerTitleFontSize">Taille / Couleur du texte :</label>
                                            <div class="input-group input-group-sm">
                                                <input type="text" v-model="mybiometer.biometerTitleFontSize" id="biometerTitleFontSize" class="form-control input-sm" />
                                                <span class="input-group-btn">
                                                    <input type="color" class="btn btn-default" v-model="mybiometer.biometerTitleColor" />
                                                </span>
Brouillon's avatar
Brouillon committed
282
                                            </div>
Brouillon's avatar
Brouillon committed
283 284 285 286
                                        </div>
                                    </div>
                                </div>
                            </div>
Brouillon's avatar
Brouillon committed
287
                        </div>
Brouillon's avatar
Brouillon committed
288

Brouillon's avatar
Brouillon committed
289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308
                        <div class="modal fade" id="groupFontSettingModal" tabindex="-1" role="dialog">
                            <div class="modal-dialog modal-md" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                        <h4 class="modal-title">Réglages pour les textes du groupe</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="form-group">
                                            <label>Taille / Couleur du texte :</label>
                                             <div class="input-group input-group-sm">
                                                <input type="text" v-model="mybiometer.currentGroup.groupFontSize" v-on:focus="focusGroupFontSize($event)" v-on:change="changeGroupFontSize($event)" class="form-control input-sm" id="groupFontSize" name="groupFontSize" >
                                                <span class="input-group-btn">
                                                    <input type="color" id="groupFontColor" class="btn btn-default" v-model="mybiometer.currentGroup.groupFontColor" />
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
Brouillon's avatar
Brouillon committed
309
                        </div>
Brouillon's avatar
Brouillon committed
310

Brouillon's avatar
Brouillon committed
311 312 313 314 315 316 317 318 319 320 321 322 323
                    </div>

                </div>

            </form>
        </div>
    </div>

    <div id="biometer">
        <div id="homeScreen">

            <h2>Bienvenue</h2>

Brouillon's avatar
Brouillon committed
324
            My Biometer permet de créer facilement des biomètres ou cadrans de radiesthésie.
Brouillon's avatar
Brouillon committed
325

Brouillon's avatar
Brouillon committed
326
            <br />
Brouillon's avatar
Brouillon committed
327 328

            <ul>
Brouillon's avatar
Brouillon committed
329
                <li>Une <a href="https://framalistes.org/sympa/subscribe/mybiometer" class="ls-modal">liste de diffusion <span class="glyphicon glyphicon-envelope"></span></a> pour discuter utilisation et évolution du logiciel.</li>
330 331

                <li>MyBiometer est un <a href="https://fr.wikipedia.org/wiki/Logiciel_libre" class="ls-modal">logiciel libre</a> fait avec <span class="glyphicon glyphicon-heart"></span>, code source sur <a href="https://framagit.org/Brouillon/myBiometer" class="ls-modal">framagit</a>.</li>
Brouillon's avatar
Brouillon committed
332 333
            </ul>

Brouillon's avatar
Brouillon committed
334
            <hr />
Brouillon's avatar
Brouillon committed
335 336

            <h3>Pour commencer</h3>
Brouillon's avatar
Brouillon committed
337 338 339 340


            <div class="row">

Brouillon's avatar
Brouillon committed
341
                <div class="col-lg-6 col-md-8 text-center">
Brouillon's avatar
Brouillon committed
342 343 344 345 346 347
                    <strong>Cliquez sur "Créer un nouveau biomètre"</strong><br />
                    <img src="img/start.png" /><br />
                </div>

            </div>

Brouillon's avatar
Brouillon committed
348 349 350 351 352 353
            <hr />

            <h3>
                À découvrir :
                <a href="https://www.subtil.net" style="vertical-align:middle;text-decoration:none !important;" >
                    <img src="https://www.subtil.net/views/img/media/logo-subtil.png"  alt="Subtil - Site de partage et création de planches de radiesthésie pour penduler" style="vertical-align:text-bottom" width="150" />
Brouillon's avatar
Brouillon committed
354
                </a>
Brouillon's avatar
Brouillon committed
355
                Partage et Création de biomètres
Brouillon's avatar
Brouillon committed
356 357 358 359 360
            </h3>

            <div class="row">

                <div class="col-lg-4 col-md-6">
Brouillon's avatar
Brouillon committed
361
                    <a href="https://www.subtil.net"><img src="https://www.subtil.net/views/img/media/share.fr.png" alt="Cadrans et planches de radiesthésie à técharger - Subtil" class="img-responsive" /></a><br />
Brouillon's avatar
Brouillon committed
362 363
                </div>
                <div class="col-lg-4 col-lg-offset-3 col-md-6">
Brouillon's avatar
Brouillon committed
364
                    <a href="https://www.subtil.net"><img src="https://www.subtil.net/views/img/media/generator.fr.png"  alt="Application / Logiciel générateur d'abaques de radiesthésie - Subtil" class="img-responsive" /></a><br />
Brouillon's avatar
Brouillon committed
365 366 367 368 369 370
                </div>

            </div>

            <div style="position:absolute;bottom:5px;right:5px;">

Brouillon's avatar
Brouillon committed
371
            </div>
Brouillon's avatar
Brouillon committed
372 373 374 375

        </div>
    </div>

376 377 378 379 380 381 382 383 384 385 386 387 388
    <div class="modal fade" id="browserModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">Page web</h4>
                </div>
                <div class="modal-body" style="height:500px">
                </div>
            </div>
        </div>
    </div>

Brouillon's avatar
Brouillon committed
389 390
    <script type="text/javascript">

Brouillon's avatar
Brouillon committed
391 392 393 394 395
    //Add sortable capacity into vuejs
    Vue.directive('sortable', {
      inserted: function (el, binding) {
        new Sortable(el, binding.value || {})
      }
Brouillon's avatar
Brouillon committed
396
    });
Brouillon's avatar
Brouillon committed
397

Brouillon's avatar
Brouillon committed
398
    var defaultBiometer = {
399
        biometerFormatVersion:  '1.1',
Brouillon's avatar
Brouillon committed
400 401
        biometerID:             null,
        biometerTitle:          'Titre du biomètre',
Brouillon's avatar
Brouillon committed
402 403 404
        biometerTitleDisplay:   true,
        biometerTitleFontSize:  '40',
        biometerTitleColor:     '#000',
Brouillon's avatar
Brouillon committed
405 406
        biometerWidth:          1000,
        biometerBorderWidth:    10,
Brouillon's avatar
Brouillon committed
407
        biometerBorderColor:    '#642898',
Brouillon's avatar
Brouillon committed
408 409
        currentGroup:           null,
        groups: [{
Brouillon's avatar
Brouillon committed
410 411
            groupFontSize:  25,
            groupFontColor: '#000',
Brouillon's avatar
Brouillon committed
412 413
            items: [
                {
Brouillon's avatar
Brouillon committed
414
                    id: 1,
Brouillon's avatar
Brouillon committed
415
                    text: 'titre 1'
Brouillon's avatar
Brouillon committed
416 417
                },
                {
Brouillon's avatar
Brouillon committed
418
                    id: 2,
Brouillon's avatar
Brouillon committed
419
                    text: 'titre 2'
Brouillon's avatar
Brouillon committed
420 421
                },
                {
Brouillon's avatar
Brouillon committed
422
                    id: 3,
Brouillon's avatar
Brouillon committed
423
                    text: 'titre 3'
Brouillon's avatar
Brouillon committed
424 425
                },
                {
Brouillon's avatar
Brouillon committed
426
                    id: 4,
Brouillon's avatar
Brouillon committed
427
                    text: 'titre 4'
Brouillon's avatar
Brouillon committed
428 429 430 431 432 433 434 435 436 437 438
                }
            ]
        }]
    };

    var currentBiometer = false;

    var biometerList = [];

    $( document ).ready(function() {

Brouillon's avatar
Brouillon committed
439 440 441 442 443 444 445 446
        //test if there is no support for colour attribute please use IE Edge / firefox / Chromium
        colorInput = $('<input type="color" value="!" />')[0];
        if (colorInput.type !== 'color' || colorInput.value === '!')
        {
            $('body').html('<div style="padding:50px;"><h1>My Biometer</h1><div class="jumbotron"><div class="container"><h2>Votre naviagateur n\'est pas compatible avec le site</h2><p>Vous pouvez utiliser par exemple un des navigateurs suivants :</p><p class="text-center"><a href="https://www.mozilla.org/fr/firefox/new/"><img src="https://www.mozilla.org/media/img/styleguide/identity/firefox/usage-standard.dd994d6216e9.png" /></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="https://www.google.com/chrome/browser/desktop/index.html"><img src="https://www.google.com/chrome/assets/common/images/chrome_logo_2x.png?mmfb=a5234ae3c4265f687c7fffae2760a907" /></a></p></div></div></div>');
            return;
        }

Brouillon's avatar
Brouillon committed
447 448 449 450 451 452 453 454
        //Load all biometers list
        try {
            biometerList = JSON.parse( localStorage.getItem( 'biometerList' ) );
        } catch(e) { }

        if ( ! biometerList)
            biometerList = [];

Brouillon's avatar
Brouillon committed
455 456 457 458
        //check biometer format
        for (var i = 0; i < biometerList.length; i++)
            biometerList[ i ] = checkBiometerFormat(biometerList[ i ]);

459 460
        saveBiometersData();

Brouillon's avatar
Brouillon committed
461
        displayBiometerList();
Brouillon's avatar
Brouillon committed
462 463 464

    });

Brouillon's avatar
Brouillon committed
465 466 467 468 469
    function getUUID() {
        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
            var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
            return v.toString(16);
        });
Brouillon's avatar
Brouillon committed
470 471 472
    }

    function saveBiometersData() {
473

Brouillon's avatar
Brouillon committed
474
        localStorage.setItem('biometerList', JSON.stringify(biometerList) );
475

Brouillon's avatar
Brouillon committed
476 477 478 479 480 481 482 483 484 485 486
    }

    function sortBiometerList() {

        biometerList.sort(function(a, b) {
            return (a.biometerTitle < b.biometerTitle) ? -1 : 1;
        });

    }

    function hideBiometerList() {
Brouillon's avatar
Brouillon committed
487
        $('#biometerList .panel').removeClass('panel-primary').addClass('panel-default');
Brouillon's avatar
Brouillon committed
488 489 490 491 492 493
        $('#biometerList .panel-heading .glyphicon').removeClass('glyphicon-folder-open').addClass('glyphicon-folder-close');
        $('#biometerList .panel-body').hide();
    }

    function displayBiometerList() {

Brouillon's avatar
Brouillon committed
494
        $('#biometerList .panel').removeClass('panel-default').addClass('panel-primary');
Brouillon's avatar
Brouillon committed
495 496
        sortBiometerList();

Brouillon's avatar
Brouillon committed
497 498 499 500 501 502 503 504 505 506
        if (typeof biometerListView == 'undefined')
        {
            //create List
            biometerListView = new Vue({
                el: '#biometerList',
                data: {
                    biometerList: biometerList
                },
                methods: {
                    removeBiometer: function(biometerID) {
507
                        smalltalk.confirm('Question', 'Êtes-vous sûr de vouloir supprimer ce biomètre ?').then(function() {
Brouillon's avatar
Brouillon committed
508 509 510 511 512 513
                            for (idx in biometerList) {
                                if (biometerList[ idx ].biometerID === biometerID) {
                                    biometerList.splice(idx, 1);
                                }
                            }
                            saveBiometersData();
514
                        });
Brouillon's avatar
Brouillon committed
515 516
                    },
                    newBiometer: function() {
517 518 519 520 521 522 523 524 525 526 527
                        smalltalk.prompt('Question', 'Nom du biomètre', '').then(function(name) {
                            if (name != false && name != null || name == '') {
                                newBiometer = false;
                                newBiometer = JSON.parse(JSON.stringify(defaultBiometer));
                                newBiometer.biometerID = getUUID();
                                newBiometer.biometerTitle = name;
                                //Add to list
                                biometerList.push(newBiometer);
                                //Reorder && save
                                sortBiometerList();
                                saveBiometersData();
528 529

                                biometerListView.openBiometer(newBiometer.biometerID);
530 531
                            }
                        });
Brouillon's avatar
Brouillon committed
532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556
                    },
                    openBiometer: function(biometerID) {
                        for (idx in biometerList) {
                            if (biometerList[ idx ].biometerID === biometerID) {
                                openBiometer(biometerList[ idx ]);
                            }
                        }
                    },
                    downloadBiometersData: function() {
                        $('#downloadBiometersData')[0].href = 'data:application/octet-stream;charset=utf-8,'+encodeURIComponent(JSON.stringify(biometerList));
                        $('#downloadBiometersData')[0].download = 'biometerList.json';
                    },
                    displayImport: function() {
                        $('#importDataDiv').show();
                        return false;
                    },
                    importBiometerData: function(evt) {
                        var files = evt.target.files;
                        var file = files[0];
                        var reader = new FileReader();
                        reader.onload = function() {
                            var tempData;
                            try {
                                tempData = JSON.parse( this.result );
                            } catch(e) {
557
                                smalltalk.alert('Erreur', 'Une erreur s\'est produite lors du chargement de vos données');
Brouillon's avatar
Brouillon committed
558 559 560
                            }
                            if (tempData)
                            {
561
                                var processed = false;
Brouillon's avatar
Brouillon committed
562
                                for (idx in tempData) {
563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582

                                    processed = false;
                                    //Vérification, ce biomètre existe t'il déjà ?
                                    for (idx2 in biometerList) {
                                        if (biometerList[ idx2 ].biometerID == tempData[ idx ].biometerID) {
                                            processed = true;
                                            if (confirm('Le biomètre "'+(tempData[ idx ].biometerTitle == '' ? 'Biomètre sans nom' : tempData[ idx ].biometerTitle)+'" existe déjà, voulez-vous le remplacer ?')) {
                                                biometerList[ idx2 ] = checkBiometerFormat(tempData[ idx ]);
                                            } else {
                                                console.log('Biomètre ignoré !');
                                            }
                                        }
                                    }
                                    if (processed == false) {
                                        tempData[ idx ].biometerID = getUUID();
                                        //check biometer format
                                        tempData[ idx ] = checkBiometerFormat(tempData[ idx ]);
                                        //Add to list
                                        biometerList.push(tempData[ idx ]);
                                    }
Brouillon's avatar
Brouillon committed
583 584 585 586 587 588 589 590 591 592 593 594 595
                                }
                                //Reorder && save
                                sortBiometerList();
                                saveBiometersData();
                                return;
                            }
                        }
                        reader.readAsText(file);
                    }
                }
            });
        }

Brouillon's avatar
Brouillon committed
596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613
        $('#biometerList .panel-heading .glyphicon').removeClass('glyphicon-folder-close').addClass('glyphicon-folder-open');
        $('#biometerList .panel-body').show();

        $('#biometerDetail').hide();

        displayHomeScreen();

    }

    function displayHomeScreen() {
        $('#homeScreen').show();
        $('#canvas').hide();
    }

    function hideHomeScreen() {
        $('#homeScreen').hide();
    }

Brouillon's avatar
Brouillon committed
614
    //While updating the sofware some new field can be required in newer version
Brouillon's avatar
Brouillon committed
615 616
    function checkBiometerFormat(biometer) {

Brouillon's avatar
Brouillon committed
617 618 619
        //Check format version
        if (typeof biometer.biometerFormatVersion == 'undefined') {

620
            biometer.biometerFormatVersion = '1.0';
Brouillon's avatar
Brouillon committed
621 622 623 624 625 626 627

            if (typeof biometer.biometerTitleDisplay == 'undefined')
                biometer.biometerTitleDisplay = defaultBiometer.biometerTitleDisplay;
            if (typeof biometer.biometerTitleFontSize == 'undefined')
                biometer.biometerTitleFontSize = defaultBiometer.biometerTitleFontSize;
            if (typeof biometer.biometerTitleColor == 'undefined')
                biometer.biometerTitleColor = defaultBiometer.biometerTitleColor;
628 629 630
        }
        //bug id missing in version 1.0
        if (biometer.biometerFormatVersion == '1.0') {
Brouillon's avatar
Brouillon committed
631 632 633 634 635 636
            //adding id in items
            for (var i = 0; i < biometer.groups.length; i++) {
                for (var ii = 0; ii < biometer.groups[ i ].items.length; ii++) {
                    if (typeof biometer.groups[ i ].items[ ii ].id == 'undefined')
                        biometer.groups[ i ].items[ ii ].id = getUUID();
                }
Brouillon's avatar
Brouillon committed
637 638
            }
        }
Brouillon's avatar
Brouillon committed
639

640
        biometer.biometerFormatVersion = defaultBiometer.biometerFormatVersion;
Brouillon's avatar
typo  
Brouillon committed
641

Brouillon's avatar
Brouillon committed
642 643 644 645
        return biometer;

    }

Brouillon's avatar
Brouillon committed
646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664
    function openBiometer(biometer) {

        hideBiometerList();
        hideHomeScreen();
        $('#biometerDetail').show();

        currentBiometer = biometer;
        //set first group as current
        currentBiometer.currentGroup = currentBiometer.groups[0];

        if (typeof biometerDetailView == 'undefined')
        {

            biometerDetailView = new Vue({
                el: '#biometerDetail',
                data: {
                    mybiometer: currentBiometer
                },
                methods: {
Brouillon's avatar
Brouillon committed
665 666 667
                    openTitleSettings: function() {
                        $('#titleSettingModal').modal();
                    },
Brouillon's avatar
Brouillon committed
668 669 670 671 672 673 674 675 676 677 678
                    //display modal on click font setting group
                    openGroupFontSetting: function() {
                        $('#groupFontSettingModal').modal();
                    },
                    removeItem: function(item) {
                        currentBiometer.currentGroup.items.splice(currentBiometer.currentGroup.items.indexOf(item), 1);
                    },
                    removeLastItem: function() {
                        currentBiometer.currentGroup.items.pop();
                    },
                    addItem: function() {
Brouillon's avatar
Brouillon committed
679 680 681 682 683 684 685
                        currentBiometer.currentGroup.items.push({id: getUUID(),text: ''});
                    },
                    reorderItems: function(evt) {
                        Vue.nextTick(function () {
                            const item = currentBiometer.currentGroup.items.splice(evt.oldIndex, 1)[ 0 ];
                            currentBiometer.currentGroup.items.splice(evt.newIndex, 0, item);
                        });
Brouillon's avatar
Brouillon committed
686 687
                    },
                    setItemNumber: function() {
688
                        smalltalk.prompt('Question', 'Nombre ', currentBiometer.currentGroup.items.length+'').then(function(nb) {
Brouillon's avatar
Brouillon committed
689
                            if (nb === null)
Brouillon's avatar
Brouillon committed
690
                                return;
691
                            if (nb*1 > 200 || nb < 1)
Brouillon's avatar
Brouillon committed
692
                            {
693 694 695 696 697
                                nb = '';
                            }

                            if ( ! isInt(nb)) {
                                smalltalk.alert('Erreur', 'La valeur saisie n\'est pas valide (nombre < 200)');
Brouillon's avatar
Brouillon committed
698 699 700
                            }
                            else
                            {
701 702 703 704 705
                                if (isInt(nb)) {
                                    Vue.nextTick(function () {
                                        if (nb > currentBiometer.currentGroup.items.length)
                                        {
                                            while(nb > currentBiometer.currentGroup.items.length) {
706
                                                currentBiometer.currentGroup.items.push({id: getUUID(),text: ''});
707 708 709 710 711 712 713 714
                                            }
                                        }
                                        else
                                        {
                                            currentBiometer.currentGroup.items = currentBiometer.currentGroup.items.slice(0, nb);
                                        }
                                    });
                                }
Brouillon's avatar
Brouillon committed
715 716
                            }
                        });
Brouillon's avatar
Brouillon committed
717
                    },
Brouillon's avatar
Brouillon committed
718 719 720 721 722 723 724 725
                    changeTitle: function(evt) {
                        var elem = evt.target,
                            oldValue = elem.defaultValue,
                            newValue = elem.value;
                        if (newValue.length > 0)
                            elem.defaultValue = newValue;
                        else {
                            currentBiometer.biometerTitle = elem.defaultValue;
726
                            smalltalk.alert('Erreur', 'Vous devez saisir un titre');
Brouillon's avatar
Brouillon committed
727 728 729 730 731 732 733 734
                            setTimeout(function() { $(elem).focus();}, 0);
                        }
                    },
                    focusTitle: function(evt) {
                        var elem = evt.target;
                        if (elem.defaultValue == '')
                            elem.defaultValue = elem.value;
                    },
Brouillon's avatar
Brouillon committed
735 736 737 738 739 740 741 742
                    changeTitleSize: function(evt) {
                        var elem = evt.target,
                            oldValue = elem.defaultValue,
                            newValue = elem.value;
                        if (isInt(newValue) && newValue < 100)
                            elem.defaultValue = newValue;
                        else {
                            currentBiometer.biometerTitleFontSize = elem.defaultValue;
743
                            smalltalk.alert('Erreur', 'Veuillez saisir un nombre inférieur à 100');
Brouillon's avatar
Brouillon committed
744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759
                            $('#titleSettingModal').modal();
                        }
                    },
                    focusTitleSize: function(evt) {
                        var elem = evt.target;
                        if (elem.defaultValue == '')
                            elem.defaultValue = elem.value;
                    },
                    changeGroupFontSize: function(evt) {
                        var elem = evt.target,
                            oldValue = elem.defaultValue,
                            newValue = elem.value;
                        if (isInt(newValue) && newValue < 100)
                            elem.defaultValue = newValue;
                        else {
                            currentBiometer.currentGroup.groupFontSize = elem.defaultValue;
760
                            smalltalk.alert('Erreur', 'Veuillez saisir un nombre inférieur à 100');
Brouillon's avatar
Brouillon committed
761 762 763 764 765 766 767 768
                            $('#groupFontSettingModal').modal();
                        }
                    },
                    focusGroupFontSize: function(evt) {
                        var elem = evt.target;
                        if (elem.defaultValue == '')
                            elem.defaultValue = elem.value;
                    },
Brouillon's avatar
Brouillon committed
769 770 771 772 773 774 775 776
                    changeWidth: function(evt) {
                        var elem = evt.target,
                            oldValue = elem.defaultValue,
                            newValue = elem.value;
                        if (isInt(newValue) && newValue < 5000)
                            elem.defaultValue = newValue;
                        else {
                            currentBiometer.biometerWidth = elem.defaultValue;
777
                            smalltalk.alert('Erreur', 'Veuillez saisir un nombre inférieur à 5000');
Brouillon's avatar
Brouillon committed
778 779 780 781 782 783 784 785
                            setTimeout(function() { $(elem).focus();}, 0);
                        }
                    },
                    focusWidth: function(evt) {
                        var elem = evt.target;
                        if (elem.defaultValue == '')
                            elem.defaultValue = elem.value;
                    },
Brouillon's avatar
Brouillon committed
786 787 788 789 790 791 792 793
                    changeBorder: function(evt) {
                        var elem = evt.target,
                            oldValue = elem.defaultValue,
                            newValue = elem.value;
                        if (isInt(newValue) && newValue < 200)
                            elem.defaultValue = newValue;
                        else {
                            currentBiometer.biometerBorderWidth = elem.defaultValue;
794
                            smalltalk.alert('Erreur', 'Veuillez saisir un nombre inférieur à 200');
Brouillon's avatar
Brouillon committed
795 796 797 798 799 800 801 802
                            setTimeout(function() { $(elem).focus();}, 0);
                        }
                    },
                    focusBorder: function(evt) {
                        var elem = evt.target;
                        if (elem.defaultValue == '')
                            elem.defaultValue = elem.value;
                    },
Brouillon's avatar
Brouillon committed
803
                    focusHandle: function(evt) {
Brouillon's avatar
Brouillon committed
804 805
                        //console.log(evt);
                        //Todo push focus left or right if from tab or alt+tab
Brouillon's avatar
Brouillon committed
806 807 808 809
                        /*$(':input').keypress(function() {
                            $(this).next(':input').focus();
                        });*/
                    },
Brouillon's avatar
Brouillon committed
810 811 812 813 814 815 816 817
                    changeWidthHelper: function(evt) {
                        var elem = $(evt.target);
                        if (elem.val() == 'A4')
                            currentBiometer.biometerWidth = '2000';
                        else if (elem.val() == 'A5')
                            currentBiometer.biometerWidth = '1000';

                    },
Brouillon's avatar
Brouillon committed
818 819
                    downloadBiometer:  function() {
                        $('#downloadBiometer')[0].href = document.getElementById('canvas').toDataURL();
820
                        $('#downloadBiometer')[0].download = sanitize(currentBiometer.biometerTitle) + '.png';
Brouillon's avatar
Brouillon committed
821 822 823 824 825
                    }
                },
                watch: {
                    'mybiometer': {
                        handler: function (val, oldVal) {
Brouillon's avatar
Brouillon committed
826 827 828 829 830 831
                            if (currentBiometer.biometerWidth == '1000')
                                $('#biometerWidthHelper').val('A5');
                            else if (currentBiometer.biometerWidth == '2000')
                                $('#biometerWidthHelper').val('A4');
                            else
                                $('#biometerWidthHelper').val('CUSTOM');
Brouillon's avatar
Brouillon committed
832 833 834 835 836 837 838
                            drawBiometer();
                            saveBiometersData();
                        },
                        deep: true
                    }
                }
            });
Brouillon's avatar
Brouillon committed
839

Brouillon's avatar
Brouillon committed
840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862
        }
        else {
            //replace data
            biometerDetailView.$data.mybiometer = biometer;
        }

        drawBiometer();
    }

    function drawBiometer(width) {

        if (typeof width == 'undefined')
            width = false;

        var container = document.getElementById('biometer');
        var canvas = document.getElementById('canvas');

        if ( ! container)
            return;
        //Clear last canvas
        if (canvas)
            container.removeChild(canvas);

Brouillon's avatar
Brouillon committed
863 864
        //check if it's too little or too big
        if ( ! isInt(currentBiometer.biometerWidth) || currentBiometer.biometerWidth < 300  || currentBiometer.biometerWidth > 5000)
Brouillon's avatar
Brouillon committed
865 866 867 868 869 870 871 872 873 874 875
        {
            return;
        }

        //check if border are too high
        if ( ! isInt(currentBiometer.biometerBorderWidth) || currentBiometer.biometerBorderWidth > 200)
        {
            return;
        }

        var canvasWidth = currentBiometer.biometerWidth;
Brouillon's avatar
Brouillon committed
876 877 878 879 880 881 882
        var titleMargin = 10;
        if (currentBiometer.biometerTitleDisplay == true) {
            var topMargin = (titleMargin * 2) + (currentBiometer.biometerTitleFontSize * 1) + (currentBiometer.biometerBorderWidth / 2);
        }
        else
            var topMargin = 20 + (currentBiometer.biometerBorderWidth / 2);

Brouillon's avatar
Brouillon committed
883 884 885 886 887 888 889 890 891
        var sideMargin = 20 + (currentBiometer.biometerBorderWidth / 2);
        var bottomMargin = 20;
        var marginText = 10;
        var biometerCenterWidth = 50;

        var biometerWidth = canvasWidth - (sideMargin * 2);

        var canvasHeight = biometerWidth / 2 + topMargin + bottomMargin;

Brouillon's avatar
Brouillon committed
892 893 894 895 896 897 898
        var biometerRayon = biometerWidth/2;
        var biometerLeftX = (canvasWidth - biometerWidth) /2;
        var biometerRightX = biometerWidth + biometerLeftX;

        var biometerCenterX = canvasWidth/2;
        var biometerCenterY = topMargin + biometerRayon;

Brouillon's avatar
Brouillon committed
899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927
        //Create the canvas
        var canvas = document.createElement("canvas");
        canvas.id = "canvas";
        if (container.clientWidth < currentBiometer.biometerWidth)
            canvas.className = "big";
        canvas.height = canvasHeight;
        canvas.width = canvasWidth;
        container.appendChild(canvas);

        var canvas = document.getElementById("canvas");
        var ctx = canvas.getContext("2d");

        //background
        ctx.fillStyle = "#fff";
        ctx.fillRect(0, 0, canvas.width, canvas.height);

        ctx.strokeStyle = currentBiometer.biometerBorderColor;
        //Arc de cercle
        ctx.lineWidth = currentBiometer.biometerBorderWidth;
        ctx.beginPath();
        ctx.arc(biometerCenterX, biometerCenterY, biometerRayon, (Math.PI/180)*180, (Math.PI/180)*360);
        ctx.stroke();
        ctx.lineWidth = 1;
        //bottom line
        ctx.beginPath();
        ctx.moveTo(biometerLeftX - (currentBiometer.biometerBorderWidth / 2), biometerCenterY);
        ctx.lineTo(biometerRightX + (currentBiometer.biometerBorderWidth / 2), biometerCenterY);
        ctx.stroke();

Brouillon's avatar
Brouillon committed
928 929 930 931 932 933 934 935
        //Display title
        if (currentBiometer.biometerTitleDisplay == true) {
            ctx.font = currentBiometer.biometerTitleFontSize+"px Calibri,Geneva,Arial,Sans";
            var y = (topMargin - (currentBiometer.biometerBorderWidth / 2)) / 2;
            ctx.textBaseline = "middle";
            ctx.fillStyle = currentBiometer.biometerTitleColor;
            ctx.fillText(currentBiometer.biometerTitle, ((canvasWidth - ctx.measureText(currentBiometer.biometerTitle).width) / 2), y);
        }
Brouillon's avatar
Brouillon committed
936 937 938 939 940 941 942 943 944 945 946 947 948

        //Change origine
        ctx.translate(biometerCenterX, biometerCenterY);

        var group = currentBiometer.groups[0];
        var items = currentBiometer.groups[0].items;
        var nbRow = items.length;

        //Draw row
        var angle = 180 / nbRow;
        var hauteur = biometerRayon * Math.sin((Math.PI/180) * angle/2);
        var marge = (hauteur - group.groupFontSize/2);
        var ratio = hauteur / (angle / 2);
Brouillon's avatar
Brouillon committed
949
        ctx.font = group.groupFontSize+"px Calibri,Geneva,Arial,Sans";
Brouillon's avatar
Brouillon committed
950
        ctx.textBaseline = "middle";
Brouillon's avatar
Brouillon committed
951
        var textHeight = ctx.measureText('M').width;
Brouillon's avatar
Brouillon committed
952 953 954 955

        for(i = 0; i < nbRow; i++)
        {
            ctx.rotate((Math.PI/180)*angle);
Brouillon's avatar
Brouillon committed
956
            //Draw Line Not last one
Brouillon's avatar
Brouillon committed
957 958 959 960 961 962 963 964
            if (i + 1 != nbRow)
            {
                ctx.beginPath();
                ctx.moveTo(-biometerRayon, 0);
                ctx.lineTo(0, 0);
                ctx.strokeStyle = currentBiometer.biometerBorderColor;
                ctx.stroke();
            }
Brouillon's avatar
Brouillon committed
965
            //Write text before half
Brouillon's avatar
Brouillon committed
966 967
            if (angle*(i) < 90)
            {
Brouillon's avatar
Brouillon committed
968
                ctx.rotate((Math.PI/180) * -1 * (marge + (textHeight/2)) / ratio);
Brouillon's avatar
Brouillon committed
969
                //ctx.font = group.groupFontSize+"px Calibri,Geneva,Arial,Sans";
Brouillon's avatar
Brouillon committed
970 971 972
                ctx.fillStyle = group.groupFontColor;
                ctx.fillText(items[ i ].text, (biometerRayon - marginText - (currentBiometer.biometerBorderWidth / 2)) * -1, 0);

Brouillon's avatar
Brouillon committed
973
                ctx.rotate((Math.PI/180) * 1 * (marge + (textHeight/2)) / ratio);
Brouillon's avatar
Brouillon committed
974
            }
Brouillon's avatar
Brouillon committed
975
            //Write text after half
Brouillon's avatar
Brouillon committed
976 977 978
            else
            {
                ctx.rotate((Math.PI/180) * -180);
Brouillon's avatar
Brouillon committed
979
                ctx.rotate((Math.PI/180) * -1 * (marge + (textHeight/2)) / ratio);
Brouillon's avatar
Brouillon committed
980
                //ctx.font = group.groupFontSize+"px Calibri,Geneva,Arial,Sans";
Brouillon's avatar
Brouillon committed
981 982 983
                ctx.fillStyle = group.groupFontColor;
                ctx.fillText(items[ i ].text, biometerRayon - ctx.measureText(items[ i ].text).width - marginText - (currentBiometer.biometerBorderWidth / 2), 0);

Brouillon's avatar
Brouillon committed
984
                ctx.rotate((Math.PI/180) * (marge + (textHeight/2)) / ratio);
Brouillon's avatar
Brouillon committed
985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004
                ctx.rotate((Math.PI/180) * 180);
            }
        }

        ctx.rotate((Math.PI/180)*-180 );
        ctx.translate(-1 * biometerCenterX, -1 * biometerCenterY);

        ctx.fillStyle = "white";
        ctx.beginPath();
        ctx.arc(biometerCenterX, biometerCenterY, biometerCenterWidth, (Math.PI/180)*0, (Math.PI/180)*360);
        ctx.fill();
        ctx.beginPath();
        ctx.arc(biometerCenterX, biometerCenterY, biometerCenterWidth, (Math.PI/180)*180, (Math.PI/180)*360);
        ctx.stroke();
    }

    function isInt(value) {
        return ! isNaN(value) && parseInt(Number(value)) == value && ! isNaN(parseInt(value, 10));
    }

1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022
    //var truncate = require("truncate-utf8-bytes");

    var illegalRe = /[\/\?<>\\:\*\|":]/g;
    var controlRe = /[\x00-\x1f\x80-\x9f]/g;
    var reservedRe = /^\.+$/;
    var windowsReservedRe = /^(con|prn|aux|nul|com[0-9]|lpt[0-9])(\..*)?$/i;
    var windowsTrailingRe = /[\. ]+$/;

    function sanitize(input, replacement) {
      var sanitized = input
        .replace(illegalRe, replacement)
        .replace(controlRe, replacement)
        .replace(reservedRe, replacement)
        .replace(windowsReservedRe, replacement)
        .replace(windowsTrailingRe, replacement);
      return sanitized.substring(0, 255);
    }

1023
    //For electron open link in a real browser
1024
    if (typeof process  != 'undefined' && typeof process.versions.electron != 'undefined') {
1025 1026 1027 1028 1029 1030 1031 1032
        var shell = require('electron').shell;
        //open link in a modal if localhost or file
        $('.ls-modal').on('click', function(e){
            e.preventDefault();
            shell.openExternal($(this).attr('href'));
            //$('#browserModal').modal('show').find('.modal-body').html('<iframe style="width: calc(100% + 28px);height:calc(100% + 28px);margin: -14px;border: 0;" src="'+$(this).attr('href')+'"></iframe>');
        });
    }
Brouillon's avatar
Brouillon committed
1033 1034

    </script>
Brouillon's avatar
Brouillon committed
1035 1036
    </body>
</html>