github-audio/app/index.html at 9540ae87c24b84ff892e14b2a73bcbd436088750 · debugger22/github-audio · 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
<!-- index.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="title" content="GitHub Audio">
    <meta name="description" content="Listen to music generated by events happening across GitHub">
    <meta name="keywords" content="github, github music, github events, github visualization, listen, recent changes, sound, music, visualization">
    <meta name='summary' content='Events on GitHub, such as pushing commits, creating pull requests, creating issues, etc. are captured and converted to music notes based on the size of the data.'>

    <meta name="og:title" content="GitHub Audio">
    <meta name="og:url" content="https://github.audio">
    <meta name="og:image" content="https://github.audio/static/public/images/electric-guitar.png">
    <meta name="og:description" content="Listen to music generated by events happening across GitHub">

    <meta name="twitter:card" content="summary" />
    <meta name="twitter:site" content="https://github.audio" />
    <meta name="twitter:title" content="GitHub Audio" />
    <meta name="twitter:description" content="Listen to music generated by events happening across GitHub" />
    <meta name="twitter:image" content="https://github.audio/static/public/images/electric-guitar.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <meta http-equiv='Expires' content='0'>
    <meta http-equiv='Pragma' content='no-cache'>
    <meta http-equiv='Cache-Control' content='no-cache'>
    <meta http-equiv='imagetoolbar' content='no'>

    <title>GitHub Audio</title>
    <link rel="mask-icon" href="/static/public/images/electric-guitar.svg" color="orange">
    <link rel="shortcut icon" type="image/png" href="/static/public/images/favicon.png"/>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/odometer.js/0.4.7/themes/odometer-theme-default.min.css" />
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.min.css" />
    <link rel="stylesheet" href="/static/public/css/main.css"/>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/howler/2.0.0/howler.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/odometer.js/0.4.7/odometer.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/4.2.6/d3.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/seedrandom/2.4.2/seedrandom.min.js"></script>
    <script src="/static/public/js/main.js"></script>
  </head>
  <body>
    <div id="fb-root"></div>
    <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.7&appId=718063574909410";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>

    <header>
      <h1 class="header-text">
        GitHub Audio&nbsp;
        <span class="offline-text">offline</span>
      </h1>
      <div class="events-remaining">
        <span class="events-remaining-value odometer"></span>&nbsp;
        <span class="events-remaining-text">events remaining in queue</span>&nbsp;
        <div id="volumeSlider"></div>
      </div>
    </header>

    <div id="area">
      <div class="online-users-div">
        <h2 class="online-users-text"><span class="odometer online-users-count"></span> people listening</h2>
      </div>
    </div>
    <div id="config-area">
      <div id="org-repo-filter-div">
        Enter your organization's or repository's names to filter events&nbsp; <input type="text" id="org-repo-filter-name" placeholder="github google facebook"/>
      </div>
      <div class="site-description">
        <h4>About</h4>
        <br/>
        <p>This website tracks events happening across GitHub and converts them to music notes based on certain parameters.</p><br/>
        <p>
          There are three types of sounds(bell, string pluck and string swell) based on four types of events(PushEvent, PullRequestEvent, IssuesEvent and IssueCommentEvent).
          Bells represent PushEvents, string plucks represent IssuesEvents and IssueCommentEvents whereas string swells represent PullRequestEvents.
        </p>
      </div>
    </div>

    <footer>
      <div class="footer-left-text-block">
        this project is open source, you can view it on <a href="https://github.com/debugger22/github-audio" target="_blank">GitHub</a><br/>
        developed by <a href="https://github.com/debugger22" target="_blank">@debugger22</a><br/><br/>
        ProTip: It's actually kind of nice to leave on the background
      </div>
      <div class="footer-right-text-block">
        inspired by <a href="http://hatnote.com" target="_blank">hatnote</a><br/>
        <div>icons made by <a href="http://www.flaticon.com/authors/freepik" target="_blank" title="Freepik">Freepik</a></div>
      </div>
      <div class="social-buttons">
        <a class="twitter-follow-button" data-show-count="false" data-show-screen-name="false" data-size="small" href="https://twitter.com/GithubAudio">Follow</a><br/>
        <a href="https://twitter.com/share" class="twitter-share-button" data-show-count="false" data-text="Listen to music generated by events happening across GitHub. #github #music">Tweet</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script><br/>
        <div class="fb-share-button" data-href="https://github.audio" data-layout="button" data-size="small" data-mobile-iframe="true"><a class="fb-xfbml-parse-ignore" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fgithub.audio%2F&amp;src=sdkpreparse">Share</a></div>
      </div>
    </footer>

    <script>
      (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-84999786-1', 'auto');
      ga('send', 'pageview');
    </script>
  </body>
</html>