JavaScript documentation

<script type="text/javascript">
    window.doorbellOptions = {
        hideEmail: true, // Optional, hides the email address field
        email: "customer@example.com", // Optional, prepopulate the email address field
        name: 'Philip Manavopoulos', // Optional, the name of the user
        tags: 'tag1,tag2', // Optional, tags to add to this thread. Can be an array as well: ['tag1', 'tag2']
        hideButton: true, // Optional, hides the button that doorbell adds to the bottom right of the page
        container: document.getElementById('feedback-container'), // Optional, make the form render inline instead of as a modal
        language: 'en', // Optional, if you know the language of the page or the user. You can then translate the form, the response messages, and the autoreply
        properties: { // Optional, a Javascript object of custom properties you want to set
            loggedIn: true,
            username: 'manavo',
            loginCount: 11,
            roles: ["admin", "editor"], // Arrays are fine
            contactDetails: { // Nested objects are allowed too
                phone: "1234567890",
                address: "Address line 1, Country"
            }
        },
        id: 'YOUR-ID-GOES-HERE',
        appKey: 'YOUR-API-KEY-GOES-HERE'
    };
</script>

<script type="text/javascript">
    function showDoorbellModal() {
        doorbell.show(); // The doorbell object gets created by the doorbell.js script
    }

    function removeDoorbell() {
        doorbell.remove();
    }

    function sendFromMyForm() {
        var feedbackText = document.getElementById('myTextarea').value;
        var email = 'hello@example.com';

        doorbell.send(feedbackText, email, function() {
            alert('success');
        }, function(error) {
            alert('Oh no! '+error);
        });
    }

    function setEmailAddress() {
        doorbell.setOption('email', 'newemail@example.com');
    }

    function hideEmailField() {
        doorbell.setOption('hideEmail', true);
    }

    function trackEvent() {
        doorbell.track('user-123', 'logged_in', {'key': 'value'});
    }
</script>

<button type="button" onclick="showDoorbellModal();">Show Doorbell form</button>
<button type="button" onclick="trackEvent();">Track event in Doorbell</button>
<button type="button" onclick="sendFromMyForm();">Send</button>

<script type="text/javascript">
    window.doorbellOptions = {
        // Optional, called when the SDK has loaded and is about to initialize
        onLoad: function() {},

        // Optional, called when the SDK has initialized (all elements added to the HTML)
        onInitialized: function() {},

        // Optional, called when the modal is about to be shown
        onShow: function() {},

        // Optional, called once the modal has been shown
        onShown: function() {},

        // Optional, called when the modal is about to be hidden
        onHide: function() {},

        // Optional, called once the modal has been hidden
        onHidden: function() {},

        // Optional, called when the feedback is about to be sent
        // Return false to stop the request from happening
        onSubmit: function() {},

        // Optional, called when the feedback is sent successfully
        onSuccess: function(message) {},

        // Optional, called when the feedback fails to be sent
        // Possible code values: 'missing-email', 'invalid-email', 'missing-message', 'message-too-short',
        // 'missing-recaptcha', 'recaptcha-validation-failed', 'missing-required-field'
        onError: function(code, message) {},

        // Optional, called when a screenshot is about to be generated. Returning false cancels it
        onGenerateScreenshot: function() {},

        // Optional, callback when the screenshot is generated
        onScreenshotGenerated: function(screenshotDataURI) {}
    };
</script>