Merge branch 'master' of git://github.com/slevenbits/cappuccino into slevenbits-master

Before this fix, popoverDidShow: would not be sent to popover delegates when the app ran in Firefox due to Firefox now recognising the -webkit-transition property, but not the webkitTransitionEnd event.

Also, before this fix popover animation was only implemented for Webkit based browsers.

This fix resolves that issue and in addition adds full support for animated popovers in all browsers that support CSS transitions. The fix also improves Cappuccino's general support for CSS3 animations.

AppKit/CPCompatibility.j

@@ -83,7 +83,8 @@ CPCanvasParentDrawErrorsOnMovementBug   = 1 << 0;
 var USER_AGENT                          = "",
     PLATFORM_ENGINE                     = CPUnknownBrowserEngine,
     PLATFORM_FEATURES                   = 0,
-    PLATFORM_BUGS                       = 0;
+    PLATFORM_BUGS                       = 0,
+    PLATFORM_STYLE_JS_PROPERTIES        = {};
 
 // default these features to true
 
@@ -273,3 +274,87 @@ else
     CPUndoKeyEquivalentModifierMask = CPControlKeyMask;
     CPRedoKeyEquivalentModifierMask = CPControlKeyMask;
 }
+
+/*!
+    Return the properly prefixed JS property for the given name. E.g. in a webkit browser,
+    CPBrowserStyleProperty('transition') -> WebkitTransition
+
+    While technically not a style property, style related event handler names are also supported.
+    CPBrowserStyleProperty('transitionend') -> 'webkitTransitionEnd'
+
+    CSS is only available in platform(dom), so don't rely too heavily on it.
+*/
+function CPBrowserStyleProperty(aProperty)
+{
+    var lowerProperty = aProperty.toLowerCase();
+
+    if (PLATFORM_STYLE_JS_PROPERTIES[lowerProperty] === undefined)
+    {
+        var r = nil;
+
+#if PLATFORM(DOM)
+        var testElement = document.createElement('div');
+
+        switch (lowerProperty)
+        {
+            case 'transitionend':
+                var candidates = {
+                        'WebkitTransition' : 'webkitTransitionEnd',
+                        'MozTransition'    : 'transitionend',
+                        'OTransition'      : 'oTransitionEnd',
+                        'msTransition'     : 'MSTransitionEnd',
+                        'transition'       : 'transitionend'
+                    };
+
+                r = candidates[PLATFORM_STYLE_JS_PROPERTIES['transition']] || nil;
+                break;
+            default:
+                var prefixes = ["Webkit", "Moz", "O", "ms"],
+                    capProperty = [aProperty capitalizedString];
+
+                for (var i = 0; i < prefixes.length; i++)
+                {
+                    if (prefixes[i] + capProperty in testElement.style)
+                    {
+                        r = prefixes[i] + capProperty;
+                        break;
+                    }
+                }
+
+                if (!r && lowerProperty in testElement.style)
+                    r = lowerProperty;
+
+                break;
+        }
+#endif
+
+        PLATFORM_STYLE_JS_PROPERTIES[lowerProperty] = r;
+    }
+
+    return PLATFORM_STYLE_JS_PROPERTIES[lowerProperty];
+}
+
+function CPBrowserCSSProperty(aProperty)
+{
+    var browserProperty = CPBrowserStyleProperty(aProperty);
+
+    if (!browserProperty)
+        return nil;
+
+    var prefixes = {
+            'Webkit': '-webkit-',
+            'Moz': '-moz-',
+            'O': '-o-',
+            'ms': '-ms-'
+        };
+
+    for (var prefix in prefixes)
+    {
+        if (browserProperty.substring(0, prefix.length) == prefix)
+        {
+            return prefixes[prefix] + browserProperty.substring(prefix.length).toLowerCase();
+        }
+    }
+
+    return browserProperty.toLowerCase();
+}

AppKit/CPScrollView.j

