[DevTools] Separate ScreenCaptureModel out of ResourceTreeModel.

third_party/WebKit/Source/devtools/front_end/screencast/ScreencastView.js

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 15 matching lines @@
  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 /**
  * @implements {SDK.DOMNodeHighlighter}
  * @unrestricted
  */
 Screencast.ScreencastView = class extends UI.VBox {
   /**
-   * @param {!SDK.Target} target
-   * @param {!SDK.ResourceTreeModel} resourceTreeModel
+   * @param {!SDK.ScreenCaptureModel} screenCaptureModel
    */
-  constructor(target, resourceTreeModel) {
+  constructor(screenCaptureModel) {
     super();
-    this._target = target;
-    this._domModel = SDK.DOMModel.fromTarget(target);
-    this._resourceTreeModel = resourceTreeModel;
+    this._target = screenCaptureModel.target();
+    this._screenCaptureModel = screenCaptureModel;
+    this._domModel = SDK.DOMModel.fromTarget(this._target);
+    this._resourceTreeModel = SDK.ResourceTreeModel.fromTarget(this._target);
 
     this.setMinimumSize(150, 150);
     this.registerRequiredCSS('screencast/screencastView.css');
   }
 
   initialize() {
     this.element.classList.add('screencast');
 
     this._createNavigationBar();
 
@@ skipping 29 matching lines @@
 
     this._imageElement = new Image();
     this._isCasting = false;
     this._context = this._canvasElement.getContext('2d');
     this._checkerboardPattern = this._createCheckerboardPattern(this._context);
 
     this._shortcuts = /** !Object.<number, function(Event=):boolean> */ ({});
     this._shortcuts[UI.KeyboardShortcut.makeKey('l', UI.KeyboardShortcut.Modifiers.Ctrl)] =
         this._focusNavigationBar.bind(this);
 
-    this._resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.ScreencastFrame, this._screencastFrame, this);
-    this._resourceTreeModel.addEventListener(
-        SDK.ResourceTreeModel.Events.ScreencastVisibilityChanged, this._screencastVisibilityChanged, this);
-
     SDK.targetManager.addEventListener(SDK.TargetManager.Events.SuspendStateChanged, this._onSuspendStateChange, this);
     this._updateGlasspane();
   }
 
   /**
    * @override
    */
   wasShown() {
     this._startCasting();
   }
@@ skipping 13 matching lines @@
     this._isCasting = true;
 
     const maxImageDimension = 2048;
     var dimensions = this._viewportDimensions();
     if (dimensions.width < 0 || dimensions.height < 0) {
       this._isCasting = false;
       return;
     }
     dimensions.width *= window.devicePixelRatio;
     dimensions.height *= window.devicePixelRatio;
-    // Note: startScreencast with and height expect to be integers so must be floored.
-    this._target.pageAgent().startScreencast(
+    // Note: startScreencast width and height are expected to be integers so must be floored.
+    this._screenCaptureModel.startScreencast(
         'jpeg', 80, Math.floor(Math.min(maxImageDimension, dimensions.width)),
-        Math.floor(Math.min(maxImageDimension, dimensions.height)));
-    this._target.emulationAgent().setTouchEmulationEnabled(true);
-    this._domModel.setHighlighter(this);
+        Math.floor(Math.min(maxImageDimension, dimensions.height)), undefined, this._screencastFrame.bind(this),
+        this._screencastVisibilityChanged.bind(this));
+    Emulation.MultitargetTouchModel.instance().setCustomTouchEnabled(true);
+    if (this._domModel)
+      this._domModel.setHighlighter(this);
   }
 
   _stopCasting() {
     if (!this._isCasting)
       return;
     this._isCasting = false;
-    this._target.pageAgent().stopScreencast();
-    this._target.emulationAgent().setTouchEmulationEnabled(false);
-    this._domModel.setHighlighter(null);
+    this._screenCaptureModel.stopScreencast();
+    Emulation.MultitargetTouchModel.instance().setCustomTouchEnabled(false);
+    if (this._domModel)
+      this._domModel.setHighlighter(null);
   }
 
   /**
-   * @param {!Common.Event} event
+   * @param {string} base64Data
+   * @param {!Protocol.Page.ScreencastFrameMetadata} metadata
    */
