source: branches/2.2.0.1/calendar/js/dhtmlx/sources/lightbox.js @ 4001

Revision 4001, 11.5 KB checked in by rafaelraymundo, 13 years ago (diff)

Ticket #1615 - Componente novo para agenda......................................

Line 
1scheduler.form_blocks={
2        textarea:{
3                render:function(sns){
4                        var height=(sns.height||"130")+"px";
5                        return "<div class='dhx_cal_ltext' style='height:"+height+";'><textarea></textarea></div>";
6                },
7                set_value:function(node,value,ev){
8                        node.firstChild.value=value||"";
9                },
10                get_value:function(node,ev){
11                        return node.firstChild.value;
12                },
13                focus:function(node){
14                        var a=node.firstChild; a.select(); a.focus();
15                }
16        },
17        select:{
18                render:function(sns){
19                        var height=(sns.height||"23")+"px";
20                        var html="<div class='dhx_cal_ltext' style='height:"+height+";'><select style='width:552px;'>";
21                        for (var i=0; i < sns.options.length; i++)
22                                html+="<option value='"+sns.options[i].key+"'>"+sns.options[i].label+"</option>";
23                        html+="</select></div>";
24                        return html;
25                },
26                set_value:function(node,value,ev){
27                        if (typeof value == "undefined")
28                                value = (node.firstChild.options[0]||{}).value;
29                        node.firstChild.value=value||"";
30                },
31                get_value:function(node,ev){
32                        return node.firstChild.value;
33                },
34                focus:function(node){
35                        var a=node.firstChild; if (a.select) a.select(); a.focus();
36                }
37        },     
38        time:{
39                render:function(){
40                        //hours
41                        var cfg = scheduler.config;
42                        var dt = this.date.date_part(new Date());
43                        var last = 24*60, first = 0;
44                        if(scheduler.config.limit_time_select){
45                                last = 60*cfg.last_hour+1;
46                                first = 60*cfg.first_hour;
47                                dt.setHours(cfg.first_hour);
48                        }
49                               
50                        var html="<select>";
51                        for (var i=first; i<last; i+=this.config.time_step*1){
52                                var time=this.templates.time_picker(dt);
53                                html+="<option value='"+i+"'>"+time+"</option>";
54                                dt=this.date.add(dt,this.config.time_step,"minute");
55                        }
56                       
57                        //days
58                        html+="</select> <select>";
59                        for (var i=1; i < 32; i++)
60                                html+="<option value='"+i+"'>"+i+"</option>";
61                       
62                        //month
63                        html+="</select> <select>";
64                        for (var i=0; i < 12; i++)
65                                html+="<option value='"+i+"'>"+this.locale.date.month_full[i]+"</option>";
66                       
67                        //year
68                        html+="</select> <select>";
69                        dt = dt.getFullYear()-5; //maybe take from config?
70                        for (var i=0; i < 10; i++)
71                                html+="<option value='"+(dt+i)+"'>"+(dt+i)+"</option>";
72                        html+="</select> ";
73                       
74                        return "<div style='height:30px; padding-top:0px; font-size:inherit;' class='dhx_cal_lsection dhx_section_time'>"+html+"<span style='font-weight:normal; font-size:10pt;'> &nbsp;&ndash;&nbsp; </span>"+html+"</div>";                 
75
76                },
77                set_value:function(node,value,ev){
78
79                        var s=node.getElementsByTagName("select");
80
81                        if(scheduler.config.full_day) {
82                                if (!node._full_day){
83                                        node.previousSibling.innerHTML+="<div class='dhx_fullday_checkbox'><label><input type='checkbox' name='full_day' value='true'> "+scheduler.locale.labels.full_day+"&nbsp;</label></input></div>";
84                                        node._full_day=true;
85                                }
86                                var input=node.previousSibling.getElementsByTagName("input")[0];
87                                var isFulldayEvent = (scheduler.date.time_part(ev.start_date)==0 && scheduler.date.time_part(ev.end_date)==0 && ev.end_date.valueOf()-ev.start_date.valueOf() < 2*24*60*60*1000);
88                                input.checked = isFulldayEvent;
89                               
90                                for(var k in s)
91                                        s[k].disabled=input.checked;
92
93                                input.onclick = function(){
94                                        if(input.checked) {
95                                                var start_date = new Date(ev.start_date);
96                                                var end_date = new Date(ev.end_date);
97                                               
98                                                scheduler.date.date_part(start_date);
99                                                end_date = scheduler.date.add(start_date, 1, "day")
100                                        }
101                                        for(var i in s)
102                                                s[i].disabled=input.checked;
103                                       
104                                        _fill_lightbox_select(s,0,start_date||ev.start_date);
105                                        _fill_lightbox_select(s,4,end_date||ev.end_date);
106                                }
107                        }
108                       
109                        if(scheduler.config.auto_end_date && scheduler.config.event_duration) {
110                                function _update_lightbox_select() {
111                                        ev.start_date=new Date(s[3].value,s[2].value,s[1].value,0,s[0].value);
112                                        ev.end_date.setTime(ev.start_date.getTime() + (scheduler.config.event_duration * 60 * 1000));
113                                        _fill_lightbox_select(s,4,ev.end_date);
114                                }
115                                for(var i=0; i<4; i++) {
116                                        s[i].onchange = _update_lightbox_select;
117                                }
118                        }
119                       
120                        function _fill_lightbox_select(s,i,d){
121                                s[i+0].value=Math.round((d.getHours()*60+d.getMinutes())/scheduler.config.time_step)*scheduler.config.time_step;       
122                                s[i+1].value=d.getDate();
123                                s[i+2].value=d.getMonth();
124                                s[i+3].value=d.getFullYear();
125                        }
126                       
127                        _fill_lightbox_select(s,0,ev.start_date);
128                        _fill_lightbox_select(s,4,ev.end_date);
129                },
130                get_value:function(node,ev){
131                        s=node.getElementsByTagName("select");
132                        ev.start_date=new Date(s[3].value,s[2].value,s[1].value,0,s[0].value);
133                        ev.end_date=new Date(s[7].value,s[6].value,s[5].value,0,s[4].value);
134                        if (ev.end_date<=ev.start_date)
135                                ev.end_date=scheduler.date.add(ev.start_date,scheduler.config.time_step,"minute");
136                },
137                focus:function(node){
138                        node.getElementsByTagName("select")[0].focus();
139                }
140        }
141}
142scheduler.showCover=function(box){
143        this.show_cover();
144        if (box){
145                box.style.display="block";
146                var pos = getOffset(this._obj);
147                box.style.top=Math.round(pos.top+(this._obj.offsetHeight-box.offsetHeight)/2)+"px";
148                box.style.left=Math.round(pos.left+(this._obj.offsetWidth-box.offsetWidth)/2)+"px";     
149        }
150}
151scheduler.showLightbox=function(id){
152        if (!id) return;
153        if (!this.callEvent("onBeforeLightbox",[id])) return;
154        var box = this._get_lightbox();
155        this.showCover(box);
156        this._fill_lightbox(id,box);
157        this.callEvent("onLightbox",[id]);
158}
159scheduler._fill_lightbox=function(id,box){
160        var ev=this.getEvent(id);
161        var s=box.getElementsByTagName("span");
162        if (scheduler.templates.lightbox_header){
163                s[1].innerHTML="";
164                s[2].innerHTML=scheduler.templates.lightbox_header(ev.start_date,ev.end_date,ev);
165        } else {
166                s[1].innerHTML=this.templates.event_header(ev.start_date,ev.end_date,ev);
167                s[2].innerHTML=(this.templates.event_bar_text(ev.start_date,ev.end_date,ev)||"").substr(0,70); //IE6 fix       
168        }
169       
170       
171        var sns = this.config.lightbox.sections;       
172        for (var i=0; i < sns.length; i++) {
173                var node=document.getElementById(sns[i].id).nextSibling;
174                var block=this.form_blocks[sns[i].type];
175                block.set_value.call(this,node,ev[sns[i].map_to],ev, sns[i])
176                if (sns[i].focus)
177                        block.focus.call(this,node);
178        };
179       
180        scheduler._lightbox_id=id;
181}
182scheduler._lightbox_out=function(ev){
183        var sns = this.config.lightbox.sections;       
184        for (var i=0; i < sns.length; i++) {
185                var node=document.getElementById(sns[i].id).nextSibling;
186                var block=this.form_blocks[sns[i].type];
187                var res=block.get_value.call(this,node,ev, sns[i]);
188                if (sns[i].map_to!="auto")
189                        ev[sns[i].map_to]=res;
190        }
191        return ev;
192}
193scheduler._empty_lightbox=function(){
194        var id=scheduler._lightbox_id;
195        var ev=this.getEvent(id);
196        var box=this._get_lightbox();
197       
198        this._lightbox_out(ev);
199       
200        ev._timed=this.is_one_day_event(ev);
201        this.setEvent(ev.id,ev);
202        this._edit_stop_event(ev,true)
203        this.render_view_data();
204}
205scheduler.hide_lightbox=function(id){
206        this.hideCover(this._get_lightbox());
207        this._lightbox_id=null;
208        this.callEvent("onAfterLightbox",[]);
209}
210scheduler.hideCover=function(box){
211        if (box) box.style.display="none";
212        this.hide_cover();
213}
214scheduler.hide_cover=function(){
215        if (this._cover)
216                this._cover.parentNode.removeChild(this._cover);
217        this._cover=null;
218}
219scheduler.show_cover=function(){
220        this._cover=document.createElement("DIV");
221        this._cover.className="dhx_cal_cover";
222        document.body.appendChild(this._cover);
223}
224scheduler.save_lightbox=function(){
225        if (this.checkEvent("onEventSave") &&                                           !this.callEvent("onEventSave",[this._lightbox_id,this._lightbox_out({ id: this._lightbox_id}), this._new_event]))
226                return;
227        this._empty_lightbox()
228        this.hide_lightbox();
229};
230scheduler.startLightbox = function(id, box){
231        this._lightbox_id=id;
232        this.showCover(box);
233}
234scheduler.endLightbox = function(mode, box){
235        this._edit_stop_event(scheduler.getEvent(this._lightbox_id),mode);
236        if (mode)
237                scheduler.render_view_data();
238        this.hideCover(box);
239};
240scheduler.resetLightbox = function(){
241        scheduler._lightbox = null;
242};
243scheduler.cancel_lightbox=function(){
244        this.callEvent("onEventCancel",[this._lightbox_id, this._new_event]);
245        this.endLightbox(false);
246        this.hide_lightbox();
247};
248scheduler._init_lightbox_events=function(){
249        this._get_lightbox().onclick=function(e){
250                var src=e?e.target:event.srcElement;
251                if (!src.className) src=src.previousSibling;
252                if (src && src.className)
253                        switch(src.className){
254                                case "dhx_save_btn":
255                                        scheduler.save_lightbox();
256                                        break;
257                                case "dhx_delete_btn":
258                                        var c=scheduler.locale.labels.confirm_deleting;
259                                        if (!c||confirm(c)) {
260                                                scheduler.deleteEvent(scheduler._lightbox_id);
261                                                scheduler._new_event = null; //clear flag, if it was unsaved event
262                                                scheduler.hide_lightbox();
263                                        }
264                                        break;
265                                case "dhx_cancel_btn":
266                                        scheduler.cancel_lightbox();
267                                        break;
268                                       
269                                default:
270                                        if (src.className.indexOf("dhx_custom_button_")!=-1){
271                                                var index = src.parentNode.getAttribute("index");
272                                                var block=scheduler.form_blocks[scheduler.config.lightbox.sections[index].type];
273                                                var sec = src.parentNode.parentNode;
274                                                block.button_click(index,src,sec,sec.nextSibling);     
275                                        }
276                        }
277        };
278        this._get_lightbox().onkeypress=function(e){
279                switch((e||event).keyCode){
280                        case scheduler.keys.edit_save:
281                                if ((e||event).shiftKey) return;
282                                scheduler.save_lightbox();
283                                break;
284                        case scheduler.keys.edit_cancel:
285                                scheduler.cancel_lightbox();
286                                break;
287                }
288        }
289}
290scheduler.setLightboxSize=function(){
291        var d = this._lightbox;
292        if (!d) return;
293       
294        var con = d.childNodes[1];
295        con.style.height="0px";
296        con.style.height=con.scrollHeight+"px";         
297        d.style.height=con.scrollHeight+50+"px";               
298        con.style.height=con.scrollHeight+"px";          //it is incredible , how ugly IE can be       
299}
300
301scheduler._get_lightbox=function(){
302        if (!this._lightbox){
303                var d=document.createElement("DIV");
304                d.className="dhx_cal_light";
305                if (/msie|MSIE 6/.test(navigator.userAgent))
306                        d.className+=" dhx_ie6";
307                d.style.visibility="hidden";
308                d.innerHTML=this._lightbox_template;
309                document.body.insertBefore(d,document.body.firstChild);
310                this._lightbox=d;
311               
312                var sns=this.config.lightbox.sections;
313                var html="";
314                for (var i=0; i < sns.length; i++) {
315                        var block=this.form_blocks[sns[i].type];
316                        if (!block) continue; //ignore incorrect blocks
317                        sns[i].id="area_"+this.uid();
318                        var button = "";
319                        if (sns[i].button) button = "<div style='float:right;' class='dhx_custom_button' index='"+i+"'><div class='dhx_custom_button_"+sns[i].name+"'></div><div>"+this.locale.labels["button_"+sns[i].button]+"</div></div>";
320                        html+="<div id='"+sns[i].id+"' class='dhx_cal_lsection'>"+button+this.locale.labels["section_"+sns[i].name]+"</div>"+block.render.call(this,sns[i]);
321                };
322               
323       
324                //localization
325                var ds=d.getElementsByTagName("div");
326                ds[4].innerHTML=scheduler.locale.labels.icon_save;
327                ds[7].innerHTML=scheduler.locale.labels.icon_cancel;
328                ds[10].innerHTML=scheduler.locale.labels.icon_delete;
329                //sections
330                ds[1].innerHTML=html;
331                //sizes
332                this.setLightboxSize();
333       
334                this._init_lightbox_events(this);
335                d.style.display="none";
336                d.style.visibility="visible";
337        }
338        return this._lightbox;
339}
340scheduler._lightbox_template="<div class='dhx_cal_ltitle'><span class='dhx_mark'>&nbsp;</span><span class='dhx_time'></span><span class='dhx_title'></span></div><div class='dhx_cal_larea'></div><div class='dhx_btn_set'><div class='dhx_save_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set'><div class='dhx_cancel_btn'></div><div>&nbsp;</div></div><div class='dhx_btn_set' style='float:right;'><div class='dhx_delete_btn'></div><div>&nbsp;</div></div>";
Note: See TracBrowser for help on using the repository browser.