spade 0.0.1

data/sproutcore/frameworks/core_foundation/system/locale.js

@@ -0,0 +1,293 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2010 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+/**
+  The Locale defined information about a specific locale, including date and
+  number formatting conventions, and localization strings.  You can define
+  various locales by adding them to the SC.locales hash, keyed by language
+  and/or country code.
+  
+  On page load, the default locale will be chosen based on the current 
+  languages and saved at SC.Locale.current.  This locale is used for 
+  localization, etc.
+  
+  h2. Creating a new locale
+  
+  You can create a locale by simply extending the SC.Locale class and adding
+  it to the locales hash:
+  
+  {{{
+    SC.Locale.locales['en'] = SC.Locale.extend({ .. config .. }) ;
+  }}}
+  
+  Alternatively, you could choose to base your locale on another locale by
+  extending that locale:
+  
+  {{{
+    SC.Locale.locales['en-US'] = SC.Locale.locales['en'].extend({ ... }) ;
+  }}}
+  
+  Note that if you do not define your own strings property, then your locale
+  will inherit any strings added to the parent locale.  Otherwise you must
+  implement your own strings instead.
+  
+  @extends SC.Object
+  @since SproutCore 1.0
+*/
+SC.Locale = SC.Object.extend({
+  
+  init: function() {
+    // make sure we know the name of our own locale.
+    if (!this.language) SC.Locale._assignLocales();
+    
+    // Make sure we have strings that were set using the new API.  To do this
+    // we check to a bool that is set by one of the string helpers.  This 
+    // indicates that the new API was used. If the new API was not used, we
+    // check to see if the old API was used (which places strings on the 
+    // String class). 
+    if (!this.hasStrings) {
+      var langs = this._deprecatedLanguageCodes || [] ;
+      langs.push(this.language);
+      var idx = langs.length ;
+      var strings = null ;
+      while(!strings && --idx >= 0) {
+        strings = String[langs[idx]];
+      }
+      if (strings) {
+        this.hasStrings = YES; 
+        this.strings = strings ;
+      }
+    }
+  },
+  
+  /** Set to YES when strings have been added to this locale. */
+  hasStrings: NO,
+  
+  /** The strings hash for this locale. */
+  strings: {},
+  
+  toString: function() {
+    if (!this.language) SC.Locale._assignLocales() ;
+    return "SC.Locale["+this.language+"]"+SC.guidFor(this) ;
+  },
+  
+  /** 
+    Returns the localized version of the string or the string if no match
+    was found.
+    
+    @param {String} string
+    @param {String} optional default string to return instead
+    @returns {String}
+  */
+  locWithDefault: function(string, def) {
+    var ret = this.strings[string];
+    
+    // strings may be blank, so test with typeOf.
+    if (SC.typeOf(ret) === SC.T_STRING) return ret;
+    else if (SC.typeOf(def) === SC.T_STRING) return def;
+    return string;
+  }
+  
+  
+}) ;
+
+SC.Locale.mixin(/** @scope SC.Locale */ {
+
+  /**
+    If YES, localization will favor the detected language instead of the
+    preferred one.
+  */
+  useAutodetectedLanguage: NO,
+  
+  /**
+    This property is set by the build tools to the current build language.
+  */
+  preferredLanguage: null,
+  
+  /** 
+    Invoked at the start of SproutCore's document onready handler to setup 
+    the currentLocale.  This will use the language properties you have set on
+    the locale to make a decision.
+  */
+  createCurrentLocale: function() {
+
+    // get values from String if defined for compatibility with < 1.0 build 
+    // tools.
+    var autodetect = (String.useAutodetectedLanguage !== undefined) ? String.useAutodetectedLanguage : this.useAutodetectedLanguage; 
+    var preferred = (String.preferredLanguage !== undefined) ? String.preferredLanguage : this.preferredLanguage ;
+
+    // determine the language
+    var lang = ((autodetect) ? SC.browser.language : null) || preferred || SC.browser.language || 'en';
+    lang = SC.Locale.normalizeLanguage(lang) ;
+
+    // get the locale class.  If a class cannot be found, fall back to generic
+    // language then to english.
+    var klass = this.localeClassFor(lang) ;
+
+    // if the detected language does not match the current language (or there
+    // is none) then set it up.
+    if (lang != this.currentLanguage) {
+      this.currentLanguage = lang ; // save language
+      this.currentLocale = klass.create(); // setup locale
+    }
+    return this.currentLocale ;
+  },
+
+  /**
+    Finds the locale class for the names language code or creates on based on
+    its most likely parent.
+  */
+  localeClassFor: function(lang) {
+    lang = SC.Locale.normalizeLanguage(lang) ;
+    var parent, klass = this.locales[lang];
+    
+    // if locale class was not found and there is a broader-based locale
+    // present, create a new locale based on that.
+    if (!klass && ((parent = lang.split('-')[0]) !== lang) && (klass = this.locales[parent])) {
+      klass = this.locales[lang] = klass.extend() ;      
+    }
+    
+    // otherwise, try to create a new locale based on english.
+    if (!klass) klass = this.locales[lang] = this.locales.en.extend();
+    
+    return klass;
+  },
+
+  /** 
+    Shorthand method to define the settings for a particular locale.
+    The settings you pass here will be applied directly to the locale you
+    designate.  
+
+    If you are already holding a reference to a locale definition, you can
+    also use this method to operate on the receiver.
+    
+    If the locale you name does not exist yet, this method will create the 
+    locale for you, based on the most closely related locale or english.  For 
+    example, if you name the locale 'fr-CA', you will be creating a locale for
+    French as it is used in Canada.  This will be based on the general French
+    locale (fr), since that is more generic.  On the other hand, if you create
+    a locale for manadarin (cn), it will be based on generic english (en) 
+    since there is no broader language code to match against.
+
+    @param {String} localeName
+    @param {Hash} options
+    @returns {SC.Locale} the defined locale
+  */
+  define: function(localeName, options) {
+    var locale ;
+    if (options===undefined && (SC.typeOf(localeName) !== SC.T_STRING)) {
+      locale = this; options = localeName ;
+    } else locale = SC.Locale.localeClassFor(localeName) ;
+    SC.mixin(locale.prototype, options) ;
+    return locale ;
+  },
+  
+  /**
+    Gets the current options for the receiver locale.  This is useful for 
+    inspecting registered locales that have not been instantiated.
+    
+    @returns {Hash} options + instance methods
+  */
+  options: function() { return this.prototype; },
+  
+  /**
+    Adds the passed hash of strings to the locale's strings table.  Note that
+    if the receiver locale inherits its strings from its parent, then the 
+    strings table will be cloned first.
+    
+    @returns {Object} receiver
+  */
+  addStrings: function(stringsHash) {
+    // make sure the target strings hash exists and belongs to the locale
+    var strings = this.prototype.strings ;
+    if (strings) {
+      if (!this.prototype.hasOwnProperty('strings')) {
+        this.prototype.strings = SC.clone(strings) ;
+      }
+    } else strings = this.prototype.strings = {} ;
+    
+    // add strings hash
+    if (stringsHash)  this.prototype.strings = SC.mixin(strings, stringsHash) ;
+    this.prototype.hasStrings = YES ;
+    return this;
+  },
+  
+  _map: { english: 'en', french: 'fr', german: 'de', japanese: 'ja', jp: 'ja', spanish: 'es' },
+  
+  /**
+    Normalizes the passed language into a two-character language code.
+    This method allows you to specify common languages in their full english
+    name (i.e. English, French, etc). and it will be treated like their two
+    letter code equivalent.
+    
+    @param {String} languageCode
+    @returns {String} normalized code
+  */
+  normalizeLanguage: function(languageCode) {
+    if (!languageCode) return 'en' ;
+    return SC.Locale._map[languageCode.toLowerCase()] || languageCode ;
+  },
+  
+  // this method is called once during init to walk the installed locales 
+  // and make sure they know their own names.
+  _assignLocales: function() {
+    for(var key in this.locales) this.locales[key].prototype.language = key;
+  },
+  
+  toString: function() {
+    if (!this.prototype.language) SC.Locale._assignLocales() ;
+    return "SC.Locale["+this.prototype.language+"]" ;
+  },
+  
+  // make sure important properties are copied to new class. 
+  extend: function() {
+    var ret= SC.Object.extend.apply(this, arguments) ;
+    ret.addStrings= SC.Locale.addStrings;
+    ret.define = SC.Locale.define ;
+    ret.options = SC.Locale.options ;
+    ret.toString = SC.Locale.toString ;
+    return ret ;
+  }
+    
+}) ;
+
+/** 
+  This locales hash contains all of the locales defined by SproutCore and
+  by your own application.  See the SC.Locale class definition for the
+  various properties you can set on your own locales.
+  
+  @property {Hash}
+*/
+SC.Locale.locales = {
+  en: SC.Locale.extend({ _deprecatedLanguageCodes: ['English'] }),
+  fr: SC.Locale.extend({ _deprecatedLanguageCodes: ['French'] }),
+  de: SC.Locale.extend({ _deprecatedLanguageCodes: ['German'] }),
+  ja: SC.Locale.extend({ _deprecatedLanguageCodes: ['Japanese', 'jp'] }),
+  es: SC.Locale.extend({ _deprecatedLanguageCodes: ['Spanish'] })
+} ;
+
+
+
+
+/**
+  This special helper will store the strings you pass in the locale matching
+  the language code.  If a locale is not defined from the language code you
+  specify, then one will be created for you with the english locale as the 
+  parent.
+  
+  @param {String} languageCode
+  @param {Hash} strings
+  @returns {Object} receiver 
+*/
+SC.stringsFor = function(languageCode, strings) {
+  // get the locale, creating one if needed.
+  var locale = SC.Locale.localeClassFor(languageCode);
+  locale.addStrings(strings) ;
+  return this ;
+} ;
+
+

