YUI 3 :: {53} YUI3 - New Accepted

Error after calling stopPropagation() on a synthetic event facade

Calling stopPropagation() on the facade for a synthetic event results in the following error:

Y.Env._eventstack is undefined
/build/event-custom/event-custom-debug.js
Line 2319

Repro case (stolen from a repro case for an unrelated bug) here: http://gist.github.com/557733

autosubmenudisplay Don't close menu too quick

When using autosubmenudisplay, if the user clicks on the MenuBarItem just after the submenu began displaying (automatically of course), the submenu closes up. It's my opinion that people would almost never intend to "intercept" a menu on it's way to open up, in order to close it. I know I've had this happen to me lots of times.

My suggestion is to have a grace period such that: if a user clicks on a MenuBarItem withing say 100 milliseconds of the submenu opening, the submenu will ignore the click and continue opening.

It's not a super big deal, but to me, it would make using autosubmenudisplay more user friendly, since the user doesn't know before hand if a menu opens automatically (which I know most internet menus do open up automatically) or if it requires a click like a desktop application menu. Even though I know the menu's I've created use autosubmenudisplay, I still find myself clicking them on occasion in order to open them.

Mouseup on select list within scrollview jumps scroll position. Firefox only.

Behaviour can be observed here:
http://jsfiddle.net/simongilligan/GQYFC/1/

To reproduce, scroll to second slide. Select an option from the select list. Scrollview jumps to end (scroll position should remain as is).
Noted in forum here: http://yuilibrary.com/forum/viewtopic.php?f=92&t=7890

Charts - inner axis ticks appear above content in IE 6, 7

The axis ticks on a chart will appear of above the series content in IE 6 and 7.

This can be avoided by setting the display of the ticks to none:

axes : {
category: {
position: "bottom",
type: "category",
keys: ["category"],
styles: {
majorTicks: {
display: "axes"
}
}
}

Investigate configuration option Boolean for click on dial to set value enable/disable

Some use cases may suggest not having click to set value

Investigate config for offsetting the location of zero value

Currently zero value is always at North

Add API property for handleDistanceFromCenter

This could be useful.
Requested in forum by Andrew W.

Support || and ?: in Substitute template

the substitute module is very useful to render template.

1. default value using the '||' operator like JavaScript
var template = '{varName||'defaultValue'}'
Y.Assert.areEquals( 'myValue' , Y.substitute( template , {varName:'myValue'} )
Y.Assert.areEquals( 'defaultValue' , Y.substitute( template , {} )

2. ?: operator
var template = '<div{className?' class="' + className+ '"':''}></div>'
Y.Assert.areEquals('<div class="myClass"></div>', {className:'myClass'} )
Y.Assert.areEquals('<div></div>', {} )

Both are for handling the case when a variable does not exist. The 2nd one is an advanced version that could handle more cases.

Add support for non-uniform tick intervals

Gamaiel in Santa Monica noted that the DD utility supports non-uniform tick intervals, but slider does not. Although in most cases a slider is used as a finite range control, Gamaiel has found a use for it that is more akin to scrolling (see screen movie in URL attached to this request). In this instance, he is using slider to scroll horizontally to three separate pieces of content, each of distinct widths. The desired behavior is for the slider to come to rest in points positioned proportionally to the width of the content.

[imported, BZ 556091]

Create Slider plugin to output value to an element

Plugin adds attribute "output", or "bindTo", or "reportTo". Will accept selector or
Node.

Encapsulates reporting the current value to an element.

[imported, BZ 2395839]

A really good thing would be i18n safe URLencode / decode methods in YAHOO.lang

Took me ages to find a good one.

[imported, BZ 1846180]

Wrap JSON.parse and stringify in try/catch internally and use Y.error

The ECMA 3.1 spec calls for parse and stringify to throw errors for invalid JSON and cyclical objects respectively.

However, YUI has a policy of error tolerance in production application (read: non -debug mode), so the error should be thrown through the Y.error mechanism. This means the try/catch must be included in the JSON code.

I guess parse should return an empty object and stringify can fall back to replacing cyclical refs with null?

JSON doesn't have a stringToDate method

3.x JSON utility doesn't have a stringToDate like the 2.x utility does.

When you stringify something containing a date and then parse it, you get to different objects.

AsyncQueue runs twice methods when pause() and run() is used

lets define AsyncQueue object in following way:
var q2 = new Y.AsyncQueue();
q2.add({
fn: function() {
q2.pause();
Y.log('q2, one', 'info');
q2.run();
},
id: 'one'
},
{
fn: function() {
Y.log('q2, two', 'info');
},
id: 'two',
iterations: 1
});
q2.run();
Then function with id 'two' will be executed twice (generally n+1 times where iterations: n)
Below is log output:
et: Appending node: ../yui/build/event-custom/event-custom-min.js yui-debug.js (line 2972)
get: q1 onload ../yui/build/event-custom/event-custom-min.js yui-debug.js (line 2972)
get: _next: q1, loaded: ../yui/build/event-custom/event-custom-min.js yui-debug.js (line 2972)
get: Finishing transaction q1 yui-debug.js (line 2972)
q2, one yui-debug.js (line 2972)
q2, two yui-debug.js (line 2972)
q2, two

It seems that such change in async-queue.js would help:
_execute : function (callback) {
this._running = callback._running = true;

callback.iterations--;
if (callback.iterations>=0) { // <---- added
this.fire(EXECUTE, { callback: callback });
} // <--- added

Move to style.setProperty and parse out !important from set() values

This is a follow up action item for #2528234. It should be possible to handle !important with minimal code change.

StyleSheet aggregating existing rules can break specificity

When instantiating from source



<style type="text/css">

.foo { color: red; }

.bar { font-size: 2em; }

.foo { font-size: 1.5em; }

</style>

if the style properties for .foo are aggregated, then elements with class="foo bar" will be 2em because equal specificity is resolved by order in the sheet. This needs to be tested in practice.

Console rounded corner rendering not correct in Collapsed view, Safari only

Open http://developer.yahoo.com/yui/3/examples/test/test-simple-example.html in safari
Click on collapse button.
Note that rounded corners are not drawn correctly.
Screen shot attached

Happens in both 3.1.0 development master, as well as production 3.0.0 on developer.yahoo.com/yui/3

Slider fires first setValue() call twice if "max" is 200 or greater.

This was a difficult problem to isolate. Not sure what the heck is going on here. The first time you call setValue() or set('value', someVal) after rendering a slider with a "max" of >=200, it ends up being called twice. Subscribing to the valueChange event reveals that the value for one of the calls is different than what you set.

See the simple test case below. If you change the "max" configuration parameter to 199 or lower, the bug goes away. If you set the "min" and "max" parameters to high numbers (say, 1000 and 100000, respectively), the discrepancy between the two values picked up by valueChange is much greater.

Forced selection

Forced selection s may make more sense as a separate Select/ComboBox widget built with AutoComplete

[bz3727705] arraylist-add.js isn't really the right way to make some ArrayLists mutable

Loading arraylist-add.js makes all ArrayLists mutable. The right way is to provide a separate MutableArrayList which
extends ArrayList with what is currently in arraylist-add.js

Stacked column chart series heights irregular with small values

I am using the latest version 2.8.0r4. I am having problems with the heights of series columns in the stacked column chart, here is a link http://www.solarcentury.co.uk/estimate/?postcode=WR2+6NJ . Hit the benifits tab and drag the slider back one notch, you will see that year six has its 3rd series (yellow) missing. If i change it to a normal column chart, then it renders fine, with all values present as visible columns. It seems to me that if its a small value the stacked series wont display correctly but it doesn't make sense that smaller values would display, then a slighley larger one wouldn't, let me know if you require more information. The problem does seem to vary in different browsers (different bars have the series missing), but is always present.

[bz 2403330] To export the graph to convert to pdf

I need chart as a image component rather than a .swf file so If I would like to export the chart that come as an image.

YUI 3 Node Menu Nav Plugin not as responsive as the YUI 2 Menu control

I really hope you address this, as I am considering using this plugin for an upcoming application in production.
It is probably related to the javascript speed of the browser since I have only seem the problem in IE 7 (probably IE 6 as well, not tested).
When hovering over the sub-items in a menu a bit quickly, there is a delay before the hover effect is applied to the menu item. Looks more like flickering, not a great user experience.

Allow DataType.Number.format to accept a string formatting spec

DataType.Number.format currently accepts an object literal as a formatting specification. It would be good to have a compact means to specify such a format with a string.

I would like to suggest a format string centered around a # sign. The first character to its left would be the thousands separator, the first to its right, the decimal separator, followed by a number representing the number of decimals.

Whatever is to the left or right of this central group would make the prefix and suffix.

Either section on the sides of the # sign is optional, but to specify the options towards the end, the intermediate options should also be given. If there should be no thousands separator but a prefix needs to be specified, a digit 0 (an otherwise invalid character for a separator) should be used as a placeholder for the thousands separator.

For example, the spec for USD would be "$,#.2" while that for the Euro, ".#,2â�¬"

Stylesheet enableRule and disableRule - new methods

Duplicate of http://yuilibrary.com/projects/yui2/ticket/2529061 (but that's for YUI2).

The following snippet are additional public methods for Stylesheet. disableRule(match) allows you to temporarily turn off some of the rules in the Stylesheet; match is a string or RegExp to compare to the selectors in the Stylesheet. enableRule(match) turns them back on again.

Although this is in YUI2.8, it might be good to have in 3 too - I'll file a separate ticket.

This doesn't fix the !important bug issues with Opera (http://yuilibrary.com/forum/viewtopic.php?f=89&t=4304&start=0&hilit=stylesheet)

There's also an extra var _disabledRules in the constructor.

[code]
/**

Enable a particular rule (or several) that's previously been disabled.
The selector parameter can be a RegExp; each rule matching the pattern
will be enabled
@param sel {String} String or RegExp to match to selectors to enable
@method enableRule
@return {StyleSheet} the StyleSheet instance
@chainable
/

enableRule : function (sel) {

var i,
disabled = _disabledRules,
toEnable = [],
thisToEnable,
idx;

for (i in disabled) {

if (YAHOO.util.Lang.isString(i) && i.match(sel) !== null) {

toEnable.push(i);
}

}

for (i=0; i<toEnable.length; i++) {

idx = sheet[_rules].length;
thisToEnable = disabled[toEnable[i]];

this.set(thisToEnable.selectorText,thisToEnable.css);
cssRules[i] = disabled[toEnable[i]];
delete disabled[toEnable[i]];

}

return this;

/**

Disable a particular rule (or several) that's currently in the Sheet.
The selector parameter can be a RegExp; each rule matching the pattern
will be disabled
@param sel {String} String or RegExp to match to selectors to disable
@method disableRule
@return {StyleSheet} the StyleSheet instance
@chainable
/

disableRule : function (sel) {

var i, j = 0,
enabled = cssRules,
toDisable = [],
idx;

for (i in enabled) {

if (YAHOO.util.Lang.isString(i) && i.match(sel) !== null && enabled[i].style.cssText) {

toDisable.push(i);
_disabledRules[i] = { css: enabled[i].style.cssText,
selectorText: enabled[i].selectorText};
}

j++;
}

for (i=0; i<toDisable.length; i++) {

this.unset(toDisable[i]);
delete enabled[toDisable[i]];

}

return this;

}
[/code]

add 'step' as a configuration attribute in slider

I went to this having a scale from min=0, max=3000 and length=50px.
Because it is imposable to position the slider on every available value, it would be great to 'raster' it with a step attribute.

[Pull Request] - Widget: png transparency alternative support moved from TickSlider to support all widgets. 1. Added new attribute called pngAlternative. 2. Added parsePng method and integrated it in the default render process. Slider-Ticks: is now an extension! this is required as of the current change in Widget and the moving of pngParsing to there. 1. png support moved to Widget. 2. using now the getClassName. Signed-off-by: moppy

This include minor changes in ImgLoadImgObj and Widget.
Stable.
See ticket 2525929

Is refinement needed in the DD intersection detection code?

It looks as tho there is a margin of error in the detection of intersection of objects in DD. seems like the mouse location and object bounds both need to be taken into account. One symptom of the issue can be see by doing the following:

1) Launch the Drag & Drop: Drop Based Coding example
2) Click on the very bottom edge of one of the drag objects and drag it slowly down to the drop target
You will notice that the object gets to about a pixel or two away from the target before it is highlighted as an intersection
3) Release target
4) Click on the very top of edge of one of the drag object and drag it slowly down to the drop target
You will notice that the target is highlighted even tho the object is still almost a quarter inch away from the drop target.

You will see similar behavior in the Animated Drop Targets example if you click and hold on a Drag #1 you will notice that the objects freeze as intersected at various distances from the drag object. Clicking in a position near the top-left corner of the drag object is most telling. You will see that objects have to be very close to the top and left to trigger the intersection but appear intersected at a much farther distance from the right and bottom

Large value for border property in the stack chart makes columns disappear

If the border property on a column is set to a value larger than twice the width of the column, the column disappears from view.

Provide method for removal of single cache entry based on key

I often have need to remove a single cache entry based on a unique key when using uniqueKeys: true. It'd be nice to have a method provided for doing so.

Allow different "submenualignment" for different MenuBar submenus.

It is very common to have a menubar where the width of the very first or very last menu item's submenu extends beyond the menubar itself. It would be very handy to be able to specify "submenualignment" on a per-submenu basis, so that only the final submenu would be aligned differently.

Add a triggerSequence property and supporting logic

Add a triggerSequence property and supporting logic in the event handlers for the auto complete widget. Enhancement will allow autocompletion on partial strings such as completing only the domain name on an email address.

Patch file with my implementation of this is attached.

Provide basic autocomplete-base extended object

The second example here: http://developer.yahoo.com/yui/3/api/AutoCompleteBase.html works perfectly as a simple object when "List" functionality is not desired. My use case was to create a module just as it says and then attach listeners for the events in a different module such that the module that extends Y.AutoCompleteBase did nothing of a custom nature (i.e. no new attributes, methods, etc.) so the example could make a sufficient stand alone class provided by this module. Would then be simple to set up a non-List based autocomplete on an input field and implement only listeners, etc.

Allow inputNode to change without having to destroy and recreate the AC instance

I'm leveraging AutoCompleteBase to populate a select box of delivery options based on postal code. In my form I have a default of a billing address postal code input, when it is filled out the delivery options are retrieved and populated into a normal form select box. My use case here is to allow a toggle of a different delivery address which is a different input node. When the delivery toggle fires I build/render/etc. the separate delivery address form, consequently I hoped I could just set "inputNode" on the existing AC object since everything else about the request/configuration/etc. stays the same.

I've worked around it by just destroying the existing AC object, recreating a new one, and rebinding it, which works well enough.

Add styles attribute to Pie Chart

Cartesian Charts offer a "styles" attribute that allows you to specify values for the styles of its underlying components. (graph, series and axes). You can also style each piece directly. With Pie Chart, you must style its markers through the series. There should be a "styles" attribute on the PieChart as well.

AutocompleteList: option to show list whenever the input is focused

Presently, my options are to show the list only when there are results, or to show the list always. I would like to be able to show it whenever the user has engaged the input, so that the explanatory text I've put in the autocomplete contentBox will show.

Provide automatic inclusion of deprecated modules

Since deprecated methods are moved to *-deprecated modules, I think it would be beneficial if a flag could be added to the YUI's config that will automatically include the deprecated module when the module from which the methods were deprecated is being used.
So, for example, when using node module, node-deprecated will be used automatically.

Add support for open selectors passed to Y.delegate for container node

There's a discrepancy of behavior between DOM events and synthetic events for delegation. The synth infrastructure allows
Y.delegate('synth', fn, '.moreThanOne', 'p');

creating delegate subscriptions for each element matching .moreThanOne

But
Y.delegate('click', fn, '.moreThanOne', 'p');
will only attach to the first match of .moreThanOne.

Either delegate should be changed for DOM events or SyntheticEvent should be changed to limit to the first.

Overlapping needles do not get highlighted

As the title states, overlapping needles do not get highlighted.
For code, that says more than thousand words, see below.

_setAttrs is not to setAttrs as _set is to set

At this point, _setAttrs and setAttrs are the same, however, _set and set are not. _set allows you to bypass readOnly and writeOnce attributes.
Wouldn't it make sense to have _setAttrs be able to do the same?

Right now I have code like this:



reset: function() {

    this.set(VALUE, this.get(INITIAL_VALUE)).

        _set(IS_BAD, false).

        _set(OLD_VALUE, undefined).

        _set(REMOTE_VALUE,  undefined);

},

This code is in the same class as the attributes. I can't simply have getters in those readOnly attributes because I need them effectively changed so their change events fire.

I admit, though, that using _set allows me to use constants, which _setAttrs wouldn't allow me to, and that spares me from typos and compresses better and, since _setAttrs simply loops through the object calling set (instead of _set) it wouldn't save any execution time. So, it is just for the sake of symmetry and because there doesn't seem to be any point in having both setAttrs and _setAttrs.

NodeMenuNav on hover autohides submenu even with mouseOutHideDelay=0

The main project page says "Set the autoSubmenuDisplay to false, so that each menu label's submenu isn't made visible until the label is clicked. Set the mouseOutHideDelay to 0 so that a label's submenu is only hidden when the user mouses down on an area outside of the submenu."

I thought that the submenus would stay visible when mousing around the page. They do, until one mouses over the parent menu bar. It hides the submenu and then enters an inconsistent state.

Expectation: When using the { autoSubmenuDisplay: false, mouseOutHideDelay: 0 } config, just moving the mouse should not trigger any changes to the displayed submenu.

Add support for synthetic event simulation

This may not strictly be necessary, since synths should be triggered by DOM events, which can themselves be simulated, but it may be worth while to bundle up the triggering mechanism to spare the implementer having to know the triggering events, sequence, and conditions, and do the dance to simulate them.

This would introduce a new dependency to event-simulate, so is further evidence that on/detach, delegate/detachDelegate, and simulate should be composable on the adapter rather than having the permanent place holders.

AutoComplete results always appear under the input Node

Hi,

Unlike Comboboxes, YUI's AutoComplete results always drop down from under the InputNode, even if it is completely at the bottom of the screen. This makes the feature almost useless in some cases, mostly when scrolling is prohibited by the parent node (div, document, etc.). I think this could be a good improvement, given that YUI's AutoComplete is very powerful if we forget this little flaw.

on(type, strCallbackName) support for late binding of method callback

Late binding of functions is supported in Attribute configs and Y.bind(). It may as well be supported for event subscriptions as well.

Coalesce changes via setAttrs() into a single change event

The app framework is going to need a way to coalesce changes to multiple attribute values (via setAttr()) into a single change event.

An app model might have a large number of attributes and many of those may change at once. The default app view behavior (though this is really up to the implementer) is to re-render an entire view when a change occurs, and it's no good to have to re-render a view for each individual attribute rather than only once for the batch.

Positional attribute initialization on instantiation

Perhaps a new static property could be added to Base, containing an array of strings, each the name of an attribute to be initialized.

If the first argument for the constructor of Base (or a subclass) is not an object and this array has members, the arguments to the constructor will be assigned to the attributes listed in the array.

This would simplify initializing an object when a few arguments are very frequent, using the traditional positional arguments instead of an object with named properties.

Investigate ways to create and position the pointer for WidgetPointer plugin

Eric F.'s implementation details on TipTheWeb may help - he has a gist up with the CSS that's in there.

Test out various ways of visually representing the pointer

Especially in IE where CSS stuff may not work as intended. May take a leaf out of Eric's TipTheWeb CSS here. That seems to be compatible in IE

Unit Tests + Test WidgetPointer? plugin across A-grade

see summary.

Write examples and user guide for WidgetPointer plugin

Write two examples (one with pointy Tooltip for forms (a la MobileMe?, one with Overlay (a la iOS PopOver/NPR webapp)) and make user-guide.

Horizontal scrollview to support vertical drag gesture

The horizontal scrollview doesn't support a vertical gesture to allow a vertical scroll of a container page.

Use case (on iPad):
http://www.apple.com/ipad features a horizontal scrollview (their implementation) at the top of the page. It supports horizontal scroll through different promotional images of the ipad. I can also drag the scrollview area vertically to activate the html page-level scroll and scroll the page down.

The YUI scrollview implementation does not support this action - meaning I can't initiate a page level scroll whilst in the scroll view area. On touch devices, if the horz scroll view happens to cover the entire viewport of the browser, then content below the scrollview can never be reached.

Class extensions require NAME if their prototype has an own property 'constructor' and are mixed into Widgets



var BuiltClass = Y.Base.create('boomer', Y.Widget, []);

function Ext() {}

Ext.prototype = {

    constructor: Ext, // If this is included in the prototype redefinition...

    ...

};

Ext.NAME = 'ext'; // ...this is also required.

Y.Base.mix(BuiltClass, [Ext]);

var instance = new BuiltClass({...});

Omitting the static NAME will result in the following JS error:
Uncaught TypeError: Cannot call method 'toLowerCase' of undefined

Omitting the constructor from the prototype redefinition will obviate the need for the NAME.

What I suspect is happening is that Ext's prototype is being mixed onto the BuiltClass's prototype, clobbering its constructor, so when the Widget constructor is eventually called from the BuiltClass's superclass.constructor.apply() chain, line



widget._cssPrefix = constructor.CSS_PREFIX || _getClassName(constructor.NAME.toLowerCase());

is referring to Ext.NAME, which is not desirable anyway, as that would cause anything rooting in the NAME to now use Ext.NAME (should it be defined).

Best to ignore the constructor property of extension prototypes, IMO.

This same behavior exists in 3.2.0 and 3.3.0.

node-focusmanager-1.html example doesn't move through toolbar buttons with arrows

The example suggests that you should be able to move between buttons with left and right arrows. After clicking on a button and dismissing the alert, the button seems to still have focus, but the arrow keys do nothing.

Add ability to detect devices with "Retina" or hi-resolution screens

It would be useful if we put information on the `Y.UA` object for whether or not a device has a hi-resolution screen. Application developer may choose to serve different images or CSS to devices which have a hi-res "Retina" display.

Apple products like the iPhone 4 have a hi-resolution "Retina" display and MobileSafari has a `devicePixelRatio` property on the `window` object which has the value of `2`.

It would be worth checking to see if other manufacturers of hi-res display devices are using the same `devicePixelRatio` property in their browsers. Maybe it's a Webkit thing?

This originated from Ryuichi Okumura's (okuryu) GitHub Pull Request: https://github.com/yui/yui3/pull/26

Separate routing functionality from browser history functionality.

If routing was its own module, it would be viable in Node JS as a lightweight alternative to Express or other frameworks. I frequently want to route requests to different callback functions based on the request url, but I don't frequently use the other features or middleware provided by Express. If the same routing could be used on client and server, it would simplify tasks such as initial view rendering on the server

simulate does not support touch device events

gesturemovestart
gesturemoveend

and others

Investigate why dial._angle is available/updated only after dial._uiSetValue(val);

May need to call this._uiSetValue(val) instead of just dial.set('value', val); in handlers for mousedown and handledrag
Jenny suggests making dial._angle a formal r/o property of Dial

Y.Array.each backwards

I've run into a case where I need to iterate backwards through an array. It would be nice if there was a utility to do this which worked similarly to Y.Array.each.

Make ModelList model member work as a function as well as a class

I posted a comment in the forum about this a couple weeks ago http://yuilibrary.com/forum/viewtopic.php?f=92&t=8881
Since then I have come across a number of situations where this is very useful.
As I stated in the forum post creating a list of subclassed items from the source JSON data the function can interrogate the data and determine the type to create. I can do conversions of one model type passed into the list and create a new Model type to store in the List.

I have implemented this capability as a function in place of the model property of the List, it was also sugested that the create part of the _add method could be broken out into a separate method so it could be overriden more easily. This would work well too if it was able to process not only the JSON inputs to add but any Model input as well.

Method to compare Model instances for equality

It would be useful for to have a method (either static or on the prototype) to aid in comparing the equality of two Model instances.

Captured discussion in IRC:

rgrove: Comparing Model equality seems like a problem we need to solve regardless of whether we use a flyweight ModelList, so we should probably have a static Model.compareTo() method or something in any case.

eric_f: Arguably I think even pre-flyweight ML, we'd benefit from a `.equals()` method on Model. It could probably do triple-equals check first, if false, compare the `id` attributes.

rgrove: Yep. Compare id attributes and class name, to avoid dupe ids across different base models.

We *could* also compare clientIds, but then two models representing the exact same data but created at different times could be considered non-equal.

One tricky spot: I create a model instance and load() some data into it for id "foo". Then I create another instance and load the same data, for id "foo". Then I change the first model instance, but don't update the second one. They now contain different data, but have the same id and class name.

We could keep model instances centrally bound to one another when they share an id, but then you'd never be able to use two instances to represent different states or views of a given model.

World co-ordinates are treated as pixels in SVG event dispatch in Webkit browsers

The issue arose when I decided to apply the viewing transformation in an SVG-based application to the SVG node's viewBox, instead of a group node.

With a null transformation, or with a transformation on a group whose a and d coefficients are much greater than 1, everything works, or appears to work.

In a world whose co-ordinates range between 0 and 1, the transformed pointer event co-ordinates used in hit-testing (but not those reported as properties of the event object) are rounded to the nearest whole number when the viewing transformation is set using the viewBox attribute on the parent SVG node.

The same is true of all transformations; but the effect becomes large enough to notice when the world is small. Note that the event object has the correct data; the problem is that the event fires on the wrong node due to this apparent rounding done internally.

This only happens in Webkit browsers. It works as expected in Mozilla.

[bz 4586100] Y.dump() should pretty-print, like Y.JSON.stringify(obj, null, 4)

Mirrored from bugzilla:

<<<<<<<<<<

Y.dump() has a huge advantage over stringify: it catches errors. stringify fails (and prints nothing) when it hits a
reference to a Y.Node object, because there are circular references.

>>>>>>>>>>

Y.dump output also includes functions. I think this is all doable with a replacer function in Y.JSON.stringify(data,
/* HERE */, 4);

I personally don't use dump, preferring stringify instead. Do you think it would be acceptable if dump were just a
wrapper over stringify with a replacer to handle circular refs and other formatting hooks for things like Nodes or
functions?

I don't like the idea of changing the output of a serialization function, but I can't imagine it's being relied on in
production business logic. It's primary function is for development. What's your take?

<<<<<<<<<<

Yes, making dump a wrapper around stringify sounds like an excellent solution. For debugging, it's really useful to
have a function like stringify, but that won't throw exceptions :)

In principle, you don't have to change the existing output of dump. If you just add the option to pretty-print, then
when the option is off, it still generates the original result.

Dial "reset" button should be marked up with an ARIA role of button

Otherwise, they appear as text strings to a screen reader.
reported by Victor

Highlight words() does't work while in case-insensitive mode and needles is an array

test cases

http://_Sgithub.com/huang47/yui3/commit/d46026a21ffe033c8afc7187acd3edbf7dab5fbd

description



Assert.areSame(

    'foo <b class="yui3-highlight">BAR</b> baz',

    Hi.words('foo BAR baz', 'bar')

);

Assert.areSame(

    'foo <b class="yui3-highlight">BAR</b> baz',

    Hi.words('foo BAR baz', 'Bar')

);

but



Assert.areSame(

    'foo <b class="yui3-highlight">BAR</b> baz',

    Hi.words('foo BAR baz', ['Bar'])

);

doesn't

my guess

http://_Sgithub.com/huang47/yui3/commit/408b602737f7832ef82720fe7d7032519a2c7892

Highlight words() doesn't work if disable escapeHTML

added test cases

added test case

description

Not quite sure if this is supposed to be support because it's not even documented in YUI3 API

Base destructors should receive arguments passed to destroy()

Sometimes it's useful to be able to pass options or even a callback to a Base-based class's destroy() method. Right now, this requires overriding destroy() and then attaching an event handler to the `destroy` event to allow destruction to be prevented, since arguments aren't passed along to destructors. It'd be more convenient if destructors automatically received any arguments that were passed to destroy().

Model and View would both use this (they currently use an override).

A SQL date parser for DataSchema

SQL databases typically output Date data that is in ISO format, "YYYY-MM-DD" (strftime '%F') or extended full date/time format as "YYYY-MM-DD HH:MM:SS" (strftime '%F %T'). The Javascript Date.parse function, and therefore the DataType.Date.parse function doesn't parse these dates properly when used in conjunction with a DataSchema field (i.e. { key:'myDate', parser:"date"}, etc... ).

For years I have used a function by Satyam as follows;



//

//  Custom Parser for ISO and SQL formatted date strings ...

//  in the following format:

//           YYYY-MM-DD HH:MM:SS    [corresponding "strftime" format: "%F %T" ]

//        also YYYY-MM-DD  (excluding "time" part)    ["strftime" format "%F" ]

//    

//  The parser accomplishes this as;

//    1. Split input "o" into two parts: parts[0] is YYYY-MM-DD, parts[1] is HH:MM:SS (if provided) 

//      2. If timepart included (parts[1]), split it at ":" separator

//      3. Return the Javascript Date 

//

//  This is taken directly from Satyam's YUIBlog article:

//    http://yuiblog.com/blog/2008/10/15/datatable-260-part-one/

//

    var parseSQLDate = function (o) {

        var parts = o.split(' ');            

            datePart = parts[0].split('-');

            

        if (parts.length > 1) {

            var timePart = parts[1].split(':');

            return new Date( datePart[0], datePart[1]-1, datePart[2], timePart[0], timePart[1], timePart[2] );

        } else {

            return new Date( datePart[0], datePart[1]-1, datePart[2]);

        }

    }

Which works perfectly fine.

Any chance of adding this to either DataType.parse or to the DataSchema standard "parsers", maybe as "parser:'sql_date'" or something ?

Calling showView before render

When using app-transitions, calls to showView that occur before render do not get completed properly. This causes all further calls to showView to get queued up instead of transitioning the active view.

[bz 5355838] Graphics - Add support to WebGL with a 3d framework.

Add support to WebGL with a 3d framework.

cssbutton example - height is slightly different than /

Screenshot @

Optionally fire one 'add' event when multiple Models are added to a ModelList using the add() method.

When passing in an array Models to the ModelList add() method, it would be nice to specify an option to only fire one 'add' event and attach the Models which were added to the event payload.

This helps make Views listening to the 'add' event a little more efficient if the View's event handler is appending new content to its container for each Model added. That way the View would only react to one event, append a new piece of content to a fragment for each Model added, then append the fragment to the container.

I understand that you could potentially use .reset() if you want only one 'add' method to be fired; however, replacing the entire list is not always optimal and may not play nice if the data source driving the ModelList is paginated.

Y.Model.undo() should support reverting back to the last saved state

Per my discussion with EricF, it would be nice if the changes made to a model could be reverted to a prior saved state. Currently, undo() only reverts to the immediately previous changed value. For more details, please see the YUI forum post in the comments section below.

Add warning/error message when rendering an undefined view using showView()

In the debug version of YUI, there should be at least a warning, ideally an error sent to the console when displaying an undefined view.

Details on the situation:
Inside an App, calling this.showView("someViewThatDoesntExist"); silently does nothing.

Suggestion for an helpful message:
The view "someViewThatDoesntExist" was not defined. Please add it to the "views" object inside the App. Thank you and have a great day!

Loading indicator for autocomplete

This enhancement request is similiar to my no results one: http://yuilibrary.com/projects/yui3/ticket/2532519

It would be nice if instead of showing nothing, the AutoComplete widget could display a loading div on "query" and remove it on "results". This is useful when we use sources from the server and it takes a while for the results to come in.

The loading div should also have a time delay so that it doesn't show for requests that will get results quickly, resulting in a flash of a loader.

The loading div will the the user know that the autocomplete has not stalled and is getting results from the server.

This is an example of a loading indicator on facebook:

Cannot use attachEvents method twice in App View module

On line 200 of the App View module, the attachEvents method calls the detachEvents method. This causes all events previously attached to the view instance to be destroyed. This seems like an undesirable side-effect for the attachEvents method for the following reasons:

1) The attachEvents method accepts an events parameter. This implies that I can call attachEvents multiple times to fully establish to event handling I desire. But since attachEvents destroys all previously attached events each time it is called, only the event handling configured with the final call to attachEvents will survive.

2) I sub-class YUI App View with an Input View which is sub-classed into each type of input. Some events are global to all input types while other events are only applicable to certain input types. The base input module uses the attachEvents method to setup generic input event handling. The specific input type (e.g. "select" or "textarea") uses attachEvents to add event handling necessary for only that input type. If attachEvents detaches all existing event handlers each time, I must either setup a complex object mix/merge somewhere or duplicate the event configuration object across multiple modules.

The detachEvents method is chainable. It can be called optionally by the developer prior to attaching events. This would be a more versatile solution than mandating event detachments with every call to attachEvents.

CURRENT YUI 3.6.0 CODE:

attachEvents: function (events) {
var container = this.get('container'),
owns = Y.Object.owns,
handler, handlers, name, selector;

this.detachEvents(); //Why?

events || (events = this.events);

for (selector in events) {
if (!owns(events, selector)) { continue; }

handlers = events[selector];

for (name in handlers) {
if (!owns(handlers, name)) { continue; }

handler = handlers[name];

if (typeof handler === 'string') {
handler = this[handler];
}

this._attachedViewEvents.push(
container.delegate(name, handler, selector, this));
}
}

return this;
},

SUGGESTED PATCH:

attachEvents: function (events) {
var container = this.get('container'),
owns = Y.Object.owns,
handler, handlers, name, selector;

this._attachedViewEvents = this._attachedViewEvents || [];

events || (events = this.events);

for (selector in events) {
if (!owns(events, selector)) { continue; }

handlers = events[selector];

for (name in handlers) {
if (!owns(handlers, name)) { continue; }

handler = handlers[name];

if (typeof handler === 'string') {
handler = this[handler];
}

this._attachedViewEvents.push(
container.delegate(name, handler, selector, this));
}
}

return this;
},

Provide a replacement for instanceof so that it can work across window instances or YUI sandboxes.

Both Model and ModelList declare trick variables _isYUIModle (http://yuilibrary.com/yui/docs/api/classes/Model.html#property__isYUIModel) and _isYUIModelList (http://yuilibrary.com/yui/docs/api/classes/ModelList.html#property__isYUIModelList) declared as:

"Total hack to allow us to identify ModelList instances without using instanceof, which won't work when the instance was created in another window or YUI sandbox."

It would be good if Y.Base provided a mechanism for this. Looping over the _classes property and comparing against the class would probably fail across windows and sandboxes as the regular instanceof would.

Thus, may I suggest that an _instanceOf protected method be added that receives a name and goes through the _classes array and compares it against the NAME property of each item and returns true on the first match.

It would be nice to have a similar method to find out if a class has been extended by a particular extension but, unlike plugins, extensions do not require a NAME property or anything like it. However, it would be a good idea if something like it could be added to extensions, for future use.

Talking about plugins, though their NAME property is used to create a namespace within the host object, finding such a property name in an object is no guarantee that it has been produced by a plugin so a method to confirm by name that a plugin is there (by further looking into the plugin for a signature that confirms it being a plugin) might also be in order.

Opera doesn't return selection

Hi Dav,

In Opera, if you have a selection and use this code:

editorY = editor.getInstance();
sel = new editorY.EditorSelection();
out = sel.getSelected();

then out will be undefined

Noticed in Opera 12.02, build 1578, Max OS X 10.8.1

I've tested it with a timeout, just to be sure I didn't loose focus because selecting something.
See the testinformation: select a word right away and wait for the timeout to response.

Regards,
Marco.

[bz 4588838] Console should leverage WidgetStdMod

Perhaps it could be useful to add IFRAME Shim as it's
done for Containers (Dialog) for Logger in IE, because
<select> boxes brokes Logger's appearence. It's not
the first priority, but why not? %)

Support dataSrc attributes on all containers

It would be nice to have dataSrc supported on all containers - it would just start loading whenever the container became visible. This should be settable from either the source markup or from JavaScript, as suggested by another bug posting on tabView

Add nodeType constants somewhere

There is no cross browser method of using nodeType constants instead of magic numbers. Any code that walks the dom and needs to inspect nodeType on various nodes is forced to either make its own constants or use magic numbers.

Constants should either be placed somewhere helpful in the YUI namespace or even better added somehow to the node prototype for browsers that do not fully support the dom spec (http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1950641247).

Looking at YUI 2.5.0 there are 14 components that utilize nodeType and its associated magic numbers. So this would also help clean up the YUI codebase itself.

Add support for specifying number of ticks

Rather than configuring the pixel distance between ticks, allow configuring the number of ticks and have Slider do the math based on the dimensions/constraints.

This will be a Slider plugin in 3.x

[imported, BZ 2253476]

Add textResize and windowResize and window scroll events

This is a duplicate of ticket #2527758 to make sure that the work done for YUI 2.8 is also implemented in YUI 3.

Should height of Overlay body be implemented as minimum/autofill height?

if a height is set, and the actual content is too "tall", the content flow out of the content box.

ideally, the height should be implemented as minimum height or auto fill height and when the content is too tall, the height shall not take effect. so, by default, there won't be problem when the height is not high enough.

for sure in some use cases, people want a fixed height. and obviously there should be an option to support that. i personally think it should not be the default.

in YUI2, there are autofillheight and height.

Add method logIf

Sometimes you want to log a message is certain condition is met. Like:

if (<condition>) Y.log('something');

In the minified version, the code ends up:

if(<condition>){}

A logIf method could be used:

Y.logIf(<condition>,'something');

and then have the whole stripped when creating the raw version.

make loadOptional more granular

Original description 2008-04-07 23:38

The current syntax forces you to load all optional dependencies. This has the undesirable effect of automatically all
components' optional behaviours active instead of just one's. Increased granularity should be available in the Loader
API (i.e. specify options for each component).

[imported, bz 1859738]

Panels need key windowing concepts available OOTB - minimize, restore, maximize, resizable

Would be nice to habe minimize, restore and maximize buttons on resizable panels.

ConsoleFilters flushes previously logged messages

It should be possible for the ConsoleFilters plugin to scrape the messages in the Console body to prime its message cache.

Explicit Version Request for YUI instance

As I understand it and am see right now I implicitly get the last "loaded" version of YUI. I'd like to see the ability to do something like:

YUI("3.X") - which would return the latest 3 version instance of those loaded
YUI("latest") - it would instantiate the latest version of YUI currently loaded on the page.
YUI("3.2.1") - would instantiate the explicit version of YUI is loaded already otherwise it would attempt to load it.

extend calendar to allow picking days, weeks, months, quarters, years and time

imported from bugzilla ticket 723025

For reporting projects we needed to allow the user to select a day, a week, a month, a quarter, a year, or a custom
date range.

We are in the process of using the calendar widget to do this, but would love if you could add it to your calendar.
Link to an example on an internal site is available in the bugzilla version of this ticket.

And, also add ability to pick time in daily mode.

[bz 1078217] Internationalization defects in Calendar

mirroring bugzilla bug 1078217 for tracking/scheduling purposes
refer to bugzilla ticket for specific details of bug and links to internal content for additional information

support window.onerror

imported from bugzilla ticket 1212083

Original description by Adam Moore at 2007-05-29 11:48

window onerror is a non-standard event. Not all browsers support it, and those that do have a different signature than standard DOM events (three parameters: message, url, line, rather than a single error object). Investigate providing a special abstraction for this event.

Normalization of element.set('value', number); on select nodes.

Now that Y.get('#select-el').get('value') returns the currently selected value, it would be great if .set('value', 'some value') did the right thing (and perhaps threw an exception if the value isn't a valid option).

I looked at providing a patch, but the Dom code is a bit hairy to jump in. I'm happy to contribute a patch, but wanted to file the ticket first.

Thanks

Use element.classList if available to speed up class manipulation

Element.classList is a new API introduced in HTML5 for manipulating the classes of an element. The API is documented on https://developer.mozilla.org/en/DOM/element.classList.

This API is implemented in Firefox 3.6 and WebKit is planning to implement it.

YUI could detect if this property is available and use it in the YAHOO.util.Dom.{add,has,remove}Class functions. A speedup of up to 12 could be achieved with Firefox according to this benchmark: https://bug501257.bugzilla.mozilla.org/attachment.cgi?id=395627).

Independent calls to YUI().use() to yield the same YUI instance for one application

http://yuilibrary.com/forum/viewtopic.php?f=18&t=731

An application consists of many JS files. Each uses its own YUI().use() to surround its code. Each gets its own instance. However, one and the same application should get (or at least be able to get) the same instance: The first use() call creates a new instance, but any other calls to use() yield that same instance.

Y.use() where Y *is* an instance is not sufficent - when I have class files loaded there is no instance created yet, unless I load those class files of my application like YUI files. However, for various reasons (e.g. I include my own files statically but use dynamic loading for YUI) I would prefer this:

How about (optionally) giving names to YUI instances? Either as another config in YUI({conf....}), or as parameter to use(). If there is no instance with the given name, create a new one, of there already is one, use that instance! That seems a very simple solution for obtaining one and the same YUI instance - FROM YUI, and not having to maintain a mechanism myself, which is not trivial in this asynchronous environment!

Add event for printing a line or give a config option to the last log message printed

I'm working on a "debugger" for YUI3 & it would be nice to be able to get access to the message that was logged. So then I can do "interactive" logging for things like IO.

Then I can log this:
IO: GET http://foo.com/endpoint *[spinner]

Then when IO completes, I can remove the spinner and add the Status code. Very much like Firebug does now.

addClass adds more than one class - but removeClass removes only one at a time

The subject says it.

This works:

{node.addClass('class1 class2')}

The reverse operation does not work:

{node.removeClass('class1 class2')}

However, it would be soooo much more convenient if removeClass would remove several classes at once compared to having to chain several removeClass calls :-)
I enter it as "defect" even if it isn't one, strictly speaking, but there should be symmetry of addClass/removeClass I'd venture to say.

on('available', fn, selector) should give fn the Node(List) instance

Not a necessity for sure, not certain how useful this is overall...

In a handler for 'available' right now I have to do a selector-call to get the Node or NodeList. Couldn't the callback function be supplied with an argument - the Node(List) instance - instead? The YUI on-available detector already did this work.

Event.Target.fire fails for events defined in Node.DOM_EVENTS

This works:

var node = Y.one('#demo');
node.on('foo', function(e) {
console.log(e);
});
node.fire('foo', {});
});

But not this:
Y.Node.DOM_EVENTS.foo = true;
var node = Y.one('#demo');
node.on('foo', function(e) {
console.log(e);
});
node.fire('foo', {});
});
});

or this:

Popup Menus should be modal

Filing as a design requirement for Menu 3.0: Further study of menus on the desktop indicates that popup menus are always modal. So, Menu 3.0 will be designed with this feature in mind.

Update MenuNav to use Event's built-in delegation support

MenuNav was developed prior to Event having built-in delegation support. As time allows, it'd be nice to update MenuNav to take advantage of Y.delegate