mirror of
https://github.com/HeyPuter/puter.git
synced 2026-08-13 17:51:36 +00:00
KernelDeimos
e050506a05
ExportService gets removed and instead a global class registry is added. The `init.js` file is split into `init_sync.js` and `init_async.js` so that synchronous code that isn't dependent on imports is guarenteed to run before initgui.js. The globalThis scope and service-script API now expose `def`, a function for registering class definitions, and `use`, a function for obtaining registered classes.
46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
const Component = use('util.Component');
|
|
|
|
/**
|
|
* A simple component that displays a string in the
|
|
* specified style.
|
|
*/
|
|
export default def(class StringView extends Component {
|
|
static ID = 'ui.component.StringView';
|
|
|
|
static PROPERTIES = {
|
|
text: { value: '' },
|
|
heading: { value: 0 },
|
|
no_html_encode: { value: false },
|
|
}
|
|
|
|
static CSS = /*css*/`
|
|
h2 {
|
|
margin: 0;
|
|
color: hsl(220, 25%, 31%);
|
|
}
|
|
span {
|
|
color: #3b4863;
|
|
}
|
|
`;
|
|
|
|
create_template ({ template }) {
|
|
$(template).html(`<span></span>`);
|
|
}
|
|
|
|
on_ready ({ listen }) {
|
|
// TODO: listener composition, to avoid this
|
|
const either = ({ heading, text }) => {
|
|
const wrapper_nodeName = heading ? 'h' + heading : 'span';
|
|
$(this.dom_).find('span').html(`<${wrapper_nodeName}>${
|
|
this.get('no_html_encode') ? text : html_encode(text)
|
|
}</${wrapper_nodeName}>`);
|
|
};
|
|
listen('heading', heading => {
|
|
either({ heading, text: this.get('text') });
|
|
});
|
|
listen('text', text => {
|
|
either({ heading: this.get('heading'), text });
|
|
});
|
|
}
|
|
});
|