198 lines
33 KiB
HTML
198 lines
33 KiB
HTML
<!DOCTYPE html lang="en">
|
|
<head>
|
|
<meta name="fragment" content="!">
|
|
<link rel="canonical" href="https://youcount.github.io/" />
|
|
<link rel="amphtml" href="https://youcount.github.io/amp">
|
|
<meta name="theme-color" content="#e52d27" />
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="EXPIRES" content="Thu, 10 Jan 2030 12:00:00 GMT">
|
|
<title>YouCount: YouTube® LIVE Subscriber Count</title>
|
|
<link rel="shortcut icon" href="/favicon.ico"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<meta name="description" content="See the LIVE growth of any YouTube® channel and achieving of milestones through their Realtime Subscriber Count(RSC) and Incredibly Useful Statistics(IUF)."/>
|
|
<meta property="og:title" content="YouCount: YouTube® LIVE Subscriber Count"/>
|
|
<meta property="og:description" content="See the LIVE growth of any YouTube® channel and achieving of milestones through their Realtime Subscriber Count(RSC) and Incredibly Useful Statistics(IUF)." />
|
|
<meta property="og:type" content="article"/>
|
|
<meta property="og:image" content="https://youcount.github.io/images/fblogo.jpg" />
|
|
<meta property="og:site_name" content="YouCount" />
|
|
<meta property="article:author" content="https://www.facebook.com/20manas"/>
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "http://schema.org",
|
|
"@type": "Article",
|
|
"headline": "YouCount: YouTube® LIVE Subscriber Count",
|
|
"datePublished": "2015-10-07T12:02:41Z",
|
|
"publisher": {
|
|
"@type": "Organization",
|
|
"name":"YouCount",
|
|
"logo": {
|
|
"@type": "ImageObject",
|
|
"url": "https://youcount.github.io/images/amplogo.jpg",
|
|
"width": 600,
|
|
"height": 60
|
|
}
|
|
},
|
|
"author":"Manas Khurana",
|
|
"image": {
|
|
"@type": "ImageObject",
|
|
"url": "https://youcount.github.io/images/fblogo.jpg",
|
|
"width": 1203,
|
|
"height": 630
|
|
},
|
|
"description":"See the LIVE growth of any YouTube® channel and achieving of milestones through their Realtime Subscriber Count(RSC) and Incredibly Useful Statistics(IUF)."
|
|
}
|
|
</script>
|
|
<style>
|
|
/* Odometer */
|
|
.odometer.odometer-auto-theme,.odometer.odometer-auto-theme .odometer-digit,.odometer.odometer-theme-minimal,.odometer.odometer-theme-minimal .odometer-digit{display:inline-block;position:relative}.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer,.odometer.odometer-theme-minimal .odometer-digit .odometer-digit-spacer{display:inline-block;visibility:hidden}.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner,.odometer.odometer-theme-minimal .odometer-digit .odometer-digit-inner{text-align:left;display:block;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden}.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon,.odometer.odometer-theme-minimal .odometer-digit .odometer-ribbon{display:block}.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner,.odometer.odometer-theme-minimal .odometer-digit .odometer-ribbon-inner{display:block;-webkit-backface-visibility:hidden}.odometer.odometer-auto-theme .odometer-digit .odometer-value,.odometer.odometer-theme-minimal .odometer-digit .odometer-value{display:block;-webkit-transform:translateZ(0);transform:translateZ(0)}.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value,.odometer.odometer-theme-minimal .odometer-digit .odometer-value.odometer-last-value{position:absolute}.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner,.odometer.odometer-theme-minimal.odometer-animating-up .odometer-ribbon-inner{-webkit-transition:-webkit-transform .5s;transition:transform .5s}.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner,.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner,.odometer.odometer-theme-minimal.odometer-animating-down .odometer-ribbon-inner,.odometer.odometer-theme-minimal.odometer-animating-up.odometer-animating .odometer-ribbon-inner{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner,.odometer.odometer-theme-minimal.odometer-animating-down.odometer-animating .odometer-ribbon-inner{-webkit-transition:-webkit-transform .5s;transition:transform .5s;-webkit-transform:translateY(0);transform:translateY(0)}
|
|
/*Odometer End*/
|
|
#tutorial,.navButtonsCover .navButtons{-webkit-transform:translate(-50%,0);left:50%}#sharebox,#suggest,ul{list-style-type:none}#pageUrl input,body{font-family:Arial,sans-serif;outline:0}#bg1,#pageUrl{background-color:#fff}#bg2,#menu{z-index:1001}#menu,#pageUrl,.card{box-shadow:0 0 20px -4px #000}#bg1 div,#bg2,#dp,#pageUrl,#tutStep2,#tutorial,.share{display:none}#arrowCircle,#dp,#input button,.extrabutton,.share,.suggest{cursor:pointer}#extra,#input button,#suggest,.extrabutton{overflow:hidden}#bg1 h2,#extra,#mainPage,#tutStep1,#username,#vids,.card{text-align:center}body{background-color:#fafafa;margin:0;-webkit-tap-highlight-color:transparent;-webkit-transition:background-color .5s linear;transition:background-color .5s linear}img{color:transparent}#menu{position:fixed;width:100%;height:50px;left:0;top:0;background-color:#e52d27}.navButtonsCover{position:relative;height:100%;width:15vh;min-height:40px;float:right;top:0;cursor:pointer}#username,.navButtonsCover[data-child=logo]{float:left}.navButtonsCover .navButtons{position:relative;top:10%;transform:translate(-50%,0);height:40px;width:40px;background-image:url(/images/menu.png);background-size:auto 100%}#bg2,#pageUrl,#sharebox{position:fixed}#bg1,#mainPage,#pointer,#tutorial{position:absolute}#logo{width:58px;background-position:0 0}#helpButton{background-position:150 0}#code{background-position:308 0}#share{background-position:40px 0}#sharebox{top:60px;right:5px;margin:0;padding:0}.share{height:40px;width:40px;border-radius:50%}#bg1,#bg2,#mainPage{width:100%}#pageUrl,#pageUrl input{text-align:center;width:80%;left:10%;border-radius:4px}#pageUrl{top:20%;z-index:1010;padding:30px;font-size:25px}#pageUrl input{border:none;font-size:30px;padding:10px;background-color:gray;color:#fff;margin:20px}#embedUrl{font-size:20px}#tutorial{z-index:1003;height:300px;width:400px;padding-left:30px;padding-right:30px;background-color:rgba(0,0,0,.7);border-radius:10px;top:700px;transform:translate(-50%,0)}#pointer{bottom:100%;height:50px;left:50%;opacity:.7;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}#tutorial p,.tutStep2{color:#fff}#tutStep1{font-size:50px;font-weight:900}#tutorial h3{font-size:25px}ol li{padding-top:5px;padding-bottom:5px}.ball{-webkit-transform:translate(100%,-100%);transform:translate(100%,-100%);border-radius:50vmax;opacity:0}#bg1{display:block;overflow-y:hidden;-webkit-transition:all .5s linear;transition:all .5s linear;min-height:100%;right:0;top:0;z-index:501}#bg1 div{margin-top:60px;-webkit-transition:all .5s;transition:all .5s;opacity:0}#bg1 h2{font-size:6vw;margin:0;font-family:Impact,Arial,sans-serif}#bg1 ol,#bg1 p{font-size:25px;text-align:left;margin-left:20px;margin-right:20px}#bg1 a{color:#e52d27;font-weight:600}#bg2{left:0;top:0;background-color:rgba(0,0,0,.5);height:100%}#mainPage{left:0;bottom:0;top:60px;margin-left:auto;margin-right:auto}.card{position:relative;width:80%!important;height:auto;top:0!important;margin:2vw auto;padding-top:2vw;font-size:1vw;border-radius:4px!important;background-color:#fff}#dp,#input{height:8vw;position:absolute}#prime{height:30vw}#actualCount{font-size:11vw!important}#pubDate,#totalVideos,#totalViews{font-size:3vw!important;line-height:1;font-weight:400}#dp{left:5%;border-radius:8vw}#input button,#username{border:none;outline:0;color:#fff}#input,#username{border-radius:.5vw}#input{right:5%;width:75%;background-color:#c8c8c8;-webkit-transition:background-color .25s;transition:background-color .25s}#input button{height:100%;background-color:#e52d27;right:0;width:8vw;position:absolute;display:none}#username{font-size:3vw;font-family:Arial,sans-serif;height:100%;width:100%;background-color:transparent;-webkit-transition:width .25s;transition:width .25s}#search{height:60%;left:20%}.bar:after,.bar:before{content:'';height:.5vw;width:0;bottom:0;position:absolute;background:#e52d27;-webkit-transition:.2s ease all;transition:.2s ease all}#extra,#hideextra,.suggest div{position:relative}.bar:before{left:50%}.bar:after{right:50%}input:focus~.bar:after,input:focus~.bar:before{width:50%}#username:focus{background-color:#ffc8c8;width:87%}#username:focus~#inputButton{display:block}#suggest{position:absolute;left:0;top:8vw;z-index:400;width:100%;display:none;box-shadow:0 4px 10px -4px #000;padding:0;margin:0;background-color:#fff}.suggest{color:#000;height:50px;padding-bottom:10px;padding-top:10px}.extrabutton,.suggest:hover{background-color:#e52d27;color:#fff}.suggest div{font-size:2.5vw;margin-left:10px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.suggestImg{float:left;width:50px;height:50px;border-radius:50%;margin-left:10px}#arrowCircle,#extra,#hideextra,.myChart-wrapper{margin-left:auto;margin-right:auto}#topnum{width:100%;top:12vw;position:absolute}#extra{display:none;font-weight:400;top:0;width:4vw}.extraCol{height:15vh}.extraExp{height:180vw}#arrowCircle{background-color:#e52d27;width:4vw;height:4vw;border-radius:5vw;-webkit-transition:transform .5s;-webkit-transition:-webkit-transform .5s;transition:transform .5s}#extraContent{opacity:0;height:100%}#extra table{border-collapse:collapse;font-size:2vw;font-weight:100}#extra td,#extra th{text-align:left;vertical-align:center;border-bottom:1px solid #ddd;padding:10px 2vw}#milestoneBox{font-size:3vw;font-weight:100}.myChart-wrapper{width:80%;height:32vw}#showextra{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:absolute}#hideextra{display:none;bottom:10vh}.extrabutton{border:none;outline:0;height:6vh;width:15vw;border-radius:4px;font-weight:900;z-index:2}#vids{width:5vw;margin:1vw;font-size:3vw;border:0;border-bottom:.5vw solid #e52d27;background-color:rgba(200,200,200,.3)}a{text-decoration:none}@media only screen and (max-width:800px),screen and (orientation:portrait){.navButtonsCover{width:25%}#bg1 h2{font-size:12vw}#pageUrl{width:100%;left:0}.card{width:98%!important;font-size:3vw}.extraCol{height:15vh}.extraExp{height:300vw}#extra table{font-size:5vw}#milestoneBox{font-size:8vw}#actualCount{font-size:15vw!important}#pubDate,#totalVideos,#totalViews{font-size:8vw!important}#prime{height:40vw!important}#username:focus{width:84%}#arrowCircle,#extra{width:10vw}#arrowCircle{height:10vw}#arrow{box-shadow:.75vw .75vw #fff;height:2.625vw;width:2.625vw}#username{font-size:6vw}#dp,#input{height:12vw}#suggest{top:12vw}#input button{width:12vw}#topnum{top:14vw}.extrabutton{height:8vh;width:35vw}.myChart-wrapper{width:95%}#charts{display:none!important}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<section id="menu">
|
|
<div id="buttonBig">
|
|
<div class="navButtonsCover" data-child="logo" onClick="handleNavButtons(1)">
|
|
<div id="logo" class="navButtons" alt="YouCount Logo/Homepage"></div>
|
|
</div>
|
|
<div class="navButtonsCover" data-child="share" onClick="handleNavButtons(4)">
|
|
<div id="share" class="navButtons" alt="Share button"></div>
|
|
</div>
|
|
<div class="navButtonsCover" data-child="code" onClick="handleNavButtons(3)">
|
|
<div id="code" class="navButtons" alt="Get YouCount embed or widget"></div>
|
|
</div>
|
|
<div class="navButtonsCover" data-child="helpButton" onClick="handleNavButtons(2)">
|
|
<div id="helpButton" class="navButtons" alt="Help button"></div>
|
|
</div>
|
|
<ul id="sharebox">
|
|
<li><img id="fb" class="share" alt="Facebook Icon"></li>
|
|
<li><img id="tw" class="share" alt="Twitter Icon"></li>
|
|
<li><img id="lnkdIn" class="share" alt="LinkedIn Icon"></li>
|
|
<li><img id="tb" class="share" alt="Tumblr Icon"></li>
|
|
<li><img id="rdit" class="share" alt="Reddit Icon"></li>
|
|
<li><img id="link" class="share" alt="Link Icon"></li>
|
|
</ul>
|
|
</section>
|
|
<span id="pageUrl">
|
|
Select and copy the URL of this page below and use it to share this page anywhere!
|
|
<br><input type="text" value="" onclick="this.select()" readonly />
|
|
</span>
|
|
|
|
<div id="tutorial">
|
|
<img id="pointer">
|
|
<p id="tutStep1">Click Here</p>
|
|
<div id="tutStep2">
|
|
<h3 class="tutStep2">Search for a YouTube channel</h3>
|
|
<span class="tutStep2">For example, to see Fine Brothers Entertainment's live YouTube subscriber count, type in any one of these:</span>
|
|
<ol class="tutStep2">
|
|
<li><b>TheFineBros</b> (their username)</li>
|
|
<li><b>Fine Brothers Entertainment</b> (their YouTube channel name)</li>
|
|
<li><b></b> (their YouTube channel ID)</li>
|
|
<li><b>fine bros</b> (a search query)</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
<div class="bg ball" id="bg1">
|
|
<div id="helpArt">
|
|
<h2>About YouCount</h2>
|
|
<p>YouCount shows the LIVE growth of any YouTube® channel and achieving of milestones through their Realtime Subscriber Count (RSC) and Incredibly Useful Statistics (IUF).
|
|
Youtube updates the subscriber count after a long time.
|
|
On YouCount, the YouTube subscriber count is updated every second!</p>
|
|
<p>Furthermore, click on the "SHOW STATS" button to see other useful information related to the YouTube channel</p>
|
|
<p>YouCount has been specifically designed using the Material Design language to make it look awesome! It is also optimized for mobile devices and has been made to work even with older browsers.</p>
|
|
<p>To know more or to get in contact:
|
|
<ol>
|
|
<li><a href="//github.com/YouCount/youcount.github.io">Visit the GitHub Project site</a></li>
|
|
<li>Send an Email: <a id="email"></a></li>
|
|
</ol>
|
|
</p>
|
|
<p>Support the website by sharing it with your friends!</p>
|
|
|
|
</div>
|
|
<div id="codeArt">
|
|
<h2>Embed This!</h2>
|
|
<p>
|
|
Copy the code below and paste it where you want to embed this:
|
|
</p>
|
|
<code id="embedUrl"></code>
|
|
<p>
|
|
Adjust its size by changing the "height" and "width" attribute of the iframe.
|
|
The size will automatically adjust to the size of the iframe.
|
|
</p>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bg" id="bg2"></div>
|
|
|
|
<div id="mainPage">
|
|
<section id="prime" class="card">
|
|
<label for="username">
|
|
<img id="dp" alt="Channel Image">
|
|
</label>
|
|
<div id="input">
|
|
<input type="text" id="username" placeholder="Search for a YouTube channel" value="Loading..." onkeypress="trigenter(event)"/>
|
|
<button id="inputButton">
|
|
<img id="search" alt="Search Button to process the query">
|
|
</button>
|
|
<span class="bar"></span>
|
|
<ul id="suggest">
|
|
<li class="suggest" id="suggest1"><img class="suggestImg"><div></div></li>
|
|
<li class="suggest"><img class="suggestImg"><div></div></li>
|
|
<li class="suggest"><img class="suggestImg"><div></div></li>
|
|
<li class="suggest"><img class="suggestImg"><div></div></li>
|
|
<li class="suggest"><img class="suggestImg"><div></div></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div id="topnum">
|
|
<br>
|
|
<span id="actualCount">Loading...</span>
|
|
<br>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="extra" class="card extraCol">
|
|
<button class="extrabutton" id="showextra">SHOW STATS</button>
|
|
<div id="extraContent">
|
|
<div class="myChart-wrapper">
|
|
<canvas width="400" height="200" id="myChart1"></canvas>
|
|
</div>
|
|
<br><br><br>
|
|
<span class="milestones" id="milestoneBox">
|
|
<span id="milestoneLeft">Loading...</span> left from <span id="milestoneTarget">Loading...</span>!
|
|
</span>
|
|
<br><br><br>
|
|
<table style="margin-left: auto; margin-right: auto; text-align: center;">
|
|
<tr>
|
|
<td>Total Views:</td>
|
|
<td><span id="totalViews">Loading...</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Total Videos:</td>
|
|
<td><span id="totalVideos">Loading...</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Since:</td>
|
|
<td><span id="pubDate">Loading...</span></td>
|
|
</tr>
|
|
</table>
|
|
<p style="font-size:3vw;">Last <input aria-label="Input box: Enter number of videos (1-25)" type="text" id="vids" placeholder="1-25" value="5"> videos</p><button class="extrabutton" onclick="upCharts();" id="upCharts">Update</button>
|
|
<div class="myChart-wrapper">
|
|
<canvas width="400" height="200" id="myChart2"></canvas>
|
|
<canvas width="400" height="200" id="myChart3"></canvas>
|
|
<canvas width="400" height="200" id="myChart4"></canvas>
|
|
</div>
|
|
</div>
|
|
<button class="extrabutton" id="hideextra">HIDE STATS</button>
|
|
</section>
|
|
</div>
|
|
<script>
|
|
//Odometer
|
|
(function(){var a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G=[].slice;q='<span class="odometer-value"></span>',n='<span class="odometer-ribbon"><span class="odometer-ribbon-inner">'+q+"</span></span>",d='<span class="odometer-digit"><span class="odometer-digit-spacer">8</span><span class="odometer-digit-inner">'+n+"</span></span>",g='<span class="odometer-formatting-mark"></span>',c="(,ddd).dd",h=/^\(?([^)]*)\)?(?:(.)(d+))?$/,i=30,f=2e3,a=20,j=2,e=.5,k=1e3/i,b=1e3/a,o="transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd",y=document.createElement("div").style,p=null!=y.transition||null!=y.webkitTransition||null!=y.mozTransition||null!=y.oTransition,w=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame,l=window.MutationObserver||window.WebKitMutationObserver||window.MozMutationObserver,s=function(a){var b;return b=document.createElement("div"),b.innerHTML=a,b.children[0]},v=function(a,b){return a.className=a.className.replace(new RegExp("(^| )"+b.split(" ").join("|")+"( |$)","gi")," ")},r=function(a,b){return v(a,b),a.className+=" "+b},z=function(a,b){var c;return null!=document.createEvent?(c=document.createEvent("HTMLEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):void 0},u=function(){var a,b;return null!=(a=null!=(b=window.performance)?"function"==typeof b.now?b.now():void 0:void 0)?a:+new Date},x=function(a,b){return null==b&&(b=0),b?(a*=Math.pow(10,b),a+=.5,a=Math.floor(a),a/=Math.pow(10,b)):Math.round(a)},A=function(a){return 0>a?Math.ceil(a):Math.floor(a)},t=function(a){return a-x(a)},C=!1,(B=function(){var a,b,c,d,e;if(!C&&null!=window.jQuery){for(C=!0,d=["html","text"],e=[],b=0,c=d.length;c>b;b++)a=d[b],e.push(function(a){var b;return b=window.jQuery.fn[a],window.jQuery.fn[a]=function(a){var c;return null==a||null==(null!=(c=this[0])?c.odometer:void 0)?b.apply(this,arguments):this[0].odometer.update(a)}}(a));return e}})(),setTimeout(B,0),m=function(){function a(b){var c,d,e,g,h,i,l,m,n,o,p=this;if(this.options=b,this.el=this.options.el,null!=this.el.odometer)return this.el.odometer;this.el.odometer=this,m=a.options;for(d in m)g=m[d],null==this.options[d]&&(this.options[d]=g);null==(h=this.options).duration&&(h.duration=f),this.MAX_VALUES=this.options.duration/k/j|0,this.resetFormat(),this.value=this.cleanValue(null!=(n=this.options.value)?n:""),this.renderInside(),this.render();try{for(o=["innerHTML","innerText","textContent"],i=0,l=o.length;l>i;i++)e=o[i],null!=this.el[e]&&!function(a){return Object.defineProperty(p.el,a,{get:function(){var b;return"innerHTML"===a?p.inside.outerHTML:null!=(b=p.inside.innerText)?b:p.inside.textContent},set:function(a){return p.update(a)}})}(e)}catch(q){c=q,this.watchForMutations()}}return a.prototype.renderInside=function(){return this.inside=document.createElement("div"),this.inside.className="odometer-inside",this.el.innerHTML="",this.el.appendChild(this.inside)},a.prototype.watchForMutations=function(){var a,b=this;if(null!=l)try{return null==this.observer&&(this.observer=new l(function(){var a;return a=b.el.innerText,b.renderInside(),b.render(b.value),b.update(a)})),this.watchMutations=!0,this.startWatchingMutations()}catch(c){a=c}},a.prototype.startWatchingMutations=function(){return this.watchMutations?this.observer.observe(this.el,{childList:!0}):void 0},a.prototype.stopWatchingMutations=function(){var a;return null!=(a=this.observer)?a.disconnect():void 0},a.prototype.cleanValue=function(a){var b;return"string"==typeof a&&(a=a.replace(null!=(b=this.format.radix)?b:".","<radix>"),a=a.replace(/[.,]/g,""),a=a.replace("<radix>","."),a=parseFloat(a,10)||0),x(a,this.format.precision)},a.prototype.bindTransitionEnd=function(){var a,b,c,d,e,f,g=this;if(!this.transitionEndBound){for(this.transitionEndBound=!0,b=!1,e=o.split(" "),f=[],c=0,d=e.length;d>c;c++)a=e[c],f.push(this.el.addEventListener(a,function(){return b?!0:(b=!0,setTimeout(function(){return g.render(),b=!1,z(g.el,"odometerdone")},0),!0)},!1));return f}},a.prototype.resetFormat=function(){var a,b,d,e,f,g,i,j;if(a=null!=(i=this.options.format)?i:c,a||(a="d"),d=h.exec(a),!d)throw new Error("Odometer: Unparsable digit format");return j=d.slice(1,4),g=j[0],f=j[1],b=j[2],e=(null!=b?b.length:void 0)||0,this.format={repeating:g,radix:f,precision:e}},a.prototype.render=function(a){var b,c,d,e,f,g,h,i,j,k,l,m;for(null==a&&(a=this.value),this.stopWatchingMutations(),this.resetFormat(),this.inside.innerHTML="",g=this.options.theme,b=this.el.className.split(" "),f=[],i=0,k=b.length;k>i;i++)c=b[i],c.length&&((e=/^odometer-theme-(.+)$/.exec(c))?g=e[1]:/^odometer(-|$)/.test(c)||f.push(c));for(f.push("odometer"),p||f.push("odometer-no-transitions"),f.push(g?"odometer-theme-"+g:"odometer-auto-theme"),this.el.className=f.join(" "),this.ribbons={},this.digits=[],h=!this.format.precision||!t(a)||!1,m=a.toString().split("").reverse(),j=0,l=m.length;l>j;j++)d=m[j],"."===d&&(h=!0),this.addDigit(d,h);return this.startWatchingMutations()},a.prototype.update=function(a){var b,c=this;return a=this.cleanValue(a),(b=a-this.value)?(v(this.el,"odometer-animating-up odometer-animating-down odometer-animating"),b>0?r(this.el,"odometer-animating-up"):r(this.el,"odometer-animating-down"),this.stopWatchingMutations(),this.animate(a),this.startWatchingMutations(),setTimeout(function(){return c.el.offsetHeight,r(c.el,"odometer-animating")},0),this.value=a):void 0},a.prototype.renderDigit=function(){return s(d)},a.prototype.insertDigit=function(a,b){return null!=b?this.inside.insertBefore(a,b):this.inside.children.length?this.inside.insertBefore(a,this.inside.children[0]):this.inside.appendChild(a)},a.prototype.addSpacer=function(a,b,c){var d;return d=s(g),d.innerHTML=a,c&&r(d,c),this.insertDigit(d,b)},a.prototype.addDigit=function(a,b){var c,d,e,f;if(null==b&&(b=!0),"-"===a)return this.addSpacer(a,null,"odometer-negation-mark");if("."===a)return this.addSpacer(null!=(f=this.format.radix)?f:".",null,"odometer-radix-mark");if(b)for(e=!1;;){if(!this.format.repeating.length){if(e)throw new Error("Bad odometer format without digits");this.resetFormat(),e=!0}if(c=this.format.repeating[this.format.repeating.length-1],this.format.repeating=this.format.repeating.substring(0,this.format.repeating.length-1),"d"===c)break;this.addSpacer(c)}return d=this.renderDigit(),d.querySelector(".odometer-value").innerHTML=a,this.digits.push(d),this.insertDigit(d)},a.prototype.animate=function(a){return p&&"count"!==this.options.animation?this.animateSlide(a):this.animateCount(a)},a.prototype.animateCount=function(a){var c,d,e,f,g,h=this;if(d=+a-this.value)return f=e=u(),c=this.value,(g=function(){var i,j,k;return u()-f>h.options.duration?(h.value=a,h.render(),void z(h.el,"odometerdone")):(i=u()-e,i>b&&(e=u(),k=i/h.options.duration,j=d*k,c+=j,h.render(Math.round(c))),null!=w?w(g):setTimeout(g,b))})()},a.prototype.getDigitCount=function(){var a,b,c,d,e,f;for(d=1<=arguments.length?G.call(arguments,0):[],a=e=0,f=d.length;f>e;a=++e)c=d[a],d[a]=Math.abs(c);return b=Math.max.apply(Math,d),Math.ceil(Math.log(b+1)/Math.log(10))},a.prototype.getFractionalDigitCount=function(){var a,b,c,d,e,f,g;for(e=1<=arguments.length?G.call(arguments,0):[],b=/^\-?\d*\.(\d*?)0*$/,a=f=0,g=e.length;g>f;a=++f)d=e[a],e[a]=d.toString(),c=b.exec(e[a]),e[a]=null==c?0:c[1].length;return Math.max.apply(Math,e)},a.prototype.resetDigits=function(){return this.digits=[],this.ribbons=[],this.inside.innerHTML="",this.resetFormat()},a.prototype.animateSlide=function(a){var b,c,d,f,g,h,i,j,k,l,m,n,o,p,q,s,t,u,v,w,x,y,z,B,C,D,E;if(s=this.value,j=this.getFractionalDigitCount(s,a),j&&(a*=Math.pow(10,j),s*=Math.pow(10,j)),d=a-s){for(this.bindTransitionEnd(),f=this.getDigitCount(s,a),g=[],b=0,m=v=0;f>=0?f>v:v>f;m=f>=0?++v:--v){if(t=A(s/Math.pow(10,f-m-1)),i=A(a/Math.pow(10,f-m-1)),h=i-t,Math.abs(h)>this.MAX_VALUES){for(l=[],n=h/(this.MAX_VALUES+this.MAX_VALUES*b*e),c=t;h>0&&i>c||0>h&&c>i;)l.push(Math.round(c)),c+=n;l[l.length-1]!==i&&l.push(i),b++}else l=function(){E=[];for(var a=t;i>=t?i>=a:a>=i;i>=t?a++:a--)E.push(a);return E}.apply(this);for(m=w=0,y=l.length;y>w;m=++w)k=l[m],l[m]=Math.abs(k%10);g.push(l)}for(this.resetDigits(),D=g.reverse(),m=x=0,z=D.length;z>x;m=++x)for(l=D[m],this.digits[m]||this.addDigit(" ",m>=j),null==(u=this.ribbons)[m]&&(u[m]=this.digits[m].querySelector(".odometer-ribbon-inner")),this.ribbons[m].innerHTML="",0>d&&(l=l.reverse()),o=C=0,B=l.length;B>C;o=++C)k=l[o],q=document.createElement("div"),q.className="odometer-value",q.innerHTML=k,this.ribbons[m].appendChild(q),o===l.length-1&&r(q,"odometer-last-value"),0===o&&r(q,"odometer-first-value");return 0>t&&this.addDigit("-"),p=this.inside.querySelector(".odometer-radix-mark"),null!=p&&p.parent.removeChild(p),j?this.addSpacer(this.format.radix,this.digits[j-1],"odometer-radix-mark"):void 0}},a}(),m.options=null!=(E=window.odometerOptions)?E:{},setTimeout(function(){var a,b,c,d,e;if(window.odometerOptions){d=window.odometerOptions,e=[];for(a in d)b=d[a],e.push(null!=(c=m.options)[a]?(c=m.options)[a]:c[a]=b);return e}},0),m.init=function(){var a,b,c,d,e,f;if(null!=document.querySelectorAll){for(b=document.querySelectorAll(m.options.selector||".odometer"),f=[],c=0,d=b.length;d>c;c++)a=b[c],f.push(a.odometer=new m({el:a,value:null!=(e=a.innerText)?e:a.textContent}));return f}},null!=(null!=(F=document.documentElement)?F.doScroll:void 0)&&null!=document.createEventObject?(D=document.onreadystatechange,document.onreadystatechange=function(){return"compvare"===document.readyState&&m.options.auto!==!1&&m.init(),null!=D?D.apply(this,arguments):void 0}):document.addEventListener("DOMContentLoaded",function(){return m.options.auto!==!1?m.init():void 0},!1),"function"==typeof define&&define.amd?define(["jquery"],function(){return m}):typeof exports===!1?module.exports=m:window.Odometer=m}).call(this);
|
|
//Odometer End
|
|
function getKey(){return++keyIndex==APIkeys.length&&(keyIndex=0),APIkeys[keyIndex]}function AJX(e,t,n){var a=new XMLHttpRequest;a.onreadystatechange=function(){4==a.readyState&&(200==a.status?t(JSON.parse(a.responseText)):n(a.statusText))},a.open("GET",e),a.send()}function changeText(e,t){"form"in e?e.value=t:e.textContent=t}function getValueFromURL(){if(location.hash.split("#!/")[1])getValue(location.hash.split("#!/")[1]);else try{tutorial()}catch(e){isTutorialOn=1}}function getValue(e){console.log("getValue ran"),e||(e=document.getElementById("username").value),e=e.trim(),internet?e&&"Not Found!"!=e&&"Loading..."!=e&&"Refresh the page"!=e&&(isTutorialOn&&tutorial(3),changeText(document.getElementById("username"),"Loading..."),document.getElementById("username").blur(),rawInput=e,intervalId=setInterval(live,1e3),queryName()):document.getElementById("username").value="Refresh the page"}function noInternet(){internet=0,document.getElementById("actualCount").innerHTML="No Internet";for(var e=["totalViews","totalVideos","pubDate","username"],t=0;t<e.length;t++)changeText(document.getElementById(e[t]),"No Internet");document.getElementById("username").value="Refresh the page",document.getElementById("dp").style.display="none",clearInterval(intervalId)}function queryName(){try{AJX("https://www.googleapis.com/youtube/v3/search?part=snippet&q="+encodeURIComponent(rawInput)+"&type=channel&maxResults=1&key="+getKey(),function(e){if(e.items){if(e.pageInfo.totalResults<1)return document.getElementById("actualCount").style.display="none",document.getElementById("milestoneBox").style.display="none",document.getElementById("dp").style.display="none",document.getElementById("extra").style.display="none",clearInterval(intervalId),void(notFound=1);1==notFound&&(document.getElementById("actualCount").style.display="inline-block",document.getElementById("milestoneBox").style.display="inline",intervalId=setInterval(live,1e3),notFound=0),document.getElementById("dp").style.display="block",document.getElementById("extra").style.display="block",channelname=e.items[0].snippet.title,changeText(document.querySelector("#username"),channelname),username=e.items[0].snippet.channelId.trim(),2===isChart&&(isChart=1),live();var t=e.items[0].snippet.publishedAt.split("T")[0];(t=t.split("-"))[1]=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"][Number(t[1])-1],channeldate=t[2]+"-"+t[1]+"-"+t[0];var n=username.length>=24&&"UC"==username.substr(0,2).toUpperCase()?"id":"forUsername";if(1==popstatevar){var a,s;AJX(o="https://www.googleapis.com/youtube/v3/channels?part=snippet&"+n+"="+username+"&fields=items/snippet&key="+getKey(),function(e){a=e.items[0].snippet.customUrl?e.items[0].snippet.customUrl.trim():channelname.trim().replace(/\s+/g,"+"),AJX("https://www.googleapis.com/youtube/v3/search?part=snippet&q="+encodeURIComponent(a)+"&type=channel&maxResults=1&key="+getKey(),function(e){s=e.pageInfo.totalResults<1||e.items[0].snippet.channelId.trim()!=username?username:a,history.pushState(null,null,"#!/"+s),changeText(document.getElementById("embedUrl"),'<iframe src="https://youcount.github.io/e/#!/'+s+'" height="100" width="250" frameborder="0"></iframe>'),changeText(document.querySelector("#pageUrl input"),"https://youcount.github.io/#!/"+s)})})}else popstatevar=1;if(firstload){var o="https://www.googleapis.com/youtube/v3/channels?part=contentDetails&"+n+"="+username+"&fields=items/contentDetails/relatedPlaylists/uploads&key="+getKey();AJX(o,function(e){AJX("https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&playlistId="+e.items[0].contentDetails.relatedPlaylists.uploads+"&maxResults=50&fields=items/snippet/resourceId/videoId&key="+getKey(),function(e){for(var t=0;e.items[t];t++){var n="https://www.googleapis.com/youtube/v3/videos?part=statistics&id="+e.items[t].snippet.resourceId.videoId+"&fields=items/statistics/viewCount&key="+getKey();pushViews(n,t,"auto")}})})}document.getElementById("dp").src=e.items[0].snippet.thumbnails.default.url}else noInternet()},noInternet)}catch(e){noInternet()}}function live(){var e="https://www.googleapis.com/youtube/v3/channels?part=statistics&"+(username.length>=24&&"UC"==username.substr(0,2).toUpperCase()?"id":"forUsername")+"="+username+"&fields=items/statistics/subscriberCount&key="+getKey();try{AJX(e,function(e){var t=actualCount;if(e.items){actualCount=e.items[0].statistics.subscriberCount;for(var n=0,a=0;a<targets.length;a++)if(actualCount<=targets[a]){n=targets[a];break}var s=n-actualCount;if(document.body.style.backgroundColor=actualCount-t>0?"rgb(240,255,240)":actualCount-t==0?"rgb(250,250,250)":"rgb(255,240,240)",1===isChart&&(myLineChart1Data={labels:[""],datasets:[{label:"Realtime Trend (30s)",fill:!1,borderColor:"rgba(255,50,50,0.5)",pointRadius:0,data:[actualCount]}]},myLineChart1=new Chart(document.getElementById("myChart1").getContext("2d"),{type:"line",data:myLineChart1Data,gridLines:{display:!1},responsive:!0,maintainAspectRatio:!1}),isChart=2,seconds=0),++seconds,prevCounts[seconds%5]=actualCount,isLive){if(changeText(document.getElementById("actualCount"),actualCount),changeText(document.getElementById("milestoneLeft"),s),changeText(document.getElementById("milestoneTarget"),n.toLocaleString("en-US")),s<1&&s>-1&&(document.getElementById("milestoneBox").innerHTML="Congratulations!"),2===isChart&&seconds%5==0){for(a=0;a<5;a++)myLineChart1.data.labels.push("");for(a=0;a<5;a++)myLineChart1.data.datasets[0].data.push(prevCounts[a]);if(seconds>30)for(a=0;a<5;a++)myLineChart1.data.labels.shift(),myLineChart1.data.datasets[0].data.shift();myLineChart1.update()}}else new Odometer({el:document.getElementById("actualCount"),value:actualCount,format:"(,ddd)",theme:"minimal"}),new Odometer({el:document.getElementById("milestoneLeft"),value:s,format:"(,ddd)",theme:"minimal"}),isLive=1}else noInternet()},noInternet)}catch(e){noInternet()}}function getScript(e,t,n,a){var s=document.createElement("script"),o=document.getElementsByTagName("script")[0];if(s.async=1,o.parentNode.insertBefore(s,o),s.onload=s.onreadystatechange=function(e,n){(n||!s.readyState||/loaded|compvare/.test(s.readyState))&&(s.onload=s.onreadystatechange=null,s=void 0,n||t&&t())},s.src=e,n&&a)for(var i=0;i<n.length;i++)n[i]&&(s[n[i]]=a[i])}var APIkeys=["AIzaSyBAb4nM48dVlty7LPHm_qrcWrhlQ1P205U"],username="",rawInput=username,channelname,channeldate="",popstatevar=1,keyIndex=Math.round(Math.random()*(APIkeys.length-1)),isLoaded=0,seconds=0,actualCount,targets=[10,25,50,100,500,1e3,2500,5e3,1e4,25e3,5e4,1e5,25e4,5e5,1e6,2e6,3e6,4e6,5e6,6e6,7e6,1e7,15e6,2e7,25e6,3e7,4e7,5e7,7e7,1e8,15e7,2e8,3e8],myLineChart1,internet=1;window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=function(e,t){t=t||window;for(var n=0;n<this.length;n++)e.call(t,this[n],n,this)});var isTutorialOn=0,isChart=0,notFound=0,firstload=0,isLive=0,myLineChart1Data,prevCounts=[[0],[0],[0],[0],[0]];getValueFromURL(),window.onpopstate=function(){popstatevar=0,getValueFromURL(),changeText(document.querySelector("#username"),"Loading..."),queryName()},window.onload=function(){getScript("js/script.js")};
|
|
</script>
|
|
</body>
|
|
</html>
|