summaryrefslogtreecommitdiff
path: root/share/frontend/imgrid/greatgrids/copy.html
diff options
context:
space:
mode:
Diffstat (limited to 'share/frontend/imgrid/greatgrids/copy.html')
-rwxr-xr-xshare/frontend/imgrid/greatgrids/copy.html327
1 files changed, 0 insertions, 327 deletions
diff --git a/share/frontend/imgrid/greatgrids/copy.html b/share/frontend/imgrid/greatgrids/copy.html
deleted file mode 100755
index 9607758..0000000
--- a/share/frontend/imgrid/greatgrids/copy.html
+++ /dev/null
@@ -1,327 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
-<title>the difference - interactive DHTML</title>
-<meta http-equiv="imagetoolbar" content="no">
-<link href='http://fonts.googleapis.com/css?family=Tienne:400,700' rel='stylesheet' type='text/css'>
-<style type="text/css">
- html {
- overflow: hidden;
- }
- body {
- margin: 0px;
- padding: 0px;
- background: aqua;
- position: absolute;
- width: 100%;
- height: 100%;
- }
- #screen {
- position:absolute;
- left: 00%;
- top: 0%;
- width: 100%;
- height: 100%;
- background: aqua;
- overflow: hidden;
- }
- #screen img {
- position: absolute;
- cursor: pointer;
- left: -4000px;
- filter: fliph flipv;
- -ms-interpolation-mode:nearest-neighbor;
- }
- #screen canvas {
- position: absolute;
- cursor: pointer;
- width: 0px;
- border-style:outset;
- border-width:8px;
- border-color:black;
- }
- #b1
- {
- position:absolute;
- width:100%;
- height:10%;
- background-color:red;
- background-image:url(http://ghghgh.us/timb/pepper3.gif);
- }
- #b2
- {
- position:absolute;
- top:100px;
- width:100%;
- font-family: 'Tienne', serif;
- color:#8B8B7A;
- text-shadow: 0px -15px 0 bisque;
- text-shadow: 20px 30px 11px #CDC5BF;
- font-size:40px;
- padding-top:20px;
- padding-bottom:20px;
- text-align:center;
- height:100px;
- background-color:whitesmoke;
- bottom:0px;
- }
- #b3
- {
- position:fixed:
- top:1000px;
- height:1000px;
- width:100%;
- text-align:center;
- font-style:georgia;
- font-size:20px;
- color:black;
- text-transform:uppercase;
- background-color:azure;
- background-image:url(http://ghghgh.us/timb/pepper2.gif);
- }
- img
- {
- background-color:whitesmoke;
- }
- a {text-decoration: none;color:#333;}
- a:hover {text-decoration: none;background:#ff8000;color:#fff;}
- a:visited {text-decoration: none;color:#333;}
- a:visited:hover {text-decoration: none;background:#ff8000;color:#fff;}
-</style>
-<!--special thanks to Gerard Ferrandez at http://www.dhteumeuleu.com for his image rolodex script-->
-
-<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
-<script type="text/javascript">
-var car = {
- scr : 0,
- img : 0,
- xm : 0,
- ym : 0,
- xmb : 0,
- ymb : 0,
- drag : false,
- cosY : 0,
- cosX : 0,
- sinY : 0,
- sinX : 0,
- xd : 0,
- yd : -10,
-// arr : [],
- run : function () {
- /* ==== rotation speed ==== */
- var Ay = car.xd / (car.scr.offsetWidth * .2);
- var Ax = car.yd / (car.scr.offsetHeight * .2);
- /* ==== vertical / horizontal friction ==== */
- if(!car.drag){
- if(Math.abs(car.xd) > Math.abs(car.yd)){
- car.xd *= .99;
- car.yd *= .95;
- } else {
- car.xd *= .95;
- car.yd *= .99;
- }
- }
- /* ==== rotation angles ==== */
- car.cosY = Math.cos(Ay);
- car.cosX = Math.cos(Ax);
- car.sinY = Math.sin(Ay);
- car.sinX = Math.sin(Ax);
- /* ==== animate images ==== */
- for(var i = 0; i < 8; i++)
- {
- car.img[i].rotate()
- };
- /* ==== loop ==== */
- setTimeout(car.run, 16);
- },
-
- /* ==== mouse mov ==== */
- mouse : function (e) {
- this.xm = e.clientX;
- this.ym = -e.clientY;
- if(this.drag){
- var homeboy = this.img
- this.xd = this.xm - this.xmb;
- this.yd = this.ym - this.ymb;
- }
- this.xmb = this.xm;
- this.ymb = this.ym;
- },
-
- /* ==== dim screen ==== */
- resize : function () {
- car.nw = car.scr.offsetWidth;
- car.nh = car.scr.offsetHeight;
- },
-
- /* ==== init script ==== */
- init : function () {
- /* ==== window mousemove event ==== */
- document.onmousemove = function (e) {
- if (window.event) e = window.event;
- car.mouse(e);
- // $('#error').append('x');
- }
- /* ==== window onresize event ==== */
- onresize = car.resize;
- /* ==== init images ==== */
- this.scr = document.getElementById('screen');
- var img = this.scr.getElementsByClassName('images');
- this.img = [];
- car.resize();
- var k = 0;
-
- for(var xi = -1; xi <= 1; xi+=2) {
- for(var yi = -1; yi <= 1; yi+=2) {
- for(var zi = -1; zi <= 1; zi+=2) {
- var o = img[k++]
- /* ==== replace images by canvas ==== */
- if (document.createElement("canvas").getContext) {
- var src = o;
- o = document.createElement("canvas");
- if (k<=8){
- o.id = img[k-1].getAttribute('src')}
- o.canvas = true;
- /* ==== flip function ==== */
- o.flip = function (fx, fy) {
- var context = this.getContext("2d");
- context.translate(fx<0?this.w:0, fy<0?this.h:0);
- context.scale(fx, fy);
- context.drawImage(this.img, 0, 0, this.w, this.h);
- }
- o.img = src;
- this.scr.appendChild(o);
- }
- /* ==== HTML Objects ==== */
- this.img.push(o);
- o.css = o.style;
- o.x3d = xi;
- o.y3d = yi;
- o.z3d = zi;
- o.py = 0;
- o.px = 0;
- o.onselectstart = function () { return false; }
- o.ondrag = function () { return false; }
- o.onmousedown = function () {
- car.drag = true;
- car.xd = 0;
- car.yd = 0;
- this.css.cursor = "move";
- // if(reference)
- // {
- // $('#'+reference.toString()).css('border-color','purple');
- // }
- $('canvas').css('border-color','black')
- document.getElementById('error').innerHTML = this.getAttribute('id').toString()
- $(this).css('border-color','red');
- //reference = this.getAttribute('id').toString();
- //$('#error').append(reference);
- // car.arr.push(reference)
- // var thelast = car.arr[car.arr.length-2]
- if (thelast)
- {
- $('#error').append('#'+thelast)
- }
- // $('#'+thelast).css('border-color','purple')
- $('#error').click(function(){$('#error').html("<img src='"+reference.toString()+"'></img>")});
-// $('#error').click(function(){$('#b2').append("<img src='"+reference+"'></img>")});
- return false;
-
- }
- o.onmouseout = function () {car.drag = false; this.css.cursor = "pointer"; return false; }
- o.onmouseup = function () {car.drag = false; this.css.cursor = "pointer"; return false; }
- o.rotate = function () {
- /* ==== trigo ==== */
- var tz = this.z3d * car.cosY - this.x3d * car.sinY;
- this.x3d = this.z3d * car.sinY + this.x3d * car.cosY;
- this.z3d = this.y3d * car.sinX + tz * car.cosX;
- this.y3d = this.y3d * car.cosX - tz * car.sinX;
- var zf = 1 / (this.z3d / 10 + 1);
- var x2d = this.x3d * zf * car.nw * .2;
- var y2d = this.y3d * zf * car.nh * .2;
- var w2d = Math.abs(x2d * 1.6);
- var h2d = Math.abs(y2d * 1.6);
- if (this.loaded) {
- /* ==== HTML animation ==== */
- this.css.left = Math.round(car.nw * .5 - x2d - w2d * .5) + 'px';
- this.css.top = Math.round(car.nh * .5 - y2d - h2d * .5) + 'px';
- this.css.width = Math.round(w2d) + 'px';
- this.css.height = Math.round(h2d) + 'px';
- this.css.zIndex = Math.round(zf * 100);
- /* $('body').click(function()
- {
- // $(this).attr('img');
- bill = 'howdy'
- $('#error').html(bill);
- });*/
- // $('#error').append(this.img);
- /* ==== flipv ==== */
- if ((y2d < 0) != this.py) {
- this.py = (y2d < 0);
- if (this.canvas)
- this.flip(1, -1);
- else if (this.filters)
- this.filters[1].enabled = (y2d < 0) ? "true" : "false";
- }
- /* ==== fliph ==== */
- if ((x2d < 0) != this.px) {
- this.px = (x2d < 0);
- if (this.canvas)
- this.flip(-1, 1);
- else if (this.filters)
- this.filters[0].enabled = (x2d < 0) ? "true" : "false";
- }
- } else {
- /* ==== load image ==== */
- if ((this.canvas && this.img.complete) || this.complete) {
- this.loaded = true;
- if (this.canvas) {
- this.w = this.img.width;
- this.h = this.img.height;
- this.width = this.w;
- this.height = this.h;
- var context = this.getContext("2d");
- context.drawImage(this.img, 0, 0, this.w, this.h);
- }
- }
- }
- }
- }
- }
- }
- this.run();
- }
-}
-</script>
-</head>
-
-<body>
-
-<div id="screen">
- <div id="b1"></div>
- <div id="b2">WELCOME TO THE PHOTOBLASTER GREAT GRIDS GALLERY...THESE ARE RECENT GRIDS CREATED BY PEOPLE USING HTTP://ASDF.US/IMGRID</div>
- <div id="b3">
- <br>
- </div>
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg1.png">
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg2.png">
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg3.png">
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg4.png">
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg5.png">
- <img class='images' alt="by Jeremy Matthew Daly" src="images/gg6.png">
- <img class='images' alt="by Pepper" src="images/gg7.png">
- <img class='images' alt="" src="images/gg6.png">
-</div>
-<div id='error' style='border-style:solid; border-width:10px; border-color:green; background-color:red; height:100px;width100px;position:fixed;left:100px; top:20px;'>hello</div>
-<script type="text/javascript">
- /* ==== start ==== */
- setTimeout(function() {
- car.init();
- }, 1000);
-</script>
-
-<script type='text/javascript'>
-</script>
-</body>
-</html>
-