alcatel/static/libraries/nco/tapestry.js
author Nicolas Sauret <nicolas.sauret@iri.centrepompidou.fr>
Fri, 18 Apr 2014 14:31:58 +0200
changeset 51 79833eaa394a
parent 27 8ca7f2cea729
permissions -rw-r--r--
set up second level for navigation
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
27
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     1
function glow() {
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     2
	document.getElementById('')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     3
}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     4
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     5
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     6
function Tapestry(json,parametres){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     7
	this.parametres = {
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     8
			name: null,
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
     9
			hauteur: 400,
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    10
			largeur: 900,	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    11
			timelineHaute : "#timelinehaute",
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    12
			relations: null,
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    13
			contenu: function(cellule, element) {
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    14
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    15
				var html;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    16
				var img = new Image();
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    17
				img.src= element.name;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    18
				indexx = element.indexx;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    19
				var wi, hi, wc, hc;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    20
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    21
				wi = img.width;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    22
				hi = img.height;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    23
				wc = cellule.offsetWidth  ;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    24
				hc = cellule.offsetHeight ;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    25
			//	r = Math.min(hi/hc, wi/wc);
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    26
			//	w = wi/r;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    27
			//	h = hi/r;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    28
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    29
				var posx, posy;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    30
				posx = (wi-wc)/2;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    31
				posy = (hi-hc)/2;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    32
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    33
				html = "<img class = 'img' src = \"" + img.src + "\" style=\" width:"+ wc + "px; height:" +hc + "px; margin-top: 0px; margin-left: 0px;\" />";
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    34
				html += "<p class = 'title' style = \" width:" + wc + "px;\"> Image "+String(indexx)+"</p>";
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    35
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    36
				return html;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    37
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    38
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    39
			}};
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    40
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    41
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    42
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    43
	var object = this;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    44
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    45
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    46
	//----------------------------------------------------------------------
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    47
	// FENETRE DE FOND
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    48
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    49
	object.tapestryHtml = d3.select("#timelinehaute")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    50
	.style('position', 'relative')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    51
	.style('width', object.parametres.largeur + 'px')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    52
	.style('height', object.parametres.hauteur + 'px')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    53
	.style('background-color', 'black');	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    54
	//.style('overflow','hidden');
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    55
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    56
	object.boutonzoom = d3.select("#timelinebasse").append('div')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    57
	.style('position', 'relative')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    58
	.style('width', '200px')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    59
	.style('height','20px')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    60
	.style('background-color', 'grey')	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    61
	.style('margin-top', '5px')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    62
	.html("<p class = 'title' style = \" width:200px;\"> Dezoooooom </p>")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    63
	.on('mouseover', function(){d3.select(this).style('opacity', 0.8);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    64
	.on('mouseout', function(){d3.select(this).style('opacity', 1);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    65
	.on('click',function(){object.agencerzoom;})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    66
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    67
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    68
	//----------------------------------------------------------------------
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    69
	// CREATION DES PETITES FENETRES
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    70
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    71
	var listeposition = this.getPosition();
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    72
	var larg,haut;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    73
	larg = String(this.parametres.largeur/5) + "px";
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    74
	larg2=String(this.parametres.largeur/10) + "px";
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    75
	haut = String(this.parametres.hauteur/2 -1) + "px" ;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    76
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    77
	d3.select("#timelinehaute").selectAll("div")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    78
		.data(donnees).enter().append("div")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    79
			.attr('class', 'cell')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    80
			.attr('id', function(index){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    81
				if(index==0){return "first";}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    82
				else if (index==10){return "last";}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    83
			})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    84
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    85
			.on('mouseover', function(){d3.select(this).style('opacity', 0.8);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    86
			.on('mouseout', function(){d3.select(this).style('opacity', 1);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    87
			.on('click',function(datum,index){object.agencerzoom(datum,index);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    88
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    89
			.style('position', 'absolute')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    90
			.style('width', function(datum,index){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    91
				if(index==0 || index==10){return larg2;}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    92
				else{return larg;}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    93
			})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    94
			.style('height',haut)
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    95
			.style('background-color', '#32675F')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    96
			.style('text-align','center')
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    97
			.html(function(datum,index){return object.parametres.contenu(this,datum);})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    98
			.style('left', function(datum, index) {
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
    99
				return listeposition[index][0];
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   100
			})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   101
			.style('top', function(datum, index) {
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   102
				return listeposition[index][1];
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   103
			})
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   104
	//		.attr('onmouseover',"this.style(\"stroke\",\"white\");" )
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   105
			;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   106
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   107
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   108
	
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   109
};
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   110
// Position des fenetres 
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   111
Tapestry.prototype = {		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   112
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   113
		getPosition: function(){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   114
			var l,h;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   115
			l= this.parametres.largeur;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   116
			h= this.parametres.hauteur;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   117
			var listposition=[[0,0]];
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   118
			for (var i=0;i<9;i++){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   119
				listposition.push([(i*0.5)*l/5,h/2*((i+1)%2)]);
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   120
			}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   121
			listposition.push([4.5*l/5,0]);
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   122
			//for (var j=0;j<5;j++){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   123
			//	listposition.push([j*l/5,h/2]);
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   124
			//}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   125
			return listposition;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   126
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   127
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   128
		},
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   129
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   130
		agencerzoom: function(element,indexx){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   131
			var object = this;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   132
			this.tapestryHtml.selectAll("div")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   133
				.data(donnees[indexx].childs)
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   134
					.html(function(datum,index){return object.parametres.contenu(this,datum);});
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   135
			this.tapestryHtml.select("first")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   136
				.data(donnees[indexx-1])
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   137
					.html(function(datum,index){return object.parametres.contenu(this,datum);});
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   138
		},
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   139
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   140
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   141
		agencerdezoom: function(){
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   142
			var object = this;
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   143
			this.tapestryHtml.selectAll("div")
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   144
			.data(donnees)
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   145
				.html(function(datum,index){return object.parametres.contenu(this,datum);});
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   146
			
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   147
		}
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   148
				
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   149
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   150
		
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   151
};
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   152
8ca7f2cea729 add alcatel folder
cobled@FRVILN0H401086.emea.lucent.com
parents:
diff changeset
   153