@@ -213,7 +213,7 @@ var CPScrollerStyleGlobal                       = CPScrollerStyleOverlay,
 
     @param aStyle the scroller style to set all scroller views to use (CPScrollerStyleLegacy or CPScrollerStyleOverlay)
 */
-+ (int)setGlobalScrollerStyle:(int)aStyle
++ (void)setGlobalScrollerStyle:(int)aStyle
 {
     CPScrollerStyleGlobal = aStyle;
     [[CPNotificationCenter defaultCenter] postNotificationName:CPScrollerStyleGlobalChangeNotification object:nil];

AppKit/CPTabView.j

@@ -88,9 +88,6 @@ var CPTabViewDidSelectTabViewItemSelector           = 1,
     _box = [[CPBox alloc] initWithFrame:[self  bounds]];
     [self setBackgroundColor:[CPColor colorWithCalibratedWhite:0.95 alpha:1.0]];
 
-    [_box setAutoresizingMask:CPViewWidthSizable | CPViewHeightSizable];
-    [_tabs setAutoresizingMask:CPViewMinXMargin | CPViewMaxXMargin];
-
     [self addSubview:_box];
     [self addSubview:_tabs];
 }
@@ -343,21 +340,9 @@ var CPTabViewDidSelectTabViewItemSelector           = 1,
     _type = aTabViewType;
 
     if (_type !== CPTopTabsBezelBorder && _type !== CPBottomTabsBezelBorder)
-    {
-        [_box setFrame:[self bounds]];
         [_tabs removeFromSuperview];
-    }
     else
-    {
-        var aFrame = [self frame],
-            segmentedHeight = _CGRectGetHeight([_tabs frame]),
-            origin = _type === CPTopTabsBezelBorder ? segmentedHeight / 2 : 0;
-
-        [_box setFrame:_CGRectMake(0, origin, _CGRectGetWidth(aFrame),
-                                   _CGRectGetHeight(aFrame) - segmentedHeight / 2)];
-
         [self addSubview:_tabs];
-    }
 
     switch (_type)
     {
@@ -373,6 +358,29 @@ var CPTabViewDidSelectTabViewItemSelector           = 1,
             [_box setBorderType:CPNoBorder];
             break;
     }
