[OpenAjaxIDE] date formatting

Bertrand Le Roy Bertrand.Le.Roy at microsoft.com
Thu Aug 20 11:15:39 PDT 2009


If IDEs are going to generate code from the metadata this way:
<script type=”text/javascript”>
var calwidget = new YAHOO.whatever.calendar({
mindate:” 08/12/2009”,
maxdate: ” 08/19/2009”,
selected: ” 08/12/2009”,
pagedate: ” 08/12/2009”
});
</script>
Is there also a possibility to generate an actual JavaScript Date object instead of a string representation?

From: ide-bounces at openajax.org [mailto:ide-bounces at openajax.org] On Behalf Of Kin Blas
Sent: Thursday, August 20, 2009 11:05 AM
To: ide at openajax.org
Subject: Re: [OpenAjaxIDE] date formatting

Actually, you can’t declare the function in the same <javascript> block as the constructor. If you do, a copy of that function will be inserted into the document for each instance of the widget that is inserted into the document. You would have to use an inline <require> so that only one instance is ever added to the file:

<require type=”javascript”>
<![CDATA[
function yuiFormat(d){return mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear(); }
]]>
</require>

…

<property name='mindate' datatype='Date' format='date'/>
<property name='maxdate' datatype='Date' format='date'/>
<property name='selected' datatype='Date' format='date'/>
<property name='pagedate' datatype='Date' format='date'/>

…

<javascript location="afterContent">
function yuiFormat(d){return mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear(); }
var calwidget = new YAHOO.whatever.calendar({
mindate:yuiFormat(@@mindate@@),
maxdate:yuiFormat(@@maxdate@@),
selected:yuiFormat(@@selected@@),
pagedate:yuiFormat(@@patedate@@)
});
</javascript>


What this means though is that should you mix different widgets, that happen to use dates, there is the potential for multiple formatting functions being added to the user’s page.

So just to make sure we’re all on the same page here, what is the proposed output format for the properties? Date objects with ints?

<head>
…
<script type=”text/javascript”>
function yuiFormat(d){return mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear(); }
</script>
…
</head>
<body>
…
<script type=”text/javascript”>
var calwidget = new YAHOO.whatever.calendar({
mindate:yuiFormat(new Date(2009, 8, 12)),
maxdate:yuiFormat(new Date(2009, 8, 19)),
selected:yuiFormat(new Date(2009, 8, 12)),
pagedate:yuiFormat(new Date(2009, 8, 12))
});
</script>
…
</body>

Date objects with UTC strings?

<head>
…
<script type=”text/javascript”>
function yuiFormat(d){return mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear(); }
</script>
…
</head>
<body>
…
<script type=”text/javascript”>
var calwidget = new YAHOO.whatever.calendar({
mindate:yuiFormat(new Date(“Wed, 12 Aug 2009 09:35:00 GMT”)),
maxdate:yuiFormat(new Date(“Wed, 19 Aug 2009 23:59:59 GMT”)),
selected:yuiFormat(new Date(“Wed, 12 Aug 2009 09:35:00 GMT”)),
pagedate:yuiFormat(new Date(“Wed, 12 Aug 2009 09:35:00 GMT”))
});
</script>

I’m not sure of the customer-base for other products currently making use of these OAM widget files, but for Dreamweaver, some of our customers are consultants/designers that care about the markup and code that is inserted into their document. They care because it is a reflection on them, and in some cases it affects how employable they are.

The last code snippet above seems a bit bloated/wasteful since you are going from one string date format, into the native date format, only to go back to a string format, that *may* eventually end up being converted into a native Date format internally by the widget. This really makes the user/designer look like they don’t know what they are doing.

It is much tighter/cleaner to generate code that looks like this:

<script type=”text/javascript”>
var calwidget = new YAHOO.whatever.calendar({
mindate:” 08/12/2009”,
maxdate: ” 08/19/2009”,
selected: ” 08/12/2009”,
pagedate: ” 08/12/2009”
});
</script>
which is expected/supported by the widget, then to generate extra code that the IDE and user will have to manage. Also note that so far we’ve been making an explicit assumption that the value of the date property we are talking about is going to be used within JavaScript, when the reality is that it could also potentially be used within markup, which is a case where writing out “new Date (blah)” just doesn’t make sense.

While I agree that in an ideal world, everyone would be using the same date format or Date objects in their APIs … it would make life for all of us easier … the reality is that we are just not there yet.

--== Kin ==--

From: ide-bounces at openajax.org [mailto:ide-bounces at openajax.org] On Behalf Of Adam Peller
Sent: Thursday, August 20, 2009 9:03 AM
To: Jon Ferraiolo
Cc: ide at openajax.org
Subject: Re: [OpenAjaxIDE] date formatting


alternatively:

<property name='mindate' datatype='Date' format='date'/>
<javascript location="afterContent">
function yuiFormat(d){return mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear(); }
var calwidget = new YAHOO.whatever.calendar({...mindate:yuiFormat(@@mindate@@)...});
</javascript>

