move addFont button to main.js
dependencies hashes: openFrameworks d78075f4bca6be2a2533c6e51a75cc1f18404501 ofxMsdfgen e14da13d02c4dff04fb69d7923469f606924e6c3 ofxGPUFont d482bb7cbdf6b296fa4ab5abcf73fb5ff8c8b239 ofxVariableLab 8df98846248a93aa068989a3ebd0d2f0f16e5e69 ofxProfiler a868e34fa1a79189dd4fbdede2938e308535e5e8 theatre 86d3e07f6f2c75fd6e08fca8c97e3617c9e23b18
This commit is contained in:
parent
a9a40a8de1
commit
1fdce3ee96
3 changed files with 54 additions and 54 deletions
|
@ -296,6 +296,7 @@
|
|||
<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="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>-->
|
||||
</div>
|
||||
|
||||
|
|
|
@ -735,23 +735,6 @@ const Layer = function(tp, layerID, fontsAndAxes, autoInit = true) {
|
|||
}
|
||||
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;
|
||||
clearTimeout(panelFinderTimeout);
|
||||
panelFinderTimeout = false;
|
||||
|
@ -826,43 +809,6 @@ const Layer = function(tp, layerID, fontsAndAxes, autoInit = true) {
|
|||
}
|
||||
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) => {
|
||||
return new Promise((resolve) => {
|
||||
tp.friendlySequenceNames();
|
||||
|
|
|
@ -186,6 +186,11 @@ const findInjectPanel = () => {
|
|||
bottomButtonsContainer.append(startNewButton);
|
||||
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 {
|
||||
setTimeout(() => {
|
||||
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;
|
||||
|
|
Loading…
Reference in a new issue