Skip to main content
aboutsummaryrefslogtreecommitdiffstats
blob: b59f58865c54d40939c0adf31310f4ea910f08aa (plain) (blame)
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
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!-- **************************************************************************
#
# Copyright  (c) 2004-2010 Oracle Corporation.
#
# All rights reserved. This program and the accompanying materials
# are made available under the terms of the Eclipse Public License v1.0
# which accompanies this distribution, and is available at
# http://www.eclipse.org/legal/epl-v10.html
#
# Contributors: 
#
#    Kohsuke Kawaguchi, Erik Ramfelt, Seiji Sogabe
#        
#************************************************************************** --> 

<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout" xmlns:t="/lib/hudson" xmlns:f="/lib/form" xmlns:i="jelly:fmt">
    <st:documentation>
    Show timeline trend image. It takes two builds
    </st:documentation>
    
    <script type="text/javascript">
        var SimileAjax = {
            Platform: {}
        }; 
    </script>          

    <script type="text/javascript">
        var browserName=navigator.appName;
        if (browserName=="Microsoft Internet Explorer"){
           //load ie friendly stylesheet
           document.write('<link rel="stylesheet" type="text/css" href="${resURL}/scripts/timeline_2.3.0/timeline_ajax/styles/graphics-ie6.css" />')
        } else{
           document.write('<link rel="stylesheet" type="text/css" href="${resURL}/scripts/timeline_2.3.0/timeline_ajax/styles/graphics.css" />')
        }
     </script> 

    <link rel="stylesheet" type="text/css" href="${resURL}/scripts/timeline_2.3.0/timeline_ajax/styles/graphics.css" />
    <link rel="stylesheet" type="text/css" href="${resURL}/scripts/timeline_2.3.0/timeline_js/timeline-bundle.css" />
    
    <script src="${resURL}/scripts/timeline_2.3.0/timeline_ajax/simile-ajax-bundle.js" type="text/javascript" /> 
    
     <script type="text/javascript">
        
            var Timeline = {};
            Timeline.DateTime = SimileAjax.DateTime;
            Timeline.urlPrefix ='${resURL}/scripts/timeline_2.3.0/timeline_js/';
            Timeline.serverLocale = '${h.serverLocale.language}';
            Timeline.clientLocale = '${h.clientLocale.language}';;
            
    </script>  
    
    <script src="${resURL}/scripts/timeline_2.3.0/timeline_js/timeline-bundle.js" type="text/javascript" />
    
    <script src="${resURL}/scripts/timeline_2.3.0/timeline_js/scripts/l10n/en/labellers.js" type="text/javascript" />   
    <script src="${resURL}/scripts/timeline_2.3.0/timeline_js/scripts/l10n/en/timeline.js" type="text/javascript" /> 
    
    
    <j:invokeStatic var="tz" className="java.util.TimeZone" method="getDefault"/>
    <div id="tl" style="height:250px; border:1px solid black;" />
    <div id="status" />
 
     <script type="text/javascript">
       
          <![CDATA[
            // Respect Daylight Saving Time on client side
            var tz = ${it.getTimeZoneOffset()};
           
             function onLoadEvent() {
                var tl_el = document.getElementById("tl");
                var eventSource1 = new Timeline.DefaultEventSource();
                eventSource1.loaded = {};
                var interval = 24*60*60*1000;
                eventSource1.ensureVisible = function(band) {
                  // make sure all data are loaded for the portion visible in the band
                  // $('status').innerHTML = "min="+band.getMinDate()+" max="+band.getMaxDate();
                  var min = Math.floor(band.getMinDate().getTime()/interval);
                  var max = Math.ceil(band.getMaxDate().getTime()/interval);
                  for (var i=min; i<=max; i++) {
                    if (!this.loaded[i]) {
                      this.loaded[i] = true;
                      new Ajax.Request("timeline/data",{
                          method:"POST",
                          parameters: {min: i*interval, max:(i+1)*interval},
                          onSuccess: function(t) {
                            try {
                              eventSource1.loadJSON(eval('('+t.responseText+')'),'.');
                            } catch (e) {
                              alert(e);
                            }
                          }
                      });
                    }
                  }
                };


                var theme1 = Timeline.ClassicTheme.create();
                 // theme1.autoWidth = true; // Set the Timeline's "width" automatically.
                 // Set autoWidth on the Timeline's first band's theme,
                 // will affect all bands.
                theme1.timeline_start = new Date(${it.firstBuild.timeInMillis-24*60*60*1000});
                theme1.timeline_stop  = new Date(${it.lastBuild.timeInMillis+24*60*60*1000});

                var d = new Date(${it.lastBuild.timeInMillis});
                var bandInfos = [
                    // the bar that shows outline
                    Timeline.createBandInfo({
                        width:          "50px", // set to a minimum, autoWidth will then adjust
                        intervalUnit:   Timeline.DateTime.DAY,
                        intervalPixels: 200,
                        eventSource:    eventSource1,
                        timeZone:       tz,
                        theme:          theme1,
                        layout:         'overview'  // original, overview, detailed
                    }),
                    // the main area
                    Timeline.createBandInfo({
                        width:          "200px",
                        eventSource:    eventSource1,
                        timeZone:       tz,
                        theme:          theme1,
                        intervalUnit:   Timeline.DateTime.HOUR,
                        intervalPixels: 200
                    })
                ];
                bandInfos[0].highlight = true;
                bandInfos[0].syncWith = 1;

                // create the Timeline
                var tl = Timeline.create(tl_el, bandInfos, Timeline.HORIZONTAL);

                tl.getBand(0).addOnScrollListener(function(band) {
                    eventSource1.ensureVisible(band);
                });

                tl.layout(); // display the Timeline

                // if resized, redo layout
                var resizeTimerID = null;
                window.addEventListener('resize',function() {
                    if (resizeTimerID == null) {
                        resizeTimerID = window.setTimeout(function() {
                            resizeTimerID = null;
                            tl.layout();
                        }, 500);
                    }
                },false);
            }

            if (window.attachEvent) {
                window.attachEvent('onload', onLoadEvent);
            }else if (window.addEventListener) {
               window.addEventListener('load', onLoadEvent, false);
            }else {
               document.addEventListener('load', onLoadEvent, false);
            }
     ]]>
    
  </script>
     
</j:jelly>

Back to the top