which I think reads pretty well. One open issue is whether we'd be dealing with UTC or local time once the substitutions take place. I suspect we'll have to work in UTC to be consistent. (Granted, it's a JS gotcha, but we're not out to eliminate all of those)



[Inactive hide details for Jon Ferraiolo---08/20/2009 11:17:08 AM---If we add another attribute, its name should reflect that th]Jon Ferraiolo---08/20/2009 11:17:08 AM---If we add another attribute, its name should reflect that the attribute only applies to formatting dates versus other datatypes
Jon Ferraiolo/Menlo Park/IBM at IBMUS
Sent by: ide-bounces at openajax.org

08/20/2009 10:56 AM


To


"ide at openajax.org" <ide at openajax.org>


cc




Subject


Re: [OpenAjaxIDE] date formatting








If we add another attribute, its name should reflect that the attribute only applies to formatting dates versus other datatypes. Therefore, instead of 'formatString', the attribute should be named something like 'formatDate', 'dateFormat' or 'dateResultFormat'. (The latter one is long, but re-inforces that we are formatting on the property editor result rather than the input value that is given the property editor.)

But like Adam I would like to see side-by-side comparisons of how the OAM file would look if we added a new attribute versus pushing this feature into something that has to be done via JavaScript. I'll take a crack at it.

With a 'dateResultFormat' attribute:

<property name='mindate' datatype='String' format='date' dateResultFormat='MM/DD/YYYY'/>
<javascript location="afterContent">
var calwidget = new YAHOO.whatever.calendar({...mindate:@@mindate@@...});
</javascript>

Without a 'dateResultFormat' attribute:

<property name='mindate' datatype='Date' format='date'/>
<javascript location="afterContent">
var mdate = @@mindate@@;
var mdate_string = mdate.getMonth()+"/"+mdate.getDay()+"/"+mdate.getFullYear();
var calwidget = new YAHOO.whatever.calendar({...mindate:mdate_string...});
</javascript>

Jon



