source: sandbox/2.3-MailArchiver/calendar/js/dhtmlx/samples/03_extensions/20_tooltip.html @ 6779

Revision 6779, 5.2 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 :: Tooltip</title>
6       
7        <script src='../../codebase/dhtmlxscheduler.js' type="text/javascript" charset="utf-8"></script>
8        <script src='../../codebase/ext/dhtmlxscheduler_timeline.js' type="text/javascript" charset="utf-8"></script>
9        <script src='../../codebase/ext/dhtmlxscheduler_treetimeline.js' type="text/javascript" charset="utf-8"></script>
10       
11        <script src='../../codebase/ext/dhtmlxscheduler_tooltip.js' type="text/javascript" charset="utf-8"></script>
12       
13        <link rel='stylesheet' type='text/css' href='../../codebase/dhtmlxscheduler.css'>
14        <link rel="stylesheet" href="../../codebase/ext/dhtmlxscheduler_ext.css" type="text/css" media="screen" title="no title" charset="utf-8">
15       
16<style type="text/css" media="screen">
17        html, body{
18                margin:0px;
19                padding:0px;
20                height:100%;
21                overflow:hidden;
22        }       
23        .one_line{
24                white-space:nowrap;
25                overflow:hidden;
26                padding-top:5px; padding-left:5px;
27                text-align:left !important;
28        }
29</style>
30
31<script type="text/javascript" charset="utf-8">
32        function init() {       
33
34                scheduler.templates.tooltip_date_format=scheduler.date.date_to_str("%Y-%m-%d %H:%i");
35                scheduler.locale.labels.timeline_tab = "Timeline";
36                scheduler.locale.labels.section_custom="Section";
37                scheduler.config.details_on_create=true;
38                scheduler.config.details_on_dblclick=true;
39                scheduler.config.xml_date="%Y-%m-%d %H:%i";
40                scheduler.config.event_duration = 45;
41                scheduler.config.full_day = true;
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", open: true, 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:80, label:"Kate Moss"},
58                        {key:90, label:"Dian Fossey"}
59                ];
60               
61                scheduler.createTimelineView({
62                        section_autoheight: false,
63                        name:   "timeline",
64                        x_unit: "minute",
65                        x_date: "%H:%i",
66                        x_step: 30,
67                        x_size: 24,
68                        x_start: 16,
69                        x_length:       48,
70                        y_unit: elements,
71                        y_property:     "section_id",
72                        render: "tree",
73                        folder_events_available: true,
74                        dy:60
75                });
76
77                //===============
78                //Data loading
79                //===============
80                scheduler.config.lightbox.sections=[   
81                        {name:"description", height:130, map_to:"text", type:"textarea" , focus:true},
82                        {name:"custom", height:23, type:"timeline", options:null , map_to:"section_id" }, //type should be the same as name of the tab
83                        {name:"time", height:72, type:"time", map_to:"auto"}
84                ]
85               
86                scheduler.init('scheduler_here',new Date(2009,5,30),"timeline");
87                scheduler.parse([
88                        { start_date: "2009-06-30 09:00", end_date: "2009-06-30 12:00", text:"Task A-12458", section_id:20},
89                        { start_date: "2009-06-30 10:00", end_date: "2009-06-30 16:00", text:"Task A-89411", section_id:20},
90                        { start_date: "2009-06-30 10:00", end_date: "2009-06-30 14:00", text:"Task A-64168", section_id:20},
91                        { start_date: "2009-06-30 16:00", end_date: "2009-06-30 17:00", text:"Task A-46598", section_id:20},
92                       
93                        { start_date: "2009-06-30 10:00", end_date: "2009-06-30 17:00", text:"Task for Managers folder", section_id:30},
94                       
95                        { start_date: "2009-06-30 12:00", end_date: "2009-06-30 20:00", text:"Task B-48865", section_id:40},
96                        { start_date: "2009-06-30 14:00", end_date: "2009-06-30 16:00", text:"Task B-44864", section_id:40},
97                        { start_date: "2009-06-30 16:30", end_date: "2009-06-30 18:00", text:"Task B-46558", section_id:40},
98                        { start_date: "2009-06-30 18:30", end_date: "2009-06-30 20:00", text:"Task B-45564", section_id:40},
99                       
100                        { start_date: "2009-06-30 08:00", end_date: "2009-06-30 12:00", text:"Task C-32421", section_id:50},
101                        { start_date: "2009-06-30 14:30", end_date: "2009-06-30 16:45", text:"Task C-14244", section_id:50},
102                       
103                        { start_date: "2009-06-30 09:20", end_date: "2009-06-30 12:20", text:"Task D-52688", section_id:60},
104                        { start_date: "2009-06-30 11:40", end_date: "2009-06-30 16:30", text:"Task D-46588", section_id:60},
105                        { start_date: "2009-06-30 12:00", end_date: "2009-06-30 18:00", text:"Task D-12458", section_id:60}
106                ],"json");
107        }
108       
109</script>
110</head>
111
112<body onload="init();">
113        <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
114                <div class="dhx_cal_navline">
115                        <div class="dhx_cal_prev_button">&nbsp;</div>
116                        <div class="dhx_cal_next_button">&nbsp;</div>
117                        <div class="dhx_cal_today_button"></div>
118                        <div class="dhx_cal_date"></div>
119                        <div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
120                        <div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
121                        <div class="dhx_cal_tab" name="timeline_tab" style="right:280px;"></div>
122                        <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
123                </div>
124                <div class="dhx_cal_header">
125                </div>
126                <div class="dhx_cal_data">
127                </div>         
128        </div>
129</body>
Note: See TracBrowser for help on using the repository browser.