src/third_party/trace-viewer/third_party/tvcm/src/tvcm/properties.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2014 The Chromium Authors. All rights reserved.
   4 Use of this source code is governed by a BSD-style license that can be
   5 found in the LICENSE file.
   6 -->
   7 <link rel="import" href="/tvcm/events.html">
   8 <script>
   9 'use strict';
  10
  11 tvcm.exportTo('tvcm', function() {
  12   /**
  13    * Fires a property change event on the target.
  14    * @param {EventTarget} target The target to dispatch the event on.
  15    * @param {string} propertyName The name of the property that changed.
  16    * @param {*} newValue The new value for the property.
  17    * @param {*} oldValue The old value for the property.
  18    */
  19   function dispatchPropertyChange(target, propertyName, newValue, oldValue,
  20                                   opt_bubbles, opt_cancelable) {
  21     var e = new tvcm.Event(propertyName + 'Change',
  22                            opt_bubbles, opt_cancelable);
  23     e.propertyName = propertyName;
  24     e.newValue = newValue;
  25     e.oldValue = oldValue;
  26
  27     var error;
  28     e.throwError = function(err) {  // workaround CR 239648
  29       error = err;
  30     };
  31
  32     target.dispatchEvent(e);
  33     if (error)
  34       throw error;
  35   }
  36
  37   function setPropertyAndDispatchChange(obj, propertyName, newValue) {
  38     var privateName = propertyName + '_';
  39     var oldValue = obj[propertyName];
  40     obj[privateName] = newValue;
  41     if (oldValue !== newValue)
  42       tvcm.dispatchPropertyChange(obj, propertyName,
  43           newValue, oldValue, true, false);
  44   }
  45
  46   /**
  47    * Converts a camelCase javascript property name to a hyphenated-lower-case
  48    * attribute name.
  49    * @param {string} jsName The javascript camelCase property name.
  50    * @return {string} The equivalent hyphenated-lower-case attribute name.
  51    */
  52   function getAttributeName(jsName) {
  53     return jsName.replace(/([A-Z])/g, '-$1').toLowerCase();
  54   }
  55
  56   /* Creates a private name unlikely to collide with object properties names
  57    * @param {string} name The defineProperty name
  58    * @return {string} an obfuscated name
  59    */
  60   function getPrivateName(name) {
  61     return name + '_tvcm_';
  62   }
  63
  64   /**
  65    * The kind of property to define in {@code defineProperty}.
  66    * @enum {number}
  67    * @const
  68    */
  69   var PropertyKind = {
  70     /**
  71      * Plain old JS property where the backing data is stored as a 'private'
  72      * field on the object.
  73      */
  74     JS: 'js',
  75
  76     /**
  77      * The property backing data is stored as an attribute on an element.
  78      */
  79     ATTR: 'attr',
  80
  81     /**
  82      * The property backing data is stored as an attribute on an element. If the
  83      * element has the attribute then the value is true.
  84      */
  85     BOOL_ATTR: 'boolAttr'
  86   };
  87
  88   /**
  89    * Helper function for defineProperty that returns the getter to use for the
  90    * property.
  91    * @param {string} name The name of the property.
  92    * @param {tvcm.PropertyKind} kind The kind of the property.
  93    * @return {function():*} The getter for the property.
  94    */
  95   function getGetter(name, kind) {
  96     switch (kind) {
  97       case PropertyKind.JS:
  98         var privateName = getPrivateName(name);
  99         return function() {
 100           return this[privateName];
 101         };
 102       case PropertyKind.ATTR:
 103         var attributeName = getAttributeName(name);
 104         return function() {
 105           return this.getAttribute(attributeName);
 106         };
 107       case PropertyKind.BOOL_ATTR:
 108         var attributeName = getAttributeName(name);
 109         return function() {
 110           return this.hasAttribute(attributeName);
 111         };
 112     }
 113   }
 114
 115   /**
 116    * Helper function for defineProperty that returns the setter of the right
 117    * kind.
 118    * @param {string} name The name of the property we are defining the setter
 119    *     for.
 120    * @param {tvcm.PropertyKind} kind The kind of property we are getting the
 121    *     setter for.
 122    * @param {function(*):void=} opt_setHook A function to run after the property
 123    *     is set, but before the propertyChange event is fired.
 124    * @param {boolean=} opt_bubbles Whether the event bubbles or not.
 125    * @param {boolean=} opt_cancelable Whether the default action of the event
 126    *     can be prevented.
 127    * @return {function(*):void} The function to use as a setter.
 128    */
 129   function getSetter(name, kind, opt_setHook, opt_bubbles, opt_cancelable) {
 130     switch (kind) {
 131       case PropertyKind.JS:
 132         var privateName = getPrivateName(name);
 133         return function(value) {
 134           var oldValue = this[privateName];
 135           if (value !== oldValue) {
 136             this[privateName] = value;
 137             if (opt_setHook)
 138               opt_setHook.call(this, value, oldValue);
 139             dispatchPropertyChange(this, name, value, oldValue,
 140                 opt_bubbles, opt_cancelable);
 141           }
 142         };
 143
 144       case PropertyKind.ATTR:
 145         var attributeName = getAttributeName(name);
 146         return function(value) {
 147           var oldValue = this.getAttribute(attributeName);
 148           if (value !== oldValue) {
 149             if (value == undefined)
 150               this.removeAttribute(attributeName);
 151             else
 152               this.setAttribute(attributeName, value);
 153             if (opt_setHook)
 154               opt_setHook.call(this, value, oldValue);
 155             dispatchPropertyChange(this, name, value, oldValue,
 156                 opt_bubbles, opt_cancelable);
 157           }
 158         };
 159
 160       case PropertyKind.BOOL_ATTR:
 161         var attributeName = getAttributeName(name);
 162         return function(value) {
 163           var oldValue = (this.getAttribute(attributeName) === name);
 164           if (value !== oldValue) {
 165             if (value)
 166               this.setAttribute(attributeName, name);
 167             else
 168               this.removeAttribute(attributeName);
 169             if (opt_setHook)
 170               opt_setHook.call(this, value, oldValue);
 171             dispatchPropertyChange(this, name, value, oldValue,
 172                 opt_bubbles, opt_cancelable);
 173           }
 174         };
 175     }
 176   }
 177
 178   /**
 179    * Defines a property on an object. When the setter changes the value a
 180    * property change event with the type {@code name + 'Change'} is fired.
 181    * @param {!Object} obj The object to define the property for.
 182    * @param {string} name The name of the property.
 183    * @param {tvcm.PropertyKind=} opt_kind What kind of underlying storage to
 184    * use.
 185    * @param {function(*):void=} opt_setHook A function to run after the
 186    *     property is set, but before the propertyChange event is fired.
 187    * @param {boolean=} opt_bubbles Whether the event bubbles or not.
 188    * @param {boolean=} opt_cancelable Whether the default action of the event
 189    *     can be prevented.
 190    */
 191   function defineProperty(obj, name, opt_kind, opt_setHook,
 192                           opt_bubbles, opt_cancelable) {
 193     console.error("Don't use tvcm.defineProperty");
 194     if (typeof obj == 'function')
 195       obj = obj.prototype;
 196
 197     var kind = opt_kind || PropertyKind.JS;
 198
 199     if (!obj.__lookupGetter__(name))
 200       obj.__defineGetter__(name, getGetter(name, kind));
 201
 202     if (!obj.__lookupSetter__(name))
 203       obj.__defineSetter__(name, getSetter(name, kind, opt_setHook,
 204           opt_bubbles, opt_cancelable));
 205   }
 206
 207   return {
 208     PropertyKind: PropertyKind,
 209     defineProperty: defineProperty,
 210     dispatchPropertyChange: dispatchPropertyChange,
 211     setPropertyAndDispatchChange: setPropertyAndDispatchChange
 212   };
 213 });
 214 </script>