Puggans Blog

Today i made a greasmonkey-script for putting shared notes on websites.
One persson can add a note to a webpage they visiting, when that persson or
someone else in the same sharing-group visit that website, the note will apear.

// ==UserScript==
// @name           url_notes
// @namespace      url_notes
// @description    keep notes on urls
// ==/UserScript==

var category = GM_getValue('url_note_category', '');

if(!category)
{
	change_category();
	category = GM_getValue('url_note_category', 'test');
}

function change_category()
{
	category = prompt("Välj en kategori/grupp", GM_getValue('url_note_category', ''));
	GM_setValue('url_note_category', category);
}

GM_registerMenuCommand("Change note category", change_category);
GM_registerMenuCommand("Add a note to this page", add_note);

get_notes(category, document.location.href, false);

function add_note()
{
	var category = GM_getValue('url_note_category', 'test');
	get_notes(category, document.location.href, true);
}

function get_notes(category, url, force)
{
	GM_xmlhttpRequest(
	{
		method: "POST",
		url: "https://www.exemple.se/url_notes.php",
		data: "category=" + urlencode(category) + "&url=" + urlencode(url) + "&",
		headers:
		{
			"Content-Type": "application/x-www-form-urlencoded"
		},
		onload: function(response)
		{
			var text = "";
			text += "<div style='float: right; cursor: pointer;' onclick=\"document.getElementById('note_box_div').parentNode.removeChild(document.getElementById('note_box_div'))\"><b>X</b></div>";
			text += "<div onmousedown='dragStart(event, \"note_box_div\")' style='background-color: orange; height: 15px;'>Antekningar</div>";
			if(response.responseText.length > 2)
			{
				var notes = eval("(" + response.responseText + ")");
				for(key in notes)
				{
					text += notes[key]['note'] + " <br /> /" + notes[key]['author'] + "<br/> " + notes[key]['birth'] + "<br /><hr />";
				}
				force = true;
			}
			if(force)
			{
				text += "<form action='https://www.exemple.se/url_notes.php' method='post'>";
				text += "<textarea name='note'></textarea><br/>";
				text += "<input type='submit' value='spara'/>";
				text += "<input type='hidden' name='url' value='" + urlencode(url) + "'/>";
				text += "<input type='hidden' name='category' value='" + urlencode(category) + "'/>";
				text += "</form>";
				var notes_div = document.createElement('div');
				notes_div.setAttribute('style', 'position: absolute; left: ' + (document.body.clientWidth -350) + 'px; right: auto; top: 100px; bottom: auto; width: 300px; height: auto; background-color: yellow; border: solid black 3px;');
				notes_div.innerHTML = text;
				notes_div.id = 'note_box_div';
				document.getElementsByTagName('body')[0].appendChild(notes_div);
				var dyn_script = document.createElement('script');
				dyn_script.src = "https://www.interfaceways.se/src/js/dynamic_boxes.js";
				document.getElementsByTagName('body')[0].appendChild(dyn_script);
			}
		}
	});
}

function urlencode(str)
{
   return escape(str).replace('+', '%2B').replace('%20', '+').replace('*', '%2A').replace('/', '%2F').replace('@', '%40');
}