+
+    [self setNeedsLayout];
+}
+
+- (void)layoutSubviews
+{
+    // Even if CPTabView's autoresizesSubviews is NO, _tabs and _box has to be laid out.
+    // This means we can't rely on autoresize masks.
+    if (_type !== CPTopTabsBezelBorder && _type !== CPBottomTabsBezelBorder)
+    {
+        [_box setFrame:[self bounds]];
+    }
+    else
+    {
+        var aFrame = [self frame],
+            segmentedHeight = _CGRectGetHeight([_tabs frame]),
+            origin = _type === CPTopTabsBezelBorder ? segmentedHeight / 2 : 0;
+
+        [_box setFrame:_CGRectMake(0, origin, _CGRectGetWidth(aFrame),
+                                   _CGRectGetHeight(aFrame) - segmentedHeight / 2)];
+
+        [self _repositionTabs];
+    }
 }
 
 /*!
@@ -497,7 +505,6 @@ var CPTabViewItemsKey               = "CPTabViewItemsKey",
         [_items makeObjectsPerformSelector:@selector(_setTabView:) withObject:self];
 
         [self _updateItems];
-        [self _repositionTabs];
 
         [self setDelegate:[aCoder decodeObjectForKey:CPTabViewDelegateKey]];
 
@@ -506,6 +513,8 @@ var CPTabViewItemsKey               = "CPTabViewItemsKey",
             [self selectTabViewItem:selected];
 
         [self setTabViewType:[aCoder decodeIntForKey:CPTabViewTypeKey]];
+
+        [self setNeedsLayout];
     }
 
     return self;

AppKit/CPTextField.j

@@ -308,6 +308,11 @@ CPTextFieldStatePlaceholder = CPThemeState("placeholder");
     if (shouldBeEditable)
         _isSelectable = YES;
 
+    if (_isEditable)
+        [self setThemeState:CPThemeStateEditable];
+    else
+        [self unsetThemeState:CPThemeStateEditable];
+
     // We only allow first responder status if the field is editable and enabled.
     if (!shouldBeEditable && [[self window] firstResponder] === self)
         [[self window] makeFirstResponder:nil];

AppKit/CPTokenField.j

@@ -570,6 +570,7 @@ var CPScrollDestinationNone             = 0,
                 [newToken setTokenField:self];
                 [newToken setRepresentedObject:tokenObject];
                 [newToken setStringValue:tokenValue];
+                [newToken setEditable:[self isEditable]];
                 [contentView addSubview:newToken];
             }
 
@@ -615,6 +616,13 @@ var CPScrollDestinationNone             = 0,
     }
 }
 
+- (void)setEditable:(BOOL)shouldBeEditable
+{
+    [super setEditable:shouldBeEditable];
+
+    [[self _tokens] makeObjectsPerformSelector:@selector(setEditable:) withObject:shouldBeEditable];
+}
+
 - (void)sendAction:(SEL)anAction to:(id)anObject
 {
     _shouldNotifyTarget = NO;
@@ -1331,6 +1339,34 @@ var CPScrollDestinationNone             = 0,
     _representedObject = representedObject;
 }
 
+- (void)setEditable:(BOOL)shouldBeEditable
+{
+    [super setEditable:shouldBeEditable];
+    [self setNeedsLayout];
+}
+
+- (BOOL)setThemeState:(CPThemeState)aState
+{
+    var r = [super setThemeState:aState];
+
+    // Share hover state with the delete button.
+    if (r && aState === CPThemeStateHovered)
+        [_deleteButton setThemeState:aState];
+
+    return r;
+}
+
+- (BOOL)unsetThemeState:(CPThemeState)aState
+{
+    var r = [super unsetThemeState:aState];
+
+    // Share hover state with the delete button.
+    if (r && aState === CPThemeStateHovered)
+        [_deleteButton unsetThemeState:aState];
+
+    return r;
+}
+
 - (CGSize)_minimumFrameSize
 {
     var size = _CGSizeMakeZero(),
@@ -1356,6 +1392,7 @@ var CPScrollDestinationNone             = 0,
     {
         [_deleteButton setTarget:self];
         [_deleteButton setAction:@selector(_delete:)];
+        [_deleteButton setEnabled:[self isEditable]];
 
         var frame = [bezelView frame],
             buttonOffset = [_deleteButton currentValueForThemeAttribute:@"offset"],
@@ -1377,7 +1414,8 @@ var CPScrollDestinationNone             = 0,
 
 - (void)_delete:(id)sender
 {
-    [_tokenField _deleteToken:self];
+    if ([self isEditable])
+        [_tokenField _deleteToken:self];
 }
 
 @end

AppKit/Themes/Aristo/ThemeDescriptors.j

@@ -1089,7 +1089,7 @@ var themedButtonValues = nil,
             [@"text-color",     textHighlightedColor,               CPThemeStateHighlighted],
 
             [@"bezel-inset",    CGInsetMakeZero(),                  CPThemeStateBezeled],
-            [@"content-inset",  CGInsetMake(2.0, 22.0, 2.0, 15.0),  CPThemeStateBezeled],
+            [@"content-inset",  CGInsetMake(2.0, 20.0, 2.0, 20.0),  CPThemeStateBezeled],
 
             // Minimum height == maximum height since tokens are fixed height.
             [@"min-size",       CGSizeMake(0.0, 19.0)],
@@ -1112,16 +1112,17 @@ var themedButtonValues = nil,
 
         themeValues =
         [
-            [@"bezel-color",    bezelColor,                         CPThemeStateBordered],
-            [@"bezel-color",    bezelHighlightedColor,              CPThemeStateBordered | CPThemeStateHighlighted],
+            [@"bezel-color",    bezelColor,                             CPThemeStateBordered | CPThemeStateHovered],
+            [@"bezel-color",    [bezelColor colorWithAlphaComponent:0], CPThemeStateBordered | CPThemeStateDisabled],
+            [@"bezel-color",    bezelHighlightedColor,                  CPThemeStateBordered | CPThemeStateHighlighted],
 
             [@"min-size",       CGSizeMake(8.0, 8.0)],
             [@"max-size",       CGSizeMake(8.0, 8.0)],
 
-            [@"bezel-inset",    CGInsetMake(0.0, 0.0, 0.0, 0.0),    CPThemeStateBordered],
-            [@"bezel-inset",    CGInsetMake(0.0, 0.0, 0.0, 0.0),    CPThemeStateBordered | CPThemeStateHighlighted],
+            [@"bezel-inset",    CGInsetMake(0.0, 0.0, 0.0, 0.0),        CPThemeStateBordered],
+            [@"bezel-inset",    CGInsetMake(0.0, 0.0, 0.0, 0.0),        CPThemeStateBordered | CPThemeStateHighlighted],
 
-            [@"offset",         CGPointMake(17, 6),                 CPThemeStateBordered]
+            [@"offset",         CGPointMake(17, 6),                     CPThemeStateBordered]
         ];
 
     [self registerThemeValues:themeValues forView:button];

AppKit/_CPAttachedWindow.j

@@ -134,7 +134,7 @@ var _CPAttachedWindow_attachedWindowShouldClose_    = 1 << 0,
         [self setMovableByWindowBackground:YES];
         [self setHasShadow:NO];
 
-        [self setCSS3Property:@"TransitionProperty" value:@"-webkit-transform, opacity"];
+        [self setCSS3Property:@"TransitionProperty" value:CPBrowserCSSProperty('transform') + @", opacity"];
 
         [_windowView setNeedsDisplay:YES];
     }
@@ -350,25 +350,18 @@ var _CPAttachedWindow_attachedWindowShouldClose_    = 1 << 0,
 }
 
 /*! @ignore */
