2022-11-15 12:24:31 +01:00
|
|
|
import {Component} from "./component";
|
2020-01-15 21:18:02 +01:00
|
|
|
|
2022-11-15 12:24:31 +01:00
|
|
|
export class DetailsHighlighter extends Component {
|
|
|
|
|
|
|
|
setup() {
|
|
|
|
this.container = this.$el;
|
2020-01-15 21:18:02 +01:00
|
|
|
this.dealtWith = false;
|
2022-11-15 12:24:31 +01:00
|
|
|
|
|
|
|
this.container.addEventListener('toggle', this.onToggle.bind(this));
|
2020-01-15 21:18:02 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
onToggle() {
|
|
|
|
if (this.dealtWith) return;
|
|
|
|
|
2022-11-15 12:24:31 +01:00
|
|
|
if (this.container.querySelector('pre')) {
|
2022-02-08 12:10:01 +01:00
|
|
|
window.importVersioned('code').then(Code => {
|
2022-11-15 12:24:31 +01:00
|
|
|
Code.highlightWithin(this.container);
|
2022-02-08 12:10:01 +01:00
|
|
|
});
|
|
|
|
}
|
2020-01-15 21:18:02 +01:00
|
|
|
this.dealtWith = true;
|
|
|
|
}
|
2022-11-15 12:24:31 +01:00
|
|
|
}
|