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);