clavier.html 2.15 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
{% load static %}
<!DOCTYPE html>
<html>
<head>
    <title>Clavier Phonologique</title>
    <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>
        <h2>Clavier Phonologique</h2>
        <div class="fenetre" id="textZone" contenteditable="true"></div>
    </div>

    <div class="boutons">
        <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">
        <div class="clavier">
25
            <embed id="svgFond" src="../static/svg/00.svg" class="superposeBack">
Sylvain Coulange's avatar
Sylvain Coulange committed
26
27
28
            <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">
29
30
31
32
33
34
        </div>

        <div class="graphies">
            <div id="graphiesZone"></div>
        </div>
    </div>
Sylvain Coulange's avatar
Sylvain Coulange committed
35
36
    
    <div class="fenetre btn-calq-div">
Sylvain Coulange's avatar
Sylvain Coulange committed
37
38
39
40
        <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" />
        <input type="image" class="btn-calq" src="../static/png/btn_bch.png" title="Formes de bouche" id="btn-bch" />
        <input type="image" class="btn-calq" src="../static/png/btn_cpsg.png" title="Coupes sagitales" id="btn-cpsg" />
Sylvain Coulange's avatar
Sylvain Coulange committed
41
42
43
    </div>

    <footer>
44
        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
Sylvain Coulange committed
45
    </footer>
46
47
48
49
50

    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script src="{% static 'js/clavier.js' %}"></script>
</body>
</html>