yubi/bookmarklet.html at master · kylebarrow/yubi · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html lang="en">
<head>
<title>Yubi Bookmarklet</title>
<meta charset="utf-8">
<style>

body {
	font-family: "Helvetica", "Helvetica Neue", "Roboto", sans-serif
}

</style>
</head>
<body>
<p>Drag the Yubi bookmarklet to your bookmarks:</p>
<a href="javascript:(function(){'use strict';function x(r,i){var s,o=[],u=r+i*2,a=u/2,f=[a,r/2];s=v[e](S,'svg');s[t]('width',u+2);s[t]('height',u+2);s[t]('pointer-events','none');for(m=0;m<2;m+=1){o[m]=v[e](S,'circle');o[m][t]('cx',a+1);o[m][t]('cy',a+1);o[m][t]('r',f[m]);o[m][t]('stroke','white');o[m][t]('stroke-width',1);o[m][t]('stroke-opacity',.3*(m+1));o[m][t]('fill-opacity',.2*(m+1));o[m][t]('fill','red');s[n](o[m])}return s}function T(e){g[r].top=e.pageY-y+'px';g[r].left=e.pageX-y+'px'}function N(e){g=e;y=Math.round(g.getBoundingClientRect().width/2);v.body[n](g);b[s][i](b);g[r].position='absolute';d[o](u,T,a);d[o]('mousemove',T,a);d[o]('touchstart',T,a)}function C(){var e=document.getElementsByTagName('meta');for(m=0;m<e[f];m+=1)if(e[m].getAttribute('name')==='viewport')return!0;return a}function k(){var e=v[l](c),i=v[l](c),s=v[l](c),f=v[l](c),d=v[l](c),m=x(52,13),g=x(45,6),y=C(),E=y?'':'<div style=\'font-size:12px; padding-top: 10px\'><span style=\'color:#F00\'>WARNING:</span> This page has no viewport meta tag, touch size may be inaccurate in browsers that rely on this to set viewport scale</div>',S=y?240:300;b=v[l](c);b[t](r,'z-index: 10000; padding: 0; margin: 0; background-color: rgba(255, 255, 255, 0.9); color: #000;position: fixed; top: 0; bottom: 0; left: 0; right: 0; font-family:\'Helvetica\', \'Helvetica Neue\', \'Roboto\', sans-serif; font-size: 12px; line-height: 1.5em; font-weight: 200; text-align: center');b.className=w;g[t](h,w);m[t](h,w);e[t](r,'width: 280px; height: '+S+'px; border-radius: 10px; background-color: #fff; position: fixed; top: 50%; left: 50%; margin-top: -'+S/2+'px; margin-left: -140px');m[r].zIndex=1e4;g[r].zIndex=1e4;i[t](r,'float: left; width: 115px; cursor: pointer; margin-left: 20px');i[n](m);s[t](r,'float: right; width: 115px; cursor: pointer; margin-right: 20px; padding-top: 11px');s[n](g);f[p]='<div style=\'font-size: 16px; padding: 10px 0 10px 0\'>Thumb</div><div>8mm target</div><div>2mm boundary</div>';i[n](f);d[p]='<div style=\'font-size: 16px; padding:  20px 0 10px 0\'>Finger</div><div>7mm target</div><div>1mm boundary</div>';s[n](d);e[p]='<div style=\'padding:  20px 10px 20px 10px; font-size: 20px;\'>Choose touch size'+E+'</div>';e[n](i);e[n](s);b[n](e);v.body[n](b);s[o](u,function(){N(g)},a);i[o](u,function(){N(m)},a)}var e='createElementNS',t='setAttribute',n='appendChild',r='style',i='removeChild',s='parentNode',o='addEventListener',u='click',a=!1,f='length',l='createElement',c='div',h='class',p='innerHTML',d=window,v=document,m,g,y,b,w='_yubi-'+ +(new Date),E=v.querySelectorAll('[class|=_yubi]'),S='http://www.w3.org/2000/svg';if(E[f]>0)for(m=E[f]-1;m>=0;m-=1)E[m][s][i](E[m]);else k()})();">Yubi</a>
</body>
</html>