gistfile1.js

dojo.require("dojo.io.script");
dojo.require("dijit.Dialog");
dojo.require("dijit.TooltipDialog");
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.Form");
dojo.require("dijit.form.Textarea");
dojo.require("dijit.form.ValidationTextBox");
dojo.require("dojo.cookie");
dojo.require("dojo.parser");

var bugria_ui_texts = {
    report: 'Report a bug!',
    user: 'Your name and email',
    problem: 'Describe what is wrong',
    send: 'Submit'
};

function BugiraWidget() {
    this.config = {
        'url': 'http://bugira.com/report',
        'mode': 'simple',
        'theme': 'claro',
        'trusted': 0,
        'types': ['design','content','behavior'],

        'history_max_length': 20,
        'history_cookie_name': 'bugira_hstry'

    };
    this.elements = [];


}

BugiraWidget.prototype.setup = function(config) {
    for (key in this.config) {
        if (config[key] != undefined) {
            this.config[key] = config[key];
        }
    }

    dojo.create("link", {
        rel: 'stylesheet',
        type: 'text/css',
        href: 'http://ajax.googleapis.com/ajax/libs/dojo/1.7/dijit/themes/' + this.config.theme.toLowerCase() + '/' + this.config.theme.toLowerCase() + '.css'
    }, dojo.doc.getElementsByTagName("head")[0], 'first');

    dojo.attr(dojo.body(), {'class': this.config.theme.toLowerCase()});
}

BugiraWidget.prototype.initDialog = function() {
    if (this.dialog != undefined) {
        return;
    }

    var me = this;

    var dialog = new dijit.TooltipDialog({
        title: "Bugira!"
    });

    var flash = document.createElement('div');
    flash.setAttribute('id', 'bugira_message');
    this.flash = flash;

    var bugform = document.createElement("form");
    bugform.setAttribute('action', this.config.url);
    bugform.setAttribute('method', 'post');
    bugform = new dijit.form.Form({
        id: 'bugform',
        method: 'post',
        action: this.config.url
    }, bugform);

    var send = new dijit.form.Button({
        label: bugria_ui_texts.send,
        name: 'submit'
    });

    var reporter_label = document.createElement('label');
    reporter_label.setAttribute('for', 'reporter[name]');
    reporter_label.innerHTML = bugria_ui_texts.user + '<br/>';

    var reporter = new dijit.form.TextBox({
        name: 'reporter[name]',
        value: dojo.cookie('bugira_reporter_name')
    });

    var report_label = document.createElement('label');
    report_label.setAttribute('for', 'report');
    report_label.innerHTML = '<br/>' + bugria_ui_texts.problem + ':<br/>';

    // hidden values
    var api_key = document.createElement('input');
    api_key.setAttribute('value', this.config.api_key);
    api_key.setAttribute('name', 'api_key');
    api_key.setAttribute('type', 'hidden');

    var resolution = document.createElement('input');
    resolution.setAttribute('value', window.screen.width + 'x' + window.screen.height);
    resolution.setAttribute('name', 'reporter[resolution]');
    resolution.setAttribute('type', 'hidden');

    var windowsize = document.createElement('input');
    windowsize.setAttribute('value', window.innerWidth + 'x' + window.innerHeight);
    windowsize.setAttribute('name', 'reporter[window]');
    windowsize.setAttribute('type', 'hidden');

    var history = dojo.create('input', {type: 'hidden', name: 'reporter[history]', 'value': dojo.toJson(this.getHistory())});

    var trusted = dojo.create('input', {type: 'hidden', name: 'trusted', 'value': this.config.trusted});

    var OSName = "Unknown OS";
    if (navigator.appVersion.indexOf("Win") != -1) OSName = "Windows";
    if (navigator.appVersion.indexOf("Mac") != -1) OSName = "MacOS";
    if (navigator.appVersion.indexOf("X11") != -1) OSName = "UNIX";
    if (navigator.appVersion.indexOf("Linux") != -1) OSName = "Linux";

    var os = document.createElement('input');
    os.setAttribute('value', OSName);
    os.setAttribute('name', 'reporter[os]');
    os.setAttribute('type', 'hidden');

    var report = new dijit.form.Textarea({
        name: 'reporter[description]'
    }, document.createElement('textarea'));

    dojo.connect(send, "onClick", function() {
        dojo.cookie('bugira_reporter_name', reporter.domNode.value);
        dojo.io.script.get({
            callbackParamName: 'callback',
            form: bugform.domNode,
            url: me.config.url,
            handleAs: 'json',
            content: { format: 'json'},
            load: function(response, ioArgs) {
                console.log('load');
                dialog.onCancel();

                me.flash.innerHTML = response['text'];
                dialog.getParent().appendChild(me.flash.domNode)

            },
            error: function(response, ioArgs) {
                console.log('error');
                dialog.onCancel();

                me.flash.innerHTML = response['text'];
                dialog.getParent().appendChild(me.flash.domNode)
            }
        });

    });

    dialog.set('content', bugform);
    bugform.domNode.appendChild(reporter_label);
    bugform.domNode.appendChild(reporter.domNode);
    bugform.domNode.appendChild(report_label);
    bugform.domNode.appendChild(report.domNode);
    bugform.domNode.appendChild(send.domNode);
    bugform.domNode.appendChild(resolution);
    bugform.domNode.appendChild(windowsize);
    bugform.domNode.appendChild(api_key);
    bugform.domNode.appendChild(history);
    bugform.domNode.appendChild(trusted);
    bugform.domNode.appendChild(os);
    dialog.startup();

    this.dialog = dialog;
}

BugiraWidget.prototype.initElements = function() {
    if (this.dialog == undefined) {
        this.initDialog();
    }
    for (var i = 0; i<this.elements.length; i++) {
        var widget = new dijit.form.DropDownButton({
            label: bugria_ui_texts.report,
            dropDown: this.dialog
        });
        dojo.byId(this.elements[i]).appendChild(widget.domNode);
    }

}

BugiraWidget.prototype.addElement = function(elementId) {
    this.elements.push(elementId);
}


BugiraWidget.prototype.appendHistory = function(entryMessage) {
    var history = this.getHistory();

    history.push([
        Date.now(),
        entryMessage
    ]);

    // remove elements over length limit
    while (history.length > this.config.history_max_length) {
        history.shift();
    }

    dojo.cookie(this.config.history_cookie_name, dojo.toJson(history), { expire: 1, path: '/'});
}

BugiraWidget.prototype.getHistory = function() {
    var historyCookie = dojo.cookie(this.config.history_cookie_name);
    if (!historyCookie) {
        return [];
    }
    else {
        return dojo.fromJson(historyCookie);
    }
}

BugiraWidget.prototype.trackEvent = function(e) {
    el = {
        'tag': e.target.tagName,
        'id': e.target.id,
        'class': e.target.className
    };
    this.appendHistory(e.type + ':' + dojo.toJson(el))
}

var bugiraWidget = new BugiraWidget();

dojo.ready(function() {
    bugiraWidget.initElements();
    bugiraWidget.appendHistory('L:' + window.location.pathname);
});