mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-26 19:55:39 +00:00
Bug 1283123 - Reps: make it possible to pass in a component to handle object links. r=linclark,honza
MozReview-Commit-ID: 20xvwUua4WA --HG-- extra : transplant_source : %B7TG%F1g%D8%1E%16P%22%87E%D8%BD%B4%07ww%7C%E6
This commit is contained in:
parent
997396e949
commit
4e07f37d98
@ -62,9 +62,13 @@ define(function (require, exports, module) {
|
||||
|
||||
if (array.length > max + 1) {
|
||||
items.pop();
|
||||
|
||||
let objectLink = this.props.objectLink || DOM.span;
|
||||
items.push(Caption({
|
||||
key: "more",
|
||||
object: "more...",
|
||||
object: objectLink({
|
||||
object: this.props.object
|
||||
}, "more...")
|
||||
}));
|
||||
}
|
||||
|
||||
@ -129,29 +133,22 @@ define(function (require, exports, module) {
|
||||
items = this.arrayIterator(object, max);
|
||||
}
|
||||
|
||||
let objectLink = this.props.objectLink || DOM.span;
|
||||
|
||||
return (
|
||||
ObjectBox({
|
||||
className: "array",
|
||||
onClick: this.onToggleProperties},
|
||||
DOM.a({
|
||||
className: "objectLink",
|
||||
onclick: this.onClickBracket},
|
||||
DOM.span({
|
||||
className: "arrayLeftBracket",
|
||||
role: "presentation"},
|
||||
"["
|
||||
)
|
||||
),
|
||||
className: "array"},
|
||||
objectLink({
|
||||
className: "arrayLeftBracket",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "["),
|
||||
items,
|
||||
DOM.a({
|
||||
className: "objectLink",
|
||||
onclick: this.onClickBracket},
|
||||
DOM.span({
|
||||
className: "arrayRightBracket",
|
||||
role: "presentation"},
|
||||
"]"
|
||||
)
|
||||
),
|
||||
objectLink({
|
||||
className: "arrayRightBracket",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "]"),
|
||||
DOM.span({
|
||||
className: "arrayProperties",
|
||||
role: "group"}
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
|
||||
// Shortcuts
|
||||
const { span } = React.DOM;
|
||||
@ -28,15 +28,21 @@ define(function (require, exports, module) {
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
return new Date(grip.preview.timestamp).toISOString();
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: grip
|
||||
}, grip.class);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
render: function () {
|
||||
let grip = this.props.object;
|
||||
return (
|
||||
ObjectLink({className: "Date"},
|
||||
span({className: "objectTitle"},
|
||||
this.getTitle(grip)
|
||||
ObjectBox({},
|
||||
this.getTitle(grip),
|
||||
span({className: "Date"},
|
||||
new Date(grip.preview.timestamp).toString()
|
||||
)
|
||||
)
|
||||
);
|
||||
|
@ -33,8 +33,15 @@ define(function (require, exports, module) {
|
||||
return location ? getFileName(location) : "";
|
||||
},
|
||||
|
||||
getTitle: function (win, context) {
|
||||
return "document";
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return ObjectBox({},
|
||||
this.props.objectLink({
|
||||
object: grip
|
||||
}, grip.class)
|
||||
);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
getTooltip: function (doc) {
|
||||
@ -46,6 +53,7 @@ define(function (require, exports, module) {
|
||||
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
this.getTitle(grip),
|
||||
span({className: "objectPropValue"},
|
||||
this.getLocation(grip)
|
||||
)
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
|
||||
/**
|
||||
* Renders DOM event objects.
|
||||
@ -24,8 +24,17 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: grip
|
||||
}, grip.preview.type);
|
||||
}
|
||||
return grip.preview.type;
|
||||
},
|
||||
|
||||
summarizeEvent: function (grip) {
|
||||
let info = [grip.preview.type, " "];
|
||||
let info = [];
|
||||
|
||||
let eventFamily = grip.class;
|
||||
let props = grip.preview.properties;
|
||||
@ -44,7 +53,8 @@ define(function (require, exports, module) {
|
||||
render: function () {
|
||||
let grip = this.props.object;
|
||||
return (
|
||||
ObjectLink({className: "event"},
|
||||
ObjectBox({className: "event"},
|
||||
this.getTitle(grip),
|
||||
this.summarizeEvent(grip)
|
||||
)
|
||||
);
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
const { cropString } = require("./string");
|
||||
|
||||
/**
|
||||
@ -25,6 +25,15 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: grip
|
||||
}, "function");
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
summarizeFunction: function (grip) {
|
||||
let name = grip.displayName || grip.name || "function";
|
||||
return cropString(name + "()", 100);
|
||||
@ -34,7 +43,8 @@ define(function (require, exports, module) {
|
||||
let grip = this.props.object;
|
||||
|
||||
return (
|
||||
ObjectLink({className: "function"},
|
||||
ObjectBox({className: "function"},
|
||||
this.getTitle(grip),
|
||||
this.summarizeFunction(grip)
|
||||
)
|
||||
);
|
||||
|
@ -15,7 +15,7 @@ define(function (require, exports, module) {
|
||||
const { Caption } = createFactories(require("./caption"));
|
||||
|
||||
// Shortcuts
|
||||
const { a, span } = React.DOM;
|
||||
const { span } = React.DOM;
|
||||
|
||||
/**
|
||||
* Renders an array. The array is enclosed by left and right bracket
|
||||
@ -35,7 +35,12 @@ define(function (require, exports, module) {
|
||||
},
|
||||
|
||||
getTitle: function (object, context) {
|
||||
return "[" + object.length + "]";
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: object
|
||||
}, object.class);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
arrayIterator: function (grip, max) {
|
||||
@ -84,10 +89,13 @@ define(function (require, exports, module) {
|
||||
|
||||
if (array.length > max + 1) {
|
||||
items.pop();
|
||||
let objectLink = this.props.objectLink || span;
|
||||
items.push(Caption({
|
||||
key: "more",
|
||||
object: "more..."}
|
||||
));
|
||||
object: objectLink({
|
||||
object: this.props.object
|
||||
}, "more...")
|
||||
}));
|
||||
}
|
||||
|
||||
return items;
|
||||
@ -118,29 +126,23 @@ define(function (require, exports, module) {
|
||||
items = this.arrayIterator(object, max);
|
||||
}
|
||||
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
return (
|
||||
ObjectBox({
|
||||
className: "array",
|
||||
onClick: this.onToggleProperties},
|
||||
a({
|
||||
className: "objectLink",
|
||||
onclick: this.onClickBracket},
|
||||
span({
|
||||
className: "arrayLeftBracket",
|
||||
role: "presentation"},
|
||||
"["
|
||||
)
|
||||
),
|
||||
className: "array"},
|
||||
this.getTitle(object),
|
||||
objectLink({
|
||||
className: "arrayLeftBracket",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "["),
|
||||
items,
|
||||
a({
|
||||
className: "objectLink",
|
||||
onclick: this.onClickBracket},
|
||||
span({
|
||||
className: "arrayRightBracket",
|
||||
role: "presentation"},
|
||||
"]"
|
||||
)
|
||||
),
|
||||
objectLink({
|
||||
className: "arrayRightBracket",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "]"),
|
||||
span({
|
||||
className: "arrayProperties",
|
||||
role: "group"}
|
||||
|
@ -30,8 +30,13 @@ define(function (require, exports, module) {
|
||||
mode: React.PropTypes.string,
|
||||
},
|
||||
|
||||
getTitle: function () {
|
||||
return this.props.object.class || "Object";
|
||||
getTitle: function (object) {
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: object
|
||||
}, object.class);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
longPropIterator: function (object) {
|
||||
@ -81,9 +86,14 @@ define(function (require, exports, module) {
|
||||
// one and append 'more...' postfix in such case.
|
||||
if (props.length > max) {
|
||||
props.pop();
|
||||
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
props.push(Caption({
|
||||
key: "more",
|
||||
object: "more...",
|
||||
object: objectLink({
|
||||
object: object
|
||||
}, "more...")
|
||||
}));
|
||||
} else if (props.length > 0) {
|
||||
// Remove the last comma.
|
||||
@ -146,20 +156,34 @@ define(function (require, exports, module) {
|
||||
this.longPropIterator(object) :
|
||||
this.shortPropIterator(object);
|
||||
|
||||
let objectLink = this.props.objectLink || span;
|
||||
if (this.props.mode == "tiny" || !props.length) {
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
span({className: "objectTitle"}, this.getTitle(object))
|
||||
this.getTitle(object),
|
||||
objectLink({
|
||||
className: "objectLeftBrace",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "{}")
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
span({className: "objectTitle"}, this.getTitle(object)),
|
||||
span({className: "objectLeftBrace", role: "presentation"}, " {"),
|
||||
this.getTitle(object),
|
||||
objectLink({
|
||||
className: "objectLeftBrace",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "{"),
|
||||
props,
|
||||
span({className: "objectRightBrace"}, "}")
|
||||
objectLink({
|
||||
className: "objectRightBrace",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "}")
|
||||
)
|
||||
);
|
||||
},
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
const { Caption } = createFactories(require("./caption"));
|
||||
|
||||
// Shortcuts
|
||||
@ -22,6 +22,7 @@ define(function (require, exports, module) {
|
||||
* Used to render a map of values provided as a grip.
|
||||
*/
|
||||
let NamedNodeMap = React.createClass({
|
||||
displayName: "NamedNodeMap",
|
||||
|
||||
propTypes: {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
@ -29,13 +30,16 @@ define(function (require, exports, module) {
|
||||
provider: React.PropTypes.object,
|
||||
},
|
||||
|
||||
className: "NamedNodeMap",
|
||||
|
||||
getLength: function (object) {
|
||||
return object.preview.length;
|
||||
},
|
||||
|
||||
getTitle: function (object) {
|
||||
if (this.props.objectLink && object.class) {
|
||||
return this.props.objectLink({
|
||||
object: object
|
||||
}, object.class);
|
||||
}
|
||||
return object.class ? object.class : "";
|
||||
},
|
||||
|
||||
@ -46,9 +50,12 @@ define(function (require, exports, module) {
|
||||
|
||||
if (items.length > max + 1) {
|
||||
items.pop();
|
||||
let objectLink = this.props.objectLink || span;
|
||||
items.push(Caption({
|
||||
key: "more",
|
||||
object: "more...",
|
||||
object: objectLink({
|
||||
object: this.props.object
|
||||
}, "more...")
|
||||
}));
|
||||
}
|
||||
|
||||
@ -98,22 +105,22 @@ define(function (require, exports, module) {
|
||||
items = this.getItems(grip, max);
|
||||
}
|
||||
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
return (
|
||||
ObjectLink({className: "NamedNodeMap"},
|
||||
span({className: "objectTitle"},
|
||||
this.getTitle(grip)
|
||||
),
|
||||
span({
|
||||
ObjectBox({className: "NamedNodeMap"},
|
||||
this.getTitle(grip),
|
||||
objectLink({
|
||||
className: "arrayLeftBracket",
|
||||
role: "presentation"},
|
||||
"["
|
||||
),
|
||||
role: "presentation",
|
||||
object: grip
|
||||
}, "["),
|
||||
items,
|
||||
span({
|
||||
objectLink({
|
||||
className: "arrayRightBracket",
|
||||
role: "presentation"},
|
||||
"]"
|
||||
)
|
||||
role: "presentation",
|
||||
object: grip
|
||||
}, "]")
|
||||
)
|
||||
);
|
||||
},
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
|
||||
// Shortcuts
|
||||
const { span } = React.DOM;
|
||||
@ -27,6 +27,17 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return ObjectBox({},
|
||||
this.props.objectLink({
|
||||
object: grip
|
||||
}, this.getType(grip))
|
||||
);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
getType: function (grip) {
|
||||
return grip.class;
|
||||
},
|
||||
@ -38,7 +49,8 @@ define(function (require, exports, module) {
|
||||
render: function () {
|
||||
let grip = this.props.object;
|
||||
return (
|
||||
ObjectLink({className: this.getType(grip)},
|
||||
ObjectBox({className: this.getType(grip)},
|
||||
this.getTitle(grip),
|
||||
span({className: "objectPropValue"},
|
||||
this.getDescription(grip)
|
||||
)
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
|
||||
// Shortcuts
|
||||
const { span } = React.DOM;
|
||||
@ -27,6 +27,17 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return ObjectBox({},
|
||||
this.props.objectLink({
|
||||
object: grip
|
||||
}, this.getType(grip))
|
||||
);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
getType: function (grip) {
|
||||
return grip.class;
|
||||
},
|
||||
@ -38,7 +49,8 @@ define(function (require, exports, module) {
|
||||
render: function () {
|
||||
let grip = this.props.object;
|
||||
return (
|
||||
ObjectLink({className: this.getType(grip)},
|
||||
ObjectBox({className: this.getType(grip)},
|
||||
this.getTitle(grip),
|
||||
span({className: "objectPropValue"},
|
||||
this.getDescription(grip)
|
||||
)
|
||||
|
@ -27,8 +27,13 @@ define(function (require, exports, module) {
|
||||
mode: React.PropTypes.string,
|
||||
},
|
||||
|
||||
getTitle: function () {
|
||||
return "Object";
|
||||
getTitle: function (object) {
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: object
|
||||
}, object.class);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
longPropIterator: function (object) {
|
||||
@ -75,9 +80,13 @@ define(function (require, exports, module) {
|
||||
|
||||
if (props.length > max) {
|
||||
props.pop();
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
props.push(Caption({
|
||||
key: "more",
|
||||
object: "more...",
|
||||
object: objectLink({
|
||||
object: object
|
||||
}, "more...")
|
||||
}));
|
||||
} else if (props.length > 0) {
|
||||
// Remove the last comma.
|
||||
@ -133,21 +142,22 @@ define(function (require, exports, module) {
|
||||
render: function () {
|
||||
let object = this.props.object;
|
||||
let props = this.shortPropIterator(object);
|
||||
|
||||
if (this.props.mode == "tiny" || !props.length) {
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
span({className: "objectTitle"}, this.getTitle())
|
||||
)
|
||||
);
|
||||
}
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
span({className: "objectTitle"}, this.getTitle()),
|
||||
span({className: "objectLeftBrace", role: "presentation"}, "{"),
|
||||
this.getTitle(object),
|
||||
objectLink({
|
||||
className: "objectLeftBrace",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "{"),
|
||||
props,
|
||||
span({className: "objectRightBrace"}, "}")
|
||||
objectLink({
|
||||
className: "objectRightBrace",
|
||||
role: "presentation",
|
||||
object: object
|
||||
}, "}")
|
||||
)
|
||||
);
|
||||
},
|
||||
@ -155,6 +165,7 @@ define(function (require, exports, module) {
|
||||
function supportsObject(object, type) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// Exports from this module
|
||||
exports.Obj = {
|
||||
rep: Obj,
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
|
||||
// Shortcuts
|
||||
const { span } = React.DOM;
|
||||
@ -27,25 +27,20 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
return grip.class;
|
||||
},
|
||||
|
||||
getSource: function (grip) {
|
||||
return grip.displayString;
|
||||
},
|
||||
|
||||
render: function () {
|
||||
let grip = this.props.object;
|
||||
let objectLink = this.props.objectLink || span;
|
||||
|
||||
return (
|
||||
ObjectLink({className: "regexp"},
|
||||
span({className: "objectTitle"},
|
||||
this.getTitle(grip)
|
||||
),
|
||||
span(" "),
|
||||
span({className: "regexpSource"},
|
||||
this.getSource(grip)
|
||||
)
|
||||
ObjectBox({className: "regexp"},
|
||||
objectLink({
|
||||
object: grip,
|
||||
className: "regexpSource"
|
||||
}, this.getSource(grip))
|
||||
)
|
||||
);
|
||||
},
|
||||
|
@ -28,6 +28,18 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
let title = "StyleSheet";
|
||||
if (this.props.objectLink) {
|
||||
return ObjectBox({},
|
||||
this.props.objectLink({
|
||||
object: grip
|
||||
}, title)
|
||||
);
|
||||
}
|
||||
return title;
|
||||
},
|
||||
|
||||
getLocation: function (grip) {
|
||||
// Embedded stylesheets don't have URL and so, no preview.
|
||||
let url = grip.preview ? grip.preview.url : "";
|
||||
@ -39,7 +51,7 @@ define(function (require, exports, module) {
|
||||
|
||||
return (
|
||||
ObjectBox({className: "object"},
|
||||
"StyleSheet ",
|
||||
this.getTitle(grip),
|
||||
DOM.span({className: "objectPropValue"},
|
||||
this.getLocation(grip)
|
||||
)
|
||||
|
@ -12,7 +12,7 @@ define(function (require, exports, module) {
|
||||
|
||||
// Reps
|
||||
const { createFactories, isGrip } = require("./rep-utils");
|
||||
const { ObjectLink } = createFactories(require("./object-link"));
|
||||
const { ObjectBox } = createFactories(require("./object-box"));
|
||||
const { cropMultipleLines } = require("./string");
|
||||
|
||||
// Shortcuts
|
||||
@ -33,8 +33,13 @@ define(function (require, exports, module) {
|
||||
return cropMultipleLines(grip.preview.textContent);
|
||||
},
|
||||
|
||||
getTitle: function (win, context) {
|
||||
return "textNode";
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return this.props.objectLink({
|
||||
object: grip
|
||||
}, "#text");
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
render: function () {
|
||||
@ -43,22 +48,29 @@ define(function (require, exports, module) {
|
||||
|
||||
if (mode == "short" || mode == "tiny") {
|
||||
return (
|
||||
ObjectLink({className: "textNode"},
|
||||
ObjectBox({className: "textNode"},
|
||||
this.getTitle(grip),
|
||||
"\"" + this.getTextContent(grip) + "\""
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
let objectLink = this.props.objectLink || DOM.span;
|
||||
return (
|
||||
ObjectLink({className: "textNode"},
|
||||
"<",
|
||||
ObjectBox({className: "textNode"},
|
||||
this.getTitle(grip),
|
||||
objectLink({
|
||||
object: grip
|
||||
}, "<"),
|
||||
DOM.span({className: "nodeTag"}, "TextNode"),
|
||||
" textContent=\"",
|
||||
DOM.span({className: "nodeValue"},
|
||||
this.getTextContent(grip)
|
||||
),
|
||||
"\"",
|
||||
">;"
|
||||
objectLink({
|
||||
object: grip
|
||||
}, ">;")
|
||||
)
|
||||
);
|
||||
},
|
||||
|
@ -28,6 +28,17 @@ define(function (require, exports, module) {
|
||||
object: React.PropTypes.object.isRequired,
|
||||
},
|
||||
|
||||
getTitle: function (grip) {
|
||||
if (this.props.objectLink) {
|
||||
return ObjectBox({},
|
||||
this.props.objectLink({
|
||||
object: grip
|
||||
}, grip.class)
|
||||
);
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
getLocation: function (grip) {
|
||||
return cropString(grip.preview.url);
|
||||
},
|
||||
@ -37,6 +48,7 @@ define(function (require, exports, module) {
|
||||
|
||||
return (
|
||||
ObjectBox({className: "Window"},
|
||||
this.getTitle(grip),
|
||||
DOM.span({className: "objectPropValue"},
|
||||
this.getLocation(grip)
|
||||
)
|
||||
|
@ -16,19 +16,20 @@ const {openVariablesView} = require("devtools/client/webconsole/new-console-outp
|
||||
VariablesViewLink.displayName = "VariablesViewLink";
|
||||
|
||||
VariablesViewLink.propTypes = {
|
||||
objectActor: PropTypes.object.required,
|
||||
label: PropTypes.string.label,
|
||||
object: PropTypes.object.required
|
||||
};
|
||||
|
||||
function VariablesViewLink(props) {
|
||||
const { objectActor, label } = props;
|
||||
const { object, children } = props;
|
||||
|
||||
return dom.a({
|
||||
onClick: openVariablesView.bind(null, objectActor),
|
||||
className: "cm-variable",
|
||||
draggable: false,
|
||||
href: "#"
|
||||
}, label);
|
||||
return (
|
||||
dom.a({
|
||||
onClick: openVariablesView.bind(null, object),
|
||||
className: "cm-variable",
|
||||
draggable: false,
|
||||
href: "#"
|
||||
}, children)
|
||||
);
|
||||
}
|
||||
|
||||
module.exports.VariablesViewLink = VariablesViewLink;
|
||||
|
@ -12,6 +12,6 @@
|
||||
*
|
||||
* Once JSTerm is also written in React/Redux, these will be actions.
|
||||
*/
|
||||
exports.openVariablesView = (objectActor) => {
|
||||
window.jsterm.openVariablesView({objectActor});
|
||||
exports.openVariablesView = (object) => {
|
||||
window.jsterm.openVariablesView({objectActor: object});
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user