-- (void)setCSS3Property:(CPString)property value:(CPString)value
+- (void)setCSS3Property:(CPString)aProperty value:(CPString)value
 {
-    _DOMElement.style['webkit' + property] = value;
+    var browserProperty = CPBrowserStyleProperty(aProperty);
 
-    // Support other browsers here eventually
+    if (browserProperty)
+        _DOMElement.style[browserProperty] = value;
 }
 
 /*! @ignore */
 - (BOOL)browserSupportsAnimation
 {
-    return typeof(_DOMElement.style.webkitTransition) !== "undefined";
-
-    /*
-        No others browsers supported yet.
-
-           typeof(_DOMElement.style.MozTransition) !== "undefined" ||
-           typeof(_DOMElement.style.MsTransition) !== "undefined" ||
-           typeof(_DOMElement.style.OTransition) !== "undefined";
-    */
+    return CPBrowserStyleProperty('transition') && CPBrowserStyleProperty('transitionend');
 }
 
 #pragma mark -
@@ -388,6 +381,14 @@ var _CPAttachedWindow_attachedWindowShouldClose_    = 1 << 0,
 #pragma mark -
 #pragma mark Overrides
 
+/*!
+    Attached windows, such as pop overs, can usually become the key window.
+*/
+- (BOOL)canBecomeKeyWindow
+{
+    return YES;
+}
+
 /*!
     Called when the window is losing focus.
 */
@@ -452,28 +453,28 @@ var _CPAttachedWindow_attachedWindowShouldClose_    = 1 << 0,
 
                 // Set up the pop-out transition
                 [self setCSS3Property:@"Transform" value:@"scale(1.1)"];
