// ==UserScript==
// @name Ipernity Smiles
// @namespace http://www.sallati.com/scripts/ipernity/
// @description Adds the smilies to the comments box
// @version 0.5 BETA
// @identifier http://www.sallati.com/scripts/ipernity/ipernity.smiles.user.js
// @date 2007-10-31
// @creator Motaz Abuthiab (moty66 * gmail * com)
// @include http://*ipernity.com/doc/*/*
// @include http://*ipernity.com/blog/*/*
// @include http://*ipernity.com/group/*/*
// @exclude http://*ipernity.com/doc/*/organize
// ==/UserScript==
// --------------------------------------------------------------------
// CHANGE LOG
// ver 0.5
// * fix the cursor position after inserting url, bold, italic or smile
// * fix does not prompt for a lable when you select a string to link it
// to an URL
// * fix the arrows position, also if you are using ipernity Easy Photo Post
//
// ver 0.4
// * added Bold and Italic button
// * added Link button
// * added arrows to change the textarea size
//
// --------------------------------------------------------------------
// TODO
// * move the position of the arrows when the user click preview
// --------------------------------------------------------------------
//
// This is a Greasemonkey user script.
//
// To install, you need Greasemonkey: http://greasemonkey.mozdev.org/
// Then restart Firefox and revisit this script.
// Under Tools, there will be a new menu item to "Install User Script".
// Accept the default configuration and install.
//
// --------------------------------------------------------------------
// Copyright (C) 2007 Motaz Abuthiab
//
// This program is free software; you can redistribute it and/or
// modify it under the terms of the GNU General Public License
// as published by the Free Software Foundation; either version 2
// of the License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// The GNU General Public License is available by visiting
// http://www.gnu.org/copyleft/gpl.html
// or by writing to
// Free Software Foundation, Inc.
// 51 Franklin Street, Fifth Floor
// Boston, MA 02110-1301
// USA
(function () {
var win = unsafeWindow || window.wrappedJSObject || window;
//update information
var SCRIPT = {
name: "Ipernity Smiles",
namespace: "http://www.sallati.com/scripts/ipernity/",
description: "Adds the smilies to the comments box",
identifier: "http://www.sallati.com/scripts/ipernity/ipernity.smiles.user.js",
version: "0.5 BETA", // version
date: (new Date(2007, 10, 31)) // update date
.valueOf()
};
function $x( xpath, root )
{
var doc = root ? root.evaluate?root:root.ownerDocument : document;
var got = doc.evaluate( xpath, root||doc, null, 0, null ), next;
var result = [];
while( next = got.iterateNext() )
result.push( next );
return result;
}
var IpernitySmiles = function() {this.init();}
IpernitySmiles.prototype = {
init: function() {
// The main form for comments
// this works only on reply or on
// commenting a posts
// but does not work on NEW TOPIC in groups
var form = document.getElementById('comment');
var TextArea;
if (form) {
// There is the form for leaving a comments
// Get the list of smiles
var list_of_smiles = this.iniSmiles();
// The textarea
var TextArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
// the same size for all textareas
TextArea.setAttribute("style","width:" + 450 + "px; height:" + 80 + "px;");
// Insert the html for the smiles box if there is the text area
if(TextArea)
form.innerHTML = '<div style="margin-bottom:3px; cursor:pointer;" id="smiles_box"></div>' + form.innerHTML;
else
// In case you are not able to comment (like if the comments are closed or you are not a memeber on a group)
return false;
// Get the smiles box
var smiles_box = document.getElementById('smiles_box');
// call the function addArrows to resize the textarea
this.addArrows(smiles_box,TextArea);
// Loop to insert the smiles
for(var i=0; i<list_of_smiles.length; i++) {
smile_url = list_of_smiles[i][1];
smile_alt = list_of_smiles[i][0];
var image = smiles_box.appendChild(document.createElement('img'));
image.src = smile_url;
image.setAttribute("style","margin-left:3px; padding:2px; border:1px solid #eee; height:16px;");
image.alt = list_of_smiles[i][0];
image.id = "imageSmile"+i;
image.addEventListener('click',function(evt) {
mesg = '<img src="'+ this.src +'" alt="'+ this.alt +'" /> ';
// get all textAreas
allTextAreas = $x('//textarea[@id="comment_content"]', document);
for (var j = 0; j < allTextAreas.length; j++) {
thisTextArea = allTextAreas[j];
var position = thisTextArea.selectionEnd;
try{
thisTextArea.value = thisTextArea.value.substr(0,thisTextArea.selectionStart)
+ mesg
+ thisTextArea.value.substr(thisTextArea.selectionStart);
}
catch(e) {
thisTextArea.value += mesg;
}
// se the cursor position
position = mesg.length + position;
if (thisTextArea.setSelectionRange) {
thisTextArea.focus();
thisTextArea.setSelectionRange(position, position);
}
else
thisTextArea.focus();
// end for allTextAreas
}
// end add Event
},true);
// end for loop
}
// add bold button to the toolbar
this.addBoldBtn(smiles_box);
// add italic button to the toolbar
this.addItalicBtn(smiles_box);
// add bold button to the toolbar
this.addLinkBtn(smiles_box);
// add the about to the smiles
this.showAbout(smiles_box);
// end if from
}
else
{
// there is not form in this page and we do nothing
// for debug
// alert('nothing to');
}
// end ini function
},
iniSmiles: function() {
/*
Array of smiles, you can add as much as you want
I got these icons from Ipernity Website directly
Just to be always availavle...
*/
// FCK icons are here http://www.ipernity.com/T/E/FCK/skin/fck_strip.gif
var smiles = new Array();
smiles[0] = new Array('smile','/T/UIcons/smileys/fun/smile.gif');
smiles[1] = new Array('laught','/T/UIcons/smileys/fun/apophys.gif');
smiles[2] = new Array('cty','/T/UIcons/smileys/fun/pleure.gif');
smiles[3] = new Array('love','/T/UIcons/smileys/fun/love.gif');
smiles[4] = new Array('shy','/T/UIcons/smileys/fun/blush.gif');
smiles[5] = new Array('sad','/T/UIcons/smileys/fun/sad.gif');
return smiles;
// end iniSmiles function
},
showAbout: function(object) {
var about = object.appendChild(document.createElement('img'));
about.src = 'http://www.sallati.com/scripts/ipernity/imgs/about.png';
about.setAttribute("style","margin-left:30px; padding:2px; border:1px solid #eee; height:16px;");
about.alt = 'About Ipernity Smiles';
about.id = 'AboutIpernitySmiles';
about.addEventListener('click',function(evt) {
location.href = 'http://www.sallati.com/scripts/ipernity';
},true);
// end showAbout function
},
addArrows: function(object,textArea) {
// The icons for changeing the height of the textarea
var downIcon= "/T/1/L/rubix/album_close.png";
var upIcon = "/T/1/L/rubix/album_open.png";
// set the ini hight and width of the textarea
var iniH = 80;
var iniW = 450;
// this is so importat, just to make al textareas's style the same
textArea.setAttribute("style","width:" + iniW + "px; height:" + iniH + "px;");
// the main div of the textarea
var container = document.getElementById('comment_form');
// get the absolute position of the main div
// I didn't find the way to to get the absolure
// position of the textarea, but it was possibile
// to find the it for the main div
var absLeft = container.offsetLeft;
var absTop = container.offsetTop;
// space between the textarea and the arrows
var space = 20;// pixel
// the space to add/sub every time you click the buttons
var additionl_hight = 80; // pixel
// creat the first child for down arrow
var up = container.appendChild(document.createElement('img'));
// the the srouce and the alt to the image
up.src = upIcon;
up.alt = 'Make the textarea box bigger';
// add the style to the down arrow
up.setAttribute("style","position: absolute; cursor:pointer; top:"
+ (absTop+iniH+15) + "px; left: "
+ (absLeft+iniW+space) + "px;");
// create the second child for the up arrow
var down = container.appendChild(document.createElement('img'));
// the the srouce and the alt to the image
down.src = downIcon;
down.alt = 'Make the textarea box smaller';
// add the style to the down arrow
down.setAttribute("style","position:absolute; cursor:pointer; top:"
+ (absTop+24) + "px; left: "
+ (absLeft+iniW+space) + "px;");
up.addEventListener('click',function(evt) {
// get the textarea
textArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
// add 80px to the hight when click
iniH += additionl_hight;
// refresh the style of the textarea
textArea.setAttribute("style",'height:' + iniH + 'px; width:' + iniW +'px;' );
// refresh the style of the button
up.setAttribute("style","position: absolute; cursor:pointer; top:"
+ (absTop+iniH+15) + "px; left: "
+ (absLeft+iniW+space) + "px;");
},true);
down.addEventListener('click',function(evt) {
if(iniH == additionl_hight)
return false;
// get the textarea
textArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
// sub 80 pixels from the textarea
iniH -= additionl_hight;
// refresh the style of the textarea
textArea.setAttribute("style",'height:' + iniH + 'px; width:'+iniW+'px;' );
// refresh the style of the button
up.setAttribute("style","position: absolute; cursor:pointer; top:"
+ (absTop+iniH+15) + "px; left: "
+ (absLeft+iniW+space) + "px;");
},true);
// end addArrows function
},
addBoldBtn : function(object) {
var boldBtn = object.appendChild(document.createElement('input'));
boldBtn.type = 'button';
boldBtn.name = 'boldBtn';
boldBtn.className = 'reset';
boldBtn.value = 'B';
boldBtn.setAttribute("style","width: 20px; height: 20px; padding:0; margin:-16px 0px 0px 3px;");
boldBtn.addEventListener('click',function(evt) {
textArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
// check if the selection is empty !
if(textArea.selectionStart == textArea.selectionEnd)
return false;
// get the cursor position
var position = textArea.selectionEnd;
// get the text before the selection
var selStart = textArea.value.substr(0, textArea.selectionStart);
// get the text after the selection
var selEnd = textArea.value.substr(textArea.selectionEnd, textArea.value.length);
// get the selected text
var curSelection = textArea.value.replace(selStart, '').replace(selEnd, '');
// rewrite the text with the tag in the textarea
textArea.value = selStart + '<b>' + curSelection + '</b>' + selEnd;
// se the cursor position
if (textArea.setSelectionRange) {
textArea.focus();
textArea.setSelectionRange(position+7, position+7);
}
else
textArea.focus();
},true);
// end add bold function
},
addItalicBtn : function(object) {
var italicBtn = object.appendChild(document.createElement('input'));
italicBtn.type = 'button';
italicBtn.name = 'italicBtn';
italicBtn.className = 'reset';
italicBtn.value = 'I';
italicBtn.setAttribute("style","width: 20px; height: 20px; font-style:italic; font-family:times; padding:0; margin:-16px 0px 0px 3px;");
italicBtn.addEventListener('click',function(evt) {
textArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
// check if the selection is empty !
if(textArea.selectionStart == textArea.selectionEnd)
return false;
// get the cursor position
var position = textArea.selectionEnd;
// get the text before the selection
var selStart = textArea.value.substr(0, textArea.selectionStart);
// get the text after the selection
var selEnd = textArea.value.substr(textArea.selectionEnd, textArea.value.length);
// get the selected text
var curSelection = textArea.value.replace(selStart, '').replace(selEnd, '');
// rewrite the text with the tag in the textarea
textArea.value = selStart + '<em>' + curSelection + '</em>' + selEnd;
// se the cursor position
if (textArea.setSelectionRange) {
textArea.focus();
textArea.setSelectionRange(position+9, position+9);
}
else
textArea.focus();
},true);
// end add bold function
},
addLinkBtn : function(object) {
var urlBtn = object.appendChild(document.createElement('input'));
urlBtn.type = 'button';
urlBtn.name = 'boldBtn';
urlBtn.className = 'reset';
urlBtn.value = 'URL';
urlBtn.setAttribute("style","width: 30px; height: 20px; padding:0; margin:-16px 0px 0px 3px;");
urlBtn.addEventListener('click',function(evt) {
textArea = document.evaluate(
"//textarea[@id='comment_content']",
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE, null
).singleNodeValue;
var selStart = textArea.value.substr(0, textArea.selectionStart);
// get the text after the selection
var selEnd = textArea.value.substr(textArea.selectionEnd, textArea.value.length);
// get the selected text
var curSelection = textArea.value.replace(selStart, '').replace(selEnd, '');
// get the cursor position
var position = textArea.selectionEnd;
var lable;
// read the url an the lable
var url = prompt("Enter a Link example http://www.ipernity.com/","");
if(curSelection == '')
lable = prompt("Enter a Lable","");
else {
lable = curSelection;
position -= lable.length;
}
if(url == '')
return false;
// check if the url has the prtocol if not add http://
if(url.indexOf('http://') < 0 && url.indexOf('https://') < 0 && url.indexOf('ftp://') < 0 )
{
url = 'http://' + url;
}
// check the lable if empty, if yes, it will be the same as the url but without the protocol
if(lable == '')
lable = url.replace('http://', '');
// generat the html code
var mesg = '<a href="'+url+'">'+lable+'</a>';
// get the cursor position
// insert in where the curos is located
try{
textArea.value = textArea.value.substr(0,textArea.selectionStart)
+ mesg
+ textArea.value.substr(textArea.selectionStart).replace(curSelection,'');
}
catch(e) {
textArea.value += mesg;
}
// se the cursor position
if (textArea.setSelectionRange) {
textArea.focus();
textArea.setSelectionRange(position+15+url.length + lable.length, position+15+url.length + lable.length);
}
else
textArea.focus();
},true);
// end add bold function
},
}
// AUTO UPDATE
try {
window.addEventListener("load", function () {
try {
win.UserScriptUpdates.requestAutomaticUpdates(SCRIPT);
} catch (ex) {}
}, false);
} catch (ex) {}
var ipernitygp = new IpernitySmiles();
})();
