slideshow/index.html at master · sarnobat/slideshow · 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
<html>
<head>
        <title>Slideshow</title>
        <link rel="shortcut icon" href="http://netgear.rohidekar.com/static/icons/skin/ball/ball_009.png" type="image/x-icon" />
        <meta charset="utf-8" />

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
        <script src="http://netgear.rohidekar.com/cream/jsLouvain.js" type="text/JavaScript"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/purl/2.3.1/purl.js"></script>

</head>
<style>

</style>
<body style="background-color : #000000;">

<script>


function resize()
{
    var img    = document.getElementsByTagName('img')[0];
        winDim = getWinDim();


    img.style.height = winDim.y + "px";

    if (img.offsetWidth > winDim.x)
    {
        img.style.height = null;
        img.style.width = winDim.x + "px";
    }
}

function getWinDim()
{
    var body = document.documentElement || document.body;
console.debug("window = " + window.innerWidth + " x " + windown.innerHeight);
    return {
        x: window.innerWidth  || body.clientWidth,
        y: window.innerHeight || body.clientHeight
    }
}


var elem = document.getElementsByTagName("body")[0];

elem.onclick = function() {
	req = elem.requestFullScreen || elem.webkitRequestFullScreen || elem.mozRequestFullScreen;
	req.call(elem);
	$("#theTextArea").hide();
}

d3.text("http://netgear.rohidekar.com:4452/tmp/images.txt?t=" + Math.random(), function(error, nodes) {
		d3.text("http://netgear.rohidekar.com:4452/tmp/images.txt?t=" + Math.random(), function(error, data1) {

			var images = nodes.split('\n');
			var i = 0;

			(function myLoop (i) {
			   setTimeout(function () {
				  console.debug(i);
				  $("#theImage").attr("src", "http://netgear.rohidekar.com:44452" + images[i]);

var imageWidth = document.getElementById('theImage').naturalWidth;
var imageHeight = document.getElementById('theImage').naturalHeight;


var windowWidth = window.innerWidth	;
var windowHeight = window.innerHeight;
				  console.info(imageWidth + 'x' + imageHeight + "("+windowWidth+"x"+windowHeight+")" + ": " + images[i]);
				  //resize();
				var isWideImage = imageWidth / imageHeight > windowWidth / windowHeight;
				var isTallImage = !isWideImage;

				if (isWideImage) {
					$("#theImage").attr("width", windowWidth);
					$("#theImage").removeAttr("height");
				} else {
					$("#theImage").attr("height", windowHeight);
					$("#theImage").removeAttr("width");
				}

				  ++i;
				  if (i < 200) {
					  myLoop(i);
				  } else {
					  myLoop(0);
				  }
			   }, 4000)
			})(0);
		});
});

</script>

<textarea id="theTextArea" cols=200>
find /Unsorted/images/ -maxdepth 1 -type f -not -empty | shuf | head -100 | tee /tmp/images.txt
</textarea>
<center>
	<img id="theImage" >
</center>

</body>


</html>