From 2e593fada976c3f2b1028612fce3e309932800d2 Mon Sep 17 00:00:00 2001 From: Rushabh Mehta Date: Fri, 23 Nov 2012 16:24:56 +0530 Subject: [PATCH] calendar.js: events made smaller (online) and other minor ui fixes --- utilities/page/calendar/calendar.css | 24 ++++----- utilities/page/calendar/calendar.html | 3 ++ utilities/page/calendar/calendar.js | 74 ++++++++++++++++----------- 3 files changed, 56 insertions(+), 45 deletions(-) diff --git a/utilities/page/calendar/calendar.css b/utilities/page/calendar/calendar.css index 9adae7a2bf..dd1b6de2fd 100644 --- a/utilities/page/calendar/calendar.css +++ b/utilities/page/calendar/calendar.css @@ -1,5 +1,12 @@ /**** CALENDAR ****/ +.cal_event { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + margin-bottom: 3px; +} + div.cal_body { margin: 16px; background-color: #DDD; @@ -62,7 +69,7 @@ div.cal_month_body { } .cal_month_headtable { - /*table-layout:fixed;*/ + table-layout:fixed; width: 100%; } @@ -83,7 +90,7 @@ div.cal_month_body { table.cal_month_table { border-collapse: collapse; - /*table-layout:fixed;*/ + table-layout:fixed; width: 100%; } @@ -138,6 +145,7 @@ div.cal_day_unit{ table.cal_week_table { border-collapse: collapse; + table-layout: fixed; width: 100%; } @@ -155,15 +163,3 @@ div.cal_week_unit{ width: 100%; cursor:pointer; } - -div.cal_event_Public { - color: GREEN; -} - -div.cal_event_Private { - color: BLUE; -} - -div.cal_event_hover { - text-decoration: underline; -} diff --git a/utilities/page/calendar/calendar.html b/utilities/page/calendar/calendar.html index 456566d589..11dd3bf98a 100644 --- a/utilities/page/calendar/calendar.html +++ b/utilities/page/calendar/calendar.html @@ -13,6 +13,9 @@ +
diff --git a/utilities/page/calendar/calendar.js b/utilities/page/calendar/calendar.js index 3d3519b402..a9429f2ecd 100644 --- a/utilities/page/calendar/calendar.js +++ b/utilities/page/calendar/calendar.js @@ -115,8 +115,11 @@ Calendar.prototype.show_event = function(ev, cal_ev) { this.widgets['Ref Link'].innerHTML = ''; if(this.ev.ref_type) { - $(repl('Reference: %(ref_type)s: %(ref_name)s', this.ev)) + $(repl('\ + \ + \ +
Reference:%(ref_type)s: %(ref_name)s
', this.ev)) .appendTo(this.widgets['Ref Link']) } @@ -256,32 +259,28 @@ Calendar.prototype.refresh = function(viewtype){//Sets the viewtype of the Calen //------------------------------------------------------ Calendar.CalEvent= function(doc, cal) { - this.body = document.createElement('div'); - this.link = $a(this.body, 'a', '', {}, locals['Event'][doc.name].description || ''); - this.doc = doc; var me = this; + me.doc = doc; + + this.body = $("
") + .html(doc.description) + .css({"cursor":"pointer"}) + .attr("data-event", doc.name) + .click(function() { + var doc = locals["Event"][$(this).attr("data-event")]; + cal.show_event(doc, me); + }) - this.link.onclick = function() { - if(me.doc.name) { - cal.show_event(me.doc, me); - } + this.show = function(vu) { + me.body + .html(me.doc.description) + .css({"width": ($(vu.body).width()-10)}) + .appendTo(vu.body) + .removeClass("label-success").removeClass("label-info") + .addClass(me.doc.event_type=="Public" ? "label-success" : "label-info") } } -Calendar.CalEvent.prototype.show = function(vu) { - - var t = this.doc.event_type; - this.my_class = 'cal_event_'+ t; - - if(this.body.parentNode) - this.body.parentNode.removeChild(this.body); - vu.body.appendChild(this.body); - - // refresh - this.link.innerHTML = this.doc.description || ''; - this.body.className = this.my_class; -} - // ---------- @@ -295,10 +294,13 @@ Calendar.View.prototype.init=function(cal) { Calendar.View.prototype.show=function() { - this.get_events(); this.refresh(); this.body.style.display = 'block'; + this.body.style.display = 'block'; + this.get_events(); this.refresh(); } -Calendar.View.prototype.hide=function() { this.body.style.display = 'none';} +Calendar.View.prototype.hide=function() { + this.body.style.display = 'none'; +} Calendar.View.prototype.next = function() { var s = this.cal.selected_date; @@ -349,7 +351,8 @@ Calendar.MonthView.prototype.create_table = function() { var r = this.headtable.insertRow(0); for(var j=0;j<7;j++) { var cell = r.insertCell(j); - cell.innerHTML = erpnext.calendar.weekdays[j]; $w(cell, (100 / 7) + '%'); + cell.innerHTML = erpnext.calendar.weekdays[j]; + $w(cell, (100 / 7) + '%'); } this.main = $a(this.body, 'div', 'cal_month_body'); @@ -480,7 +483,6 @@ Calendar.WeekView.prototype.create_table = function() { var r = this.headtable.insertRow(0); for(var j=0;j<8;j++) { var cell = r.insertCell(j); - $w(cell, (100 / 8) + '%'); } // hour header @@ -652,14 +654,24 @@ Calendar.ViewUnit.prototype.deselect=function() { this.selected = false; this.se Calendar.ViewUnit.prototype.setevent=function() { } Calendar.MonthViewUnit=function(parent) { - this.header = $a(parent, 'div' , "cal_month_date"); - this.default_class = "cal_month_unit"; - + var me = this; + this.header = $("
") + .appendTo(parent) + .css({"cursor":"pointer"}) + .click(function() { + me.body.onclick(); + }) + .bind("dblclick", function() { + me.body.ondblclick(); + }) + .get(0); + + this.default_class = "cal_month_unit"; this.init(parent); this.onrefresh = function() { this.header.innerHTML = this.day.getDate(); - } + } } Calendar.MonthViewUnit.prototype = new Calendar.ViewUnit(); Calendar.MonthViewUnit.prototype.is_selected = function() {