├── .gitattributes ├── README.md ├── assets ├── B.mp3 ├── C.mp3 ├── D.mp3 ├── E.mp3 ├── F.mp3 ├── favicon-16x16.png ├── favicon-32x32.png ├── favicon.ico ├── jadoo.png ├── refresh.gif └── space.jpg ├── css ├── ellipse.css ├── main.css └── wave.css ├── index.html └── js └── crt.js /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # calling-jadoo 2 | 3 | this is just a stimulator of calling jadoo inspired by movie "Koi mil gaya" 4 | 5 | Here are somescreenshots : 6 |  7 | 8 | 9 | When you press keys : 10 | it also do sound "oo ohh oo oooo" 😂 11 | 12 | Thanks and follow me on my social handles : 13 | 14 | Insta : https://www.instagram.com/developer_rahul_/ 15 | Youtube : https://www.youtube.com/@developerRahul 16 | -------------------------------------------------------------------------------- /assets/B.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/B.mp3 -------------------------------------------------------------------------------- /assets/C.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/C.mp3 -------------------------------------------------------------------------------- /assets/D.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/D.mp3 -------------------------------------------------------------------------------- /assets/E.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/E.mp3 -------------------------------------------------------------------------------- /assets/F.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/F.mp3 -------------------------------------------------------------------------------- /assets/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/favicon-16x16.png -------------------------------------------------------------------------------- /assets/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/favicon-32x32.png -------------------------------------------------------------------------------- /assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/favicon.ico -------------------------------------------------------------------------------- /assets/jadoo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/jadoo.png -------------------------------------------------------------------------------- /assets/refresh.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/refresh.gif -------------------------------------------------------------------------------- /assets/space.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/developerrahulofficial/calling-jadoo/ec0105c180ef73261f61d3cc64eb1f3212dfd0e7/assets/space.jpg -------------------------------------------------------------------------------- /css/ellipse.css: -------------------------------------------------------------------------------- 1 | .wrap { 2 | width: 50%; 3 | height: 50%; 4 | margin: 0; 5 | position: absolute; 6 | -webkit-perspective: 4000px; 7 | perspective: 4000px; 8 | -webkit-transform-style: preserve-3d; 9 | transform-style: preserve-3d; 10 | top: 55vh; 11 | left: 15vw; 12 | } 13 | 14 | .circle { 15 | -webkit-filter: blur(1px); 16 | filter: blur(1px); 17 | -webkit-transform-style: preserve-3d; 18 | transform-style: preserve-3d; 19 | box-sizing: border-box; 20 | opacity: 0; 21 | width: 30vh; 22 | height: 30vh; 23 | border: 1vh solid green; 24 | border-radius: 50%; 25 | position: absolute; 26 | top: 0; 27 | left: 0; 28 | -webkit-animation: spin 20s ease-in-out alternate infinite; 29 | animation: spin 20s ease-in-out alternate infinite; 30 | } 31 | 32 | .circle:nth-of-type(1) { 33 | -webkit-animation-delay: 500ms; 34 | animation-delay: 500ms; 35 | } 36 | .circle:nth-of-type(2) { 37 | -webkit-animation-delay: 1000ms; 38 | animation-delay: 1000ms; 39 | } 40 | .circle:nth-of-type(3) { 41 | -webkit-animation-delay: 1500ms; 42 | animation-delay: 1500ms; 43 | } 44 | .circle:nth-of-type(4) { 45 | -webkit-animation-delay: 2000ms; 46 | animation-delay: 2000ms; 47 | } 48 | .circle:nth-of-type(5) { 49 | -webkit-animation-delay: 2500ms; 50 | animation-delay: 2500ms; 51 | } 52 | 53 | @-webkit-keyframes spin { 54 | 0% { 55 | -webkit-transform: rotateY(0deg) rotateX(0deg); 56 | opacity: 1; 57 | } 58 | 25% { 59 | -webkit-transform: rotateY(180deg) rotateX(360deg); 60 | } 61 | 50% { 62 | -webkit-transform: rotateY(540deg) rotateX(540deg); 63 | } 64 | 75% { 65 | -webkit-transform: rotateY(720deg) rotateX(900deg); 66 | } 67 | 100% { 68 | -webkit-transform: rotateY(900deg) rotateX(1080deg); 69 | opacity: 1; 70 | } 71 | } 72 | @keyframes spin { 73 | 0% { 74 | -webkit-transform: rotateY(0deg) rotateX(0deg); 75 | transform: rotateY(0deg) rotateX(0deg); 76 | opacity: 1; 77 | } 78 | 25% { 79 | -webkit-transform: rotateY(180deg) rotateX(360deg); 80 | transform: rotateY(180deg) rotateX(360deg); 81 | } 82 | 50% { 83 | -webkit-transform: rotateY(540deg) rotateX(540deg); 84 | transform: rotateY(540deg) rotateX(540deg); 85 | } 86 | 75% { 87 | -webkit-transform: rotateY(720deg) rotateX(900deg); 88 | transform: rotateY(720deg) rotateX(900deg); 89 | } 90 | 100% { 91 | -webkit-transform: rotateY(900deg) rotateX(1080deg); 92 | transform: rotateY(900deg) rotateX(1080deg); 93 | opacity: 1; 94 | } 95 | } 96 | 97 | .circle1 { 98 | height: 40vh; 99 | width: 20vh; 100 | } 101 | 102 | .circle2 { 103 | width: 45vh; 104 | height: 25vh; 105 | } 106 | 107 | .circle3 { 108 | height: 10vh; 109 | width: 10vh; 110 | } 111 | -------------------------------------------------------------------------------- /css/main.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css?family=VT323'); 2 | 3 | body { 4 | pointer-events: none; 5 | cursor: none; 6 | padding: 0; 7 | margin: 0; 8 | text-align: center; 9 | overflow: hidden; 10 | } 11 | 12 | .crt { 13 | letter-spacing: 1px; 14 | font-family: 'VT323', monospace; 15 | color: #95e208; 16 | -webkit-filter: blur(0.5px); 17 | filter: blur(0.5px); 18 | text-transform: uppercase; 19 | font-size: 3vw; 20 | } 21 | 22 | #monitor { 23 | z-index: 2; 24 | position: relative; 25 | display: inline-flex; 26 | align-items: center; 27 | justify-content: center; 28 | width: 100vw; 29 | height: 100vh; 30 | } 31 | 32 | .content { 33 | white-space: nowrap; 34 | text-align: center; 35 | display: inline-block; 36 | } 37 | 38 | .background { 39 | pointer-events: none; 40 | position: absolute; 41 | left: 0; 42 | top: 0; 43 | display: block; 44 | width: 100%; 45 | height: 100%; 46 | } 47 | 48 | .background { 49 | opacity: .01; 50 | } 51 | 52 | .enter-text { 53 | -webkit-filter: blur(0.6px); 54 | background: black; 55 | padding: 10px 20px 10px 20px; 56 | border: 5px double #95e208; 57 | box-shadow: 1px 1px 1px #95e208; 58 | } 59 | 60 | .background-image { 61 | right: -10px; 62 | bottom: -10px; 63 | top: -10px; 64 | left: -10px; 65 | background-image: url(../assets/space.jpg), radial-gradient(#0F0, #000), repeating-linear-gradient(transparent 0, rgba(0, 0, 0, 0.1) 2.5px, transparent 5px); 66 | background-size: cover; 67 | background-position: center; 68 | background-blend-mode: overlay; 69 | position: fixed; 70 | -webkit-filter: blur(5px); 71 | display: block; 72 | z-index: 1; 73 | } 74 | 75 | .content { 76 | box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); 77 | left: 0; 78 | position: fixed; 79 | right: 0; 80 | z-index: 2; 81 | } 82 | 83 | .line { 84 | height: 0.9vh; 85 | background: green; 86 | position: fixed; 87 | transform-origin: 50%; 88 | -webkit-filter: blur(0.15vh); 89 | } 90 | 91 | .vline { 92 | transform: rotate(90deg); 93 | width: 91vh; 94 | } 95 | 96 | .hline { 97 | width: 100vw; 98 | top: 45vh; 99 | } 100 | 101 | .hline1 { 102 | width: 100vw; 103 | top: 4%; 104 | } 105 | 106 | .hline2 { 107 | width: 100vw; 108 | top: 95%; 109 | } 110 | 111 | .prompt { 112 | font-size: 4.5vh; 113 | position: fixed; 114 | bottom: -0.5vh; 115 | left: 1vw; 116 | filter: blur(0.15vh); 117 | font-family: 'VT323', monospace; 118 | animation:pulse 0.55s infinite alternate 119 | } 120 | 121 | @keyframes pulse { 122 | from { color: green; } 123 | to { color: yellow; } 124 | } 125 | 126 | .prompt-key { 127 | color: red; 128 | font-weight: 700; 129 | } 130 | 131 | .sending, .receiving { 132 | position: fixed; 133 | top: 5vh; 134 | filter: blur(0.15vh); 135 | } 136 | 137 | .sending { 138 | left: 5vw; 139 | } 140 | 141 | .receiving { 142 | left: 55vw; 143 | } 144 | 145 | .sea { 146 | position: fixed; 147 | top: 5.5vh; 148 | } 149 | 150 | .sea-left { 151 | transform: rotateX(67deg) rotateZ(-223deg) rotateY(0deg); 152 | left: 10vw; 153 | } 154 | 155 | .sea-right { 156 | transform: rotateX(67deg) rotateZ(-57deg) rotateY(0deg); 157 | left: 60vw; 158 | } 159 | 160 | .header { 161 | position: fixed; 162 | top: 0; 163 | right: 1vh; 164 | text-transform: none; 165 | font-size: 4vh; 166 | filter: blur(0.15vh); 167 | } 168 | 169 | a { 170 | text-decoration: none; 171 | color: #95e208; 172 | cursor: hand; 173 | pointer-events: all; 174 | } 175 | 176 | a:hover { 177 | background-color: #95e208; 178 | color: #161913; 179 | } 180 | 181 | .radar { 182 | width:50%; 183 | height:6px; 184 | background:green; 185 | position: absolute; 186 | top:50%; 187 | transform-origin: 100%; 188 | transition: all 0.05s; 189 | transition-timing-function: cubic-bezier(0.1, 2.7, 0.58, 1); 190 | } 191 | 192 | .radar1 { 193 | transform: rotate(-30deg); 194 | } 195 | 196 | .radar2 { 197 | transform: rotate(90deg); 198 | } 199 | 200 | .radar3 { 201 | transform: rotate(210deg); 202 | } 203 | 204 | .garbage { 205 | filter: blur(0.15vh); 206 | position: fixed; 207 | top: 53vh; 208 | text-align: justify; 209 | margin: 0; 210 | } 211 | 212 | .garbage-left { 213 | left: 50vw; 214 | font-size: 4.5vh; 215 | } 216 | 217 | .garbage-right { 218 | right: 0vw; 219 | font-size: 5vh; 220 | } 221 | 222 | pre { 223 | font-family: 'VT323', monospace; 224 | } 225 | 226 | .nodisplay { 227 | display: none; 228 | } 229 | -------------------------------------------------------------------------------- /css/wave.css: -------------------------------------------------------------------------------- 1 | 2 | .sea { 3 | display: -webkit-box; 4 | display: -ms-flexbox; 5 | display: flex; 6 | -ms-flex-wrap: wrap; 7 | flex-wrap: wrap; 8 | width: 25vw; 9 | height: 25vw; 10 | -webkit-transform-style: preserve-3d; 11 | transform-style: preserve-3d; 12 | -webkit-transform: rotateX(70deg) rotateZ(35deg); 13 | transform: rotateX(70deg) rotateZ(35deg); 14 | } 15 | 16 | .wave { 17 | filter: blur(0.1vw); 18 | width: 2.5vw; 19 | height: 2.5vw; 20 | background: green; 21 | -webkit-transform: translateZ(0px) rotateX(90deg); 22 | transform: translateZ(0px) rotateX(90deg); 23 | -webkit-transform-origin: top; 24 | transform-origin: top; 25 | margin: -22px 3px; 26 | -webkit-animation: wave 1s ease-in-out infinite alternate; 27 | animation: wave 1s ease-in-out infinite alternate; 28 | opacity: .7; 29 | border-radius: 0 0 2px 2px; 30 | } 31 | 32 | .wave:nth-child(121) { 33 | -webkit-animation-delay: 1.694s; 34 | animation-delay: 1.694s; 35 | } 36 | 37 | .wave:nth-child(120) { 38 | -webkit-animation-delay: 1.68s; 39 | animation-delay: 1.68s; 40 | } 41 | 42 | .wave:nth-child(119) { 43 | -webkit-animation-delay: 1.666s; 44 | animation-delay: 1.666s; 45 | } 46 | 47 | .wave:nth-child(118) { 48 | -webkit-animation-delay: 1.652s; 49 | animation-delay: 1.652s; 50 | } 51 | 52 | .wave:nth-child(117) { 53 | -webkit-animation-delay: 1.638s; 54 | animation-delay: 1.638s; 55 | } 56 | 57 | .wave:nth-child(116) { 58 | -webkit-animation-delay: 1.624s; 59 | animation-delay: 1.624s; 60 | } 61 | 62 | .wave:nth-child(115) { 63 | -webkit-animation-delay: 1.61s; 64 | animation-delay: 1.61s; 65 | } 66 | 67 | .wave:nth-child(114) { 68 | -webkit-animation-delay: 1.596s; 69 | animation-delay: 1.596s; 70 | } 71 | 72 | .wave:nth-child(113) { 73 | -webkit-animation-delay: 1.582s; 74 | animation-delay: 1.582s; 75 | } 76 | 77 | .wave:nth-child(112) { 78 | -webkit-animation-delay: 1.568s; 79 | animation-delay: 1.568s; 80 | } 81 | 82 | .wave:nth-child(111) { 83 | -webkit-animation-delay: 1.554s; 84 | animation-delay: 1.554s; 85 | } 86 | 87 | .wave:nth-child(110) { 88 | -webkit-animation-delay: 1.54s; 89 | animation-delay: 1.54s; 90 | } 91 | 92 | .wave:nth-child(109) { 93 | -webkit-animation-delay: 1.526s; 94 | animation-delay: 1.526s; 95 | } 96 | 97 | .wave:nth-child(108) { 98 | -webkit-animation-delay: 1.512s; 99 | animation-delay: 1.512s; 100 | } 101 | 102 | .wave:nth-child(107) { 103 | -webkit-animation-delay: 1.498s; 104 | animation-delay: 1.498s; 105 | } 106 | 107 | .wave:nth-child(106) { 108 | -webkit-animation-delay: 1.484s; 109 | animation-delay: 1.484s; 110 | } 111 | 112 | .wave:nth-child(105) { 113 | -webkit-animation-delay: 1.47s; 114 | animation-delay: 1.47s; 115 | } 116 | 117 | .wave:nth-child(104) { 118 | -webkit-animation-delay: 1.456s; 119 | animation-delay: 1.456s; 120 | } 121 | 122 | .wave:nth-child(103) { 123 | -webkit-animation-delay: 1.442s; 124 | animation-delay: 1.442s; 125 | } 126 | 127 | .wave:nth-child(102) { 128 | -webkit-animation-delay: 1.428s; 129 | animation-delay: 1.428s; 130 | } 131 | 132 | .wave:nth-child(101) { 133 | -webkit-animation-delay: 1.414s; 134 | animation-delay: 1.414s; 135 | } 136 | 137 | .wave:nth-child(100) { 138 | -webkit-animation-delay: 1.4s; 139 | animation-delay: 1.4s; 140 | } 141 | 142 | .wave:nth-child(99) { 143 | -webkit-animation-delay: 1.386s; 144 | animation-delay: 1.386s; 145 | } 146 | 147 | .wave:nth-child(98) { 148 | -webkit-animation-delay: 1.372s; 149 | animation-delay: 1.372s; 150 | } 151 | 152 | .wave:nth-child(97) { 153 | -webkit-animation-delay: 1.358s; 154 | animation-delay: 1.358s; 155 | } 156 | 157 | .wave:nth-child(96) { 158 | -webkit-animation-delay: 1.344s; 159 | animation-delay: 1.344s; 160 | } 161 | 162 | .wave:nth-child(95) { 163 | -webkit-animation-delay: 1.33s; 164 | animation-delay: 1.33s; 165 | } 166 | 167 | .wave:nth-child(94) { 168 | -webkit-animation-delay: 1.316s; 169 | animation-delay: 1.316s; 170 | } 171 | 172 | .wave:nth-child(93) { 173 | -webkit-animation-delay: 1.302s; 174 | animation-delay: 1.302s; 175 | } 176 | 177 | .wave:nth-child(92) { 178 | -webkit-animation-delay: 1.288s; 179 | animation-delay: 1.288s; 180 | } 181 | 182 | .wave:nth-child(91) { 183 | -webkit-animation-delay: 1.274s; 184 | animation-delay: 1.274s; 185 | } 186 | 187 | .wave:nth-child(90) { 188 | -webkit-animation-delay: 1.26s; 189 | animation-delay: 1.26s; 190 | } 191 | 192 | .wave:nth-child(89) { 193 | -webkit-animation-delay: 1.246s; 194 | animation-delay: 1.246s; 195 | } 196 | 197 | .wave:nth-child(88) { 198 | -webkit-animation-delay: 1.232s; 199 | animation-delay: 1.232s; 200 | } 201 | 202 | .wave:nth-child(87) { 203 | -webkit-animation-delay: 1.218s; 204 | animation-delay: 1.218s; 205 | } 206 | 207 | .wave:nth-child(86) { 208 | -webkit-animation-delay: 1.204s; 209 | animation-delay: 1.204s; 210 | } 211 | 212 | .wave:nth-child(85) { 213 | -webkit-animation-delay: 1.19s; 214 | animation-delay: 1.19s; 215 | } 216 | 217 | .wave:nth-child(84) { 218 | -webkit-animation-delay: 1.176s; 219 | animation-delay: 1.176s; 220 | } 221 | 222 | .wave:nth-child(83) { 223 | -webkit-animation-delay: 1.162s; 224 | animation-delay: 1.162s; 225 | } 226 | 227 | .wave:nth-child(82) { 228 | -webkit-animation-delay: 1.148s; 229 | animation-delay: 1.148s; 230 | } 231 | 232 | .wave:nth-child(81) { 233 | -webkit-animation-delay: 1.134s; 234 | animation-delay: 1.134s; 235 | } 236 | 237 | .wave:nth-child(80) { 238 | -webkit-animation-delay: 1.12s; 239 | animation-delay: 1.12s; 240 | } 241 | 242 | .wave:nth-child(79) { 243 | -webkit-animation-delay: 1.106s; 244 | animation-delay: 1.106s; 245 | } 246 | 247 | .wave:nth-child(78) { 248 | -webkit-animation-delay: 1.092s; 249 | animation-delay: 1.092s; 250 | } 251 | 252 | .wave:nth-child(77) { 253 | -webkit-animation-delay: 1.078s; 254 | animation-delay: 1.078s; 255 | } 256 | 257 | .wave:nth-child(76) { 258 | -webkit-animation-delay: 1.064s; 259 | animation-delay: 1.064s; 260 | } 261 | 262 | .wave:nth-child(75) { 263 | -webkit-animation-delay: 1.05s; 264 | animation-delay: 1.05s; 265 | } 266 | 267 | .wave:nth-child(74) { 268 | -webkit-animation-delay: 1.036s; 269 | animation-delay: 1.036s; 270 | } 271 | 272 | .wave:nth-child(73) { 273 | -webkit-animation-delay: 1.022s; 274 | animation-delay: 1.022s; 275 | } 276 | 277 | .wave:nth-child(72) { 278 | -webkit-animation-delay: 1.008s; 279 | animation-delay: 1.008s; 280 | } 281 | 282 | .wave:nth-child(71) { 283 | -webkit-animation-delay: 0.994s; 284 | animation-delay: 0.994s; 285 | } 286 | 287 | .wave:nth-child(70) { 288 | -webkit-animation-delay: 0.98s; 289 | animation-delay: 0.98s; 290 | } 291 | 292 | .wave:nth-child(69) { 293 | -webkit-animation-delay: 0.966s; 294 | animation-delay: 0.966s; 295 | } 296 | 297 | .wave:nth-child(68) { 298 | -webkit-animation-delay: 0.952s; 299 | animation-delay: 0.952s; 300 | } 301 | 302 | .wave:nth-child(67) { 303 | -webkit-animation-delay: 0.938s; 304 | animation-delay: 0.938s; 305 | } 306 | 307 | .wave:nth-child(66) { 308 | -webkit-animation-delay: 0.924s; 309 | animation-delay: 0.924s; 310 | } 311 | 312 | .wave:nth-child(65) { 313 | -webkit-animation-delay: 0.91s; 314 | animation-delay: 0.91s; 315 | } 316 | 317 | .wave:nth-child(64) { 318 | -webkit-animation-delay: 0.896s; 319 | animation-delay: 0.896s; 320 | } 321 | 322 | .wave:nth-child(63) { 323 | -webkit-animation-delay: 0.882s; 324 | animation-delay: 0.882s; 325 | } 326 | 327 | .wave:nth-child(62) { 328 | -webkit-animation-delay: 0.868s; 329 | animation-delay: 0.868s; 330 | } 331 | 332 | .wave:nth-child(61) { 333 | -webkit-animation-delay: 0.854s; 334 | animation-delay: 0.854s; 335 | } 336 | 337 | .wave:nth-child(60) { 338 | -webkit-animation-delay: 0.84s; 339 | animation-delay: 0.84s; 340 | } 341 | 342 | .wave:nth-child(59) { 343 | -webkit-animation-delay: 0.826s; 344 | animation-delay: 0.826s; 345 | } 346 | 347 | .wave:nth-child(58) { 348 | -webkit-animation-delay: 0.812s; 349 | animation-delay: 0.812s; 350 | } 351 | 352 | .wave:nth-child(57) { 353 | -webkit-animation-delay: 0.798s; 354 | animation-delay: 0.798s; 355 | } 356 | 357 | .wave:nth-child(56) { 358 | -webkit-animation-delay: 0.784s; 359 | animation-delay: 0.784s; 360 | } 361 | 362 | .wave:nth-child(55) { 363 | -webkit-animation-delay: 0.77s; 364 | animation-delay: 0.77s; 365 | } 366 | 367 | .wave:nth-child(54) { 368 | -webkit-animation-delay: 0.756s; 369 | animation-delay: 0.756s; 370 | } 371 | 372 | .wave:nth-child(53) { 373 | -webkit-animation-delay: 0.742s; 374 | animation-delay: 0.742s; 375 | } 376 | 377 | .wave:nth-child(52) { 378 | -webkit-animation-delay: 0.728s; 379 | animation-delay: 0.728s; 380 | } 381 | 382 | .wave:nth-child(51) { 383 | -webkit-animation-delay: 0.714s; 384 | animation-delay: 0.714s; 385 | } 386 | 387 | .wave:nth-child(50) { 388 | -webkit-animation-delay: 0.7s; 389 | animation-delay: 0.7s; 390 | } 391 | 392 | .wave:nth-child(49) { 393 | -webkit-animation-delay: 0.686s; 394 | animation-delay: 0.686s; 395 | } 396 | 397 | .wave:nth-child(48) { 398 | -webkit-animation-delay: 0.672s; 399 | animation-delay: 0.672s; 400 | } 401 | 402 | .wave:nth-child(47) { 403 | -webkit-animation-delay: 0.658s; 404 | animation-delay: 0.658s; 405 | } 406 | 407 | .wave:nth-child(46) { 408 | -webkit-animation-delay: 0.644s; 409 | animation-delay: 0.644s; 410 | } 411 | 412 | .wave:nth-child(45) { 413 | -webkit-animation-delay: 0.63s; 414 | animation-delay: 0.63s; 415 | } 416 | 417 | .wave:nth-child(44) { 418 | -webkit-animation-delay: 0.616s; 419 | animation-delay: 0.616s; 420 | } 421 | 422 | .wave:nth-child(43) { 423 | -webkit-animation-delay: 0.602s; 424 | animation-delay: 0.602s; 425 | } 426 | 427 | .wave:nth-child(42) { 428 | -webkit-animation-delay: 0.588s; 429 | animation-delay: 0.588s; 430 | } 431 | 432 | .wave:nth-child(41) { 433 | -webkit-animation-delay: 0.574s; 434 | animation-delay: 0.574s; 435 | } 436 | 437 | .wave:nth-child(40) { 438 | -webkit-animation-delay: 0.56s; 439 | animation-delay: 0.56s; 440 | } 441 | 442 | .wave:nth-child(39) { 443 | -webkit-animation-delay: 0.546s; 444 | animation-delay: 0.546s; 445 | } 446 | 447 | .wave:nth-child(38) { 448 | -webkit-animation-delay: 0.532s; 449 | animation-delay: 0.532s; 450 | } 451 | 452 | .wave:nth-child(37) { 453 | -webkit-animation-delay: 0.518s; 454 | animation-delay: 0.518s; 455 | } 456 | 457 | .wave:nth-child(36) { 458 | -webkit-animation-delay: 0.504s; 459 | animation-delay: 0.504s; 460 | } 461 | 462 | .wave:nth-child(35) { 463 | -webkit-animation-delay: 0.49s; 464 | animation-delay: 0.49s; 465 | } 466 | 467 | .wave:nth-child(34) { 468 | -webkit-animation-delay: 0.476s; 469 | animation-delay: 0.476s; 470 | } 471 | 472 | .wave:nth-child(33) { 473 | -webkit-animation-delay: 0.462s; 474 | animation-delay: 0.462s; 475 | } 476 | 477 | .wave:nth-child(32) { 478 | -webkit-animation-delay: 0.448s; 479 | animation-delay: 0.448s; 480 | } 481 | 482 | .wave:nth-child(31) { 483 | -webkit-animation-delay: 0.434s; 484 | animation-delay: 0.434s; 485 | } 486 | 487 | .wave:nth-child(30) { 488 | -webkit-animation-delay: 0.42s; 489 | animation-delay: 0.42s; 490 | } 491 | 492 | .wave:nth-child(29) { 493 | -webkit-animation-delay: 0.406s; 494 | animation-delay: 0.406s; 495 | } 496 | 497 | .wave:nth-child(28) { 498 | -webkit-animation-delay: 0.392s; 499 | animation-delay: 0.392s; 500 | } 501 | 502 | .wave:nth-child(27) { 503 | -webkit-animation-delay: 0.378s; 504 | animation-delay: 0.378s; 505 | } 506 | 507 | .wave:nth-child(26) { 508 | -webkit-animation-delay: 0.364s; 509 | animation-delay: 0.364s; 510 | } 511 | 512 | .wave:nth-child(25) { 513 | -webkit-animation-delay: 0.35s; 514 | animation-delay: 0.35s; 515 | } 516 | 517 | .wave:nth-child(24) { 518 | -webkit-animation-delay: 0.336s; 519 | animation-delay: 0.336s; 520 | } 521 | 522 | .wave:nth-child(23) { 523 | -webkit-animation-delay: 0.322s; 524 | animation-delay: 0.322s; 525 | } 526 | 527 | .wave:nth-child(22) { 528 | -webkit-animation-delay: 0.308s; 529 | animation-delay: 0.308s; 530 | } 531 | 532 | .wave:nth-child(21) { 533 | -webkit-animation-delay: 0.294s; 534 | animation-delay: 0.294s; 535 | } 536 | 537 | .wave:nth-child(20) { 538 | -webkit-animation-delay: 0.28s; 539 | animation-delay: 0.28s; 540 | } 541 | 542 | .wave:nth-child(19) { 543 | -webkit-animation-delay: 0.266s; 544 | animation-delay: 0.266s; 545 | } 546 | 547 | .wave:nth-child(18) { 548 | -webkit-animation-delay: 0.252s; 549 | animation-delay: 0.252s; 550 | } 551 | 552 | .wave:nth-child(17) { 553 | -webkit-animation-delay: 0.238s; 554 | animation-delay: 0.238s; 555 | } 556 | 557 | .wave:nth-child(16) { 558 | -webkit-animation-delay: 0.224s; 559 | animation-delay: 0.224s; 560 | } 561 | 562 | .wave:nth-child(15) { 563 | -webkit-animation-delay: 0.21s; 564 | animation-delay: 0.21s; 565 | } 566 | 567 | .wave:nth-child(14) { 568 | -webkit-animation-delay: 0.196s; 569 | animation-delay: 0.196s; 570 | } 571 | 572 | .wave:nth-child(13) { 573 | -webkit-animation-delay: 0.182s; 574 | animation-delay: 0.182s; 575 | } 576 | 577 | .wave:nth-child(12) { 578 | -webkit-animation-delay: 0.168s; 579 | animation-delay: 0.168s; 580 | } 581 | 582 | .wave:nth-child(11) { 583 | -webkit-animation-delay: 0.154s; 584 | animation-delay: 0.154s; 585 | } 586 | 587 | .wave:nth-child(10) { 588 | -webkit-animation-delay: 0.14s; 589 | animation-delay: 0.14s; 590 | } 591 | 592 | .wave:nth-child(9) { 593 | -webkit-animation-delay: 0.126s; 594 | animation-delay: 0.126s; 595 | } 596 | 597 | .wave:nth-child(8) { 598 | -webkit-animation-delay: 0.112s; 599 | animation-delay: 0.112s; 600 | } 601 | 602 | .wave:nth-child(7) { 603 | -webkit-animation-delay: 0.098s; 604 | animation-delay: 0.098s; 605 | } 606 | 607 | .wave:nth-child(6) { 608 | -webkit-animation-delay: 0.084s; 609 | animation-delay: 0.084s; 610 | } 611 | 612 | .wave:nth-child(5) { 613 | -webkit-animation-delay: 0.07s; 614 | animation-delay: 0.07s; 615 | } 616 | 617 | .wave:nth-child(4) { 618 | -webkit-animation-delay: 0.056s; 619 | animation-delay: 0.056s; 620 | } 621 | 622 | .wave:nth-child(3) { 623 | -webkit-animation-delay: 0.042s; 624 | animation-delay: 0.042s; 625 | } 626 | 627 | .wave:nth-child(2) { 628 | -webkit-animation-delay: 0.028s; 629 | animation-delay: 0.028s; 630 | } 631 | 632 | @-webkit-keyframes wave { 633 | from { 634 | height: 8px; 635 | } 636 | to { 637 | height: 40px; 638 | } 639 | } 640 | 641 | @keyframes wave { 642 | from { 643 | height: 8px; 644 | } 645 | to { 646 | height: 40px; 647 | } 648 | } 649 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 |40 | uplink = yes 41 | axis. = 40 42 | inc. = 48 pos 43 | dec = 57 neg 44 | 45 | signal = 80 b 46 |47 |
48 | B:066 49 | C:067 50 | D:068 51 | E:069 52 | F:070 53 |54 |