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.
5 cr
.define('extensions', function() {
9 * ExtensionCode is an element which displays code in a styled div, and is
10 * designed to highlight errors.
12 function ExtensionCode(div
) {
13 div
.__proto__
= ExtensionCode
.prototype;
17 ExtensionCode
.prototype = {
18 __proto__
: HTMLDivElement
.prototype,
21 * Populate the content area of the code div with the given code. This will
22 * highlight the erroneous section (if any).
23 * @param {Object} code An object with four strings: beforeHighlight,
24 * afterHighlight, highlight, and the message. The 'highlight' strings
25 * represent the three portions of the file's content to display - the
26 * portion which is most relevant and should be emphasized (highlight),
27 * and the parts both before and after this portion. The message is the
28 * error message, which will be the mouseover hint for the highlighted
29 * region. These may be empty.
30 * @param {string} emptyMessage The message to display if the code
31 * object is empty (e.g., 'could not load code').
33 populate: function(code
, emptyMessage
) {
34 // Clear any remnant content, so we don't have multiple code listed.
37 var sourceDiv
= document
.createElement('div');
38 sourceDiv
.classList
.add('extension-code-source');
39 this.appendChild(sourceDiv
);
41 // If there's no code, then display an appropriate message.
43 (!code
.highlight
&& !code
.beforeHighlight
&& !code
.afterHighlight
)) {
44 var span
= document
.createElement('span');
45 span
.textContent
= emptyMessage
;
46 sourceDiv
.appendChild(span
);
51 var createSpan = function(source
, isHighlighted
) {
52 lineCount
+= source
.split('\n').length
- 1;
53 var span
= document
.createElement('span');
54 span
.className
= isHighlighted
? 'extension-code-highlighted-source' :
55 'extension-code-normal-source';
56 span
.textContent
= source
;
60 if (code
.beforeHighlight
)
61 sourceDiv
.appendChild(createSpan(code
.beforeHighlight
, false));
64 var highlightSpan
= createSpan(code
.highlight
, true);
65 highlightSpan
.title
= code
.message
;
66 sourceDiv
.appendChild(highlightSpan
);
69 if (code
.afterHighlight
)
70 sourceDiv
.appendChild(createSpan(code
.afterHighlight
, false));
72 // Make the line numbers. This should be the number of line breaks + 1
73 // (the last line doesn't break, but should still be numbered).
75 for (var i
= 1; i
< lineCount
+ 1; ++i
)
77 var span
= document
.createElement('span');
78 span
.textContent
= content
;
80 var linesDiv
= document
.createElement('div');
81 linesDiv
.classList
.add('extension-code-line-numbers');
82 linesDiv
.appendChild(span
);
83 this.insertBefore(linesDiv
, this.firstChild
);
87 * Clears the content of the element.
90 while (this.firstChild
)
91 this.removeChild(this.firstChild
);
95 * Scrolls to the error, if there is one. This cannot be called when the
98 scrollToError: function() {
99 var errorSpan
= this.querySelector('.extension-code-highlighted-source');
101 this.scrollTop
= errorSpan
.offsetTop
- this.clientHeight
/ 2;
107 ExtensionCode
: ExtensionCode