Editor buttons for injecting documentation links

Question

I wrote a small user script for adding some buttons to the question editor. The idea came up a few times on Meta Stack Overflow and Stack Overflow, and I just wanted to share a rough version to get the ball rolling. It's quite incomplete, and please don't laugh about the coding approaches.

Also I'm not sure if it's necessary to disguise postings as questions here on Stack Apps. I guess not. But I would have a couple of questions anyway.. ;]

Screenshot

About

Small user script (.user.js) that adds a few manual buttons. After selecting a word in the answer, the buttons can be used to transform it into a formatted documentation URL. The script tries to deduce the appropriate manual from the tags of the original question. Thus it will not currently work on reediting an answer.

License

Public Domain (free reuse, no attribution required)

Code

I'm "hosting" this in the answer below for now. Once there is a usable version, it will certainly be moved onto user scripts, etc. for easier download. I'm requesting my laziness is excused.

Platform

Only tested with Opera for now.

---

Current Issues

1. Is there some documentation here for using the WMD functions? I would prefer to use the native .getSelection(), for example, rather than bundling a jq.fn.getSelection plugin (half the code, see below).

2. Which event would you have to trigger for WMD to update the preview? I tried .change and .keyup to no effect.

3. Do you want to contribute another documentation resource to add? Preferably where you can likewise add simplistic 1:1 function name-to-URL mappings.

Answer 1

// Provide quick documentation links in Stackoverflow editor // // ==UserScript== // @name SO doc shortcuts+ // @description Adds extra buttons to turn selected text into online manual links // @version 0.2 // @namespace data:,00000000000000000000000000000000e3272d8553c99672fa541449b491dd05 // @include http*://*stackexchange.com/* // @include http*://*stackoverflow.com/* // ###@include http://*superuser.com/* // ###@include http://*serverfault.com/* // ###@include http://*doctype.com/* // ###@include http://*askubuntu.com/* // ==/UserScript== (function(){ // configured online manuals and functionname->link rewrite code manual_links = { php: { always: 0, icon: "https://static.php.net/www.php.net/favicon.ico", raw: 0, rewrite: function (text) { return "http://php.net/" + encodeURI(text); } }, javascript: { icon: "http://developer.mozilla.org/favicon.ico", rewrite: function (text) { return "https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/" + encodeURI(text); //return "http://www.w3schools.com/ಠ_ಠ/"+text; } }, jquery: { icon: "http://static.jquery.com/favicon.ico", rewrite: function (text) { text = text.replace(/^[$]?[.]/, "jQuery."); text = text.replace(/[.]/, ""); var map = { "ajax":"jQuery.ajax", "browser":"jQuery.browser", "contains":"jQuery.contains" }; text = map[text] ? map[text] : text; return "http://api.jquery.com/" + encodeURI(text) + "/"; } }, mysql: { icon: "http://dev.mysql.com/common/themes/sakila/favicon.ico", rewrite: function (text) { return "http://search.mysql.com/search/query/search?group=refman-55&q=" + text; } }, wordpress: { icon: "http://codex.wordpress.org/favicon.ico", rewrite: function (text) { return "http://codex.wordpress.org/Function_Reference/"+text; } }, google: { always: 1, icon: "https://www.google.com/favicon.ico", raw: 1, rewrite: function (text) { return "http://www.google.com/search?q=" + encodeURI(text); } }, magic_service_yet_to_be_created: { always: 0, icon: "https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico", raw: 1, rewrite: function (text) { var wait = 0; $.ajax({ url: "http://magic/get_manual_links", data: {q:text}, dataType: "html", success: function (data) { wait=data; }, async: false }); return wait; } } }; // collect current tags var question_tags = {}; $(".post-taglist .post-tag[rel=tag]").each(function(i){ question_tags[this.text]=1; }); // alert(question_tags); // iterate over configured links var pos = 400; // hacket-y-hack for (var i in manual_links) { // insert button if (manual_links[i].always || question_tags[i]) { var html = $('<li class="wmd-button" '+ 'style="z-index:20; left:'+(pos+=25)+'px" '+ 'onClick="document.wmd_doc_link(\''+i+'\')" title="'+i+' manual link">'+ '<img src="'+ manual_links[i].icon +'" width=16 height=16>'+ '</li>' ); $("#wmd-button-bar").prepend(html); //.insertAfter("#wmd-redo-button"); } } //alert("adding buttons"); // button callback document.wmd_doc_link = function (tag) { // alert("wmd_doc_link"); // get selection var area = $("#wmd-input"); var text = area.getSelection().text; // rewrite var link = manual_links[tag].rewrite( !manual_links[tag].raw ? text.replace(/[^-.\w]+/, "") : text, tag ); // into link if ( ! link.match( /\]\(/ ) ) { link = "[`" + text + "`](" + link + ")"; } // update textarea area.replaceSelection(link); area.change(); // Damn you WMD, why you ignore that?! area.trigger('keyup'); }; /* * jQuery plugin: fieldSelection - v0.1.0 - last change: 2006-12-16 * (c) 2006 Alex Brem <[email protected]> - http://blog.0xab.cd */ var fieldSelection = { getSelection: function() { var e = this.jquery ? this[0] : this; return ( /* mozilla / dom 3.0 */ ('selectionStart' in e && function() { var l = e.selectionEnd - e.selectionStart; return { start: e.selectionStart, end: e.selectionEnd, length: l, text: e.value.substr(e.selectionStart, l) }; }) || /* exploder */ (document.selection && function() { e.focus(); var r = document.selection.createRange(); if (r == null) { return { start: 0, end: e.value.length, length: 0 }; } var re = e.createTextRange(); var rc = re.duplicate(); re.moveToBookmark(r.getBookmark()); rc.setEndPoint('EndToStart', re); return { start: rc.text.length, end: rc.text.length + r.text.length, length: r.text.length, text: r.text }; }) || /* browser not supported */ function() { return { start: 0, end: e.value.length, length: 0 }; } )(); }, replaceSelection: function() { var e = this.jquery ? this[0] : this; var text = arguments[0] || ''; return ( /* mozilla / dom 3.0 */ ('selectionStart' in e && function() { e.value = e.value.substr(0, e.selectionStart) + text + e.value.substr(e.selectionEnd, e.value.length); return this; }) || /* exploder */ (document.selection && function() { e.focus(); document.selection.createRange().text = text; return this; }) || /* browser not supported */ function() { e.value += text; return this; } )(); } }; jQuery.each(fieldSelection, function(i) { jQuery.fn[i] = this; }); /* * jQuery plugin: fieldSelection - v0.1.0 - last change: 2006-12-16 * (c) 2006 Alex Brem <[email protected]> - http://blog.0xab.cd */ })();