misc/theme_editor.html
author Wuzzy <Wuzzy2@mail.ru>
Mon, 13 Nov 2017 22:14:45 +0100
changeset 12836 8610462e3d33
parent 10017 de822cd3df3a
child 13507 7e188a28f078
permissions -rw-r--r--
Remove 2 unused number tags in Construction Mode GUI These numbers are shown aside the power tag, but the numbers never change. They don't serve any purpose and are just visual clutter and annoying, since they partially overlap. They are probably a leftover from copying code over from other scripts. With this changeset, only the power and turn time are left visible, as it is supposed to.
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     1
<!doctype html>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     2
<html>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     3
    <head>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     4
        <title>Hedgewars Theme Editor</title>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     5
        <script type="text/javascript">
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     6
            var sky, clouds, horizont, water, land, border;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     7
            var skyColor, waterTopColor, waterBottomColor;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     8
            var elements = 7;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
     9
            var landArray;
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    10
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    11
            function landFunction(x){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    12
                return 384 - 192 * Math.sin(x * Math.PI/512);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    13
            }
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    14
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    15
            function tryToDraw(){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    16
                if (--elements <= 0) {
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    17
                    draw();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    18
                }
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    19
            }
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    20
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    21
            function load(){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    22
                    var canvas = document.getElementById('preview');
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    23
                    if (canvas.getContext){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    24
                        var ctx = canvas.getContext('2d');
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    25
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    26
                        ctx.fillStyle = '#0b294b';
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    27
                        ctx.fillRect(0, 0, 512, 384);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    28
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    29
                        ctx.font = "40pt Arial";
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    30
                        ctx.fillStyle = '#2b7bd5';
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    31
                        ctx.fillText('Loading Images...', 32, 212);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    32
                    }
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    33
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    34
                    sky = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    35
                    sky.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    36
                    sky.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Themes/Nature/Sky.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    37
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    38
                    clouds = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    39
                    clouds.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    40
                    clouds.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Graphics/Clouds.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    41
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    42
                    horizont = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    43
                    horizont.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    44
                    horizont.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Themes/Nature/horizont.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    45
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    46
                    land = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    47
                    land.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    48
                    land.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Themes/Nature/LandTex.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    49
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    50
                    border = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    51
                    border.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    52
                    border.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Themes/Nature/Border.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    53
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    54
                    water = new Image();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    55
                    water.onload = tryToDraw;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    56
                    water.src = 'http://hedgewars.googlecode.com/hg/share/hedgewars/Data/Graphics/BlueWater.png';
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    57
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    58
                    landArray = new Array(512);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    59
                    for (var x = 0; x < landArray.length; x++)
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    60
                        landArray[x] = landFunction(x);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    61
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    62
                    skyColor = '#131252';
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    63
                    document.getElementById('skyColor').value = skyColor;
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    64
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    65
                    waterTopColor = '#555C9D';
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    66
                    document.getElementById('waterTopColor').value = waterTopColor;
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    67
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    68
                    waterBottomColor = '#343C7D';
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    69
                    document.getElementById('waterBottomColor').value = waterBottomColor;
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    70
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    71
                    tryToDraw();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    72
            }
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    73
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    74
            function draw(){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    75
                var canvas = document.getElementById('preview');
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    76
                if (canvas.getContext){
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    77
                    var ctx = canvas.getContext('2d');
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    78
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    79
                    ctx.fillStyle = skyColor;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    80
                    ctx.fillRect(0, 0, 512, 384);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    81
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    82
                    ctx.drawImage(sky, 0, 64, 512, 256);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    83
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    84
                    for (var i = 0; i < 4; i++)
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    85
                        ctx.drawImage(clouds, 0, i * 128, 256, 128, i * 128, 64, 128, 64);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    86
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    87
                    ctx.drawImage(horizont, 0, 192, 512, 128);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    88
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    89
                    ctx.save();
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    90
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    91
                    ctx.beginPath();
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    92
                    ctx.moveTo(0, 384);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    93
                    for (var x = 0; x < landArray.length; x++)
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    94
                        ctx.lineTo(x, landArray[x]);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    95
                    ctx.clip();
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    96
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
    97
                    for (var i = 0; i < 2; i++)
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    98
                        for (var k = 0; k < 2; k++)
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
    99
                            ctx.drawImage(land, i * 320, k * 240, 320, 240);
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
   100
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   101
                    ctx.restore();
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
   102
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   103
                    var k = 0;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   104
                    for (var x = 0; x < landArray.length; x++) {
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   105
                        if (++k == 64)
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   106
                            k = 0;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   107
                        ctx.drawImage(border, k, 0, 2, 16, x, landArray[x] - 4, 1, 8);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   108
                    }
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
   109
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
   110
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   111
                    var gradient = ctx.createLinearGradient(0, 320, 0, 384);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   112
                    gradient.addColorStop(0, waterTopColor);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   113
                    gradient.addColorStop(1, waterBottomColor);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   114
                    ctx.fillStyle = gradient;
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   115
                    ctx.fillRect(0, 320, 512, 384);
10017
de822cd3df3a fixwhitespace and dos2unix
koda
parents: 5543
diff changeset
   116
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   117
                    for (var i = 0; i < 8; i++)
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   118
                        ctx.drawImage(water, i * 64, 308, 64, 24);
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   119
                }
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   120
            }
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   121
        </script>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   122
        <style type="text/css">
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   123
            canvas { border: 1px solid black; }
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   124
        </style>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   125
    </head>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   126
    <body onload="load();">
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   127
        <h1>Hedgewars Theme editor</h1>
5543
5e597b725316 disable campaign button, structure and change sudden death music to hell.ogg
Henek
parents: 5346
diff changeset
   128
        <canvas id="preview" width="512" height="384">Sorry, your browser does not support Canvas.</canvas><br>
5346
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   129
        <table>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   130
        <tr><td>Sky:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   131
        <input id="sky" type="file" accept="image/png" onchange="sky.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   132
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   133
        <tr><td>Sky Color:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   134
        <input id="skyColor" type="color" onchange="skyColor = this.value; draw()"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   135
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   136
        <tr><td>Clouds:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   137
        <input id="clouds" type="file" accept="image/png" onchange="clouds.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   138
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   139
        <tr><td>Horizont:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   140
        <input id="horizont" type="file" accept="image/png" onchange="horizont.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   141
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   142
        <tr><td>Land:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   143
        <input id="land" type="file" accept="image/png" onchange="land.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   144
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   145
        <tr><td>Border:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   146
        <input id="border" type="file" accept="image/png" onchange="border.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   147
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   148
        <tr><td>Water:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   149
        <input id="water" type="file" accept="image/png" onchange="water.src = window.URL.createObjectURL(this.files[0])"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   150
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   151
        <tr><td>Water Top Color:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   152
        <input id="waterTopColor" type="color" onchange="waterTopColor = this.value; draw()"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   153
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   154
        <tr><td>Water Bottom Color:</td><td>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   155
        <input id="waterBottomColor" type="color" onchange="waterBottomColor = this.value; draw()"></input>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   156
        </td></tr>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   157
        </table>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   158
    </body>
ee611abe9158 first draft of a html based theme editor
Henek
parents:
diff changeset
   159
</html>