[jira] Assigned: (WICKET-880) Option to align DatePicker to the left of icon

["Gerolf Seitz (JIRA)" <ji...@apache.org>]

     [ https://issues.apache.org/jira/browse/WICKET-880?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Gerolf Seitz reassigned WICKET-880:
-----------------------------------

    Assignee: Gerolf Seitz

> Option to align DatePicker to the left of icon
> ----------------------------------------------
>
>                 Key: WICKET-880
>                 URL: https://issues.apache.org/jira/browse/WICKET-880
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-datetime
>    Affects Versions: 1.3.0-beta2
>         Environment: wicket-1.3.0-SNAPSHOT (YUI DatePicker)
>            Reporter: Russell Morrisey
>            Assignee: Gerolf Seitz
>            Priority: Minor
>         Attachments: RightAlignedDatePicker.java, RightAlignedDatePicker.js
>
>
> wicket-1.3.0-SNAPSHOT
> I'm using the wicket YUI DatePicker on a DateTextField in my application, and it works quite nicely. The problem is that my date field is on the far right-hand side of the page. When set to align with icon, the DatePicker appears so that the left edge of the calendar is lined up with the left edge of the icon. When I open the DatePicker, the calendar appears mostly offscreen, and the user has to scroll horizontally to interact with it.
> I wanted my DatePicker to line up the other way - with the calendar's right edge aligned with the right edge of the icon - so the user doesn't have to scroll. I made a RightAlignedDatePicker that does this, but it's not good enough to be a patch, since it duplicates a lot of code unnecessarily. I would like to see this as a standard setting on the wicket DatePicker if possible!
> I created RightAlignedDatePicker.java only so I could replace DatePicker.js with RightAlignedDatePicker.js. The rest of the code from renderHead() is copied from DatePicker directly. Similarly, I replaced RightAlignedDatePicker.js so that I could replace the showCalendar() method, and introduce my Wicket.DateTime.positionRelativeToLeft() method. The important code that had to be changed was:
> function showCalendar() {
> 		Wicket.DateTime.positionRelativeToLeft = function(subject, target) {
> 			
> 			targetPos = YAHOO.util.Dom.getXY(target);
> 			targetHeight = YAHOO.util.Dom.get(target).offsetHeight;
> 			targetWidth = YAHOO.util.Dom.get(target).offsetWidth;
> 			var calWidth = YAHOO.util.Dom.get(subject).offsetWidth;
> 			YAHOO.util.Dom.setX(subject, targetPos[0] + targetWidth - calWidth);
> 			YAHOO.util.Dom.setY(subject, targetPos[1] + targetHeight + 1);
> 		}
> 	
> 		Wicket.DateTime.showCalendar(YAHOO.wicket.${widgetId}DpJs, YAHOO.util.Dom.get("${componentId}").value, '${datePattern}');
> //		if (${alignWithIcon}) Wicket.DateTime.positionRelativeTo(YAHOO.wicket.${widgetId}DpJs.oDomContainer, "${widgetId}Icon");
> 		if (${alignWithIcon}) Wicket.DateTime.positionRelativeToLeft(YAHOO.wicket.${widgetId}DpJs.oDomContainer, "${widgetId}Icon");
> 	}
> 	
> I tried introducing the positionRelativeToLeft method elsewhere, but I started running into javascript errors, so I left it here. There could be an extra (optional) parameter added to Wicket.DateTime.positionRelativeTo() instead.
> Hope this seems like a helpful addition. I think it won't be too bad to implement.
> -Russ

-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.