variablelab/variabletime
variablelab/variabletime
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

move addFont button to main.js

Browse source 
dependencies hashes:
openFrameworks d78075f4bca6be2a2533c6e51a75cc1f18404501
ofxMsdfgen e14da13d02c4dff04fb69d7923469f606924e6c3
ofxGPUFont d482bb7cbdf6b296fa4ab5abcf73fb5ff8c8b239
ofxVariableLab 8df98846248a93aa068989a3ebd0d2f0f16e5e69
ofxProfiler a868e34fa1a79189dd4fbdede2938e308535e5e8
theatre 86d3e07f6f2c75fd6e08fca8c97e3617c9e23b18
This commit is contained in:
themancalledjakob 2024-03-22 16:34:55 +01:00
parent a9a40a8de1
commit 1fdce3ee96
3 changed files with 54 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
assets/template.html
View file

@ -296,6 +296,7 @@
<button id="save_project" onclick="window.tp.downloadProject()">save project</button> <button id="save_project" onclick="window.tp.downloadProject()">save project</button>
<button id="open_project" onclick="window.tp.uploadProject(true)">open project</button> <button id="open_project" onclick="window.tp.uploadProject(true)">open project</button>
<button id="start_new_project" onclick="window.tp.startNewProject()">start new project</button> <button id="start_new_project" onclick="window.tp.startNewProject()">start new project</button>
<button id="add_font">add font</button>
<!--<button id="debug_profiling" onclick="window.toggleProfiling()">debug start profiling</button>--> <!--<button id="debug_profiling" onclick="window.toggleProfiling()">debug start profiling</button>-->
</div> </div>

54
bin/em/variabletime/web/js/layer.js
View file

@ -735,23 +735,6 @@ const Layer = function(tp, layerID, fontsAndAxes, autoInit = true) {
} }
togglePanelProp('width', this.theatreObject.value.width > 0, false); togglePanelProp('width', this.theatreObject.value.width > 0, false);
let bottomButtonsContainer = panel.querySelector('.bottomButtonsContainer');
if (bottomButtonsContainer === null) {
bottomButtonsContainer = document.createElement('div');
bottomButtonsContainer.classList.add("bottomButtonsContainer");
panel.append(bottomButtonsContainer);
}
if (bottomButtonsContainer.querySelector('.vte_button') === null) {
const addFontButton = document.createElement('div');
addFontButton.classList.add('vte_button');
addFontButton.style.cursor = 'pointer';
addFontButton.innerHTML = "add Font";
addFontButton.addEventListener('click', (clickEvent) => {
addUserFont();
});
bottomButtonsContainer.append(addFontButton);
}
doItAgain = false; doItAgain = false;
clearTimeout(panelFinderTimeout); clearTimeout(panelFinderTimeout);
panelFinderTimeout = false; panelFinderTimeout = false;
@ -826,43 +809,6 @@ const Layer = function(tp, layerID, fontsAndAxes, autoInit = true) {
} }
return letterDelays.hasOwnProperty(prop[0]); return letterDelays.hasOwnProperty(prop[0]);
}; };
const addUserFont = () => {
return new Promise((resolve, reject) => {
uploadFile('font')
.then((fontFile) => {
moduleFS
.save(fontFile)
.then(() => {
getFontsAndAxes()
.then((newFontsAndAxes) => {
// let's select the new uploaded font
if (newFontsAndAxes.length > 0) {
const path = newFontsAndAxes[0].fontPath;
this.selectFont(path);
// we need to update theatreprops
// a bit awkwardly twice
//
// first like this
this.updateTheatreProps()
.then(() => {
// and again with a transaction
const hash = props.fontFamily.default;
tp.studio.transaction(({
set
}) => {
set(this.theatreObject.props.fontFamily, hash);
});
this.findInjectPanel();
resolve();
});
} else {
reject();
}
});
});
});
});
};
this.handleSequenceEvent = (detail, updateTheatre = true) => { this.handleSequenceEvent = (detail, updateTheatre = true) => {
return new Promise((resolve) => { return new Promise((resolve) => {
tp.friendlySequenceNames(); tp.friendlySequenceNames();

53
bin/em/variabletime/web/js/main.js
View file

@ -186,6 +186,11 @@ const findInjectPanel = () => {
bottomButtonsContainer.append(startNewButton); bottomButtonsContainer.append(startNewButton);
startNewButton.classList.add("main_panel_button"); startNewButton.classList.add("main_panel_button");
} }
const addFontButton = document.querySelector('#add_font');
if (addFontButton !== null) {
bottomButtonsContainer.append(addFontButton);
addFontButton.classList.add("main_panel_button");
}
} else { } else {
setTimeout(() => { setTimeout(() => {
findInjectPanel(); findInjectPanel();
@ -600,4 +605,52 @@ const initPanels = () => {
}); });
}); });
} }
let addFontButton = document.querySelector('#add_font');
if (addFontButton === null) {
addFontButton = tp.getPanel().querySelector('#add_font');
}
if (addFontButton !== null) {
addFontButton.addEventListener('click', () => {
addUserFont();
});
}
}; };
const addUserFont = () => {
uploadFile('font')
.then((fontFile) => {
moduleFS
.save(fontFile)
.then(() => {
getFontsAndAxes()
.then((newFontsAndAxes) => {
// let's select the new uploaded font
// if we have a layer selected
const layer = getLayer();
if (layer.id().indexOf('layer-') === 0 && newFontsAndAxes.length > 0) {
const path = newFontsAndAxes[0].fontPath;
layer.selectFont(path);
// we need to update theatreprops
// a bit awkwardly twice
//
// first like this
layer.updateTheatreProps()
.then(() => {
// and again with a transaction
const hash = layer.props.fontFamily.default;
tp.studio.transaction(({
set
}) => {
set(layer.theatreObject.props.fontFamily, hash);
});
layer.findInjectPanel();
resolve();
});
} else {
reject();
}
});
});
});
};
window.addUserFont = addUserFont;