data/sproutcore/frameworks/core_foundation/system/page.js

@@ -0,0 +1,108 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2010 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+/**
+  @class SC.Page
+
+  A Page object is used to store a set of views that can be lazily configured
+  as needed.  The page object works by overloading the get() method.  The
+  first time you try to get the page
+  
+  @extends SC.Object
+*/
+SC.Page = SC.Object.extend(
+/** @scope SC.Page.prototype */ {
+  
+  /**
+    When you create a page, you can set it's "owner" property to an
+    object outside the page definition. This allows views in the page
+    to use the owner object as a target, (as well as other objects
+    accessible through the owner object). E.g.
+    
+    {{{
+      myButton: SC.ButtonView.design({
+        title: 'Click me',
+        target: SC.outlet('page.owner'),
+        action: 'buttonClicked'
+      })
+    }}}
+    
+    Usually, you'll set 'owner' to the object defined in core.js.
+  */
+  owner: null,
+  
+  get: function(key) {
+    var value = this[key] ;
+    if (value && value.isClass) {
+      this[key] = value = value.create({ page: this }) ;
+      if (!this.get('inDesignMode')) value.awake() ;
+      return value ;
+    } else return sc_super();
+  },
+  
+  /**
+    Finds all views defined on this page instances and builds them.  This is 
+    a quick, brute force way to wake up all of the views in a page object.  It
+    is not generally recommended. Instead, you should use get() or getPath() 
+    to retrieve views and rely on the lazy creation process to set them up.
+    
+    @return {SC.Page} receiver
+  */
+  awake: function() {
+    // step through all views and build them
+    var value, key;
+    for(key in this) {
+      if (!this.hasOwnProperty(key)) continue ;
+      value = this[key] ;
+      if (value && value.isViewClass) {
+        this[key] = value = value.create({ page: this }) ;
+      }
+    }
+    return this;
+  },
+
+  /**
+    Returns the named property unless the property is a view that has not yet
+    been configured.  In that case it will return undefined.  You can use this
+    method to safely get a view without waking it up.
+  */
+  getIfConfigured: function(key) {
+    var ret = this[key] ;
+    return (ret && ret.isViewClass) ? null : this.get(key);
+  },
+
+  /**
+    Applies a localization to every view builder defined on the page.  You must call this before you construct a view to apply the localization.
+  */
+  loc: function(locs) {
+    var view, key;
+    for(key in locs) {
+      if (!locs.hasOwnProperty(key)) continue ;
+      view = this[key] ;
+      if (!view || !view.isViewClass) continue ;
+      view.loc(locs[key]);
+    }
+    return this ;
+  }
+
+  //needsDesigner: YES,
+  
+  //inDesignMode: YES
+    
+}) ;
+
+// ..........................................................
+// SUPPORT FOR LOADING PAGE DESIGNS
+// 
+
+/** Calling design() on a page is the same as calling create() */
+SC.Page.design = SC.Page.create ;
+
+/** Calling localization returns passed attrs. */
+SC.Page.localization = function(attrs) { return attrs; };
+
+

