Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix PAGComposition bindings error. #120

Merged
merged 1 commit into from
Feb 17, 2022
Merged

Fix PAGComposition bindings error. #120

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 24 additions & 26 deletions web/demo/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ window.onload = async () => {
'viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no',
);
await loadScript('https://unpkg.com/vconsole@latest/dist/vconsole.min.js');
new window.VConsole();
const vconsole = new window.VConsole();
canvasElementSize = 320;
const canvas = document.getElementById('pag') as HTMLCanvasElement;
canvas.width = canvasElementSize;
Expand All @@ -56,7 +56,7 @@ window.onload = async () => {
});
document.getElementById('upload-font').addEventListener('change', async (event) => {
const file = (event.target as HTMLInputElement).files[0];
document.getElementById('upload-font-text').innerText = `已加载${file.name}`;
document.getElementById('upload-font-text').innerText = `已加载${file.name}`;
await PAG.PAGFont.registerFont('test', file);
});
// 加载测试字体
Expand Down Expand Up @@ -256,8 +256,8 @@ window.onload = async () => {
});
};

const existsLayer = (pagLayerWasm: object) => {
if (pagLayerWasm) return true;
const existsLayer = (pagLayer: object) => {
if (pagLayer) return true;
console.log('no Layer');
return false;
};
Expand All @@ -275,15 +275,13 @@ const testPAGComposition = {
console.log(`test numChildren: ${pagComposition.numChildren()}`);
},
getLayerAt: () => {
const pagLayerWasm = pagComposition.getLayerAt(0);
if (!existsLayer(pagLayerWasm)) return;
const pagLayer = new PAG.PAGLayer(pagLayerWasm);
const pagLayer = pagComposition.getLayerAt(0);
if (!existsLayer(pagLayer)) return;
console.log(`test getLayerAt index 0, layerName: ${pagLayer.layerName()}`);
},
getLayersByName: () => {
const pagLayerWasm = pagComposition.getLayerAt(0);
if (!existsLayer(pagLayerWasm)) return;
const pagLayer = new PAG.PAGLayer(pagLayerWasm);
const pagLayer = pagComposition.getLayerAt(0);
if (!existsLayer(pagLayer)) return;
const layerName = pagLayer.layerName();
const vectorPagLayer = pagComposition.getLayersByName(layerName);
for (let j = 0; j < vectorPagLayer.size(); j++) {
Expand Down Expand Up @@ -316,17 +314,17 @@ const testPAGComposition = {
swapLayer('swapLayer');
},
contains: () => {
const pagLayerWasm = pagComposition.getLayerAt(0);
const isContains = pagComposition.contains(pagLayerWasm);
const pagLayer = pagComposition.getLayerAt(0);
const isContains = pagComposition.contains(pagLayer);
if (isContains) {
console.log('test contains');
}
},
addLayer: () => {
const pagLayerWasm = pagComposition.getLayerAt(0);
const pagLayer = pagComposition.getLayerAt(0);
pagComposition.removeLayerAt(0);
const oldNum = pagComposition.numChildren();
const isSuccess: boolean = pagComposition.addLayer(pagLayerWasm);
const isSuccess: boolean = pagComposition.addLayer(pagLayer);
if (isSuccess) {
console.log(`test addLayer success: old num ${oldNum} current num ${pagComposition.numChildren()}`);
}
Expand Down Expand Up @@ -357,23 +355,23 @@ const testPAGCompositionAPi = () => {
};

const swapLayer = (type: string) => {
const pagLayerWasm_0 = pagComposition.getLayerAt(0);
const pagLayerWasm_1 = pagComposition.getLayerAt(1);
if (!pagLayerWasm_0 || !pagLayerWasm_1) {
const pagLayer_0 = pagComposition.getLayerAt(0);
const pagLayer_1 = pagComposition.getLayerAt(1);
if (!pagLayer_0 || !pagLayer_1) {
console.log('No layer switching');
return;
}
const pagLayer_name_0 = new PAG.PAGLayer(pagLayerWasm_0).layerName();
const pagLayer_name_1 = new PAG.PAGLayer(pagLayerWasm_1).layerName();
const pagLayer_name_0 = pagLayer_0.layerName();
const pagLayer_name_1 = pagLayer_1.layerName();
if (type === 'swapLayer') {
pagComposition.swapLayer(pagLayerWasm_0, pagLayerWasm_1);
pagComposition.swapLayer(pagLayer_0, pagLayer_1);
} else {
pagComposition.swapLayerAt(0, 1);
}
const pagLayerWasm_exch_0 = pagComposition.getLayerAt(0);
const pagLayerWasm_exch_1 = pagComposition.getLayerAt(1);
const pagLayer__exch_0 = new PAG.PAGLayer(pagLayerWasm_exch_0).layerName();
const pagLayer__exch_1 = new PAG.PAGLayer(pagLayerWasm_exch_1).layerName();
const pagLayer_exch_0 = pagComposition.getLayerAt(0);
const pagLayer_exch_1 = pagComposition.getLayerAt(1);
const pagLayer__exch_0 = pagLayer_exch_0.layerName();
const pagLayer__exch_1 = pagLayer_exch_1.layerName();
console.log(
`test ${type}: oldLayerName_0=${pagLayer_name_0}, oldLayerName_1=${pagLayer_name_1} exchange LayerName_0=${pagLayer__exch_0}, LayerName_1=${pagLayer__exch_1} `,
);
Expand Down Expand Up @@ -533,8 +531,8 @@ const loadScript = (url) => {
scriptEl.onload = () => {
resolve(true);
};
scriptEl.onerror = () => {
reject(false);
scriptEl.onerror = (e) => {
reject(e);
};
scriptEl.src = url;
document.body.appendChild(scriptEl);
Expand Down
12 changes: 6 additions & 6 deletions web/src/pag-composition.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ export class PAGComposition extends PAGLayer {
* Swap the layers at the specified index.
*/
public swapLayer(pagLayer1: PAGLayer, pagLayer2: PAGLayer): void {
this.wasmIns._swapLayer(pagLayer1, pagLayer2);
this.wasmIns._swapLayer(pagLayer1.wasmIns, pagLayer2.wasmIns);
}
/**
* Swap the layers at the specified index.
Expand All @@ -72,23 +72,23 @@ export class PAGComposition extends PAGLayer {
* Check whether current PAGComposition contains the specified pagLayer.
*/
public contains(pagLayer: PAGLayer): boolean {
return this.wasmIns._contains(pagLayer) as boolean;
return this.wasmIns._contains(pagLayer.wasmIns) as boolean;
}
/**
* Add a PAGLayer to current PAGComposition at the top. If you add a layer that already has a
* different PAGComposition object as a parent, the layer is removed from the other PAGComposition
* object.
*/
public addLayer(layer: PAGLayer): boolean {
return this.wasmIns._addLayer(layer) as boolean;
public addLayer(pagLayer: PAGLayer): boolean {
return this.wasmIns._addLayer(pagLayer.wasmIns) as boolean;
}
/**
* Add a PAGLayer to current PAGComposition at the top. If you add a layer that already has a
* different PAGComposition object as a parent, the layer is removed from the other PAGComposition
* object.
*/
public addLayerAt(layer: PAGLayer, index: number): boolean {
return this.wasmIns._addLayerAt(layer, index) as boolean;
public addLayerAt(pagLayer: PAGLayer, index: number): boolean {
return this.wasmIns._addLayerAt(pagLayer.wasmIns, index) as boolean;
}
/**
* Indicates when the first frame of the audio plays in the composition's timeline.
Expand Down