I'm trying to add a menu of buttons in a div
to a page using jQuery from within a Greasemonkey script, but have had no luck so far, and I'm not sure exactly what I'm doing wrong:
// ==UserScript==
// @name Case Email Utilities
// @namespace CaseEmailUtil
// @description Checks everything over before closing
// @version 1
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js
// @grant none
// @include http://internalsite/*
// ==/UserScript==
"use strict";
this.$ = this.jQuery = jQuery.noConflict(true);
/**
* A button that needs to be added to the ceu_bar
* @param {string} name - This will be the id of the button.
* @param {string} btn_text - The text to display on the button (the inner HTML).
* @callback action - The function to execute when this button is pressed.
* @param {string} title - Optional, if it's not provided, will default to the result of the action call back.
*/
function CEUButton(name, btn_text, action, title) {
console.log("Creating CEUButton");
var $ceu_btn = $('input[type=button]', {id: name}).html(btn_text).on('click', action);
if ('undefined' === title) {
$ceu_btn.attr("title", action());
} else {
$ceu_btn.attr("title", title);
}
console.log("CEUButton created");
return $ceu_btn;
}
$(document).ready(function () {
var isSendEmail = /^Task: Send an Email.*/;
console.log("Readying CEU Bar");
if (!isSendEmail.test(document.title)) {
return;
}
// ceu: case email utilities bar
//var ceu_bar = document.createElement('div');
var $ceu_bar = $('div', {id: "ceu_bar"});
$ceu_bar.append(CEUButton("test_btn", "Test Button", function () { return; }, "Click me!"));
console.log("Prepending ceu_bar to the body...");
$('body').prepend($ceu_bar);
$ceu_bar.position({ my: "right", at: "right", of: "window" });
});
EDIT: I've taken out the unsafeWindow
, and also set this.$ = this.jQuery = jQuery.noConflict(true);
but I'm still not getting a menu bar to show up at all.