-                [self setCSS3Property:@"Transition" value:@"-webkit-transform 200ms ease-in"];
+                [self setCSS3Property:@"Transition" value:CPBrowserCSSProperty('transform') + @" 200ms ease-in"];
 
                 var transitionEndFunction = function()
                 {
-                    _DOMElement.removeEventListener("webkitTransitionEnd", transitionEndFunction, YES);
+                    _DOMElement.removeEventListener(CPBrowserStyleProperty('transitionend'), transitionEndFunction, YES);
 
                     // Now set up the pop-in to normal size transition.
                     // Because we are watching the -webkit-transform, it will occur now.
                     [self setCSS3Property:@"Transform" value:@"scale(1)"];
-                    [self setCSS3Property:@"Transition" value:@"-webkit-transform 50ms linear"];
+                    [self setCSS3Property:@"Transition" value:CPBrowserCSSProperty('transform') + @" 50ms linear"];
 
                     var transitionCompleteFunction = function()
                     {
-                        _DOMElement.removeEventListener("webkitTransitionEnd", transitionCompleteFunction, YES);
+                        _DOMElement.removeEventListener(CPBrowserStyleProperty('transitionend'), transitionCompleteFunction, YES);
                         if (_implementedDelegateMethods & _CPAttachedWindow_attachedWindowDidShow_)
                              [_delegate attachedWindowDidShow:self];
                     }
 
-                    _DOMElement.addEventListener("webkitTransitionEnd", transitionCompleteFunction, YES);
+                    _DOMElement.addEventListener(CPBrowserStyleProperty('transitionend'), transitionCompleteFunction, YES);
                 };
 
-                _DOMElement.addEventListener("webkitTransitionEnd", transitionEndFunction, YES);
+                _DOMElement.addEventListener(CPBrowserStyleProperty('transitionend'), transitionEndFunction, YES);
             }, 0);
         }
         else
@@ -506,11 +507,11 @@ var _CPAttachedWindow_attachedWindowShouldClose_    = 1 << 0,
 
         var transitionEndFunction = function()
         {
-            _DOMElement.removeEventListener("webkitTransitionEnd", transitionEndFunction, YES);
+            _DOMElement.removeEventListener(CPBrowserStyleProperty("transitionend"), transitionEndFunction, YES);
             [self _close];
         };
 
