Search code examples
javascriptdeezer

Set canvas size in deezer sdk


I'm trying to set the canvas height via the Deezer JS sdk.

I'm using the following code:

DZ.ready(function() {
    DZ.deezer.setCanvasSize(1400); // no problem, DZ.deezer.setCanvasSize is existent
});

The problem is, that the setCanvasSize function uses a reference to an object called "app". app seems to be in context of the deezer page (but my app is run in its own iframe). When I try to call the code in the JS console of my chrome browser it works as expected.

But when I run the code from my app the following error is throwen:

app is not defined dz.js:60
ReferenceError: app is not defined
     at Object.DZ.deezer.setCanvasSize (http://cdn-files.deezer.com/js/min/dz.js:68:258)
     at eval (eval at <anonymous> (https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js:1:15535), <anonymous>:827:15)
     at Object.DZ.Event.resolve (http://cdn-files.deezer.com/js/min/dz.js:52:271)
     at Array.2 (http://cdn-files.deezer.com/js/min/dz.js:140:10)
     at Object.DZ.Event.triggerEvent (http://cdn-files.deezer.com/js/min/dz.js:55:342)
     at Object.DZ.player.onLoad (http://cdn-files.deezer.com/js/min/dz.js:133:10)
     at DZ.onDeezerLoaded (http://cdn-files.deezer.com/js/min/dz.js:7:52)
     at DZ.communication.receive (http://cdn-files.deezer.com/js/min/dz.js:99:1) 

Any idea on how to fix that?


Solution

  • You should use the DZ.canvas object instead of DZ.deezer as follows:

    // Set inApp size
    DZ.canvas.setSize(1400);
    

    And if you want to set dynamically the size use (with jQuery loaded):

    // Set inApp size
    DZ.canvas.setSize($(document.body).height());