Skip to content

GitLab

Switch branch/tag
Find file Normal viewHistoryPermalink
clavier.html 3.65 KB
Newer Older
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
1
2
3
4 
{% load static %}
<!DOCTYPE html>
<html>
<head>
Sylvain Coulange's avatar
changement du titre de page dans onglet navigateur    
Sylvain Coulange committed
5 
    <title>Clavier phonographémique</title>
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
6
7
8
9
10
11
12 
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="{% static 'styles/clavier.css'%}">
    <link rel="stylesheet" type="text/css" href="{% static 'styles/kinephones_style_v2.css'%}">
</head>
<body>

    <div>
Sylvain Coulange's avatar
test titre en couleurs avec bordure -webkit    
Sylvain Coulange committed
13 
        <h2>Clavier phonographémique <span class="phon_p">p</span><span class="phon_u">ou</span><span class="phon_r_maj">r</span><span> </span><span class="phon_e">é</span><span class="phon_k">c</span><span class="phon_r_maj">r</span><span class="phon_i">i</span><span class="phon_r_maj">re</span><span> </span><span class="phon_a_maj_nas">en</span><span> </span><span class="phon_k">c</span><span class="phon_u">ou</span><span class="phon_l">l</span><span class="phon_9">eu</span><span class="phon_r_maj">rs</span></h2>
Sylvain Coulange's avatar
rectification liaison, rectification phon o O, ajout export pdf experimental    
Sylvain Coulange committed
14
15 
        <button id="textZone2pdf">Exporter en PDF (pas de bicolors ni liaisons)</button>
        <div id="editor"></div>
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
16
17
18
19 
        <div class="fenetre" id="textZone" contenteditable="true"></div>
    </div>

    <div class="boutons">
Sylvain Coulange's avatar
ajout ponctuation    
Sylvain Coulange committed
20 
        <button onclick="writeDot()" style="padding:3px">.</button>
Sylvain Coulange's avatar
rectification liaison, rectification phon o O, ajout export pdf experimental    
Sylvain Coulange committed
21 
        <button onclick="writeComma()" style="padding:3px">,</button>
Sylvain Coulange's avatar
ajout ponctuation    
Sylvain Coulange committed
22
23
24
25 
        <button onclick="writeQuestionMark()" style="padding:3px">?</button>
        <button onclick="writeExclamationMark()" style="padding:3px">!</button>
        <button onclick="writeColumn()" style="padding:3px">:</button>
        <button onclick="writeSemicolumn()" style="padding:3px">;</button>
Sylvain Coulange's avatar
ajout couleur neutre pour ponctuation, liaison et tiret    
Sylvain Coulange committed
26 
        <button onclick="writeHyphon()" style="padding:3px">-</button>
Sylvain Coulange's avatar
rectification liaison, rectification phon o O, ajout export pdf experimental    
Sylvain Coulange committed
27 
        <!--<button onclick="writeLiaison()" style="padding:3px">‿</button>-->
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
28
29
30
31
32
33 
        <button onclick="writeSpace()" style="padding:3px 50px">Espace</button>
        <button onclick="writeEnter()" style="padding:3px">Entrer</button>
        <button onclick="eraseLastSpan()" style="padding: 3px;">Effacer</button>
    </div>
    
    <div class="clavier-graphiesZone">
Sylvain Coulange's avatar
ajout fonctionnalité taille clavier    
Sylvain Coulange committed
34 
        <div class="clavier" id="clavier">
Sylvain Coulange's avatar
mise à jour disposition div graphie    
Sylvain Coulange committed
35 
            <embed id="svgFond" src="../static/svg/00.svg" class="superposeBack">
Sylvain Coulange's avatar
add requirements.txt    
Sylvain Coulange committed
36
37
38 
            <img id="svgColor" src="../static/png/01.png" class="superpose">
            <img id="pngCalq" class="superpose">
            <embed id="svgClick" src="../static/svg/00-click.svg" class="superpose">
Sylvain Coulange's avatar
ajout fonctionnalité taille clavier    
Sylvain Coulange committed
39
40
41
42 
            <div class="control-clavier">
                <img src="../static/png/moins.png" id="btn-min" title="réduire le clavier"/>
                <img src="../static/png/plus.png" id="btn-max" title="agrandir le clavier"/>
            </div>
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
43
44
45
46
47
48 
        </div>

        <div class="graphies">
            <div id="graphiesZone"></div>
        </div>
    </div>
Sylvain Coulange's avatar
add requirements.txt    
Sylvain Coulange committed
49
50 
    
    <div class="fenetre btn-calq-div">
Sylvain Coulange's avatar
boutons en images    
Sylvain Coulange committed
51
52 
        <input type="image" class="btn-calq" src="../static/png/btn_rien.png" title="Panneau vierge" id="btn-rien" />
        <input type="image" class="btn-calq" src="../static/png/btn_vsm.png" title="Voisements et position langue" id="btn-vsm" />
Sylvain Coulange's avatar
set par défaut claviers bouches + modif style boutons calques    
Sylvain Coulange committed
53 
        <input type="image" class="btn-calq btnfocus" src="../static/png/btn_bch.png" title="Formes de bouche" id="btn-bch" />
Sylvain Coulange's avatar
boutons en images    
Sylvain Coulange committed
54 
        <input type="image" class="btn-calq" src="../static/png/btn_cpsg.png" title="Coupes sagitales" id="btn-cpsg" />
Sylvain Coulange's avatar
add requirements.txt    
Sylvain Coulange committed
55
56
57 
    </div>

    <footer>
Sylvain Coulange's avatar
ajout liens code source et journal    
Sylvain Coulange committed
58 
        S.Coulange, {{data.update}} | <a href="https://gricad-gitlab.univ-grenoble-alpes.fr/pedagogies-multimodales/phonographe">Code source</a> - <a href="https://gricad-gitlab.univ-grenoble-alpes.fr/pedagogies-multimodales/phonographe/-/commits/master">Journal des modifications</a>
Sylvain Coulange's avatar
add requirements.txt    
Sylvain Coulange committed
59 
    </footer>
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
60
Sylvain Coulange's avatar
rectification liaison, rectification phon o O, ajout export pdf experimental    
Sylvain Coulange committed
61 
    <script src="https://unpkg.com/jspdf@latest/dist/jspdf.min.js"></script>
Sylvain Coulange's avatar
Premier commit de l'appli déjà bien avancée  
Sylvain Coulange committed
62
63
64 
    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script src="{% static 'js/clavier.js' %}"></script>
</html>