third_party/WebKit/Source/devtools/front_end/bindings/CSSWorkspaceBinding.js

   1 // Copyright 2014 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 /**
   6  * @constructor
   7  * @implements {WebInspector.TargetManager.Observer}
   8  * @param {!WebInspector.TargetManager} targetManager
   9  * @param {!WebInspector.Workspace} workspace
  10  * @param {!WebInspector.NetworkMapping} networkMapping
  11  */
  12 WebInspector.CSSWorkspaceBinding = function(targetManager, workspace, networkMapping)
  13 {
  14     this._workspace = workspace;
  15     this._networkMapping = networkMapping;
  16
  17     /** @type {!Map.<!WebInspector.CSSStyleModel, !WebInspector.CSSWorkspaceBinding.TargetInfo>} */
  18     this._modelToTargetInfo = new Map();
  19     targetManager.observeTargets(this);
  20
  21     targetManager.addModelListener(WebInspector.ResourceTreeModel, WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._mainFrameCreatedOrNavigated, this);
  22 }
  23
  24 WebInspector.CSSWorkspaceBinding.prototype = {
  25     /**
  26      * @override
  27      * @param {!WebInspector.Target} target
  28      */
  29     targetAdded: function(target)
  30     {
  31         var cssModel = WebInspector.CSSStyleModel.fromTarget(target);
  32         if (cssModel)
  33             this._modelToTargetInfo.set(cssModel, new WebInspector.CSSWorkspaceBinding.TargetInfo(cssModel, this._workspace, this._networkMapping));
  34     },
  35
  36     /**
  37      * @override
  38      * @param {!WebInspector.Target} target
  39      */
  40     targetRemoved: function(target)
  41     {
  42         var cssModel = WebInspector.CSSStyleModel.fromTarget(target);
  43         if (cssModel)
  44             this._modelToTargetInfo.remove(cssModel)._dispose();
  45     },
  46
  47     /**
  48      * @param {!WebInspector.CSSStyleSheetHeader} header
  49      * @param {!WebInspector.CSSSourceMapping} mapping
  50      */
  51     pushSourceMapping: function(header, mapping)
  52     {
  53         this._ensureInfoForHeader(header)._pushSourceMapping(mapping);
  54     },
  55
  56     /**
  57      * @param {!WebInspector.CSSStyleSheetHeader} header
  58      * @return {?WebInspector.CSSWorkspaceBinding.HeaderInfo}
  59      */
  60     _headerInfo: function(header)
  61     {
  62         var map = this._modelToTargetInfo.get(header.cssModel());
  63         return map._headerInfo(header.id) || null;
  64     },
  65
  66     /**
  67      * @param {!WebInspector.CSSStyleSheetHeader} header
  68      * @return {!WebInspector.CSSWorkspaceBinding.HeaderInfo}
  69      */
  70     _ensureInfoForHeader: function(header)
  71     {
  72         var targetInfo = this._modelToTargetInfo.get(header.cssModel());
  73         if (!targetInfo) {
  74             targetInfo = new WebInspector.CSSWorkspaceBinding.TargetInfo(header.cssModel(), this._workspace, this._networkMapping);
  75             this._modelToTargetInfo.set(header.cssModel(), targetInfo);
  76         }
  77         return targetInfo._ensureInfoForHeader(header);
  78     },
  79
  80     /**
  81      * @param {!WebInspector.Event} event
  82      */
  83     _mainFrameCreatedOrNavigated: function(event)
  84     {
  85         var target = /** @type {!WebInspector.ResourceTreeModel} */ (event.target).target();
  86         var cssModel = WebInspector.CSSStyleModel.fromTarget(target);
  87         if (cssModel)
  88             this._modelToTargetInfo.get(cssModel)._reset();
  89     },
  90
  91     /**
  92      * @param {!WebInspector.CSSStyleSheetHeader} header
  93      */
  94     updateLocations: function(header)
  95     {
  96         var info = this._headerInfo(header);
  97         if (info)
  98             info._updateLocations();
  99     },
 100
 101     /**
 102      * @param {!WebInspector.CSSLocation} rawLocation
 103      * @param {function(!WebInspector.UILocation):(boolean|undefined)} updateDelegate
 104      * @return {!WebInspector.CSSWorkspaceBinding.LiveLocation}
 105      */
 106     createLiveLocation: function(rawLocation, updateDelegate)
 107     {
 108         var header = rawLocation.styleSheetId ? rawLocation.cssModel().styleSheetHeaderForId(rawLocation.styleSheetId) : null;
 109         return new WebInspector.CSSWorkspaceBinding.LiveLocation(rawLocation.cssModel(), header, rawLocation, this, updateDelegate);
 110     },
 111
 112     /**
 113      * @param {!WebInspector.CSSWorkspaceBinding.LiveLocation} location
 114      */
 115     _addLiveLocation: function(location)
 116     {
 117         this._ensureInfoForHeader(location._header)._addLocation(location);
 118     },
 119
 120     /**
 121      * @param {!WebInspector.CSSWorkspaceBinding.LiveLocation} location
 122      */
 123     _removeLiveLocation: function(location)
 124     {
 125         var info = this._headerInfo(location._header);
 126         if (info)
 127             info._removeLocation(location);
 128     },
 129
 130     /**
 131      * @param {!WebInspector.CSSProperty} cssProperty
 132      * @param {boolean} forName
 133      * @return {?WebInspector.UILocation}
 134      */
 135     propertyUILocation: function(cssProperty, forName)
 136     {
 137         var style = cssProperty.ownerStyle;
 138         if (!style || !style.parentRule || !style.styleSheetId)
 139             return null;
 140
 141         var range = cssProperty.range;
 142         if (!range)
 143             return null;
 144
 145         var url = style.parentRule.resourceURL();
 146         if (!url)
 147             return null;
 148
 149         var line = forName ? range.startLine : range.endLine;
 150         // End of range is exclusive, so subtract 1 from the end offset.
 151         var column = forName ? range.startColumn : range.endColumn - (cssProperty.text && cssProperty.text.endsWith(";") ? 2 : 1);
 152         var header = style.cssModel().styleSheetHeaderForId(style.styleSheetId);
 153         var rawLocation = new WebInspector.CSSLocation(style.cssModel(), style.styleSheetId, url, header.lineNumberInSource(line), header.columnNumberInSource(line, column));
 154         return this.rawLocationToUILocation(rawLocation);
 155     },
 156
 157     /**
 158      * @param {?WebInspector.CSSLocation} rawLocation
 159      * @return {?WebInspector.UILocation}
 160      */
 161     rawLocationToUILocation: function(rawLocation)
 162     {
 163         if (!rawLocation)
 164             return null;
 165         var header = rawLocation.cssModel().styleSheetHeaderForId(rawLocation.styleSheetId);
 166         if (!header)
 167             return null;
 168         var info = this._headerInfo(header);
 169         return info ? info._rawLocationToUILocation(rawLocation.lineNumber, rawLocation.columnNumber) : null;
 170     }
 171 }
 172
 173 /**
 174  * @constructor
 175  * @param {!WebInspector.CSSStyleModel} cssModel
 176  * @param {!WebInspector.Workspace} workspace
 177  * @param {!WebInspector.NetworkMapping} networkMapping
 178  */
 179 WebInspector.CSSWorkspaceBinding.TargetInfo = function(cssModel, workspace, networkMapping)
 180 {
 181     this._cssModel = cssModel;
 182     this._stylesSourceMapping = new WebInspector.StylesSourceMapping(cssModel, workspace, networkMapping);
 183     this._sassSourceMapping = new WebInspector.SASSSourceMapping(cssModel, workspace, networkMapping, WebInspector.NetworkProject.forTarget(cssModel.target()));
 184
 185     /** @type {!Map.<string, !WebInspector.CSSWorkspaceBinding.HeaderInfo>} */
 186     this._headerInfoById = new Map();
 187
 188     cssModel.addEventListener(WebInspector.CSSStyleModel.Events.StyleSheetAdded, this._styleSheetAdded, this);
 189     cssModel.addEventListener(WebInspector.CSSStyleModel.Events.StyleSheetRemoved, this._styleSheetRemoved, this);
 190 }
 191
 192 WebInspector.CSSWorkspaceBinding.TargetInfo.prototype = {
 193     /**
 194      * @param {!WebInspector.Event} event
 195      */
 196     _styleSheetAdded: function(event)
 197     {
 198         var header = /** @type {!WebInspector.CSSStyleSheetHeader} */ (event.data);
 199         this._stylesSourceMapping.addHeader(header);
 200         this._sassSourceMapping.addHeader(header);
 201     },
 202
 203     /**
 204      * @param {!WebInspector.Event} event
 205      */
 206     _styleSheetRemoved: function(event)
 207     {
 208         var header = /** @type {!WebInspector.CSSStyleSheetHeader} */ (event.data);
 209         this._stylesSourceMapping.removeHeader(header);
 210         this._sassSourceMapping.removeHeader(header);
 211         this._headerInfoById.remove(header.id);
 212     },
 213
 214     /**
 215      * @param {!CSSAgent.StyleSheetId} id
 216      */
 217     _headerInfo: function(id)
 218     {
 219         return this._headerInfoById.get(id);
 220     },
 221
 222     _ensureInfoForHeader: function(header)
 223     {
 224         var info = this._headerInfoById.get(header.id);
 225         if (!info) {
 226             info = new WebInspector.CSSWorkspaceBinding.HeaderInfo(header);
 227             this._headerInfoById.set(header.id, info);
 228         }
 229         return info;
 230     },
 231
 232     _dispose: function()
 233     {
 234         this._reset();
 235         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetAdded, this._styleSheetAdded, this);
 236         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetRemoved, this._styleSheetRemoved, this);
 237     },
 238
 239     _reset: function()
 240     {
 241         this._headerInfoById.clear();
 242     }
 243 }
 244
 245 /**
 246  * @constructor
 247  * @param {!WebInspector.CSSStyleSheetHeader} header
 248  */
 249 WebInspector.CSSWorkspaceBinding.HeaderInfo = function(header)
 250 {
 251     this._header = header;
 252
 253     /** @type {!Array.<!WebInspector.CSSSourceMapping>} */
 254     this._sourceMappings = [];
 255
 256     /** @type {!Set.<!WebInspector.LiveLocation>} */
 257     this._locations = new Set();
 258 }
 259
 260 WebInspector.CSSWorkspaceBinding.HeaderInfo.prototype = {
 261     /**
 262      * @param {!WebInspector.LiveLocation} location
 263      */
 264     _addLocation: function(location)
 265     {
 266         this._locations.add(location);
 267         location.update();
 268     },
 269
 270     /**
 271      * @param {!WebInspector.LiveLocation} location
 272      */
 273     _removeLocation: function(location)
 274     {
 275         this._locations.delete(location);
 276     },
 277
 278     _updateLocations: function()
 279     {
 280         var items = this._locations.valuesArray();
 281         for (var i = 0; i < items.length; ++i)
 282             items[i].update();
 283     },
 284
 285     /**
 286      * @param {number} lineNumber
 287      * @param {number=} columnNumber
 288      * @return {?WebInspector.UILocation}
 289      */
 290     _rawLocationToUILocation: function(lineNumber, columnNumber)
 291     {
 292         var uiLocation = null;
 293         var rawLocation = new WebInspector.CSSLocation(this._header.cssModel(), this._header.id, this._header.resourceURL(), lineNumber, columnNumber);
 294         for (var i = this._sourceMappings.length - 1; !uiLocation && i >= 0; --i)
 295             uiLocation = this._sourceMappings[i].rawLocationToUILocation(rawLocation);
 296         return uiLocation;
 297     },
 298
 299     /**
 300      * @param {!WebInspector.CSSSourceMapping} sourceMapping
 301      */
 302     _pushSourceMapping: function(sourceMapping)
 303     {
 304         this._sourceMappings.push(sourceMapping);
 305         this._updateLocations();
 306     }
 307 }
 308
 309 /**
 310  * @constructor
 311  * @extends {WebInspector.LiveLocation}
 312  * @param {!WebInspector.CSSStyleModel} cssModel
 313  * @param {?WebInspector.CSSStyleSheetHeader} header
 314  * @param {!WebInspector.CSSLocation} rawLocation
 315  * @param {!WebInspector.CSSWorkspaceBinding} binding
 316  * @param {function(!WebInspector.UILocation):(boolean|undefined)} updateDelegate
 317  */
 318 WebInspector.CSSWorkspaceBinding.LiveLocation = function(cssModel, header, rawLocation, binding, updateDelegate)
 319 {
 320     WebInspector.LiveLocation.call(this, updateDelegate);
 321     this._cssModel = cssModel;
 322     this._rawLocation = rawLocation;
 323     this._binding = binding;
 324     if (!header)
 325         this._clearStyleSheet();
 326     else
 327         this._setStyleSheet(header);
 328 }
 329
 330 WebInspector.CSSWorkspaceBinding.LiveLocation.prototype = {
 331     /**
 332      * @param {!WebInspector.Event} event
 333      */
 334     _styleSheetAdded: function(event)
 335     {
 336         console.assert(!this._header);
 337         var header = /** @type {!WebInspector.CSSStyleSheetHeader} */ (event.data);
 338         if (header.sourceURL && header.sourceURL === this._rawLocation.url)
 339             this._setStyleSheet(header);
 340     },
 341
 342     /**
 343      * @param {!WebInspector.Event} event
 344      */
 345     _styleSheetRemoved: function(event)
 346     {
 347         console.assert(this._header);
 348         var header = /** @type {!WebInspector.CSSStyleSheetHeader} */ (event.data);
 349         if (this._header !== header)
 350             return;
 351         this._binding._removeLiveLocation(this);
 352         this._clearStyleSheet();
 353     },
 354
 355     /**
 356      * @param {!WebInspector.CSSStyleSheetHeader} header
 357      */
 358     _setStyleSheet: function(header)
 359     {
 360         this._header = header;
 361         this._binding._addLiveLocation(this);
 362         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetAdded, this._styleSheetAdded, this);
 363         this._cssModel.addEventListener(WebInspector.CSSStyleModel.Events.StyleSheetRemoved, this._styleSheetRemoved, this);
 364     },
 365
 366     _clearStyleSheet: function()
 367     {
 368         delete this._header;
 369         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetRemoved, this._styleSheetRemoved, this);
 370         this._cssModel.addEventListener(WebInspector.CSSStyleModel.Events.StyleSheetAdded, this._styleSheetAdded, this);
 371     },
 372
 373     /**
 374      * @override
 375      * @return {?WebInspector.UILocation}
 376      */
 377     uiLocation: function()
 378     {
 379         var cssLocation = this._rawLocation;
 380         if (this._header) {
 381             var headerInfo = this._binding._headerInfo(this._header);
 382             return headerInfo._rawLocationToUILocation(cssLocation.lineNumber, cssLocation.columnNumber);
 383         }
 384         var uiSourceCode = this._binding._networkMapping.uiSourceCodeForURL(cssLocation.url, cssLocation.target());
 385         if (!uiSourceCode)
 386             return null;
 387         return uiSourceCode.uiLocation(cssLocation.lineNumber, cssLocation.columnNumber);
 388     },
 389
 390     dispose: function()
 391     {
 392         WebInspector.LiveLocation.prototype.dispose.call(this);
 393         if (this._header)
 394             this._binding._removeLiveLocation(this);
 395         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetAdded, this._styleSheetAdded, this);
 396         this._cssModel.removeEventListener(WebInspector.CSSStyleModel.Events.StyleSheetRemoved, this._styleSheetRemoved, this);
 397     },
 398
 399     __proto__: WebInspector.LiveLocation.prototype
 400 }
 401
 402 /**
 403  * @interface
 404  */
 405 WebInspector.CSSSourceMapping = function()
 406 {
 407 }
 408
 409 WebInspector.CSSSourceMapping.prototype = {
 410     /**
 411      * @param {!WebInspector.CSSLocation} rawLocation
 412      * @return {?WebInspector.UILocation}
 413      */
 414     rawLocationToUILocation: function(rawLocation) { },
 415
 416     /**
 417      * @param {!WebInspector.UISourceCode} uiSourceCode
 418      * @param {number} lineNumber
 419      * @param {number} columnNumber
 420      * @return {?WebInspector.CSSLocation}
 421      */
 422     uiLocationToRawLocation: function(uiSourceCode, lineNumber, columnNumber) { },
 423
 424     /**
 425      * @return {boolean}
 426      */
 427     isIdentity: function() { },
 428
 429     /**
 430      * @param {!WebInspector.UISourceCode} uiSourceCode
 431      * @param {number} lineNumber
 432      * @return {boolean}
 433      */
 434     uiLineHasMapping: function(uiSourceCode, lineNumber) { }
 435 }
 436
 437 /**
 438  * @type {!WebInspector.CSSWorkspaceBinding}
 439  */
 440 WebInspector.cssWorkspaceBinding;