data/sproutcore/frameworks/core_foundation/system/platform.js

@@ -0,0 +1,399 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2010 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+/**
+  This platform object allows you to conditionally support certain HTML5
+  features.
+
+  Rather than relying on the user agent, it detects whether the given elements
+  and events are supported by the browser, allowing you to create much more
+  robust apps.
+*/
+SC.platform = {
+  
+  /*
+    NOTES
+      - A development version of Chrome 9 incorrectly reported supporting touch
+      - Android is assumed to support touch, but incorrectly reports that it does not
+  */
+  /**
+    YES if the current device supports touch events, NO otherwise.
+
+    You can simulate touch events in environments that don't support them by
+    calling SC.platform.simulateTouchEvents() from your browser's console.
+
+    @property {Boolean}
+  */
+  touch: (('createTouch' in document) && SC.browser.chrome < 9) || SC.browser.android,
+  
+  bounceOnScroll: SC.browser.iOS,
+  pinchToZoom: SC.browser.iOS,
+
+  input: {
+    placeholder: ('placeholder' in document.createElement('input'))
+  },
+
+  /**
+    A hash that contains properties that indicate support for new HTML5
+    input attributes.
+
+    For example, to test to see if the placeholder attribute is supported,
+    you would verify that SC.platform.input.placeholder is YES.
+  */
+  input: function(attributes) {
+    var ret = {},
+        len = attributes.length,
+        elem = document.createElement('input'),
+        attr, idx;
+
+    for (idx=0; idx < len; idx++) {
+      attr = attributes[idx];
+
+      ret[attr] = !!(attr in elem);
+    }
+
+    return ret;
+  }(('autocomplete readonly list size required multiple maxlength '
+    +'pattern min max step placeholder').w()),
+
+  /**
+    YES if the application is currently running as a standalone application.
+
+    For example, if the user has saved your web application to their home
+    screen on an iPhone OS-based device, this property will be true.
+    @property {Boolean}
+  */
+  standalone: !!navigator.standalone,
+
+
+  /**
+    Prefix for browser specific CSS attributes. Calculated later.
+  */
+  cssPrefix: null,
+
+  /**
+    Prefix for browsew specific CSS attributes when used in the DOM. Calculated later.
+  */
+  domCSSPrefix: null,
+
+  /**
+    Call this method to swap out the default mouse handlers with proxy methods
+    that will translate mouse events to touch events.
+
+    This is useful if you are debugging touch functionality on the desktop.
+  */
+  simulateTouchEvents: function() {
+    // Touch events are supported natively, no need for this.
+    if (this.touch) {
+      //@ if (debug)
+      SC.Logger.info("Can't simulate touch events in an environment that supports them.");
+      //@ endif
+      return;
+    }
+    
+    SC.Logger.log("Simulating touch events");
+
+    // Tell the app that we now "speak" touch
+    SC.platform.touch = YES;
+    SC.platform.bounceOnScroll = YES;
+
+    // CSS selectors may depend on the touch class name being present
+    document.body.className = document.body.className + ' touch';
+
+    // Initialize a counter, which we will use to generate unique ids for each
+    // fake touch.
+    this._simtouch_counter = 1;
+
+    // Remove events that don't exist in touch environments
+    this.removeEvents('click dblclick mouseout mouseover mousewheel'.w());
+
+    // Replace mouse events with our translation methods
+    this.replaceEvent('mousemove', this._simtouch_mousemove);
+    this.replaceEvent('mousedown', this._simtouch_mousedown);
+    this.replaceEvent('mouseup', this._simtouch_mouseup);
+
+    // fix orientation handling
+    SC.platform.windowSizeDeterminesOrientation = YES;
+    SC.device.orientationHandlingShouldChange();
+  },
+
+  /** @private
+    Removes event listeners from the document.
+
+    @param {Array} events Array of strings representing the events to remove
+  */
+  removeEvents: function(events) {
+    var idx, len = events.length, key;
+    for (idx = 0; idx < len; idx++) {
+      key = events[idx];
+      SC.Event.remove(document, key, SC.RootResponder.responder, SC.RootResponder.responder[key]);
+    }
+  },
+
+  /** @private
+    Replaces an event listener with another.
+
+    @param {String} evt The event to replace
+    @param {Function} replacement The method that should be called instead
+  */
+  replaceEvent: function(evt, replacement) {
+    SC.Event.remove(document, evt, SC.RootResponder.responder, SC.RootResponder.responder[evt]);
+    SC.Event.add(document, evt, this, replacement);
+  },
+
+  /** @private
+    When simulating touch events, this method is called when mousemove events
+    are received.
+
+    If the altKey is depresed and pinch center not yet established, we will capture the mouse position.
+  */
+  _simtouch_mousemove: function(evt) {
+    if (!this._mousedown) {
+      /*
+        we need to capture when was the first spot that the altKey was pressed and use it as
+        the center point of a pinch
+       */
+      if(evt.altKey && this._pinchCenter == null) {
+        this._pinchCenter = {
+          pageX: evt.pageX,
+          pageY: evt.pageY,
+          screenX: evt.screenX,
+          screenY: evt.screenY,
+          clientX: evt.clientX,
+          clientY: evt.clientY
+        };
+      } else if(!evt.altKey && this._pinchCenter != null){
+        this._pinchCenter = null;
+      }
+      return NO;
+    }
+
+    var manufacturedEvt = this.manufactureTouchEvent(evt, 'touchmove');
+    return SC.RootResponder.responder.touchmove(manufacturedEvt);
+  },
+
+  /** @private
+    When simulating touch events, this method is called when mousedown events
+    are received.
+  */
+  _simtouch_mousedown: function(evt) {
+    this._mousedown = YES;
+
+    var manufacturedEvt = this.manufactureTouchEvent(evt, 'touchstart');
+    return SC.RootResponder.responder.touchstart(manufacturedEvt);
+  },
+
+  /** @private
+    When simulating touch events, this method is called when mouseup events
+    are received.
+  */
+  _simtouch_mouseup: function(evt) {
+    var manufacturedEvt = this.manufactureTouchEvent(evt, 'touchend'),
+        ret = SC.RootResponder.responder.touchend(manufacturedEvt);
+
+    this._mousedown = NO;
+    this._simtouch_counter++;
+    return ret;
+  },
+
+  /** @private
+    Converts a mouse-style event to a touch-style event.
+
+    Note that this method edits the passed event in place, and returns
+    that same instance instead of a new, modified version.
+
+    If altKey is depressed and we have previously captured a position for the center of
+    the pivot point for the virtual second touch, we will manufacture an additional touch.
+    The position of the virtual touch will be the reflection of the mouse position,
+    relative to the pinch center.
+
+    @param {Event} evt the mouse event to modify
+    @param {String} type the type of event (e.g., touchstart)
+    @returns {Event} the mouse event with an added changedTouches array
+  */
+  manufactureTouchEvent: function(evt, type) {
+    var realTouch, virtualTouch, realTouchIdentifier = this._simtouch_counter;
+
+    realTouch = {
+      type: type,
+      target: evt.target,
+      identifier: realTouchIdentifier,
+      pageX: evt.pageX,
+      pageY: evt.pageY,
+      screenX: evt.screenX,
+      screenY: evt.screenY,
+      clientX: evt.clientX,
+      clientY: evt.clientY
+    };
+    evt.touches = [ realTouch ];
+
+    /*
+      simulate pinch gesture
+     */
+    if(evt.altKey && this._pinchCenter != null)
+    {
+      //calculate the mirror position of the virtual touch
+      var pageX = this._pinchCenter.pageX + this._pinchCenter.pageX - evt.pageX ,
+          pageY = this._pinchCenter.pageY + this._pinchCenter.pageY - evt.pageY,
+          screenX = this._pinchCenter.screenX + this._pinchCenter.screenX - evt.screenX,
+          screenY = this._pinchCenter.screenY + this._pinchCenter.screenY - evt.screenY,
+          clientX = this._pinchCenter.clientX + this._pinchCenter.clientX - evt.clientX,
+          clientY = this._pinchCenter.clientY + this._pinchCenter.clientY - evt.clientY,
+          virtualTouchIdentifier = this._simtouch_counter + 1;
+
+      virtualTouch = {
+        type: type,
+        target: evt.target,
+        identifier: virtualTouchIdentifier,
+        pageX: pageX,
+        pageY: pageY,
+        screenX: screenX,
+        screenY: screenY,
+        clientX: clientX,
+        clientY: clientY
+      };
+
+      evt.touches = [ realTouch , virtualTouch];
+    }
+    evt.changedTouches = evt.touches;
+
+    return evt;
+  },
+
+  /**
+    Whether the browser supports CSS transitions. Calculated later.
+  */
+  supportsCSSTransitions: NO,
+
+  /**
+    Whether the browser supports 2D CSS transforms. Calculated later.
+  */
+  supportsCSSTransforms: NO,
+
+  /**
+    Whether the browser understands 3D CSS transforms.
+    This does not guarantee that the browser properly handles them.
+    Calculated later.
+  */
+  understandsCSS3DTransforms: NO,
+
+  /**
+    Whether the browser can properly handle 3D CSS transforms. Calculated later.
+  */
+  supportsCSS3DTransforms: NO,
+
+  /**
+    Whether the browser can handle accelerated layers. While supports3DTransforms tells us if they will
+    work in principle, sometimes accelerated layers interfere with things like getBoundingClientRect.
+    Then everything breaks.
+  */
+  supportsAcceleratedLayers: NO,
+
+  /**
+    Wether the browser supports the hashchange event.
+  */
+  supportsHashChange: function() {
+    // Code copied from Modernizr which copied code from YUI (MIT licenses)
+    // documentMode logic from YUI to filter out IE8 Compat Mode which false positives
+    return ('onhashchange' in window) && (document.documentMode === undefined || document.documentMode > 7);
+  }(),
+  
+  /**
+    Wether the browser supports HTML5 history.
+  */
+  supportsHistory: function() {
+    return !!(window.history && window.history.pushState);
+  }(),
+  
+  supportsCanvas: function() {
+    return !!document.createElement('canvas').getContext;
+  }(),
+  
+  supportsOrientationChange: ('onorientationchange' in window),
+  
+  /**
+    Because iOS is slow to dispatch the window.onorientationchange event,
+    we use the window size to determine the orientation on iOS devices
+    and desktop environments when SC.platform.touch is YES (ie. when
+    SC.platform.simulateTouchEvents has been called)
+    
+    @property {Boolean}
+    @default NO
+  */
+  windowSizeDeterminesOrientation: SC.browser.iOS || !('onorientationchange' in window)
+
+};
+
+/* Calculate CSS Prefixes */
+
+(function(){
+  var userAgent = navigator.userAgent.toLowerCase();
+  if ((/webkit/).test(userAgent)) {
+    SC.platform.cssPrefix = 'webkit';
+    SC.platform.domCSSPrefix = 'Webkit';
+  } else if((/opera/).test( userAgent )) {
+    SC.platform.cssPrefix = 'opera';
+    SC.platform.domCSSPrefix = 'O';
+  } else if((/msie/).test( userAgent ) && !(/opera/).test( userAgent )) {
+    SC.platform.cssPrefix = 'ms';
+    SC.platform.domCSSPrefix = 'ms';
+  } else if((/mozilla/).test( userAgent ) && !(/(compatible|webkit)/).test( userAgent )) {
+    SC.platform.cssPrefix = 'moz';
+    SC.platform.domCSSPrefix = 'Moz';
+  }
+})();
+
+/* Calculate transform support */
+
+(function(){
+  // a test element
+  var el = document.createElement("div");
+
+  // the css and javascript to test
+  var css_browsers = ["-moz-", "-moz-", "-o-", "-ms-", "-webkit-"];
+  var test_browsers = ["moz", "Moz", "o", "ms", "webkit"];
+
+  // prepare css
+  var css = "", i = null;
+  for (i = 0; i < css_browsers.length; i++) {
+    css += css_browsers[i] + "transition:all 1s linear;";
+    css += css_browsers[i] + "transform: translate(1px, 1px);";
+    css += css_browsers[i] + "perspective: 500px;";
+  }
+
+  // set css text
+  el.style.cssText = css;
+
+  // test
+  for (i = 0; i < test_browsers.length; i++)
+  {
+    if (el.style[test_browsers[i] + "TransitionProperty"] !== undefined) SC.platform.supportsCSSTransitions = YES;
+    if (el.style[test_browsers[i] + "Transform"] !== undefined) SC.platform.supportsCSSTransforms = YES;
+    if (el.style[test_browsers[i] + "Perspective"] !== undefined || el.style[test_browsers[i] + "PerspectiveProperty"] !== undefined) {
+      SC.platform.understandsCSS3DTransforms = YES;
+      SC.platform.supportsCSS3DTransforms = YES;
+    }
+  }
+
+  // unfortunately, we need a bit more to know FOR SURE that 3D is allowed
+  try{
+    if (window.media && window.media.matchMedium) {
+      if (!window.media.matchMedium('(-webkit-transform-3d)')) SC.platform.supportsCSS3DTransforms = NO;
+    } else if(window.styleMedia && window.styleMedia.matchMedium) {
+      if (!window.styleMedia.matchMedium('(-webkit-transform-3d)')) SC.platform.supportsCSS3DTransforms = NO;
+    }
+  }catch(e){
+    //Catch to support IE9 exception
+    SC.platform.supportsCSS3DTransforms = NO;
+  }
+
+  // Unfortunately, this has to be manual, as I can't think of a good way to test it
+  // webkit-only for now.
+  if (SC.platform.supportsCSSTransforms && SC.platform.cssPrefix === "webkit") {
+    SC.platform.supportsAcceleratedLayers = YES;
+  }
+})();