Hugging Face's logo

Spaces:
coolspaces
/
windows3.1
Running

App Files Community
windows3.1
File size: 4,370 Bytes 
61e59f4
 
 
 
822bcff
61e59f4
 
 
 
efd09c6
61e59f4
 
 
 
d949fc5
61e59f4
 
4edb0a8
61e59f4
 
 
d949fc5
 
 
61e59f4
 
 
 
d949fc5
61e59f4
 
4edb0a8
61e59f4
 
 
4edb0a8
61e59f4
 
 
d949fc5
 
 
 
4edb0a8
61e59f4
 
 
4edb0a8
0c4c6dd
 
 
61e59f4
 
 
 
d949fc5
 
 
 
 
 
 
 
 
 
 
61e59f4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d949fc5
61e59f4
 
 
 
 
 
 
 
0c4c6dd
 
 
 
 
 
 
5be30bb
0c4c6dd
 
61e59f4
 
 
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
 
<html>
  <head>
    <title>Windows 3.1</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
    <link rel="stylesheet" href="style.css" type="text/css">
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" type="text/css">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
    <script src="code.js"></script>
  
  </head>
  <body>
    <div id="intro" class="window" style="position: absolute; top: 100px; left: 100px; width: 500px; height: 120px; z-index: 1">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">Introduction</div>
      </div>
      <div class="windowinner">
        <div class="fullwindowhtml">
          <p>This is a test of trying to replicate some Windows 3.1 styles and interactions in HTML, CSS & JS.</p>
          <p>Created by <a href="https://ianrenton.com">Ian Renton</a>, but nobody knows why.</p>
          <p><a href="https://github.com/ianrenton/web3point1">Source Code is on GitHub</a> and is in the Public Domain.</p>
        </div>
      </div>
    </div>

    <div id="progman" class="window selectedwindow" style="position: absolute; top: 250px; left: 150px; width: 500px; height: 300px; z-index: 2">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">Program Manager</div>
      </div>
      <div class="windowinner">
        <div class="fullwindowicons">
          <div class="icon" ondblclick="newWindow('#clock')">
            <img src="icons/clock.png">
            <p>Clock</p>
          </div>
          <div class="icon" ondblclick="newWindow('#write')">
            <img src="icons/write.png">
            <p>Write</p>
          </div>
          <div class="icon" ondblclick="newWindow('#dosprompt')">
            <img src="icons/dos.png">
            <p>MS-DOS</p>
          </div>
          <div class="icon" ondblclick="newWindow('#doom')">
            <img src="icons/doom.png">
            <p>DOOM</p>
          </div>
        </div>
      </div>
    </div>

    <div id="write" class="window" style="position: absolute; top: 150px; left: 400px; width: 500px; height: 400px; z-index: 3; display: none;">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">Write - TEXTBO~1.WRI</div>
      </div>
      <div class="windowinner">
        <textarea class="fullwindowtextarea">Yo what up this is a text box</textarea>
      </div>
    </div>


    <div id="clock" class="window" style="position: absolute; top: 260px; left: 260px; width: 250px; height: 250px; z-index: 4; display: none">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">Clock</div>
      </div>
      <div class="windowmenubar">
        <div class="menuitem">Settings</div>
      </div>
      <div class="windowinner" style="background-color: lightgrey">
        <div class="fullwindowhtml">
          <div style="margin-top: 70px; font-family: Arial, sans-serif; font-size: 40px; text-align:center">04:20:00 PM</div>
          <div style="margin-top: 5px; font-family: Arial, sans-serif; font-size: 20px; text-align:center">6/9/69</div>
        </div>
      </div>
    </div>

    <div id="dosprompt" class="window" style="position: absolute; top: 220px; left: 250px; width: 600px; height: 350px; z-index: 5; display: none">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">MS-DOS Prompt</div>
      </div>
      <div class="windowinner">
        <textarea class="fullwindowdosprompt">C:\> </textarea>
      </div>
    </div>

    <div id="doom" class="window" style="position: absolute; top: 150px; left: 150px; width: 640px; height: 480px; z-index: 6; display: none">
      <div class="windowheader">
        <div class="windowclose"></div>
        <div class="windowtitle">DOOM</div>
      </div>
      <div class="windowinner">
        <canvas id="doomcanvas"></canvas>
      </div>
    </div>
  </body>
</html>