Dion Dev Shoutbox v2.1 (AJAX)

MobileHacks

New Member
DEMO URL:

NEW FEATURES:
- simplicity was kept in mind
- new archive layout that uses a table with name, message, time, and ip & delete for admins/supermods
- shoutbox files are all in one folder
- new option to change the width and height of the shoutbox iframe
- new option to allow supermods to delete shouts
- new collapsable shoutbox template that flows better with forums
- ip addresses are now stored along with shouts
- B, I, U, and color buttons for shouts that are remembered for each shout until the member navigates away from the page
- javascript bug fixes that caused messages with "&" and other symbols to cut off
- name colors based on group open and close tags
- new option to automatically parse urls
- removed guest shouting all together (after being disgusted with some of the things written in the shoutbox on my site, i will never re-add this feature so don't bother asking)
- new hide shoutbox from guests option
- uses a little cache system so it only redraws shouts if a new shout has been made (saves bandwidth)
- and some more features I may have forgot to mention

You can see the old feature lists in the old shoutbox vb.org threads:
Dion Dev Shoutbox v2.0
vBulletin 3.x Shoutbox 1.0


UPGRADE INSTRUCTIONS:
1. Uninstall the old shoutbox product from your admin cp
2. Delete all the shout*.php files from your web server
3. Remove the old shoutbox code from whatever template you added it to
4. Follow the "fresh installation instructions" below

FRESH INSTALLATION INSTRUCTIONS:
1. Extract the zip file onto your computer
2. Log in to your admin cp
3. Go to plugins & products -> manage products -> add/import product -> browse for "product-ddsb2.1.xml" -> click "import"
4. Upload the entire "shoutbox" folder (DO NOT RENAME IT) to your main vbulletin directory
5. Copy and paste the entire contents of "template.txt" into the template you want the shoutbox to show up in

if you want the shoutbox to show at the top of your forum index, go to the FORUMHOME template and find:

"<!-- / guest welcome message -->
<br />
</if>"

and copy and paste the contents of "template.txt" after that.

6. Go to vbulletin options -> select "dion dev shoutbox v2.1 options" at the very bottom of the list
7. Edit all the options as you please and then click on the "save" button

ADDITIONAL OPTIONS:
1. If you want to change the amount of time it checks between shouts, open up "shoutshow.js" in notepad and change "2000" to whatever number, in milliseconds, you want it to wait between checking for new shouts
 
Looks like a good alternative to cyb.

*Off-topic*... What style is that demo url using? Looks nice & clean :)
 
i cant do it.i put it in index.php and it responding with error in line ,,,


i want to put it in index.php...

plz explain me what after 5.??
 
What are you doing?!
You don't put in the index file. its a template you need to edit.
Styles & Templates > Style Manager > (YOURSTYLE) Dropdown box > Edit templates.
Find:
FORUMHOME:
Code:
"<!-- / guest welcome message -->
<br />
</if>"

Add below:
Code:
<!-- Dion Dev Shoutbox v2.1 -->
<if condition="!$show[guest] || $vboptions[ddsb_guest_show]">
<script type="text/javascript" src="shoutbox/shoutinsert.js"></script>
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>
  <td class="tcat">
  
    <a style="float:$stylevar[align=right]" href="#top" onclick="return toggle_collapse('forumbit_sb')">
    <img id="collapseimg_forumbit_sb" src="$stylevar[imgdir_button]/collapse_tcat{$collapseimg_sb}.gif" alt="" border="0" />
    </a>
    
    $vboptions[ddsb_title]
    
  </td>
