// Copyright 2022 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
// Represents a source for a draw call, or a log, etc.
//
class Source {
static instances = [];
constructor(json) {
this.file_ = json.file;
this.func_ = json.func;
this.line_ = json.line;
this.anno_ = json.anno;
const index = parseInt(json.index);
Source.instances[index] = this;
}
get file() { return this.file_; }
get func() { return this.func_; }
get anno() { return this.anno_; }
};
// Represents a draw call.
// This is currently only used for drawing rects and positional text.
class DrawCall {
constructor(json) {
// e.g. {"drawindex":"44", option":{"alpha":"1.000000","color":"#ffffff"}
// ,"pos":"0.000000,763.000000","size":"255x5","source_index":"0",
// "thread_id":"123456"}
this.sourceIndex_ = parseInt(json.source_index);
this.drawIndex_ = parseInt(json.drawindex);
this.threadId_ =
parseInt(json.thread_id) || DrawFrame.demo_thread.thread_id;
this.text = json.text;
this.size_ = {
width: json.size[0],
height: json.size[1],
};
this.pos_ = {
x: json.pos[0],
y: json.pos[1],
};
if (json.option) {
this.color_ = json.option.color;
this.alpha_ = DrawCall.alphaIntToHex(json.option.alpha)
}
this.buffer_id = json.buff_id || -1;
if (json.uv_size && json.uv_pos) {
this.uv_size = {
width: json.uv_size[0],
height: json.uv_size[1],
};
this.uv_pos = {
x: json.uv_pos[0],
y: json.uv_pos[1],
};
}
else {
this.uv_size = {
width: 1.0,
height: 1.0,
};
this.uv_pos = {
x: 0.0,
y: 0.0,
};
}
}
// Used in conversion of Json.
static alphaIntToHex(value) {
value = Math.trunc(value);
value = Math.max(0, Math.min(value, 255));
return value.toString(16).padStart(2, '0');
}
// Used internally to convert from UI filter to hex.
static alphaFloatToHex(value) {
value = Math.trunc(value * 255);
value = Math.max(0, Math.min(value, 255));
return value.toString(16).padStart(2, '0');
}
draw(context, buffer_map, threadConfig) {
let filter = undefined;
const filters = Filter.enabledInstances();
// TODO: multiple filters can match the same draw call. For now, let's just
// pick the earliest filter that matches, and let it decide what to do.
for (const f of filters) {
if (f.matches(Source.instances[this.sourceIndex_])) {
filter = f;
break;
}
}
var color;
var alpha;
// If thread drawing is overriding filters.
if (threadConfig.overrideFilters) {
color = threadConfig.threadColor;
alpha = threadConfig.threadAlpha;
}
// Otherwise, follow filter draw options.
else {
// No filters match this draw. So skip.
if (!filter) return;
if (!filter.shouldDraw) return;
color = (filter && filter.drawColor) ? filter.drawColor : this.color_
alpha = (filter && filter.fillAlpha) ?
DrawCall.alphaFloatToHex(parseFloat(filter.fillAlpha) / 100) :
this.alpha_;
}
if (color && alpha) {
context.fillStyle = color + alpha;
context.fillRect(this.pos_.x,
this.pos_.y,
this.size_.width,
this.size_.height);
}
context.strokeStyle = color;
context.strokeRect(this.pos_.x,
this.pos_.y,
this.size_.width,
this.size_.height);
var buff_id = this.buffer_id.toString();
if(buffer_map[buff_id]) {
var buff_width = buffer_map[buff_id].width;
var buff_height = buffer_map[buff_id].height;
context.drawImage(buffer_map[buff_id],
this.uv_pos.x * buff_width,
this.uv_pos.y * buff_height,
this.uv_size.width * buff_width,
this.uv_size.height * buff_height,
this.pos_.x,
this.pos_.y,
this.size_.width,
this.size_.height);
}
}
};
// Represents a filter for draw calls. A filter specifies a selector (e.g.
// filename, and/or function name), and the action to take (e.g. skip draw, or
// color to use for draw, etc.) if the filter matches.
class Filter {
static instances = [];
constructor(enabled, selector, action, index) {
this.selector_ = {
filename: selector.filename,
func: selector.func,
anno: selector.anno,
};
// XXX: If there are multiple selectors that apply to the same draw, then
// I guess the newest filter will take effect.
this.action_ = {
skipDraw: action.skipDraw,
color: action.color,
alpha: action.alpha,
};
this.enabled_ = enabled;
if (index === undefined) {
Filter.instances.push(this);
this.index_ = Filter.instances.length - 1;
}
else {
Filter.instances[index] = this;
this.index_ = index;
}
}
get enabled() { return this.enabled_; }
set enabled(e) { this.enabled_ = e; }
get file() { return this.selector_.filename || ""; }
get func() { return this.selector_.func || ""; }
get anno() { return this.selector_.anno || "" };
get shouldDraw() { return !this.action_.skipDraw; }
// undefined if using caller color
get drawColor() { return this.action_.color; }
// undefined if using caller alpha
get fillAlpha() { return this.action_.alpha; }
get index() { return this.index_; }
get streamFilter() {
return {
selector: {
file: this.selector_.filename,
func: this.selector_.func,
anno: this.selector_.anno
},
active: !this.action_.skipDraw,
enabled: this.enabled_
}
}
matches(source) {
if (!(source instanceof Source)) return false;
if (!this.enabled) return false;
if (this.selector_.filename) {
const m = source.file.search(this.selector_.filename);
if (m == -1) return false;
}
if (this.selector_.func) {
const m = source.func.search(this.selector_.func);
if (m == -1) return false;
}
if (this.selector_.anno) {
const m = source.anno.search(this.selector_.anno);
if (m == -1) return false;
}
return true;
}
createUIString() {
let str = '';
if (this.selector_.filename) {
const parts = this.selector_.filename.split('/');
str += ` <i class="material-icons-outlined md-18">
text_snippet</i>${parts[parts.length - 1]}`;
}
if (this.selector_.func) {
str += ` <i class="material-icons-outlined md-18">
code</i>${this.selector_.func}`;
}
if (this.selector_.anno) {
str += ` <i class="material-icons-outlined md-18">
message</i>${this.selector_.anno}`;
}
return str;
}
static enabledInstances() {
return Filter.instances.filter(f => f.enabled);
}
static getFilter(index) {
return Filter.instances[index];
}
static swapFilters(indexA, indexB) {
var filterA = Filter.instances[indexA];
var filterB = Filter.instances[indexB];
filterA.index_ = indexB;
filterB.index_ = indexA;
Filter.instances[indexB] = filterA;
Filter.instances[indexA] = filterB;
}
static deleteFilter(index) {
Filter.instances.splice(index, 1);
for (var i = index; i < Filter.instances.length; i++) {
Filter.instances[i].index_ -= 1;
}
}
static sendStreamFilters() {
const message = {};
message['method'] = 'VisualDebugger.filterStream';
message['params'] = {
filter: { filters: Filter.instances.map((f) => f.streamFilter) }
};
Connection.sendMessage(message);
}
};
Codebase Browser
chromium