9:24 a.m.
Author: pyaschenko
Date: 2007-07-25 10:24:35 -0400 (Wed, 25 Jul 2007)
New Revision: 1846
Modified:
trunk/sandbox/samples/calendar-sample/src/main/webapp/pages/Calendar.jsp
trunk/sandbox/ui/calendar/src/main/resources/org/richfaces/renderkit/html/scripts/calendar.js
Log:
Modified: trunk/sandbox/samples/calendar-sample/src/main/webapp/pages/Calendar.jsp
===================================================================
--- trunk/sandbox/samples/calendar-sample/src/main/webapp/pages/Calendar.jsp 2007-07-25
14:18:13 UTC (rev 1845)
+++ trunk/sandbox/samples/calendar-sample/src/main/webapp/pages/Calendar.jsp 2007-07-25
14:24:35 UTC (rev 1846)
@@ -42,12 +42,12 @@
<f:validator validatorId="org.richfaces.CalendarValidator" />
<h:panelGrid columns="2">
- <f:verbatim><p style="padding: 10px;"
class="largeText">{day}</p></f:verbatim>
- <h:panelGrid>
+ <f:verbatim><p style="padding: 2px;" <%--
class="largeText"--%>>{day}</p></f:verbatim>
+ <%-- h:panelGrid>
<h:outputText styleClass="smallText" value="{data.enLabel}"
/>
<h:outputText styleClass="smallText" value="{data.frLabel}"
/>
<h:outputText styleClass="smallText" value="{data.deLabel}"
/>
- </h:panelGrid>
+ </h:panelGrid--%>
</h:panelGrid>
</calendar:calendar>
Modified:
trunk/sandbox/ui/calendar/src/main/resources/org/richfaces/renderkit/html/scripts/calendar.js
===================================================================
---
trunk/sandbox/ui/calendar/src/main/resources/org/richfaces/renderkit/html/scripts/calendar.js 2007-07-25
14:18:13 UTC (rev 1845)
+++
trunk/sandbox/ui/calendar/src/main/resources/org/richfaces/renderkit/html/scripts/calendar.js 2007-07-25
14:24:35 UTC (rev 1846)
@@ -6,36 +6,106 @@
Richfaces.Calendar={};
Richfaces.Calendar.setElementPosition = function(element, baseElement, jointPoint,
direction, offset)
{
+ // parameters:
+ // jointPoint: {x:,y:} or
('left-top','right-top','left-bottom','right-bottom')
+ // direction:
('left-top','right-top','left-bottom','right-bottom',
'auto')
+
var elementDim = {width: element.getWidth(), height: element.getHeight()};
var baseElementDim = {width: baseElement.getWidth(), height: baseElement.getHeight()};
- var windowDim = Richfaces.Calendar.getWindowDimensions();
- var windowOffset = Richfaces.Calendar.getWindowScrollOffset();
+ var windowRect = Richfaces.Calendar.getWindowViewport();
var baseOffset = Position.cumulativeOffset(baseElement);
- // jointPoint Correction
- var ox=0;
- var oy=0;
- if (jointPoint)
+ // jointPoint
+ var ox=baseOffset[0];
+ var oy=baseOffset[1];
+ var re = /^(top|bottom)-(left|right)$/;
+ var match;
+
+ if (typeof jointPoint=='object') {ox = jointPoint.x; oy=jointPoint.y}
+ else if ( jointPoint && (match=jointPoint.toLowerCase().match(re)) )
{
- var jp = jointPoint.toLowerCase().split('-');
- if (jp[0]=='bottom') oy=baseElementDim.height;
- if (jp[1]=='right') ox=baseElementDim.width;
+ if (match[2]=='right') ox+=baseElementDim.width;
+ if (match[1]=='bottom') oy+=baseElementDim.height;
+ } else
+ {
+ // ??? auto
}
- // direction Correction
- if (direction)
+ // direction
+ if (direction && (match=direction.toLowerCase().match(re)) )
{
var d = direction.toLowerCase().split('-');
- if (d[0]=='top') oy-=elementDim.height;
- if (d[1]=='left') ox-=elementDim.width;
- }
+ if (match[2]=='left') ox-=elementDim.width;
+ if (match[1]=='top') oy-=elementDim.height;
+ } else
+ {
+ // auto
+ var theBest = {square:0};
+ // jointPoint: right-bottom, direction: left-bottom
+ var rect = {right: baseOffset[0] + baseElementDim.width, top: baseOffset[1] +
baseElementDim.height};
+ rect.left = rect.right - elementDim.width;
+ rect.bottom = rect.top + elementDim.height;
+ ox = rect.left; oy = rect.top;
+ var s = Richfaces.Calendar.checkCollision(rect, windowRect);
+ if (s!=0)
+ {
+ if (ox>=0 && oy>=0 && theBest.square<s) theBest = {x:ox,
y:oy, square:s};
+ // jointPoint: right-top, direction: left-top
+ rect = {right: baseOffset[0] + baseElementDim.width, bottom: baseOffset[1]};
+ rect.left = rect.right - elementDim.width;
+ rect.top = rect.bottom - elementDim.height;
+ ox = rect.left; oy = rect.top;
+ s = Richfaces.Calendar.checkCollision(rect, windowRect);
+ if (s!=0)
+ {
+ if (ox>=0 && oy>=0 && theBest.square<s) theBest = {x:ox,
y:oy, square:s};
+ // jointPoint: left-bottom, direction: right-bottom
+ rect = {left: baseOffset[0], top: baseOffset[1] + baseElementDim.height};
+ rect.right = rect.left + elementDim.width;
+ rect.bottom = rect.top + elementDim.height;
+ ox = rect.left; oy = rect.top;
+ s = Richfaces.Calendar.checkCollision(rect, windowRect);
+ if (s!=0)
+ {
+ if (ox>=0 && oy>=0 && theBest.square<s) theBest = {x:ox,
y:oy, square:s};
+ // jointPoint: left-top, direction: right-top
+ rect = {left: baseOffset[0], bottom: baseOffset[1]};
+ rect.right = rect.left + elementDim.width;
+ rect.top = rect.bottom - elementDim.height;
+ ox = rect.left; oy = rect.top;
+ s = Richfaces.Calendar.checkCollision(rect, windowRect);
+ if (s!=0)
+ {
+ // the best way selection
+ if (ox<0 || oy<0 || theBest.square>s) {ox=theBest.x; oy=theBest.y}
+ }
+ }
+ }
+
+ }
+ }
- element.style.left = baseOffset[0] + ox + 'px';
- element.style.top = baseOffset[1] + oy + 'px';
+ element.style.left = ox + 'px';
+ element.style.top = oy + 'px';
+}
+
+Richfaces.Calendar.checkCollision = function(elementRect, windowRect, windowOffset)
+{
+ if (elementRect.left >= windowRect.left &&
+ elementRect.top >= windowRect.top &&
+ elementRect.right <= windowRect.right &&
+ elementRect.bottom <= windowRect.bottom)
+ return 0;
+ var rect = {left: (elementRect.left>windowRect.left ? elementRect.left :
windowRect.left),
+ top: (elementRect.top>windowRect.top ? elementRect.top : windowRect.top),
+ right: (elementRect.right<windowRect.right ? elementRect.right :
windowRect.right),
+ bottom: (elementRect.bottom<windowRect.bottom ? elementRect.bottom :
windowRect.bottom)};
+ return (rect.right-rect.left)* (rect.bottom-rect.top);
}
+
Richfaces.Calendar.getWindowDimensions = function() {
var w = self.innerWidth
|| document.documentElement.clientWidth
@@ -60,6 +130,12 @@
return {left:dx, top: dy};
}
+Richfaces.Calendar.getWindowViewport = function() {
+ var windowDim = Richfaces.Calendar.getWindowDimensions();
+ var windowOffset = Richfaces.Calendar.getWindowScrollOffset();
+ return {left:windowOffset.left, top:windowOffset.top, right:
windowDim.width+windowOffset.left, bottom: windowDim.height+windowOffset.top};
+}
+
/*Richfaces.Calendar.getPageDimensions = function() {
var x,y;
var test1 = document.body.scrollHeight;
@@ -257,8 +333,8 @@
this.daysData = {startDate:null, days:[]};
this.days = [];
- var htmlTextHeader = '<input id="'+this.id+'InputSelectedDate"
name="'+this.id+'InputSelectedDate" type="hidden"
value="'+this.getSelectedDateString(this.params.datePattern)+'"/>\n'
+
- '<input id="'+this.id+'InputCurrentDate"
name="'+this.id+'InputCurrentDate" type="hidden"
value="'+this.getCurrentDate().format("MM/y")+'"/>\n'
+
+ var htmlTextHeader = '<input id="'+this.id+'InputSelectedDate"
name="'+this.id+'InputSelectedDate" type="hidden"
style="display:none"
value="'+this.getSelectedDateString(this.params.datePattern)+'"/>\n'
+
+ '<input id="'+this.id+'InputCurrentDate"
name="'+this.id+'InputCurrentDate" type="hidden"
style="display:none"
value="'+this.getCurrentDate().format("MM/y")+'"/>\n'
+
'<table border="0" cellpadding="0"
cellspacing="0" class="calendar_exterior"><tbody>\n';
var colspan = (this.params.showWeeksBar ? "8" : "7");
var htmlHeaderOptional = (this.params.headerOptionalMarkup) ? '<tr><td
class="calendar_header" colspan="'+colspan+'"
id="'+this.id+'HeaderOptional"></td></tr>' :
'';
@@ -276,8 +352,8 @@
{
e.style.display='none';
e.style.position = 'absolute';
- e.style.left="0px";
- e.style.top="0px";
+ //e.style.left="0px";
+ //e.style.top="0px";
this.isVisible = false;
}
}
@@ -353,7 +429,7 @@
var base = $(this.POPUP_ID);
var e = $(this.id);
- Richfaces.Calendar.setElementPosition(e, base, this.params.jointPoint,
this.params.direction);
+ Richfaces.Calendar.setElementPosition(e, base, this.params.jointPoint,
"");//this.params.direction);
Element.show(this.id);
this.isVisible = true;