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
|
var settings;
var thumbLinks;
var firstThumbLink;
var highlight;
var loader;
var imgViewer;
$(document).ready(function() {
var token = $("meta[name='_csrf']").attr("content");
var header = $("meta[name='_csrf_header']").attr(
"content");
$(document).ajaxSend(function(e, xhr, options) {
xhr.setRequestHeader(header, token);
});
console.log('ca passe');
$.ajax({
type : "GET",
url : contextPath + "/secure/getImages.htm",
contentType : "application/json",
dataType : "json",
success : function(data) {
$("#thumbs").empty();
$.each(data.records,function(i, item) {
var a = $("<a> </a>").attr("href",contextPath + data.records[i].value);
a.append($("<img> </img>").attr( { src: contextPath + data.records[i].value, height: 100, width: 100 }));
var li = $("<li> </li>");
li.append(a);
$("#thumbs").append(li);
});
// LE CODE EST A LA SUITE DE LA CONSTRUCTION DES ELEMENTS
var settings = {
thumbListId : "thumbs",
imgViewerId : "viewer",
activeClass : "active",
activeTitle : "Photo en cours de visualisation",
loaderTitle : "Chargement en cours",
loaderImage : "../images/loader.gif"
};
var thumbLinks = $("#" + settings.thumbListId)
.find("a"), firstThumbLink = thumbLinks.eq(0), highlight = function(
elt) {
thumbLinks.removeClass(settings.activeClass)
.removeAttr("title");
elt.addClass(settings.activeClass).attr("title",
settings.activeTitle);
}, loader = $(document.createElement("img")).attr({
alt : settings.loaderTitle,
title : settings.loaderTitle,
src : settings.loaderImage
});
console.log('thumbLinks 1');
console.log(thumbLinks);
highlight(firstThumbLink);
$("#" + settings.thumbListId).after(
$(document.createElement("p")).attr("id",
settings.imgViewerId).append(
$(document.createElement("img")).attr({
alt : "",
src : firstThumbLink.attr("href")
})));
var imgViewer = $("#" + settings.imgViewerId), bigPic = imgViewer
.children("img");
console.log('thumbLinks 3');
console.log(thumbLinks);
thumbLinks.click(function(e) {
e.preventDefault();
console.log('ca passe click');
var $this = $(this), target = $this.attr("href");
if (bigPic.attr("src") == target)
return;
highlight($this);
imgViewer.html(loader);
bigPic.load(function() {
imgViewer.html($(this).fadeIn(250));
}).attr("src", target);
});
}
});
}); |
