Use Object.observe() instead of Polyfills

This is a clean up CL and should not change any behavior.

BUG=none
TEST=browsertest passes

Review URL: https://codereview.chromium.org/984593002

Cr-Commit-Position: refs/heads/master@{#319602}

ui/file_manager/audio_player/elements/audio_player.js

@@ -239,8 +239,6 @@ Polymer('audio-player', {
     }
 
     this.trackList.currentTrackIndex = nextTrackIndex;
-
-    Platform.performMicrotaskCheckpoint();
   },
 
   /**

ui/file_manager/audio_player/elements/track_list.js

@@ -11,13 +11,26 @@
      * element is ready.
      */
     ready: function() {
-      this.tracksObserver_ = new ArrayObserver(
-          this.tracks,
-          this.tracksValueChanged_.bind(this));
+      this.observeTrackList();
 
       window.addEventListener('resize', this.onWindowResize_.bind(this));
     },
 
+    observeTrackList: function() {
+      // Unobserve the previous track list.
+      if (this.unobserveTrackList_)
+        this.unobserveTrackList_();
+
+      // Observe the new track list.
+      var observer = this.tracksValueChanged_.bind(this);
+      Array.observe(this.tracks, observer);
+
+      // Set the function to unobserve it.
+      this.unobserveTrackList_ = function(tracks, observer) {
+        Array.unobserve(tracks, observer);
+      }.bind(null, this.tracks, observer);
+    },
+
     /**
      * Registers handlers for changing of external variables
      */
@@ -101,9 +114,7 @@
       // values are not null. Maybe it's a bug of Polymer.
 
       // Re-register the observer of 'this.tracks'.
-      this.tracksObserver_.close();
-      this.tracksObserver_ = new ArrayObserver(this.tracks);
-      this.tracksObserver_.open(this.tracksValueChanged_.bind(this));
+      this.observeTrackList();
 
       if (this.tracks.length !== 0) {
         // Restore the active track.
@@ -122,9 +133,9 @@
 
     /**
      * Invoked when the value in the 'tracks' is changed.
-     * @param {Array.<Object>} splices The detail of the change.
+     * @param {Array.<Object>} changes The detail of the change.
      */
-    tracksValueChanged_: function(splices) {
+    tracksValueChanged_: function(changes) {
       if (this.tracks.length === 0)
         this.currentTrackIndex = -1;
       else

ui/file_manager/audio_player/js/audio_player.js

@@ -21,10 +21,14 @@ function AudioPlayer(container) {
   this.selectedEntry_ = null;
 
   this.model_ = new AudioPlayerModel();
-  var observer = new PathObserver(this.model_, 'expanded');
-  observer.open(function(newValue, oldValue) {
-    // Inverse arguments intentionally to match the Polymer way.
-    this.onModelExpandedChanged(oldValue, newValue);
+  Object.observe(this.model_, function(changes) {
+    for (var i = 0; i < changes.lenfth; i++) {
+      var change = changes[i];
+      if (change.name == 'expanded' && change.type == 'update') {
+        this.onModelExpandedChanged(change.oldValue, change.object.expanded);
+        break;
+      }
+    }
   }.bind(this));
 
   this.entries_ = [];
@@ -45,27 +49,29 @@ function AudioPlayer(container) {
   // TODO(yoshiki): Move tracks into the model.
   this.player_.tracks = [];
   this.player_.model = this.model_;
-  Platform.performMicrotaskCheckpoint();
-
-  this.errorString_ = '';
-  this.offlineString_ = '';
-  chrome.fileManagerPrivate.getStrings(function(strings) {
-    container.ownerDocument.title = strings['AUDIO_PLAYER_TITLE'];
-    this.errorString_ = strings['AUDIO_ERROR'];
-    this.offlineString_ = strings['AUDIO_OFFLINE'];
-    AudioPlayer.TrackInfo.DEFAULT_ARTIST =
-        strings['AUDIO_PLAYER_DEFAULT_ARTIST'];
-  }.bind(this));
 
-  this.volumeManager_.addEventListener('externally-unmounted',
-      this.onExternallyUnmounted_.bind(this));
+  // Run asynchronously after an event of model change is delivered.
+  setTimeout(function() {
+    this.errorString_ = '';
+    this.offlineString_ = '';
+    chrome.fileManagerPrivate.getStrings(function(strings) {
+      container.ownerDocument.title = strings['AUDIO_PLAYER_TITLE'];
+      this.errorString_ = strings['AUDIO_ERROR'];
+      this.offlineString_ = strings['AUDIO_OFFLINE'];
+      AudioPlayer.TrackInfo.DEFAULT_ARTIST =
+          strings['AUDIO_PLAYER_DEFAULT_ARTIST'];
+    }.bind(this));
+
+    this.volumeManager_.addEventListener('externally-unmounted',
+        this.onExternallyUnmounted_.bind(this));
 
-  window.addEventListener('resize', this.onResize_.bind(this));
+    window.addEventListener('resize', this.onResize_.bind(this));
 
-  // Show the window after DOM is processed.
-  var currentWindow = chrome.app.window.current();
-  if (currentWindow)
-    setTimeout(currentWindow.show.bind(currentWindow), 0);
+    // Show the window after DOM is processed.
+    var currentWindow = chrome.app.window.current();
+    if (currentWindow)
+      setTimeout(currentWindow.show.bind(currentWindow), 0);
+  }.bind(this));
 }
 
 /**
@@ -134,22 +140,21 @@ AudioPlayer.prototype.load = function(playlist) {
           unchanged = false;
       }
 
-      if (!unchanged) {
+      if (!unchanged)
         this.player_.tracks = newTracks;
 
-        // Makes it sure that the handler of the track list is called, before
-        // the handler of the track index.
-        Platform.performMicrotaskCheckpoint();
-      }
-
-      this.select_(position, !!time);
-
-      // Load the selected track metadata first, then load the rest.
-      this.loadMetadata_(position);
-      for (i = 0; i != this.entries_.length; i++) {
-        if (i != position)
-          this.loadMetadata_(i);
-      }
+      // Run asynchronously, to makes it sure that the handler of the track list
+      // is called, before the handler of the track index.
+      setTimeout(function() {
+        this.select_(position, !!time);
+
+        // Load the selected track metadata first, then load the rest.
+        this.loadMetadata_(position);
+        for (i = 0; i != this.entries_.length; i++) {
+          if (i != position)
+            this.loadMetadata_(i);
+        }
+      }.bind(this));
     }.bind(this));
   }.bind(this));
 };
@@ -212,22 +217,24 @@ AudioPlayer.prototype.select_ = function(newTrack, time) {
   this.currentTrackIndex_ = newTrack;
   this.player_.currentTrackIndex = this.currentTrackIndex_;
   this.player_.audioController.time = time;
-  Platform.performMicrotaskCheckpoint();
 
-  if (!window.appReopen)
-    this.player_.audioElement.play();
+  // Run asynchronously after an event of current track change is delivered.
+  setTimeout(function() {
+    if (!window.appReopen)
+      this.player_.audioElement.play();
 
-  window.appState.position = this.currentTrackIndex_;
-  window.appState.time = 0;
-  util.saveAppState();
+    window.appState.position = this.currentTrackIndex_;
+    window.appState.time = 0;
+    util.saveAppState();
 
-  var entry = this.entries_[this.currentTrackIndex_];
+    var entry = this.entries_[this.currentTrackIndex_];
 
-  this.fetchMetadata_(entry, function(metadata) {
-    if (this.currentTrackIndex_ != newTrack)
-      return;
+    this.fetchMetadata_(entry, function(metadata) {
+      if (this.currentTrackIndex_ != newTrack)
+        return;
 
-    this.selectedEntry_ = entry;
+      this.selectedEntry_ = entry;
+    }.bind(this));
   }.bind(this));
 };
 

ui/file_manager/audio_player/js/audio_player_model.js

@@ -54,7 +54,7 @@
         model[key.substr(STORAGE_PREFIX.length)] = result[key];
       }
       callback();
-    }.bind(this));
+    });
   };
 
   /**
@@ -69,13 +69,13 @@
     Object.seal(this);
 
     // Restores the values from the storage
-    loadModel(this, function() {
+    var target = this;
+    loadModel(target, function() {
       // Installs observer to watch changes of the values.
-      var observer = new ObjectObserver(this);
-      observer.open(function(added, removed, changed, getOldValueFn) {
-        saveModel(this);
-      }.bind(this));
-    }.bind(this));
+      Object.observe(target, function(changes) {
+        saveModel(target);
+      });
+    });
   }
 
   // Exports AudioPlayerModel class to the global.

ui/file_manager/audio_player/js/audio_player_scripts.js

@@ -13,9 +13,6 @@ if (!('securityPolicy' in document))
 if (!('allowsEval' in document.securityPolicy))
   document.securityPolicy['allowsEval'] = false;
 
-// Force Polymer into dirty-checking mode, see http://crbug.com/351967
-Object['observe'] = undefined;
-
 <include src="../../../../third_party/polymer/components/polymer/polymer.js">
 
 (function() {