third_party/WebKit/Source/devtools/front_end/components/Linkifier.js

   1 /*
   2  * Copyright (C) 2012 Google Inc. All rights reserved.
   3  *
   4  * Redistribution and use in source and binary forms, with or without
   5  * modification, are permitted provided that the following conditions are
   6  * met:
   7  *
   8  *     * Redistributions of source code must retain the above copyright
   9  * notice, this list of conditions and the following disclaimer.
  10  *     * Redistributions in binary form must reproduce the above
  11  * copyright notice, this list of conditions and the following disclaimer
  12  * in the documentation and/or other materials provided with the
  13  * distribution.
  14  *     * Neither the name of Google Inc. nor the names of its
  15  * contributors may be used to endorse or promote products derived from
  16  * this software without specific prior written permission.
  17  *
  18  * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
  19  * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
  20  * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
  21  * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
  22  * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
  23  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  24  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  25  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  26  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  27  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  28  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  29  */
  30
  31 /**
  32  * @interface
  33  */
  34 WebInspector.LinkifierFormatter = function()
  35 {
  36 }
  37
  38 WebInspector.LinkifierFormatter.prototype = {
  39     /**
  40      * @param {!Element} anchor
  41      * @param {!WebInspector.UILocation} uiLocation
  42      */
  43     formatLiveAnchor: function(anchor, uiLocation) { }
  44 }
  45
  46 /**
  47  * @constructor
  48  * @implements {WebInspector.TargetManager.Observer}
  49  * @param {!WebInspector.LinkifierFormatter=} formatter
  50  */
  51 WebInspector.Linkifier = function(formatter)
  52 {
  53     this._formatter = formatter || new WebInspector.Linkifier.DefaultFormatter(WebInspector.Linkifier.MaxLengthForDisplayedURLs);
  54     /** @type {!Map.<!WebInspector.Target, !Map.<!Element, !WebInspector.LiveLocation>>}*/
  55     this._liveLocationsByTarget = new Map();
  56     WebInspector.targetManager.observeTargets(this);
  57 }
  58
  59 /**
  60  * @param {?WebInspector.Linkifier.LinkHandler} handler
  61  */
  62 WebInspector.Linkifier.setLinkHandler = function(handler)
  63 {
  64     WebInspector.Linkifier._linkHandler = handler;
  65 }
  66
  67 /**
  68  * @param {string} url
  69  * @param {number=} lineNumber
  70  * @return {boolean}
  71  */
  72 WebInspector.Linkifier.handleLink = function(url, lineNumber)
  73 {
  74     if (!WebInspector.Linkifier._linkHandler)
  75         return false;
  76     return WebInspector.Linkifier._linkHandler.handleLink(url, lineNumber);
  77 }
  78
  79 /**
  80  * @param {!Object} revealable
  81  * @param {string} text
  82  * @param {string=} fallbackHref
  83  * @param {number=} fallbackLineNumber
  84  * @param {string=} title
  85  * @param {string=} classes
  86  * @return {!Element}
  87  */
  88 WebInspector.Linkifier.linkifyUsingRevealer = function(revealable, text, fallbackHref, fallbackLineNumber, title, classes)
  89 {
  90     var a = createElement("a");
  91     a.className = (classes || "") + " webkit-html-resource-link";
  92     a.textContent = text.trimMiddle(WebInspector.Linkifier.MaxLengthForDisplayedURLs);
  93     a.title = title || text;
  94     if (fallbackHref) {
  95         a.href = fallbackHref;
  96         a.lineNumber = fallbackLineNumber;
  97     }
  98     /**
  99      * @param {!Event} event
 100      * @this {Object}
 101      */
 102     function clickHandler(event)
 103     {
 104         event.stopImmediatePropagation();
 105         event.preventDefault();
 106         if (fallbackHref && WebInspector.Linkifier.handleLink(fallbackHref, fallbackLineNumber))
 107             return;
 108
 109         WebInspector.Revealer.reveal(this);
 110     }
 111     a.addEventListener("click", clickHandler.bind(revealable), false);
 112     return a;
 113 }
 114
 115 WebInspector.Linkifier._uiLocationSymbol = Symbol("uiLocation");
 116 WebInspector.Linkifier._fallbackAnchorSymbol = Symbol("fallbackAnchor");;
 117
 118 WebInspector.Linkifier.prototype = {
 119     /**
 120      * @override
 121      * @param {!WebInspector.Target} target
 122      */
 123     targetAdded: function(target)
 124     {
 125         this._liveLocationsByTarget.set(target, new Map());
 126     },
 127
 128     /**
 129      * @override
 130      * @param {!WebInspector.Target} target
 131      */
 132     targetRemoved: function(target)
 133     {
 134         var liveLocations = this._liveLocationsByTarget.remove(target);
 135         var anchors = liveLocations.keysArray();
 136         for (var i = 0; i < anchors.length; ++i) {
 137             var anchor = anchors[i];
 138             var location = liveLocations.get(anchor);
 139             delete anchor[WebInspector.Linkifier._uiLocationSymbol];
 140             var fallbackAnchor = anchor[WebInspector.Linkifier._fallbackAnchorSymbol];
 141             if (fallbackAnchor) {
 142                 anchor.href = fallbackAnchor.href;
 143                 anchor.lineNumber = fallbackAnchor.lineNumber;
 144                 anchor.title = fallbackAnchor.title;
 145                 anchor.className = fallbackAnchor.className;
 146                 anchor.textContent = fallbackAnchor.textContent;
 147                 delete anchor[WebInspector.Linkifier._fallbackAnchorSymbol];
 148             }
 149             location.dispose();
 150         }
 151     },
 152
 153     /**
 154      * @param {?WebInspector.Target} target
 155      * @param {?string} scriptId
 156      * @param {string} sourceURL
 157      * @param {number} lineNumber
 158      * @param {number=} columnNumber
 159      * @param {string=} classes
 160      * @return {!Element}
 161      */
 162     linkifyScriptLocation: function(target, scriptId, sourceURL, lineNumber, columnNumber, classes)
 163     {
 164         var fallbackAnchor = WebInspector.linkifyResourceAsNode(sourceURL, lineNumber, classes);
 165         if (!target || target.isDetached())
 166             return fallbackAnchor;
 167         var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
 168         if (!debuggerModel)
 169             return fallbackAnchor;
 170
 171         var rawLocation = scriptId ? debuggerModel.createRawLocationByScriptId(scriptId, lineNumber, columnNumber || 0) :
 172                                      debuggerModel.createRawLocationByURL(sourceURL, lineNumber, columnNumber || 0);
 173         if (!rawLocation)
 174             return fallbackAnchor;
 175
 176         var anchor = this._createAnchor(classes);
 177         var liveLocation = WebInspector.debuggerWorkspaceBinding.createLiveLocation(rawLocation, this._updateAnchor.bind(this, anchor));
 178         this._liveLocationsByTarget.get(rawLocation.target()).set(anchor, liveLocation);
 179         anchor[WebInspector.Linkifier._fallbackAnchorSymbol] = fallbackAnchor;
 180         return anchor;
 181     },
 182
 183     /**
 184      * @param {!WebInspector.DebuggerModel.Location} rawLocation
 185      * @param {string} fallbackUrl
 186      * @param {string=} classes
 187      * @return {!Element}
 188      */
 189     linkifyRawLocation: function(rawLocation, fallbackUrl, classes)
 190     {
 191         return this.linkifyScriptLocation(rawLocation.target(), rawLocation.scriptId, fallbackUrl, rawLocation.lineNumber, rawLocation.columnNumber, classes);
 192     },
 193
 194     /**
 195      * @param {?WebInspector.Target} target
 196      * @param {!ConsoleAgent.CallFrame} callFrame
 197      * @param {string=} classes
 198      * @return {!Element}
 199      */
 200     linkifyConsoleCallFrame: function(target, callFrame, classes)
 201     {
 202         // FIXME(62725): console stack trace line/column numbers are one-based.
 203         var lineNumber = callFrame.lineNumber ? callFrame.lineNumber - 1 : 0;
 204         var columnNumber = callFrame.columnNumber ? callFrame.columnNumber - 1 : 0;
 205         var anchor = this.linkifyScriptLocation(target, callFrame.scriptId, callFrame.url, lineNumber, columnNumber, classes);
 206         var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
 207         var script = debuggerModel && debuggerModel.scriptForId(callFrame.scriptId);
 208         var blackboxed = script ?
 209             WebInspector.BlackboxSupport.isBlackboxed(script.sourceURL, script.isContentScript()) :
 210             WebInspector.BlackboxSupport.isBlackboxedURL(callFrame.url);
 211         if (blackboxed)
 212             anchor.classList.add("webkit-html-blackbox-link");
 213
 214         return anchor;
 215     },
 216
 217     /**
 218      * @param {!WebInspector.CSSLocation} rawLocation
 219      * @param {string=} classes
 220      * @return {!Element}
 221      */
 222     linkifyCSSLocation: function(rawLocation, classes)
 223     {
 224         var anchor = this._createAnchor(classes);
 225         var liveLocation = WebInspector.cssWorkspaceBinding.createLiveLocation(rawLocation, this._updateAnchor.bind(this, anchor));
 226         this._liveLocationsByTarget.get(rawLocation.target()).set(anchor, liveLocation);
 227         return anchor;
 228     },
 229
 230     /**
 231      * @param {!WebInspector.CSSMedia} media
 232      * @return {?Element}
 233      */
 234     linkifyMedia: function(media)
 235     {
 236         var location = media.rawLocation();
 237         if (location)
 238             return this.linkifyCSSLocation(location);
 239
 240         // The "linkedStylesheet" case.
 241         return WebInspector.linkifyResourceAsNode(media.sourceURL, undefined, "subtitle", media.sourceURL);
 242     },
 243
 244     /**
 245      * @param {!WebInspector.Target} target
 246      * @param {!Element} anchor
 247      */
 248     disposeAnchor: function(target, anchor)
 249     {
 250         delete anchor[WebInspector.Linkifier._uiLocationSymbol];
 251         delete anchor[WebInspector.Linkifier._fallbackAnchorSymbol];
 252         var liveLocations = this._liveLocationsByTarget.get(target);
 253         if (!liveLocations)
 254             return;
 255         var location = liveLocations.remove(anchor);
 256         if (location)
 257             location.dispose();
 258     },
 259
 260     /**
 261      * @param {string=} classes
 262      * @return {!Element}
 263      */
 264     _createAnchor: function(classes)
 265     {
 266         var anchor = createElement("a");
 267         anchor.className = (classes || "") + " webkit-html-resource-link";
 268
 269         /**
 270          * @param {!Event} event
 271          */
 272         function clickHandler(event)
 273         {
 274             var uiLocation = anchor[WebInspector.Linkifier._uiLocationSymbol];
 275             if (!uiLocation)
 276                 return;
 277
 278             event.consume(true);
 279             var networkURL = WebInspector.networkMapping.networkURL(uiLocation.uiSourceCode);
 280             if (WebInspector.Linkifier.handleLink(networkURL, uiLocation.lineNumber))
 281                 return;
 282             WebInspector.Revealer.reveal(uiLocation);
 283         }
 284         anchor.addEventListener("click", clickHandler, false);
 285         return anchor;
 286     },
 287
 288     reset: function()
 289     {
 290         var targets = this._liveLocationsByTarget.keysArray();
 291         for (var i = 0; i < targets.length; ++i) {
 292             var target = targets[i];
 293             this.targetRemoved(target);
 294             this.targetAdded(target);
 295         }
 296     },
 297
 298     dispose: function()
 299     {
 300         this.reset();
 301         WebInspector.targetManager.unobserveTargets(this);
 302         this._liveLocationsByTarget.clear();
 303     },
 304
 305     /**
 306      * @param {!Element} anchor
 307      * @param {!WebInspector.UILocation} uiLocation
 308      */
 309     _updateAnchor: function(anchor, uiLocation)
 310     {
 311         anchor[WebInspector.Linkifier._uiLocationSymbol] = uiLocation;
 312         this._formatter.formatLiveAnchor(anchor, uiLocation);
 313     }
 314 }
 315
 316 /**
 317  * @param {!Element} anchor
 318  * @return {?WebInspector.UILocation} uiLocation
 319  */
 320 WebInspector.Linkifier.uiLocationByAnchor = function(anchor)
 321 {
 322     return anchor[WebInspector.Linkifier._uiLocationSymbol];
 323 }
 324
 325 /**
 326  * @constructor
 327  * @implements {WebInspector.LinkifierFormatter}
 328  * @param {number=} maxLength
 329  */
 330 WebInspector.Linkifier.DefaultFormatter = function(maxLength)
 331 {
 332     this._maxLength = maxLength;
 333 }
 334
 335 WebInspector.Linkifier.DefaultFormatter.prototype = {
 336     /**
 337      * @override
 338      * @param {!Element} anchor
 339      * @param {!WebInspector.UILocation} uiLocation
 340      */
 341     formatLiveAnchor: function(anchor, uiLocation)
 342     {
 343         var text = uiLocation.linkText();
 344         if (this._maxLength)
 345             text = text.trimMiddle(this._maxLength);
 346         anchor.textContent = text;
 347
 348         var titleText = uiLocation.uiSourceCode.originURL();
 349         if (typeof uiLocation.lineNumber === "number")
 350             titleText += ":" + (uiLocation.lineNumber + 1);
 351         anchor.title = titleText;
 352     }
 353 }
 354
 355 /**
 356  * @constructor
 357  * @extends {WebInspector.Linkifier.DefaultFormatter}
 358  */
 359 WebInspector.Linkifier.DefaultCSSFormatter = function()
 360 {
 361     WebInspector.Linkifier.DefaultFormatter.call(this, WebInspector.Linkifier.DefaultCSSFormatter.MaxLengthForDisplayedURLs);
 362 }
 363
 364 WebInspector.Linkifier.DefaultCSSFormatter.MaxLengthForDisplayedURLs = 30;
 365
 366 WebInspector.Linkifier.DefaultCSSFormatter.prototype = {
 367     /**
 368      * @override
 369      * @param {!Element} anchor
 370      * @param {!WebInspector.UILocation} uiLocation
 371      */
 372     formatLiveAnchor: function(anchor, uiLocation)
 373     {
 374         WebInspector.Linkifier.DefaultFormatter.prototype.formatLiveAnchor.call(this, anchor, uiLocation);
 375         anchor.classList.add("webkit-html-resource-link");
 376         anchor.setAttribute("data-uncopyable", anchor.textContent);
 377         anchor.textContent = "";
 378     },
 379     __proto__: WebInspector.Linkifier.DefaultFormatter.prototype
 380 }
 381
 382 /**
 383  * The maximum number of characters to display in a URL.
 384  * @const
 385  * @type {number}
 386  */
 387 WebInspector.Linkifier.MaxLengthForDisplayedURLs = 150;
 388
 389 /**
 390  * @interface
 391  */
 392 WebInspector.Linkifier.LinkHandler = function()
 393 {
 394 }
 395
 396 WebInspector.Linkifier.LinkHandler.prototype = {
 397     /**
 398      * @param {string} url
 399      * @param {number=} lineNumber
 400      * @return {boolean}
 401      */
 402     handleLink: function(url, lineNumber) {}
 403 }
 404
 405 /**
 406  * @param {!WebInspector.Target} target
 407  * @param {string} scriptId
 408  * @param {number} lineNumber
 409  * @param {number=} columnNumber
 410  * @return {string}
 411  */
 412 WebInspector.Linkifier.liveLocationText = function(target, scriptId, lineNumber, columnNumber)
 413 {
 414     var debuggerModel = WebInspector.DebuggerModel.fromTarget(target);
 415     if (!debuggerModel)
 416         return "";
 417     var script = debuggerModel.scriptForId(scriptId);
 418     if (!script)
 419         return "";
 420     var location = /** @type {!WebInspector.DebuggerModel.Location} */ (debuggerModel.createRawLocation(script, lineNumber, columnNumber || 0));
 421     var uiLocation = /** @type {!WebInspector.UILocation} */ (WebInspector.debuggerWorkspaceBinding.rawLocationToUILocation(location));
 422     return uiLocation.linkText();
 423 }
 424
 425 /**
 426  * @param {string} string
 427  * @param {function(string,string,number=,number=):!Node} linkifier
 428  * @return {!DocumentFragment}
 429  */
 430 WebInspector.linkifyStringAsFragmentWithCustomLinkifier = function(string, linkifier)
 431 {
 432     var container = createDocumentFragment();
 433     var linkStringRegEx = /(?:[a-zA-Z][a-zA-Z0-9+.-]{2,}:\/\/|data:|www\.)[\w$\-_+*'=\|\/\\(){}[\]^%@&#~,:;.!?]{2,}[\w$\-_+*=\|\/\\({^%@&#~]/;
 434
 435     while (string) {
 436         var linkString = linkStringRegEx.exec(string);
 437         if (!linkString)
 438             break;
 439
 440         linkString = linkString[0];
 441         var linkIndex = string.indexOf(linkString);
 442         var nonLink = string.substring(0, linkIndex);
 443         container.appendChild(createTextNode(nonLink));
 444
 445         var title = linkString;
 446         var realURL = (linkString.startsWith("www.") ? "http://" + linkString : linkString);
 447         var splitResult = WebInspector.ParsedURL.splitLineAndColumn(realURL);
 448         var linkNode;
 449         if (splitResult)
 450             linkNode = linkifier(title, splitResult.url, splitResult.lineNumber, splitResult.columnNumber);
 451         else
 452             linkNode = linkifier(title, realURL);
 453
 454         container.appendChild(linkNode);
 455         string = string.substring(linkIndex + linkString.length, string.length);
 456     }
 457
 458     if (string)
 459         container.appendChild(createTextNode(string));
 460
 461     return container;
 462 }
 463
 464 /**
 465  * @param {string} string
 466  * @return {!DocumentFragment}
 467  */
 468 WebInspector.linkifyStringAsFragment = function(string)
 469 {
 470     /**
 471      * @param {string} title
 472      * @param {string} url
 473      * @param {number=} lineNumber
 474      * @param {number=} columnNumber
 475      * @return {!Node}
 476      */
 477     function linkifier(title, url, lineNumber, columnNumber)
 478     {
 479         var isExternal = !WebInspector.resourceForURL(url) && !WebInspector.networkMapping.uiSourceCodeForURLForAnyTarget(url);
 480         var urlNode = WebInspector.linkifyURLAsNode(url, title, undefined, isExternal);
 481         if (typeof lineNumber !== "undefined") {
 482             urlNode.lineNumber = lineNumber;
 483             if (typeof columnNumber !== "undefined")
 484                 urlNode.columnNumber = columnNumber;
 485         }
 486
 487         return urlNode;
 488     }
 489
 490     return WebInspector.linkifyStringAsFragmentWithCustomLinkifier(string, linkifier);
 491 }
 492
 493 /**
 494  * @param {string} url
 495  * @param {string=} linkText
 496  * @param {string=} classes
 497  * @param {boolean=} isExternal
 498  * @param {string=} tooltipText
 499  * @return {!Element}
 500  */
 501 WebInspector.linkifyURLAsNode = function(url, linkText, classes, isExternal, tooltipText)
 502 {
 503     if (!linkText)
 504         linkText = url;
 505     classes = (classes ? classes + " " : "");
 506     classes += isExternal ? "webkit-html-external-link" : "webkit-html-resource-link";
 507
 508     var a = createElement("a");
 509     var href = sanitizeHref(url);
 510     if (href !== null)
 511         a.href = href;
 512     a.className = classes;
 513     if (!tooltipText && linkText !== url)
 514         a.title = url;
 515     else if (tooltipText)
 516         a.title = tooltipText;
 517     a.textContent = linkText.trimMiddle(WebInspector.Linkifier.MaxLengthForDisplayedURLs);
 518     if (isExternal)
 519         a.setAttribute("target", "_blank");
 520
 521     return a;
 522 }
 523
 524 /**
 525  * @param {string} article
 526  * @param {string} title
 527  * @return {!Element}
 528  */
 529 WebInspector.linkifyDocumentationURLAsNode = function(article, title)
 530 {
 531     return WebInspector.linkifyURLAsNode("https://developers.google.com/web/tools/" + article, title, undefined, true);
 532 }
 533
 534 /**
 535  * @param {string} url
 536  * @param {number=} lineNumber
 537  * @param {string=} classes
 538  * @param {string=} tooltipText
 539  * @param {string=} urlDisplayName
 540  * @return {!Element}
 541  */
 542 WebInspector.linkifyResourceAsNode = function(url, lineNumber, classes, tooltipText, urlDisplayName)
 543 {
 544     var linkText = urlDisplayName ? urlDisplayName : url ? WebInspector.displayNameForURL(url) : WebInspector.UIString("(program)");
 545     if (typeof lineNumber === "number")
 546         linkText += ":" + (lineNumber + 1);
 547     var anchor = WebInspector.linkifyURLAsNode(url, linkText, classes, false, tooltipText);
 548     anchor.lineNumber = lineNumber;
 549     return anchor;
 550 }
 551
 552 /**
 553  * @param {!WebInspector.NetworkRequest} request
 554  * @return {!Element}
 555  */
 556 WebInspector.linkifyRequestAsNode = function(request)
 557 {
 558     var anchor = WebInspector.linkifyURLAsNode(request.url);
 559     anchor.requestId = request.requestId;
 560     return anchor;
 561 }