var $loveLockModal = $("#modal-love-lock");
        var $loveLockForm = $loveLockModal.find('form');
        var $loveLockUser = $loveLockForm.find('[name=user]');
        var lovelockCanvas;
        var habboCreator;
	
		// callled when a user clicks on a product 
        function showLoveLockModal(self)
        {
            // set background of lovelock
            lovelockCanvas.setBackground($(self).data('picture'));

            // create logged in user habbo
            var habboUrl = habboCreator.generateUrl({
                habbo_username: '{{ Auth::user()->habbo_username }}'
            });
            lovelockCanvas.setHabboLeft(habboUrl);

            $loveLockModal.find('.name').html( $(self).find('.name').html() );
            $loveLockModal.find('.description').html( $(self).data('description') );
            $loveLockModal.find('.credits').html( $(self).find('.credits').html() );     
            $loveLockModal.find('.product_id').val( $(self).data('id') );   
            $loveLockModal.modal('show');
        }

		// called on page load
		// mainly binds events
		// but first initiates the lovelockCanvas var, which is the class i posted on stack
        function lovelock()
        {
            // generate lovelock sticker preview
            // via canvas
            lovelockCanvas = new LovelockSticker();
            lovelockCanvas.setCanvasById('lovelock-canvas');


            // Habbo creator
            habboCreator = new HabboCreate();
            habboCreator.setSelected(defaultOptions);