prevent video box from exceeding width of textarea
This commit is contained in:
parent
485f212b4f
commit
d681585d50
2 changed files with 7 additions and 6 deletions
|
|
@ -50,6 +50,8 @@ self.kiri.load(api => {
|
||||||
img.onload = () => {
|
img.onload = () => {
|
||||||
const canvas = $('bbl_video');
|
const canvas = $('bbl_video');
|
||||||
const ctx = canvas.getContext('2d');
|
const ctx = canvas.getContext('2d');
|
||||||
|
const cpn = canvas.parentNode;
|
||||||
|
canvas.style = `width:${cpn.clientWidth}px;height:${cpn.clientHeight}px`;
|
||||||
canvas.width = img.width;
|
canvas.width = img.width;
|
||||||
canvas.height = img.height;
|
canvas.height = img.height;
|
||||||
ctx.drawImage(img, 0, 0);
|
ctx.drawImage(img, 0, 0);
|
||||||
|
|
@ -170,7 +172,6 @@ self.kiri.load(api => {
|
||||||
function printer_video_set(bool) {
|
function printer_video_set(bool) {
|
||||||
video_on = bool;
|
video_on = bool;
|
||||||
set_frames(selected?.rec?.serial, bool);
|
set_frames(selected?.rec?.serial, bool);
|
||||||
// ui.setVisible($('bbl_rec'), !bool);
|
|
||||||
ui.setVisible($('bbl_video_frame'), bool);
|
ui.setVisible($('bbl_video_frame'), bool);
|
||||||
ui.setClass($('bbl_vid_toggle'), 'bred', bool);
|
ui.setClass($('bbl_vid_toggle'), 'bred', bool);
|
||||||
const canvas = $('bbl_video');
|
const canvas = $('bbl_video');
|
||||||
|
|
@ -665,17 +666,17 @@ self.kiri.load(api => {
|
||||||
h.div({ class: "f-col gap4 grow" }, [
|
h.div({ class: "f-col gap4 grow" }, [
|
||||||
h.div({
|
h.div({
|
||||||
id: "bbl_video_frame",
|
id: "bbl_video_frame",
|
||||||
class: "video hide",
|
class: "video hide f-row",
|
||||||
style: "width: 100%; xheight: auto; box-sizing: border-box; aspect-ratio: 16 / 9",
|
style: "width: 100%; box-sizing: border-box; aspect-ratio: 16 / 9",
|
||||||
},[
|
},[
|
||||||
h.canvas({
|
h.canvas({
|
||||||
id: "bbl_video",
|
id: "bbl_video",
|
||||||
style: "width: 100%; xheight: auto; box-sizing: border-box; aspect-ratio: 16 / 9",
|
style: "max-width: 100%; box-sizing: border-box; grow",
|
||||||
})
|
})
|
||||||
]),
|
]),
|
||||||
h.textarea({
|
h.textarea({
|
||||||
id: "bbl_rec",
|
id: "bbl_rec",
|
||||||
style: "flex-grow: 1; width: 100%; xheight: auto; resize: none; box-sizing: border-box",
|
style: "flex-grow: 1; width: 100%; resize: none; box-sizing: border-box",
|
||||||
wrap: "off",
|
wrap: "off",
|
||||||
spellcheck: "false",
|
spellcheck: "false",
|
||||||
xrows: 15, cols: 65
|
xrows: 15, cols: 65
|
||||||
|
|
|
||||||
|
|
@ -2016,7 +2016,7 @@ gapp.register("kiri.init", (root, exports) => {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
ui.modal.onclick = api.modal.hide;
|
// ui.modal.onclick = api.modal.hide;
|
||||||
ui.modalBox.onclick = (ev) => { ev.stopPropagation() };
|
ui.modalBox.onclick = (ev) => { ev.stopPropagation() };
|
||||||
|
|
||||||
// add app name hover info
|
// add app name hover info
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue