Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
LaurentDelcambreLaurentDelcambre 

How to share Javascript object between functions inside a client controller in Lightning?

Hi all,

I'm trying to integrate a 3rd party Javascript library in my Lightning application.
This one if you are curious:
https://github.com/szimek/signature_pad

I can include the libray and initialize it with no problem but the problem arrises when you try to access the Javascript object through a different client side method.

EX: 
({
  initSignature: function(component, event, helper) {
    console.log('init');

    var canvas = component.find("signCanvas").getElement();
    var signaturePad = new SignaturePad(canvas);
  },
	saveSignature: function(component, event, helper) {
    console.log('save');
    signaturePad.toDataURL()
	},
})

I need "signaturePad" to be accessible from all my Client-side controller methods.

Is there a way to have a globally accessible var?

Cheers,
Laurent
 
Best Answer chosen by LaurentDelcambre
LaurentDelcambreLaurentDelcambre
Ha I actually fond a solution thanks to John Brunswick:
https://github.com/JohnBrunswick/Lightning-Ideas-Experiment

The trick was to store the Javascript object as a  View Attribute of type Object. 
({
  initSignature: function(component, event, helper) {
    console.log('init');

    var canvas = component.find("signCanvas").getElement();
    var signaturePad = new SignaturePad(canvas);
    component.set("v.signaturePad", signaturePad);
  },
	saveSignature: function(component, event, helper) {
    console.log('save');
    var signaturePad = component.get("v.signaturePad");
    signaturePad.toDataURL()
	},
  clearSignature: function(component, event, helper) {
    console.log('clear');
    var signaturePad = component.get("v.signaturePad");
    signaturePad.clear();
  },
})

// In the component:
<aura:attribute name="signaturePad" type="Object" />