</tr>
<tr id="collapseobj_forumbit_sb" style="{$collapseobj_sb}">
  <td style="padding: 0px;">
  
    <form method="post" onsubmit="insertshout(); return false;">

    <div class="panel" style="padding: 0px; margin-bottom: $stylevar[cellspacing]px;">

    <table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%">
    <tr>
    <td width="100%" style="padding-right: 0px;">

      <input type="text" id="body" class="bginput" size="$vboptions[ddsb_size]" maxlength="$vboptions[ddsb_length]"
      <if condition="$show[guest]"> value="$vboptions[ddsb_no]" disabled="true"</if>>

      <input type="submit" class="button" value="$vboptions[ddsb_button]"
      <if condition="$show[guest]"> disabled="true"</if>>

      &nbsp;

      <input type="button" class="button" value=" B " style="font-weight: bold;" onclick="shoutstyle('bodyb', 0);"
      <if condition="$show[guest]"> disabled="true"</if>>

      <input type="button" class="button" value=" I " style="font-style: italic;" onclick="shoutstyle('bodyi', 0);"
      <if condition="$show[guest]"> disabled="true"</if>>

      <input type="button" class="button" value=" U " style="text-decoration: underline;" onclick="shoutstyle('bodyu', 0);"
      <if condition="$show[guest]"> disabled="true"</if>>

      <select id="bodycolorsel" <if condition="$show[guest]"> disabled="true"</if> onchange="shoutstyle('bodycolor', this.value);">
      <option value="0" style="background: #ffffff; color: #000000;">$vboptions[ddsb_txtcolor]</option>
      <option value="#000000" style="background: #000000;">&nbsp;</option>
      <option value="#8b0000" style="background: #8b0000;">&nbsp;</option>
      <option value="#ff0000" style="background: #ff0000;">&nbsp;</option>
      <option value="#ff00ff" style="background: #ff00ff;">&nbsp;</option>
      <option value="#ffc0cb" style="background: #ffc0cb;">&nbsp;</option>
      <option value="#a0522d" style="background: #a0522d;">&nbsp;</option>
      <option value="#ff8c00" style="background: #ff8c00;">&nbsp;</option>
      <option value="#f4a460" style="background: #f4a460;">&nbsp;</option>
      <option value="#ffa500" style="background: #ffa500;">&nbsp;</option>
      <option value="#f5deb3" style="background: #f5deb3;">&nbsp;</option>
      <option value="#556b2f" style="background: #556b2f;">&nbsp;</option>
      <option value="#808000" style="background: #808000;">&nbsp;</option>
      <option value="#9acd32" style="background: #9acd32;">&nbsp;</option>
      <option value="#fffacd" style="background: #fffacd;">&nbsp;</option>
      <option value="#006400" style="background: #006400;">&nbsp;</option>
      <option value="#008000" style="background: #008000;">&nbsp;</option>
      <option value="#2e8b57" style="background: #2e8b57;">&nbsp;</option>
      <option value="#00ff00" style="background: #00ff00;">&nbsp;</option>
      <option value="#98fb98" style="background: #98fb98;">&nbsp;</option>
      <option value="#483d8b" style="background: #483d8b;">&nbsp;</option>
      <option value="#008080" style="background: #008080;">&nbsp;</option>
      <option value="#48d1cc" style="background: #48d1cc;">&nbsp;</option>
      <option value="#00ffff" style="background: #00ffff;">&nbsp;</option>
      <option value="#afeeee" style="background: #afeeee;">&nbsp;</option>
      <option value="#000080" style="background: #000080;">&nbsp;</option>
      <option value="#0000ff" style="background: #0000ff;">&nbsp;</option>
      <option value="#4169e1" style="background: #4169e1;">&nbsp;</option>
      <option value="#00bfff" style="background: #00bfff;">&nbsp;</option>
      <option value="#add8e6" style="background: #add8e6;">&nbsp;</option>
      <option value="#4b0082" style="background: #4b0082;">&nbsp;</option>
      <option value="#708090" style="background: #708090;">&nbsp;</option>
      <option value="#800080" style="background: #800080;">&nbsp;</option>
      <option value="#9932cc" style="background: #9932cc;">&nbsp;</option>
      <option value="#dda0dd" style="background: #dda0dd;">&nbsp;</option>
      <option value="#2f4f4f" style="background: #2f4f4f;">&nbsp;</option>
      <option value="#696969" style="background: #696969;">&nbsp;</option>
      <option value="#808080" style="background: #808080;">&nbsp;</option>
      <option value="#c0c0c0" style="background: #c0c0c0;">&nbsp;</option>
      <option value="#ffffff" style="background: #ffffff;">&nbsp;</option>
      </select>

    </td>
    <td nowrap="nowrap" class="smallfont">

      <a href="shoutbox/shoutarchive.php" target="_blank">$vboptions[ddsb_archive]</a>

    </td>
    </tr>
    </table>

    </div>

    <input type="hidden" id="bodyb" value="0">
    <input type="hidden" id="bodyi" value="0">
    <input type="hidden" id="bodyu" value="0">
    <input type="hidden" id="bodycolor" value="0">
    <input type="hidden" id="bodystyle" value="0">

    </form>

    <iframe src="shoutbox/shoutdiv.php" width="$vboptions[ddsb_iwidth]" height="$vboptions[ddsb_iheight]" scrolling="auto" frameborder="0">
    Browser does not support iframes
    </iframe>
    
  </td>
</tr>
</table>
<br />
</if>
<!-- end Dion Dev Shoutbox v2.1 -->
 
shoutdiv.php and shoutarchive.php find and remove:

<div class="smallfont" style="text-align: center;">
Powered by <a href="http://www.diondev.com/vb" target="_blank">Dion Dev Shoutbox v2.1</a>
</div>
 
I dont have the shoutshow.php file, where do i find this? :S

actually seems my extracter was corrupt sorry bout this.
 
Back
Top