--- a/web/rsln/res/metadataplayer/test/raphael_timeline.html Fri Apr 22 12:31:41 2011 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,265 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-<title>Example raphael</title>
-<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-
-</head>
-<body>
-
-<div id="Ldt-output" name="Ldt-output" style="position:absolute;left:600px;" ></div>
-<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
-<script type="text/javascript" src="raphael-min.js"></script>
-
-<div>
-<!--
-<script type='text/javascript' src='http://www.cybunk.com/irinumberOfTweet/FC/src/js/LdtPlayer.js'></script>
- <div id="player_project_13b0aa52-336b-11e0-b233-00145ea49a02_embed" class="iri_player_embed"/>
- <script type="text/javascript">
- var config = {
- metadata:{
- format:'cinelab',
- src:'http://www.iri.centrepompidou.fr//dev/ldt/ldtplatform/ldt/cljson/id/13b0aa52-336b-11e0-b233-00145ea49a02',
- load:'jsonp'},
- gui:{
- width:650,
- height:480,
- mode:'video',
- container:'player_project_13b0aa52-336b-11e0-b233-00145ea49a02_embed',
- debug:false,
- css:'http://www.iri.centrepompidou.fr//dev/ldt/static/ldt/css/LdtPlayer.css'},
- player:{
- type:'jwplayer',
- src:'http://www.iri.centrepompidou.fr//dev/ldt/static/ldt/swf/player.swf'}
- };
- __IriSP.init(config);
-</script>
-</div>
--->
-
-<div id="charttimeline">ici</div>
-
-<script type="text/javascript">
-
-// v1 ::
-// - config
-// - organisation classe
-// - zoom
-// - rollover !!
-// - legend !!
-// - seek !!
-//
-
-
- /*
- 1 | 1D973D > vert > ++ > OK
- 2 | C5A62D > orange > ?? > Q
- 3 | CE0A15 > rouge > -- > KO
- 4 | 036AAE > bleu > == > REF
- 5 | 585858 > gris > NQ > ""
- */
-
-
-cinelabToChart= function (){
-}
-
-chartTimeline = function (){
-
-}
-
-chartTimeline = function (config){
- this.config = config;
-
-}
-chartTimeline.prototype.create function(){
-}
-
- // configuration
- var config = {
- target:"charttimeline",
- x:8,
- y:438,
- width:650,
- height:200,
- heightmax:50
- }
- // Make and define the Raphael area
- var paper = Raphael(document.getElementById(config.target),config.width, config.height);
-
- // variable
- var yCoef = 2; // coef for height of 1 tweet
- var frameSize = 5; // frame size
- var lineSize = 650; // timeline width
- var nbrframes = lineSize/frameSize; // frame numbers
- var numberOfTweet = 400;
- var duration = 4299820 ;
-
- frameLenght = lineSize/frameSize;
- var timeline;
- var tweets = new Array();
- var element = new Array();
- var cluster = new Array();
- var frames = new Array(frameLenght);
- var slices = new Array();
- var colors = new Array("","#1D973D","#C5A62D","#CE0A15","#036AAE","#585858");
-
- var traceNum = 0;
- function trace(msg,value){
- traceNum += 1;
- $("<div>"+traceNum+" - "+msg+" : "+value+"</div>").appendTo("#Ldt-output");
- }
-
- function qualificationTrans(value){
- if(value == "Q"){
- return 2;
- }else if(value =="REF"){
- return 4;
- }else if(value =="OK"){
- return 1;
- }else if(value =="KO"){
- return 3;
- }else if(value ==""){
- return 5;
- }
- }
-
- var k=0;
-
- $.ajax({
- dataType: "json",
- url:"metadata.json",
- success : function(json){
- trace("load","");
- $.each(json.annotations, function(i,item) {
-
- var MyTime = Math.floor(item.begin/duration*lineSize);
- var Myframe = Math.floor(MyTime/lineSize*frameLenght);
-
- if (item.content['polemics'] != undefined) {
-
- if (item.content['polemics'][0] != null) {
-
- for(var j=0; j<item.content['polemics'].length; j++){
-
-
-
- tweets[k] = {
- id:i,
- qualification:qualificationTrans(item.content['polemics'][j]),
- yIndicator:MyTime,
- yframe:Myframe
- }
- trace("t","y = "+tweets[k].yIndicator+" | yf = "+tweets[k].yframe+" | q = "+tweets[k].qualification);
- k+=1;
- }
- }else{
- //trace("k = ",i);
- tweets[k] = {
- id:i,
- qualification:qualificationTrans(""),
- yIndicator:MyTime,
- yframe:Myframe
- }
- k+=1;
- }
-
- } else {
- //trace("tweet qualification = ","null");
- }
- });
- trace("======= ",k);
- DrawTweets ();
-
- }
- });
-
- slice = function(){
- var id;
- var values;
- var elements;
- }
-
- slice = function(id,values){
-
- }
-
-
- // Random value for tweet simulations
- /*
- for(var i=0; i<numberOfTweet; i++) {
- var MyTime = Math.floor(Math.random()*500);
- var Myframe = Math.floor(MyTime/lineSize*frameLenght);
-
- tweets[i] = {
- id:i,
- qualification:Math.floor(Math.random()*6),
- yIndicator:MyTime,
- yframe:Myframe
- }
- //trace("t","y = "+tweets[i].yIndicator+" | f = "+tweets[i].yframe+" | q = "+tweets[i].qualification);
- // ajout dans cluster
- }*/
-
- // tweet classement
- function DrawTweets (){
- numberOfTweet = tweets.length;
- //alert(numberOfTweet);
- for(var i=0; i<nbrframes; i++) {
- for(var j=0; j<numberOfTweet; j++) {
- if (i==tweets[j].yframe){
-
- var k = tweets[j].qualification;
- //trace("add in "+i,k);
- // créer un tableau pour les cluster
- if(frames[i]==undefined){
- frames[i] = new Array();
- }
- // asigné le comptage au cluster
- if(frames[i][k]==undefined){
- frames[i][k]=1;
- }else{
- frames[i][k]+=1;
- }
- }
- }
-
- }
-
- var max = 0;
- var padding = 50;
- var height = 50;
-
- for(var i=0; i<nbrframes; i++) {
- var moy = 0;
- for (var j=1; j<6; j++){
- if (frames[i]!=undefined){
- if (frames[i][j]!=undefined){
- moy += frames[i][j]
- }
- }
- }
- //trace("frame "+i,moy);
- if (moy>max){max=moy;}
- }
- trace("frame max =",max);
- trace("===================","=====================");
-
- for(var i=0; i<nbrframes; i++) {
- var addEheight = 0;
- for (var j=6; j>0; j--){
- if (frames[i]!=undefined){
- if (frames[i][j]!=undefined){
- var Eheight = frames[i][j]*5;
- paper.rect(i*frameSize, padding-Eheight-addEheight, 4, Eheight).attr({stroke:"#00","stroke-width":0.1, fill: colors[j]});
- addEheight +=Eheight;
- }
- }
-
- }
- }
-
- }
-
-</script>
-</body>
-</html>