source: sandbox/2.3-MailArchiver/calendar/js/dhtmlx/samples/06_timeline/03_tree.html @ 6779

Revision 6779, 4.8 KB checked in by rafaelraymundo, 12 years ago (diff)

Ticket #2946 - Liberado Expresso(branch 2.3) integrado ao MailArchiver?.

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3<head>
4        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
5        <title>For demo purpose only :: &1</title>
6       
7       
8        <script src='../../codebase/dhtmlxscheduler.js' type="text/javascript" charset="utf-8"></script>
9        <script src='../../codebase/ext/dhtmlxscheduler_timeline.js' type="text/javascript" charset="utf-8"></script>
10        <script src='../../codebase/ext/dhtmlxscheduler_treetimeline.js' type="text/javascript" charset="utf-8"></script>
11       
12        <link rel='stylesheet' type='text/css' href='../../codebase/dhtmlxscheduler.css'>
13        <link rel="stylesheet" href="../../codebase/ext/dhtmlxscheduler_ext.css" type="text/css" media="screen" title="no title" charset="utf-8">
14       
15</head>
16
17       
18<style type="text/css" media="screen">
19        html, body{
20                margin:0px;
21                padding:0px;
22                height:100%;
23                overflow:hidden;
24        }       
25        .one_line{
26                white-space:nowrap;
27                overflow:hidden;
28                padding-top:5px; padding-left:5px;
29                text-align:left !important;
30        }
31</style>
32
33<script type="text/javascript" charset="utf-8">
34        function init() {
35
36                scheduler.locale.labels.timeline_tab = "Timeline";
37                scheduler.locale.labels.section_custom="Section";
38                scheduler.config.details_on_create=true;
39                scheduler.config.details_on_dblclick=true;
40                scheduler.config.xml_date="%Y-%m-%d %H:%i";
41               
42               
43                //===============
44                //Configuration
45                //===============       
46               
47                elements = [ // original hierarhical array to display
48                        {key:10, label:"Web Testing Dep.", open: true, children: [
49                                {key:20, label:"Elizabeth Taylor"},
50                                {key:30, label:"Managers",  children: [
51                                        {key:40, label:"John Williams"},
52                                        {key:50, label:"David Miller"}
53                                ]},
54                                {key:60, label:"Linda Brown"},
55                                {key:70, label:"George Lucas"}
56                        ]},
57                        {key:110, label:"Human Relations Dep.", open:true, children: [
58                                {key:80, label:"Kate Moss"},
59                                {key:90, label:"Dian Fossey"}
60                        ]}
61                ];
62               
63               
64               
65                scheduler.createTimelineView({
66                        section_autoheight: false,
67                        name:   "timeline",
68                        x_unit: "minute",
69                        x_date: "%H:%i",
70                        x_step: 30,
71                        x_size: 24,
72                        x_start: 16,
73                        x_length:       48,
74                        y_unit: elements,
75                        y_property:     "section_id",
76                        render: "tree",
77                        folder_dy:20,
78                        dy:60
79                });
80               
81               
82               
83
84                //===============
85                //Data loading
86                //===============
87                scheduler.config.lightbox.sections=[   
88                        {name:"description", height:130, map_to:"text", type:"textarea" , focus:true},
89                        {name:"custom", height:23, type:"timeline", options:null , map_to:"section_id" }, //type should be the same as name of the tab
90                        {name:"time", height:72, type:"time", map_to:"auto"}
91                ]
92               
93                scheduler.init('scheduler_here',new Date(2009,5,30),"timeline");
94                scheduler.parse([
95                        { start_date: "2009-06-30 09:00", end_date: "2009-06-30 12:00", text:"Task A-12458", section_id:20},
96                        { start_date: "2009-06-30 10:00", end_date: "2009-06-30 16:00", text:"Task A-89411", section_id:20},
97                        { start_date: "2009-06-30 10:00", end_date: "2009-06-30 14:00", text:"Task A-64168", section_id:20},
98                        { start_date: "2009-06-30 16:00", end_date: "2009-06-30 17:00", text:"Task A-46598", section_id:20},
99                       
100                        { start_date: "2009-06-30 12:00", end_date: "2009-06-30 20:00", text:"Task B-48865", section_id:40},
101                        { start_date: "2009-06-30 14:00", end_date: "2009-06-30 16:00", text:"Task B-44864", section_id:40},
102                        { start_date: "2009-06-30 16:30", end_date: "2009-06-30 18:00", text:"Task B-46558", section_id:40},
103                        { start_date: "2009-06-30 18:30", end_date: "2009-06-30 20:00", text:"Task B-45564", section_id:40},
104                       
105                        { start_date: "2009-06-30 08:00", end_date: "2009-06-30 12:00", text:"Task C-32421", section_id:50},
106                        { start_date: "2009-06-30 14:30", end_date: "2009-06-30 16:45", text:"Task C-14244", section_id:50},
107                       
108                        { start_date: "2009-06-30 09:20", end_date: "2009-06-30 12:20", text:"Task D-52688", section_id:60},
109                        { start_date: "2009-06-30 11:40", end_date: "2009-06-30 16:30", text:"Task D-46588", section_id:60},
110                        { start_date: "2009-06-30 12:00", end_date: "2009-06-30 18:00", text:"Task D-12458", section_id:60}
111                ],"json");
112               
113               
114               
115        }
116       
117</script>
118
119<body onload="init();">
120        <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
121                <div class="dhx_cal_navline">
122                        <div class="dhx_cal_prev_button">&nbsp;</div>
123                        <div class="dhx_cal_next_button">&nbsp;</div>
124                        <div class="dhx_cal_today_button"></div>
125                        <div class="dhx_cal_date"></div>
126                        <div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
127                        <div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
128                        <div class="dhx_cal_tab" name="timeline_tab" style="right:280px;"></div>
129                        <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
130                </div>
131                <div class="dhx_cal_header">
132                </div>
133                <div class="dhx_cal_data">
134                </div>         
135        </div>
136</body>
Note: See TracBrowser for help on using the repository browser.