[Inactive hide details for Lori Hylan-Cho ---08/19/2009 10:41:14 PM---I agree with Kin that we shouldn't make widget developers]Lori Hylan-Cho ---08/19/2009 10:41:14 PM---I agree with Kin that we shouldn't make widget developers (or oam.xml file writers, who may not be

From:


Lori Hylan-Cho <avocadoh at gmail.com>


To:


Jon Ferraiolo/Menlo Park/IBM at IBMUS


Cc:


Kin Blas <jblas at adobe.com>, "ide at openajax.org" <ide at openajax.org>


Date:


08/19/2009 10:41 PM


Subject:


Re: [OpenAjaxIDE] date formatting

________________________________



I agree with Kin that we shouldn't make widget developers (or oam.xml file writers, who may not be the same people) write extra JS when we can include a declarative format in the spec.

I agree with Jon and Scott that a separate attribute for the format string should be used for the reason Jon outlined.

As regards encouraging bad coding practices, I'd rather recognize reality and give dev tools a chance to support it than try to get everyone to conform to an ideal.

Lori

[brevity brought to you by iPhone.]

On Aug 19, 2009, at 9:55 PM, Jon Ferraiolo <jferrai at us.ibm.com<mailto:jferrai at us.ibm.com>> wrote:
After thinking about things, I don't like either of the following:

format="d/m/Y"

or

format="date(d/m/Y)"

The 'format' attribute tells the tool what type of special editor to display within the property editor in order for the user to enter a value. For example, a tool might provide a calendar widget to edit a property that has format="date", a clock dial widget to edit a property that has format="time", and a color picker widget to edit a property that has format="color". I don't think we want to try to co-mingle the formatting instructions into the same attribute that provides a hint about which editor widget to use within the property editor UI.

If we are going to offer date formatting, I think an additional attribute such as what Scott has proposed is the way to go.

Regarding whether we should include this feature or not, I won't object if the majority think this is a necessary feature for version 1.0, but at the moment I'm not sold that this is an appropriate feature for the spec. Two things worry me:

(1) So far, I haven't seen any JavaScript-free OAM files for OAM files that wrap widgets from Ajax toolkits. If OAM authors need to resort to JavaScript anyway, then for the YUI calendar widget (and similar calendar widgets), the widget developer working on the calendar widget can figure out how to format the date values (perhaps by including Steve's 40 lines of JavaScript within that particular widget)

(2) I'm not sure that it is compelling easier for a widget developer to discover and learn how to use the 'formatString' attribute versus writing a little JavaScript to create the appropriate string before calling the constructor.

But nevertheless, if the majority want this feature, I'm OK with adding it as Scott proposes below.

Jon


<graycol.gif>Kin Blas ---08/19/2009 03:21:31 PM---For the datatype="Date" there are 2 supported format values, "date" and "time": <property name="myDa
<ecblank.gif>
From:

<ecblank.gif>
Kin Blas <jblas at adobe.com<mailto:jblas at adobe.com>>

<ecblank.gif>
To:

<ecblank.gif>
"ide at openajax.org<mailto:ide at openajax.org>" <ide at openajax.org<mailto:ide at openajax.org>>

<ecblank.gif>
Date:

<ecblank.gif>
08/19/2009 03:21 PM

<ecblank.gif>
Subject:

<ecblank.gif>
Re: [OpenAjaxIDE] date formatting

<ecblank.gif>
Sent by:

<ecblank.gif>
ide-bounces at openajax.org<mailto:ide-bounces at openajax.org>

________________________________



For the datatype=”Date” there are 2 supported format values, “date” and “time”:

<property name=”myDate” datatype=”Date” format=”date” />
<property name=”myTime” datatype=”Date” format=”time” />

Rather than introducing another attribute, as proposed in Scott’s example. Why not just leverage the existing @format attribute in conjunction with the variables used by PHP:

http://us.php.net/manual/en/function.date.php

The current proposed values for the Date @format aren’t that useful in my opinion. So I envision something like:

<property name=”myDate” datatype=”Date” format=”d/m/Y” />
<property name=”myTime” datatype=”Date” format=”g:i:s” />

Regarding Jon’s comment about being able to work around this problem with additional code added to the <javascript> or <content> sections … I really feel that if we want this OAM format to be adopted by the various frameworks and the industry, that we need to make it drop-dead simple for them to support their formats/patterns so they don’t have to resort to writing extra-glue code to make up for our in-flexibility.

--== Kin ==--

From: ide-bounces at openajax.org<mailto:ide-bounces at openajax.org> [mailto:ide-bounces at openajax.org] On Behalf Of Scott Richards
Sent: Wednesday, August 19, 2009 3:00 PM
To: Steve Repetti; 'Jon Ferraiolo'; ide at openajax.org<mailto:ide at openajax.org>
Subject: Re: [OpenAjaxIDE] date formatting

I think a lightweight solution that supports a very small set of legacy formats would be all we need. Sounds like Steve’s 40+ lines of DateFormat code could handle this.

I like a simple approach of adding an additional formatString=”” attribute or maybe call it formatPattern that enables you to format in the value that is replaced using the @@variableName@@ notation in either the <javascript> or <content> sections. Here is an example.

<property datatype=”date” format=”date” formatString=”YYYY-MM-DD” />

where:
YYYY = four-digit year
MM = two-digit month (01=January, etc.)
DD = two-digit day of month (01 through 31)
hh = two digits of hour (00 through 23) (am/pm NOT allowed)
mm = two digits of minute (00 through 59)
ss = two digits of second (00 through 59)



The formats from YUI Calendar takes Javascript Date Object or a string formatted as “mm/yyyy” and “mm/dd/yyyy”. The selected property can only be specified with a string not a Javascript date object and it does not support ISO 8601 format. See this link

http://developer.yahoo.com/yui/calendar/#config

Here is an example of how we could support YUI Calendar date strings using formatString.


var cal1 = new YAHOO.widget.Calendar("cal1",
"cal1Container",
{ pagedate:"5/2007",
selected:"5/5/2007-5/27/2007" });

This would look like the following in the oam.xml file:
<javascript>
var cal1 = new YAHOO.widget.Calendar("cal1",
"cal1Container",
{ pagedate:"@@pageDate@@",
selected:"@@selectDateStart@@-@@selectDateEnd@@" });
</javascript>

<property name=”pageDate” datatype=”date” format=”date” formatString=”MM/YYYY” />
<property name=” selectDateStart” datatype=”date” format=”date” formatString=”MM/DD/YYYY” />
<property name=” selectDateEnd” datatype=”date” format=”date” formatString=”MM/DD/YYYY” />


Not sure if we should support dropping out leading 0’s, do we need to support this? We could do with just M or D. But the YUI calendar works specifying dates with or without leading 0’s. So this may be unnecessary.



Here is the link for jQuery Date formats. They support multiple formats including iso 8601. So with could support it as follows:
_______________________________________________
IDE mailing list
IDE at openajax.org<mailto:IDE at openajax.org>
http://openajax.org/mailman/listinfo/ide
_______________________________________________
IDE mailing list
IDE at openajax.org
http://openajax.org/mailman/listinfo/ide
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://openajax.org/pipermail/ide/attachments/20090820/a44c51e2/attachment-0001.html 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image001.gif
Type: image/gif
Size: 105 bytes
Desc: image001.gif
Url : http://openajax.org/pipermail/ide/attachments/20090820/a44c51e2/attachment-0001.gif 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image002.png
Type: image/png
Size: 168 bytes
Desc: image002.png
Url : http://openajax.org/pipermail/ide/attachments/20090820/a44c51e2/attachment-0003.png 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image003.png
Type: image/png
Size: 166 bytes
Desc: image003.png
Url : http://openajax.org/pipermail/ide/attachments/20090820/a44c51e2/attachment-0004.png 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image004.png
Type: image/png
Size: 168 bytes
Desc: image004.png
Url : http://openajax.org/pipermail/ide/attachments/20090820/a44c51e2/attachment-0005.png 


More information about the IDE mailing list