-        _DOMElement.addEventListener("webkitTransitionEnd", transitionEndFunction, YES);
+        _DOMElement.addEventListener(CPBrowserStyleProperty("transitionend"), transitionEndFunction, YES);
     }
     else
     {

AppKit/_CPAutocompleteMenu.j

@@ -55,7 +55,7 @@ var _CPAutocompleteMenuMaximumHeight = 307;
         [_menuWindow setLevel:CPPopUpMenuWindowLevel];
         [_menuWindow setHasShadow:YES];
         [_menuWindow setShadowStyle:CPMenuWindowShadowStyle];
-        [_menuWindow setAcceptsMouseMovedEvents:NO];
+        [_menuWindow setAcceptsMouseMovedEvents:YES];
         [_menuWindow setBackgroundColor:[_CPMenuWindow backgroundColorForBackgroundStyle:_CPMenuWindowPopUpBackgroundStyle]];
 
         var contentView = [_menuWindow contentView];

Foundation/CPTimer.j

@@ -254,6 +254,9 @@ var _CPTimerBridgeTimer = function(codeOrFunction, aDelay, shouldRepeat, functio
         theFunction = function() { codeOrFunction.apply(window, functionArgs); if (!shouldRepeat) CPTimersForTimeoutIDs[timeoutID] = nil; }
     }
 
+    // A call such as setTimeout(f) is technically invalid but browsers seem to treat it as setTimeout(f, 0), so so will we.
+    aDelay = aDelay | 0.0;
+
     CPTimersForTimeoutIDs[timeoutID] = [CPTimer scheduledTimerWithTimeInterval:aDelay / 1000 callback:theFunction repeats:shouldRepeat];
 
     return timeoutID;

Objective-J/Jakefile

@@ -111,7 +111,7 @@ function environmentFlags()
 
 var SHRINKSAFE = require("minify/shrinksafe");
 function compressor(code) {
-    return SHRINKSAFE.compress(code, { charset : "UTF-16", useServer : true });
+    return SHRINKSAFE.compress(code, { charset : "UTF-8", useServer : true });
 }
 
 function gcc(inputFilePath, outputFilePath, flags, compress)

Tests/Manual/CPTabView2/AppController.j

@@ -11,15 +11,18 @@
 
 
 @implementation AppController : CPObject
+{
+    CPTabView tabView1;
+}
 
 - (void)applicationDidFinishLaunching:(CPNotification)aNotification
 {
     var theWindow = [[CPWindow alloc] initWithContentRect:CGRectMakeZero() styleMask:CPBorderlessBridgeWindowMask],
         contentView = [theWindow contentView];
 
-    var tabView = [[CPTabView alloc] initWithFrame:CGRectMake(50,50,400,400)];
-    [tabView setTabViewType:CPNoTabsBezelBorder];
-    [tabView setTabViewType:CPTopTabsBezelBorder];
+    tabView1 = [[CPTabView alloc] initWithFrame:CGRectMake(50,50,400,400)];
+    [tabView1 setTabViewType:CPNoTabsBezelBorder];
+    [tabView1 setTabViewType:CPTopTabsBezelBorder];
 
     var tabs = [
         "First Tab", "a label",
@@ -39,14 +42,27 @@
         var item = [[CPTabViewItem alloc] initWithIdentifier:tabs[i]];
         [item setView:view];
         [item setLabel:tabs[i]];
-        [tabView addTabViewItem:item];
+        [tabView1 addTabViewItem:item];
     }
 
-    [contentView addSubview:tabView];
+    [contentView addSubview:tabView1];
 
-    [tabView setAutoresizingMask:CPViewWidthSizable | CPViewHeightSizable];
+    [tabView1 setAutoresizingMask:CPViewWidthSizable | CPViewHeightSizable];
+
+    var toggleButton = [CPButton buttonWithTitle:@"Cycle Tab View Type"];
+    [toggleButton setAction:@selector(switchTabType:)];
+    [toggleButton setTarget:self];
+    [toggleButton sizeToFit];
+    [toggleButton setFrameOrigin:CGPointMake(CGRectGetWidth([contentView frame]) - CGRectGetWidth([toggleButton frame]) - 15, 15)];
+    [toggleButton setAutoresizingMask:CPViewMinXMargin | CPViewMaxYMargin];
+    [contentView addSubview:toggleButton];
 
     [theWindow orderFront:self];
 }
 
+- (@action)switchTabType:(id)sender
+{
+    [tabView1 setTabViewType:[tabView1 tabViewType] < CPNoTabsNoBorder ? [tabView1 tabViewType] + 1 : CPTopTabsBezelBorder];
+}
+
 @end

Tests/Manual/CPTokenFieldTest/AppController.j

@@ -87,6 +87,11 @@ var STATES = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorad
     // Delegate must be set before objectValue
     [tokenFieldD setDelegate:self];
 
+    var tokenFieldDEditable = [CPCheckBox checkBoxWithTitle:"Editable"];
+    [tokenFieldDEditable setFrame:CGRectMake(525, CGRectGetMinY([tokenFieldD frame]), 200, 30)];
+    [tokenFieldDEditable bind:CPValueBinding toObject:tokenFieldD withKeyPath:@"editable" options:nil];
+    [contentView addSubview:tokenFieldDEditable];
+
     allPersons = [
         [Person personWithFirstName:@"Luc" lastName:@"Vauvillier"],
         [Person personWithFirstName:@"John" lastName:@"Doe"],