Joined: Mar 2009 Gender: Male Posts: 2,594 Location: MI, USA Karma: 102
ShoutBox Mods « Thread Started on Mar 22, 2010, 11:23am »
These are some mods I made for Charles Stover's ShoutBox. Tested in IE, FF, Opera, Safari and Chrome.
I will add more to this post as they come!
Enjoy!!! SubDevo
ShoutBox Links by SubDevo
Features:
Converts any http URL's in your ShoutBox into a clickable link (opens in a new window). The code checks every 5 seconds for URL's and updates them as necessary. Create your shout in your chosen color. The text color in the text box also changes when you select a different color from the dropdown. Widens the text box to 70%. Now you can see more of your shout while typing it.
If you want a different text box width, find this line in the code and change the Yellow. document.getElementById("shoutboxMessage").style.width="70%"; If you prefer the default text box size, remove this line from the code.
No other editing required.
Location: Main Footer
Code:
<script type="text/javascript"> /* ShoutBox Links by SubDevo */ /* Main Footer - Please leave this header intact. Do not repost. */ /* [url]http://interoceandesigns.com[/url] or [url]http://lsdp.proboards.com[/url] */
function getSBLinks(){ var a,b,i,iN,sr,x=-1; sr=document.getElementById("shoutbox").getElementsByTagName("tr"); while(sr[++x]){ if(sr[x].cells.length.toString().match(/3|4/)&&/http:\/\//i.test(sr[x].innerHTML)){ a=sr[x].cells[1]; b=a.innerHTML; iN=b.split(" "); i=-1; while(iN[++i]){ if(/(^http:\/\/)/i.test(iN[i])&&iN[i]!=RegExp.$1&& !/\"$/i.test(iN[i])){ iN[i]="<a title='Link will open in a new window.' href='"+iN[i]+"' target='_blank'>"+iN[i]+"<\/a>"; } } iN=iN.join(" "); if(b!=iN){a.innerHTML=iN;} }}} function csbC(){ var nc=shoutbox["colors"][sbRC("color")]; if(nc){ nc=(nc.length>2)?nc:nc[1]; document.getElementById("shoutboxMessage").style.color=nc; }} function getSBox(){ var n=document.getElementById("shoutbox"),a,sCd,x=-1; if(n){ clearInterval(findSBox); setInterval("getSBLinks()",5000); sCd=document.getElementsByName("shoutboxColor")[0]; csbC(); sCd.onchange=function(){sbSC("color", this.value); csbC();} document.getElementById("shoutboxMessage").style.width="70%"; }} var findSBox=setInterval("getSBox()",1000); </script>
ShoutBox Links and UBBC by SubDevo
This code has all of the same features as the above code with the addition of UBBC icons. They work just like in your posts. And no. You can't add any more. These are the only UBBC that work in the ShoutBox.
If you want a different width for the text box, see the instructions in the code above.
If you are not using any custom UBBC icons then you do not need to edit anything. The code is set up with the default PB UBBC icon image URL's.
var ubbURL="http://images.proboards.com/new/";
Enter the URL to the folder/path that your UBBC images are stored. If all of your images are NOT from the same URL, change this to empty "", and put the FULL URL to each image below (in place of the image name).
var ubb=[ ["Bold","b","bold.png"], ["Italicize","i","italicize.png"], ["Underline","u","underline.png"], ["Strikethrough","s","strike.png"], ["Font Face","font=Verdana","face.png"], ["Superscript","sup","sup.png"], ["Subscript","sub","sub.png"], ["Teletype","tt","tele.png"] ]; Enter the file name for each of the UBBC images above. Or the full URL if you set ubbURL to empty.
Location: Main Footer
Code:
<script type="text/javascript"> /* ShoutBox Links and UBBC by SubDevo */ /* Main Footer - Please leave this header intact. Do not repost. */ /* [url]http://interoceandesigns.com[/url] or [url]http://lsdp.proboards.com[/url] */
The following is a list of all the ShoutBox mods that Charles sent to me. They are not mine...
Title: Announcement in ShoutBox Creator: Charles Stover Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); function stickyShout(usr, dsply, msg) { if (typeof(shoutbox["execute"]) != "object") shoutbox["execute"] = new Array(); shoutbox["execute"].push(new Array(function(args) { sbp(args[0], args[1], args[2]); }, new Array(usr, dsply, msg))); } stickyShout("admin", "ShoutBox", "Hello, world!"); //--></script>
This will put a message at the top of the shoutbox, after it's loaded. The first field (admin) is the username of the profile to which it will be linked, the second field (ShoutBox) is the name that will be displayed, and the third field (Hello, world!) is the message that will be displayed.
Title: Censor Words in the ShoutBox Creator: Charles Stover Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
The first field is the word to be censored, and the second field is the word to which the first field censors. For example, "kiss my ass" is censored to "I disagree." You may modify the list as you see fit.
Title: Custom Colors in the ShoutBox Creator: Charles Stover Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["colors"] = [ "Black", "White", "Red", "Orange", "Yellow", "Green", "Blue", ["Violet", "#f080f0"] ]; //--></script>
To have a simple color, just put the name of the color. To define the color specifically (via hexidecimal value), put the color in an array (as seen with Violet) where the first value is the color name and the second value is the color to which the message will be set. For a list of the default shoutbox colors, view the Default ShoutBox Colors thread.
Title: Custom Smileys in the ShoutBox Creator: Charles Stover Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
The first field is the smiley code to be replaced by a smiley, and the second field is the URL to the smiley image for the smiley code in the first field. For example, ::) is replaced with . You may modify the list as you see fit.
Title: Execute JavaScript Once the ShoutBox Loads Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox Requirements: You must be fluent in the language of JavaScript.
Code:
<script type="text/javascript"><!--
// Define shoutbox if (typeof(shoutbox) != "object") var shoutbox = new Array();
// Define execute shoutbox["execute"] = new Array();
// Performing a basic function. shoutbox["execute"].push(function() { alert("The ShoutBox has loaded!"); } );
// Sending an argument to the function. // The argument's value is the second item in the array. shoutbox["execute"].push( new Array( function(arg) { alert("Hello, " + arg + "!"); }, "world" // value of `arg` ) );
/* Sending multiple variables to the function. Adding another item to the first array will do nothing. Only the first two items of the first array are used, therefore a secondary array is necessary to send multiple values. The second array can contain as many items as necessary. */ shoutbox["execute"].push( new Array( function(args) { var temp = "How to speak Spanish:", x; for (x = 0; x < args.length; x++) temp += "\n" + x + ": " + args[x]; alert(temp); }, new Array("uno", "dos", "tres", "cuatro", "cinco") ) );
//--></script>
Explanations on how to use shoutboxExec are included in the code via comments. This is how the shoutboxExec variable is parsed, if it helps you further understand:
Code:
for (x = 0; x < shoutbox["execute"].length; x++) { if (typeof(shoutbox["execute"][x]) == "object") shoutbox["execute"][x][0](shoutbox["execute"][x][1]); else shoutbox["execute"][x](); }
Title: Change Display Name Colors in the ShoutBox Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Above the ProBoards ShoutBox
Code:
<style type="text/css"><!--
/* Change the admin's colors. */ a.admin { color : #000000; }
td.admin { background-color : #ffffff; }
/* Change the colors of the user who's username is "gamechief" */ a.gamechief { color : Orange; }
td.gamechief { background-color : Navy; }
--></style>
Title: Head/Base Images for ShoutBox Creator: Charles Stover Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") shoutbox = new Array(); shoutbox["head"] = "URL TO HEAD IMAGE"; shoutbox["foot"] = "URL TO BASE IMAGE"; //--></script>
Title: Multi-Colored Display Names in the ShoutBox Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!--
// username, color 1, color 2, color 3, ... // supports as many colors as you want var userColors = [ ["admin", "#cc3399", "#66ff66"], ["gamechief", "white", "silver", "gray", "silver"], // example fade effect ["username", "red", "#00ff00", "blue"] ];
if (typeof(shoutbox) != "object") var shoutbox = new Array(); if (typeof(shoutbox["execute"]) == "undefined") shoutbox["execute"] = new Array(); shoutbox["execute"].push( new Array( function(userColors) { var anchs = document.getElementById("shoutbox").getElementsByTagName('a'), a, c, ch; for (c = 0; c < userColors.length; c++) { for (a = 0; a < anchs.length; a++) { if ((anchs[a].getAttribute("href").match("action=viewprofile")) && (anchs[a].getAttribute("href").match("user=" + userColors[c][0]))) { var t, temp = ""; for (t = 0; t < anchs[a].innerHTML.length; t++) { ch = anchs[a].innerHTML.charAt(t); if (ch == '&') { while (anchs[a].innerHTML.charAt(t) != ";") { t++; ch += anchs[a].innerHTML.charAt(t); } } temp += "<span style=\"color : " + userColors[c][(t % (userColors[c].length - 1)) + 1] + ";\">" + ch + "<\/span>"; } anchs[a].innerHTML = temp; } } } }, userColors ) );
//--></script>
Title: Replace Display Name with an Image in the ShoutBox Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!--
// username, URL to image with which to replace the display name var userImages = [ ["admin", "http://s3.images.proboards.com/menu/admin.gif"], ["88088", "http://wimg.co.uk/CGt7va.gif"] ];
if (typeof(shoutbox) != "object") var shoutbox = new Array(); if (typeof(shoutbox["execute"]) == "undefined") shoutbox["execute"]= new Array(); shoutbox["execute"].push( new Array( function(userImages) { var anchs = document.getElementById("shoutbox").getElementsByTagName('a'), a, i; for (i = 0; i < userImages.length; i++) { for (a = 0; a < anchs.length; a++) { if ((anchs[a].getAttribute("href").match("action=viewprofile")) && (anchs[a].getAttribute("href").match("user=" + userImages[i][0]))) anchs[a].innerHTML = "<img alt=\"" + userImages[i][0] + "\" src=\"" + userImages[i][1] + "\" />"; } } }, userImages ) );
//--></script>
Title: Custom BB Code in the ShoutBox Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox Requirements: You must be fluent in the languages of HTML and JavaScript.
For tags where the code is the same as the HTML (e.g. [b] is <b>, [i] is <i>, etc.), you need only list the letter(s) in the code, which can be seen with b, i, s, sub, sup, tt, and u (<b>, <i>, <s>, <sub>, <sup>, <tt>, and <u>, respectively).
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["bb-code"] = [ 'b', 'i', 's', "sub", "sup", "tt", 'u' ]; //--></script>
To add a different tag, use an Array, as seen here:
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["bb-code"] = [ ['b', "<strong>"], ['i', "<em>"], 's', "sub", "sup", "tt", 'u' ]; //--></script>
To add parameters to the BB Code (e.g. [font=Arial]), add %s to the second item in the Array.
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["bb-code"] = [ ['b', "<strong>"], ["font", "<span style='font-family : %s;'>"], ['i', "<em>"], 's', "sub", "sup", "tt", 'u' ]; //--></script>
The closing tag is automatically determined to be </span>, so you need not worry about that. However, if you choose to add closing tags just to "be safe," it won't hurt anything.
However there are some cases where closing tags may be necessary, such as when using multiple HTML tags.
Notice how [bi] uses both <b> and <i>, and thus requires the third Array item telling it how to close the tag (closing tags in JavaScript requires the backslash-forwardslash instead of just the forwardslash). The third Array item supports the %s parameter, just as the second item does.
Title: Cell Highlight for Display Names in the ShoutBox Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!--
if (typeof(shoutbox) != "object") var shoutbox = new Array(); if (typeof(shoutbox["execute"]) == "undefined") shoutbox["execute"]= new Array(); shoutbox["execute"].push( function() { var c, cells = document.getElementById("shoutbox").getElementsByTagName("td"); for (c = 0; c < cells.length; c++) { if ((cells[c].getElementsByTagName("a").item(0)) && (cells[c].className.match(/windowbg$/))) { cells[c].onclick = function() { location.href = this.getElementsByTagName("a").item(0).getAttribute("href"); } cells[c].onmouseout = function() { this.setAttribute("class", "windowbg"); this.setAttribute("className", "windowbg"); } cells[c].onmouseover = function() { this.setAttribute("class", "windowbg2"); this.setAttribute("className", "windowbg2"); } cells[c].style.cursor = "pointer"; } } } );
//--></script>
Title: Decrease Number of Messages Displayed Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["messages"] = 9; //--></script>
Nine is the maximum number of messages that can be displayed. Setting shoutbox["messages"] to anything greater than nine will automatically revert it back to nine.
Upgraded shoutboxes are allowed to increase the number of messages displayed upon request.
Title: Disable Global Chat Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["disable-global"] = true; //--></script>
This will prevent your users from accessing the Global chatroom, which can be accessed by clicking the [Global] link at the top left corner of your shoutbox. This is useful for forums that do not approve of vulgarity - such as forums for minors/teens, religious groups, etc. The Global chatroom may not enforce the same rules as your local shoutbox, therefore you may not want your members to access it.
Title: Change ShoutBox Category Text Creator: Charles Stover (a.k.a. GAMEchief, SegaDragon) Cross-Browser: Yes Placement: Directly Above the ProBoards ShoutBox
Code:
<script type="text/javascript"><!-- if (typeof(shoutbox) != "object") var shoutbox = new Array(); shoutbox["category-text"] = "The ShoutBox"; //--></script>
This will change the category text ("The ShoutBox") in the shoutbox to display whatever you want. Simply change "The ShoutBox" to your desired text, be it "Chatroom," "TalkBox," or the name of your site. Whatever you want it to say is allowed. This will not change the category text while in global. This only changes the local shoutbox text. The global category text is and will remain the rules for the global chat.
Joined: Nov 2010 Gender: Male Posts: 976 Location: California Karma: 53
Re: ShoutBox Mods « Reply #2 on May 3, 2011, 10:06pm »
Umm I just noticed something with this code Sub. The links only work (for both codes) if you use the http in front of the url, otherwise if you type in a link using the www. in front, it won't work.
Joined: Mar 2011 Gender: Female Posts: 10 Karma: 0
Re: ShoutBox Mods « Reply #3 on Aug 19, 2011, 11:18am »
Hi...any new mods yet for the Shoutbox? Thanks for the Mods so far SubDevo. I use the new Smileys, offered by Proboards via Admin...is there a way to automatically use them in the shoutbox instead of the old ones showing? Regards
One question I had was that I wanted to add it to just one board - from reading the 'text' he says main header - is it possible to change it to a board ?
His board may be temporarily down so I'll check again later. Cheers.
I don't think its compatible to go on anywhere else but the Main Header. I tried putting it on footers, and it also worked. You can try it, maybe you get lucky, but I doubt it.
Cheers OJ but the page is not displaying correctly for me and part of the code is coverd by 'this webpage can not be found' where there are images so I can't get the code. I'll try in another browser..... or maybe tomorrow.
EDIT: Just tried it in chrome and it displayed - must be my browser playing up
OK, It's up and running , main head or footer seems to work and also other footers - Sub - Am I going to experience any problem that I haven't seen yet that you know of ?
I have another question - What is the upgrade it seems to work ok as it is. Does the upgrade get rid of the donate etc buttons ? Are there other benefits ? I'll probably upgrade/donate anyway (over a year it's very little if anyone else is thinking about it) but I was just wondering before I start messing about with it. I dont want to modify it and then find the upgrade has changed the lay out.
Cheers for any input.
EDIT: I've been trying to find out from C.Stovers site but many of the pages are not working (in any browser) - Is this affecting the working of the shout box as well ? Are they all on the same server ?
So the easy answer is , yes , it gets rid of the donate and upgrade buttons , the 'get your own chat box', the copyright charles stover, leaving it just as it is here at IOD ?
Just to rectify what I said above ^^^ - It only works in the main footers - not all - it messes up the page display if put in any footers other than main - That's why he says main !
Make sure you put it in the HEADER not footer. You can put it in a specific board header if you wish and it should work fine. The other difference of going premium is that you don't have to refresh the page to get new shouts. And the admin has the ability to delete shouts (spam, inappropriate etc...).
Cheers Sub, I'm upgraded (recommended to those thinking about it) and ready to go - Launch night on Wednesday (I'm only using it for specific events) *crosses fingers*