Printing only Canvas contents?

So I am new to Construct 2.

I am a developer and our company picked up a client who had a website based "business card" paint type program made in Construct 2.

You draw up your own card and then save/print it. Well, whoever they paid to make the program never finished the "Print" button. They want us to do that.

I am trying to find a way so when a viewer clicks the "Print" button on the page, that it opens the browsers "Print" settings, however, I don't want them to print the whole screen, I only want it to print the Canvas area they just created their business card in.

I have tried toying with a 2nd Layout view where it simply copies the contents of the Canvas on the main layout but I cant seem to get that to work. I have been able to load the Canvas contents in a new tab, but it seems you have to refresh the page to see it as it comes up bland at first. Still, using that method the user would still need to manually invoke the print method of their browser manually which is not what the client wants.

What I need is to be able to press the "Print" button in the web page, have the printer screen pop up, but only print the Canvas area they have just been drawing in. Is this possible?

Edit: Here is the live website as written in Construct2

Website: planetmogul.com/AdAgency

Again I did not write this and I know there is 1000 things wrong with hot it works now, however at this point I am only tasked with making the "Print" button function as it should.

Here's some thoughts:

Zoom

when pressing the curent print button, have it zoom in on the card a bit first, and make everything around it white. (move to a higher layer with a white background) This way when the print option pops up to print the whole page, you only see the card.

Snapshot

I havent toyed with the snapshot before, but perhaps you can use the canvas snapshot to make an image of the card and have it used from there. Like, offer as a download, so the user can download it, and then print/whatever.

Hey lennaert,

Thanks for the reply.

As a matter of fact I have already used the snapshot functionality to do just that... the "save" button actually didn't have any functionality either but I did exactly what you descrbed... made a snapshot and pushed it as a download as a .png file.

However, the company also wants a "print" feature too. I will try the "layer" thing you suggested and see if I can get that to work. I havn't worked any with layers yet so I don't know how that will work.

:D

If its troublesome to move the card to a new layer, perhaps you can add a large white sprite on top of everything on the layer where the card resides, and use an event to move the card to top of layer, then print.