-  _screencastFrame(event) {
-    var metadata = /** type {Protocol.Page.ScreencastFrameMetadata} */ (event.data.metadata);
-    var base64Data = /** type {string} */ (event.data.data);
+  _screencastFrame(base64Data, metadata) {
     this._imageElement.onload = () => {
       this._pageScaleFactor = metadata.pageScaleFactor;
       this._screenOffsetTop = metadata.offsetTop;
       this._scrollOffsetX = metadata.scrollOffsetX;
       this._scrollOffsetY = metadata.scrollOffsetY;
 
       var deviceSizeRatio = metadata.deviceHeight / metadata.deviceWidth;
       var dimensionsCSS = this._viewportDimensions();
 
       this._imageZoom = Math.min(
@@ skipping 10 matching lines @@
       this.highlightDOMNode(this._highlightNode, this._highlightConfig);
     };
     this._imageElement.src = 'data:image/jpg;base64,' + base64Data;
   }
 
   _isGlassPaneActive() {
     return !this._glassPaneElement.classList.contains('hidden');
   }
 
   /**
-   * @param {!Common.Event} event
+   * @param {boolean} visible
    */
-  _screencastVisibilityChanged(event) {
-    this._targetInactive = !event.data.visible;
+  _screencastVisibilityChanged(visible) {
+    this._targetInactive = !visible;
     this._updateGlasspane();
   }
 
   /**
    * @param {!Common.Event} event
    */
   _onSuspendStateChange(event) {
     if (SDK.targetManager.allTargetsSuspended())
       this._stopCasting();
     else
@@ skipping 15 matching lines @@
 
   /**
    * @param {!Event} event
    */
   _handleMouseEvent(event) {
     if (this._isGlassPaneActive()) {
       event.consume();
       return;
     }
 
-    if (!this._pageScaleFactor)
+    if (!this._pageScaleFactor || !this._domModel)
       return;
 
     if (!this._inspectModeConfig || event.type === 'mousewheel') {
       this._simulateTouchForMouseEvent(event);
       event.preventDefault();
       if (event.type === 'mousedown')
         this._canvasElement.focus();
       return;
     }
 
     var position = this._convertIntoScreenSpace(event);
     this._domModel.nodeForLocation(
-        position.x / this._pageScaleFactor + this._scrollOffsetX,
-        position.y / this._pageScaleFactor + this._scrollOffsetY, callback.bind(this));
+        Math.floor(position.x / this._pageScaleFactor + this._scrollOffsetX),
+        Math.floor(position.y / this._pageScaleFactor + this._scrollOffsetY), callback.bind(this));
 
     /**
      * @param {?SDK.DOMNode} node
      * @this {Screencast.ScreencastView}
      */
     function callback(node) {
       if (!node)
         return;
       if (event.type === 'mousemove') {
         this.highlightDOMNode(node, this._inspectModeConfig);
@@ skipping 489 matching lines @@
 
   _navigateToHistoryEntry(offset) {
     var newIndex = this._historyIndex + offset;
     if (newIndex < 0 || newIndex >= this._historyEntries.length)
       return;
     this._target.pageAgent().navigateToHistoryEntry(this._historyEntries[newIndex].id);
     this._requestNavigationHistory();
   }
 
   _navigateReload() {
-    this._resourceTreeModel.reloadPage();
+    if (this._resourceTreeModel)
+      this._resourceTreeModel.reloadPage();
   }
 
   _navigationUrlKeyUp(event) {
     if (event.key !== 'Enter')
       return;
     var url = this._navigationUrl.value;
     if (!url)
       return;
     if (!url.match(Screencast.ScreencastView._SchemeRegex))
       url = 'http://' + url;
@@ skipping 108 matching lines @@
     if (this._maxDisplayedProgress >= progress)
       return;
     this._maxDisplayedProgress = progress;
     this._displayProgress(progress);
   }
 
   _displayProgress(progress) {
     this._element.style.width = (100 * progress) + '%';
   }
 };