- Author:
- David Higgins
- Twitter:
- @
- GitHub:
- Facebook:
- Google+:
- +
- Reddit:
- /r/
- Pouet:
- Website:
- davidhiggins.me
- Compo:
- classic
- Demo link:
- https://js1k.com/2013-spring/demo/1337
- Shortlink:
- https://js1k.com/1337
- Blog post:
- please update here!
- Bytes:
- 1015
- Chars:
- 1015
- Submission
document.write('<style>progress{-moz-orient:vertical;height:100px!important}</style>');+function(){P=function(b){this._=function(a,b){this.e.style.width=a+"px";this.e.style.height=b+"px";this.width=a;this.height=b};this.p=function(a,b,c){var d=c?0:this.height/2;this.e.style.left=a-(c?0:this.width/2)+"px";this.e.style.top=b-d+"px";this.x=a;this.y=b};this.r=function(a){this.e.style.webkitTransform=this.e.style.MozTransform=this.e.style.transform="rotate("+a+")";this.e.value=13*Math.round((Math.round(parseInt(a))+360)/100)};this.content=function(a){this.e.innerHTML=a};this.e=document.createElement("progress");this.e.style.position="absolute";this.e.max=100;b.appendChild(this.e)};e=b;Ps=18;q=2*Math.PI/Ps;$=-Math.PI;m=y=x=ta=0;pc=[];for(c=0;c<Ps;c++){d=new P(e);d.content(" ".substr(c,1));d._(40,40);pc.push(d)}setInterval(function(){m=80*Math.sin($);for(var b=0;b<Ps;b++)x=m*Math.cos($)+200,y=m*Math.sin($)+200,ta=180*Math.atan2(y-200,x-200)/Math.PI+90+"deg",pc[b].r(ta),pc[b].p(x,y),$+=q;$+=0.06},1E3/30)}();
- Description
- Misuse of the HTML5 <progress> element.
- Base64 encoded
ZG9jdW1lbnQud3JpdGUoJzxzdHlsZT5wcm9ncmVzc3stbW96LW9yaWVudDp2ZXJ0aWNhbDtoZWlnaHQ6MTAwcHghaW1wb3J0YW50fTwvc3R5bGU+Jyk7K2Z1bmN0aW9uKCl7UD1mdW5jdGlvbihiKXt0aGlzLl89ZnVuY3Rpb24oYSxiKXt0aGlzLmUuc3R5bGUud2lkdGg9YSsicHgiO3RoaXMuZS5zdHlsZS5oZWlnaHQ9YisicHgiO3RoaXMud2lkdGg9YTt0aGlzLmhlaWdodD1ifTt0aGlzLnA9ZnVuY3Rpb24oYSxiLGMpe3ZhciBkPWM/MDp0aGlzLmhlaWdodC8yO3RoaXMuZS5zdHlsZS5sZWZ0PWEtKGM/MDp0aGlzLndpZHRoLzIpKyJweCI7dGhpcy5lLnN0eWxlLnRvcD1iLWQrInB4Ijt0aGlzLng9YTt0aGlzLnk9Yn07dGhpcy5yPWZ1bmN0aW9uKGEpe3RoaXMuZS5zdHlsZS53ZWJraXRUcmFuc2Zvcm09dGhpcy5lLnN0eWxlLk1velRyYW5zZm9ybT10aGlzLmUuc3R5bGUudHJhbnNmb3JtPSJyb3RhdGUoIithKyIpIjt0aGlzLmUudmFsdWU9MTMqTWF0aC5yb3VuZCgoTWF0aC5yb3VuZChwYXJzZUludChhKSkrMzYwKS8xMDApfTt0aGlzLmNvbnRlbnQ9ZnVuY3Rpb24oYSl7dGhpcy5lLmlubmVySFRNTD1hfTt0aGlzLmU9ZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgicHJvZ3Jlc3MiKTt0aGlzLmUuc3R5bGUucG9zaXRpb249ImFic29sdXRlIjt0aGlzLmUubWF4PTEwMDtiLmFwcGVuZENoaWxkKHRoaXMuZSl9O2U9YjtQcz0xODtxPTIqTWF0aC5QSS9QczskPS1NYXRoLlBJO209eT14PXRhPTA7cGM9W107Zm9yKGM9MDtjPFBzO2MrKyl7ZD1uZXcgUChlKTtkLmNvbnRlbnQoIiAiLnN1YnN0cihjLDEpKTtkLl8oNDAsNDApO3BjLnB1c2goZCl9c2V0SW50ZXJ2YWwoZnVuY3Rpb24oKXttPTgwKk1hdGguc2luKCQpO2Zvcih2YXIgYj0wO2I8UHM7YisrKXg9bSpNYXRoLmNvcygkKSsyMDAseT1tKk1hdGguc2luKCQpKzIwMCx0YT0xODAqTWF0aC5hdGFuMih5LTIwMCx4LTIwMCkvTWF0aC5QSSs5MCsiZGVnIixwY1tiXS5yKHRhKSxwY1tiXS5wKHgseSksJCs9cTskKz0wLjA2fSwxRTMvMzApfSgpOw==
- Original source
document.write('<style>progress{-moz-orient:vertical;height:100px!important}</style>'); + function () {
P = function (b) {
this._ = function (a, b) {
this.e.style.width = a + "px";
this.e.style.height = b + "px";
this.width = a;
this.height = b
};
this.p = function (a, b, c) {
var d = c ? 0 : this.height / 2;
this.e.style.left = a - (c ? 0 : this.width / 2) + "px";
this.e.style.top = b - d + "px";
this.x = a;
this.y = b
};
this.r = function (a) {
this.e.style.webkitTransform = this.e.style.MozTransform = this.e.style.transform = "rotate(" + a + ")";
this.e.value = 13 * Math.round((Math.round(parseInt(a)) + 360) / 100)
};
this.content = function (a) {
this.e.innerHTML = a
};
this.e = document.createElement("progress");
this.e.style.position = "absolute";
this.e.max = 100;
b.appendChild(this.e)
};
e = b;
Ps = 18;
q = 2 * Math.PI / Ps;
$ = -Math.PI;
m = y = x = ta = 0;
pc = [];
for (c = 0; c < Ps; c++) {
d = new P(e);
d.content(" ".substr(c, 1));
d._(40, 40);
pc.push(d)
}
setInterval(function () {
m = 80 * Math.sin($);
for (var b = 0; b < Ps; b++) x = m * Math.cos($) + 200, y = m * Math.sin($) + 200, ta = 180 * Math.atan2(y - 200, x - 200) / Math.PI + 90 + "deg", pc[b].r(ta), pc[b].p(x, y), $ += q;
$ += 0.06
}, 1E3 / 30)
}();