sma2017-tugas3-ci-breaklock-hori75/index.html at master · BesutKode/sma2017-tugas3-ci-breaklock-hori75 · GitHub

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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!doctype html>
<html>
  <head>
    <title>BreakLock</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <link rel="shortcut icon" href="assets/favicon.ico">
    <meta name="theme-color" content="#14171b">

    <link rel="manifest" href="manifest.json">

    <!-- Add to home screen for Safari on iOS -->
    <link rel="apple-touch-icon" href="assets/icons/ios-180x180.png">
    <link rel="apple-touch-startup-image" href="assets/ios-startup/startup-640x1136.png" media="device-width: 375px">
    <link rel="apple-touch-startup-image" href="assets/ios-startup/startup-1080x1920.png" media="device-width: 414px">
    <link rel="apple-touch-startup-image" href="assets/ios-startup/startup-640x1136.png" media="(device-width: 320px) and (device-height: 568px)">
    <link rel="apple-touch-startup-image" href="assets/ios-startup/startup-640x960.png"  media="(device-width: 320px) and (device-height: 480px)">

    <meta name="apple-mobile-web-app-title" content="BreakLock">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no, minimal-ui">

    <meta name="msapplication-TileImage" content="assets/icons/icon-144x144.png">
    <meta name="msapplication-TileColor" content="#14171b">

    <link rel="stylesheet" type="text/css" href="app.css">
  </head>

  <body>
    <!-- Intro -->
    <p id="app-intro" style="font-family: monospace; color: #fff;">
      $ ./breaklock start<br>
      Loading...
      <style type="text/css">
        body {
          background: #14171b;
        }
      </style>
    </p>

    <!-- Static content -->
    <div style="display: none;">
      <div id="instructions-template">
        <object class="introduction-demo" data="assets/intro.svg" type="image/svg+xml"></object>
        <p>Link the dots to find the lock pattern. After every attempt the game will tell you how many dots you got right.<p>
        <table>
          <tr>
            <td style="width:1.5em;">&#9679;</td>
            <td>a dot occurs in the pattern and is in the correct order</td>
          </tr>
          <tr>
            <td>&#9675;</td>
            <td>a dot occurs in the pattern but in the wrong order</td>
          </tr>
        </table>
        <p>The difficulty setting changes the amount of dots to connect. Easy is 4 dots, medium is 5 dots and hard is 6 dots.</p>
        <p>Good luck!_</p>
        <p class="small">by <a href="https://twitter.com/mxwllt"><svg class="icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-maxwellito"></use></svg></a> / on <a href="https://github.com/maxwellito/breaklock"><svg class="icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-github"></use></svg></a></p>
      </div>
    </div>

    <!-- SVG Icon definitions -->
    <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
      <symbol viewBox="0 0 128 128" id="icon-new_game">
        <path d="M111.5,120.5h-96c-4.418,0-8-3.582-8-8V16c0-3.236,1.949-6.153,4.938-7.391c2.991-1.237,6.432-0.554,8.718,1.734l48.5,48.5 c2.288,2.288,2.972,5.729,1.733,8.719S67.235,72.5,64,72.5H23.5v32h80v-80h-40c-4.418,0-8-3.582-8-8s3.582-8,8-8h48 c4.418,0,8,3.582,8,8v96C119.5,116.918,115.918,120.5,111.5,120.5z M23.5,56.5h21.187L23.5,35.313V56.5z"/>
      </symbol>
      <symbol viewBox="0 0 128 128" id="icon-back_home">
        <path d="M111.5,120.5h-96c-4.418,0-8-3.582-8-8V64c0-2.129,0.849-4.17,2.358-5.672l48.25-48C59.613,8.831,61.681,8.015,63.776,8 c2.123,0.007,4.157,0.858,5.652,2.365l47.875,48.25c1.907,1.922,2.639,4.569,2.196,7.047V112.5 C119.5,116.918,115.918,120.5,111.5,120.5z M23.5,104.5h80v-32h-40c-4.418,0-8-3.582-8-8s3.582-8,8-8h29.165L63.713,27.321 L23.5,67.326V104.5z"/>
      </symbol>
      <symbol viewBox="0 0 128 128" id="icon-continue">
        <path d="M15.5,120c-1.463,0-2.921-0.4-4.207-1.194C8.936,117.348,7.5,114.772,7.5,112V16c0-2.772,1.436-5.348,3.794-6.805 c2.359-1.458,5.304-1.591,7.784-0.35l96,48C117.788,58.2,119.5,60.97,119.5,64s-1.712,5.8-4.422,7.155l-96,48 C17.949,119.72,16.723,120,15.5,120z M23.5,28.944v70.111L93.611,64L23.5,28.944z"/>
      </symbol>
      <symbol viewBox="0 0 120 122" id="icon-maxwellito">
      	<polyline points="30,0 60,17.33 40,28.88 60,40.43 80,28.88 60,17.33 90,0 120,17.33 120,51.98 90,69.29 90,46.20 70,57.75 70,80.84 90,69.29 90,103.93 60,121.26 30,103.93 30,69.29 50,80.84 50,57.75 30,46.2 30,69.29 0,51.98 0,17.33" />
      </symbol>
      <symbol viewBox="0 0 128 128" id="icon-github">
      	<path d="M115.9,35.4c-5.3-9.2-12.6-16.5-21.8-21.8c-9.2-5.4-19.2-8-30.1-8c-10.9,0-20.9,2.7-30.1,8C24.7,18.9,17.4,26.2,12,35.4 c-5.3,9.2-8,19.3-8,30.1c0,13.1,3.8,24.9,11.4,35.3c7.7,10.4,17.5,17.7,29.6,21.7c1.4,0.3,2.5,0.1,3.1-0.5c0.7-0.6,1-1.4,1-2.4 v-4.2l-0.1-7l-1.8,0.3c-1.1,0.3-2.6,0.3-4.4,0.3c-1.7,0-3.6-0.2-5.4-0.5c-1.9-0.3-3.6-1.1-5.3-2.3c-1.6-1.2-2.7-2.8-3.4-4.8 L28,99.5c-0.5-1.2-1.3-2.5-2.5-4c-1.1-1.5-2.2-2.5-3.4-3l-0.5-0.4c-0.4-0.3-0.7-0.5-1-0.9c-0.3-0.4-0.5-0.7-0.7-1.1 c-0.1-0.4,0-0.7,0.4-0.9c0.4-0.3,1.2-0.4,2.2-0.4l1.6,0.3c1,0.2,2.3,0.8,3.8,1.8c1.6,1,2.8,2.4,3.8,4.1c1.2,2.1,2.6,3.7,4.3,4.8 c1.7,1.1,3.4,1.6,5.1,1.6c1.7,0,3.2-0.1,4.5-0.4c1.2-0.2,2.4-0.6,3.5-1.1c0.5-3.5,1.8-6.2,3.8-8c-3-0.3-5.6-0.8-8-1.4 c-2.4-0.7-4.8-1.6-7.3-3.1c-2.5-1.4-4.7-3.1-6.3-5.2c-1.6-2.1-3-4.8-4.1-8.2c-1.1-3.4-1.6-7.3-1.6-11.7c0-6.3,2.1-11.7,6.2-16.1 c-1.9-4.7-1.8-10,0.5-16c1.5-0.4,3.7-0.1,6.7,1.1c3,1.2,5.1,2.2,6.5,3c1.4,0.8,2.5,1.5,3.3,2.1c4.8-1.4,9.9-2,15-2 c5.1,0,10.1,0.7,15,2l3-1.9c2-1.3,4.4-2.5,7.2-3.5c2.7-1,4.9-1.4,6.3-0.8c2.4,5.9,2.6,11.2,0.7,15.9c4.1,4.5,6.2,9.9,6.2,16.1 c0,4.4-0.5,8.3-1.6,11.8c-1,3.4-2.4,6.1-4.1,8.2c-1.7,2-3.8,3.8-6.3,5.1c-2.6,1.5-5,2.5-7.4,3.1c-2.4,0.6-5,1.1-8,1.4 c2.7,2.4,4.1,6.1,4.1,11.1v16.5c0,0.9,0.3,1.7,1,2.4c0.7,0.6,1.6,0.8,3.1,0.5c12-4,21.9-11.2,29.6-21.7 c7.7-10.4,11.4-22.2,11.4-35.3C124,54.7,121.3,44.6,115.9,35.4L115.9,35.4z"/>
      </symbol>
      <symbol viewBox="0 0 128 128" id="icon-facebook">
        <path d="M16,16v96h51.164V74.451h-12.08v-13.99h12.08V50.144c0-11.973,7.312-18.493,17.994-18.493c5.115,0,9.514,0.381,10.795,0.552 v12.514l-7.408,0.003c-5.809,0-6.934,2.76-6.934,6.811v8.932h13.854l-1.803,13.99H81.611V112H112V16H16z"/>
      </symbol>
      <symbol viewBox="0 0 128 128" id="icon-twitter">
      	<path d="M128,24.3c-4.7,2.1-9.8,3.5-15.1,4.1c5.4-3.2,9.6-8.4,11.5-14.5c-5.1,3-10.7,5.2-16.7,6.4 C103,15.2,96.2,12,88.6,12c-14.5,0-26.3,11.8-26.3,26.3c0,2.1,0.2,4.1,0.7,6C41.2,43.2,21.9,32.7,8.9,16.8 C6.7,20.7,5.4,25.2,5.4,30c0,9.1,4.6,17.1,11.7,21.9c-4.3-0.1-8.4-1.3-11.9-3.3v0.3c0,12.7,9.1,23.3,21.1,25.7 c-2.2,0.6-4.5,0.9-6.9,0.9c-1.7,0-3.3-0.2-4.9-0.5c3.3,10.4,13,18,24.5,18.2c-9,7-20.3,11.2-32.6,11.2c-2.1,0-4.2-0.1-6.3-0.4 c11.6,7.5,25.4,11.8,40.2,11.8c48.3,0,74.7-40,74.7-74.7l-0.1-3.4C120,34.2,124.5,29.6,128,24.3z"/>
      </symbol>
    </svg>

    <noscript>
      <!--[if lte IE 6]>
        <p>
          If you read this it's probably because the world has rebooted. I don't know how but you arrived here. I'm sorry you cannot enjoy this little game but you will be able to in the not too distant future. Browsers will become incredibly better. Just before the world turns into chaos due to Nutella production shortages. Scientists will realise too late that Nutella was to humans what pollen is to bees. Don't believe the hype, the end didn't (or won't) happen because the 'left-pad' package got removed from NPM. Good luck.
        </p>
        <p>
          PS: If the world has ended, please tell thejameskyle that I loved him. Only his cat can save the world. (Shut the door)
        </p>
      <![endif]-->
    </noscript>

    <script src="app.js"></script>
    <script type="text/javascript">

      // Set up service worker
      if ('serviceWorker' in navigator) {
        navigator.serviceWorker
          .register('service-worker.js', {scope: '.'});
      }

      // Set up Google Analytics
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
      ga('create', 'UA-96752793-1', 'auto');
      ga('send', 'pageview');
    </script>
  </body>
</html>