Jump to content
vBWarez - Rest In Peace

Return of the Smilies button!


Recommended Posts

This mod adds smilies button to vBShout 6x on vb5x

Okay, this mod is not nearly so nice as DBTechs work. But they have no intention of doing more work on vBShout or fixing the smilies button they removed in vB5.0x
It makes use of vBShouts internal command codes to send smilie code values to the edit box.
Note- Smilie should be picked first or exclusive as it will replace text currently in edit box.

This is not a simple mod and it may need to be customized per theme though I hope I have managed to avoid all that annoyance.
It only covers the general set and does not include the MORE groups option as that function is not supported in vBShout 6x.
packages\dbtechvbshout\js\core.js would need to be entirely rewritten in order to accept new vB5x code-
[CODE]<a style="" href="#" class="b-link h-left h-margin-top-xs js-toggle-more-smilies" tabindex="1">More Smilies ยป</a>[/CODE].
The window method I used also has limited size so only about 3 more custom smilies may be added.

[CENTER][img]http://s32.postimg.org/ej7doc8cl/v_BShout6_v_B519_Smilies.jpg[/img][/CENTER]

In template css_additional.css
add this code anywhere-

[CODE]

/* Start vBShout Smilies */

.vBShout_SmiliesButton {
background: transparent no-repeat;
cursor: pointer;
}

/* The container <div> - needed to position the vBShout_Smilies content */
.vBShout_Smilies {
position: relative;
display: inline-block;
}

/* vBShout_Smilies Content (Hidden by Default) */
.vBShout_Smilies-content {
display: none;
position: absolute;
background-color: #222222;
color: yellow;
height: 100px
min-width: 250px;
box-shadow: 2px 8px 16px 2px rgba(50,60,70,0.2);
}
/* Links inside the vBShout_Smilies */
.vBShout_Smilies-content a {
color: yellow;
padding: 2px 2px;
text-decoration: none;
display: block;
}

/* Change color of vBShout_Smilies links on hover */
.vBShout_Smilies-content a:hover {background-color: #eeee22}

/* Show the vBShout_Smilies menu on hover */
.vBShout_Smilies:hover .vBShout_Smilies-content {
display: block;
display: -webkit-flex; /* Safari */
-webkit-flex-direction: row-reverse; /* Safari 6.1+ */
display: flex;
flex-direction: row-reverse;
}

/* Change the background color of the vBShout_Smilies button when the vBShout_Smilies content is shown */
.vBShout_Smilies:hover .vBShout_SmiliesButton {
background-color: #3e8e41;
}
/* End vBShout Smilies */

[/CODE]

Then in dbtech_vbshout_editor
locate this code block around line 85

[CODE]<vb:comment>
<vb:if condition="!($instance['options']['editors'] & 64) AND !($user['dbtech_vbshout_settings'] & 64)">
<li><img src="core/packages/dbtechvbshout/images/editor/smilie.png" alt="{vb:rawphrase smilies}" width="20" height="20" name="dbtech_vbshout_smilies" data-instanceid="{vb:var instance.instanceid}" /></li>
</vb:if>
</vb:comment>
[/CODE]

and replace it with this code-

[CODE]<!-- Smilies code was here -->
<div class="vBShout_Smilies">
<img class="vBShout_SmiliesButton" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/SmilieButton1.gif" alt="smilies" title="smilies" />
<div class="vBShout_Smilies-content">

<a target="_blank" href="/admincp/image.php?do=modify&table=smilie&" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/icon4.png" alt="more" title="more" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :D" title="Big Grin :D" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/biggrin.png" alt="Big Grin :D" title="Big Grin :D" data-smilieid="3" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :o" title="Embarrassment :o" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/redface.png" alt="Embarrassment :o" title="Embarrassment :o" data-smilieid="7" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :(" title="Frown :(" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/frown.png" alt="Frown :(" title="Frown :(" data-smilieid="8" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :confused:" title="Confused :confused:" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/confused.png" alt="Confused :confused:" title="Confused :confused:" data-smilieid="10" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :eek:" title="EEK! :eek:" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/eek.png" alt="EEK! :eek:" title="EEK! :eek:" data-smilieid="9" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :mad:" title="Mad :mad:" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/mad.png" alt="Mad :mad:" title="Mad :mad:" data-smilieid="2" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :rolleyes:" title="Smile :)" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/rolleyes.png" alt="Rolls Eyes :rolleyes:" title=":rolleyes:" data-smilieid="7" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :cool:" title="Cool :cool:" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/cool.png" alt="Cool :cool:" title="Cool :cool:" data-smilieid="6" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :p" title="Stick Out Tongue :p" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/tongue.png" alt="Stick Out Tongue :p" title="Stick Out Tongue :p" data-smilieid="5" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" ;)" title="Wink ;)" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/wink.png" alt="Wink ;)" title="Wink ;)" data-smilieid="6" />     </a>

<a href="javascript://" name="dbtech_vbshout_setcommand" data-instanceid="{vb:var instance.instanceid}" data-command=" :)" title="Smile :)" ><img width="16" height="16" src="{vb:raw baseurl_core}/packages/dbtechvbshout/images/vBShout/smile.png" alt="Smile :)" title=":)" data-smilieid="1" />     </a>


</div>
</div>
[/CODE]

Save

Download, extract and add vBShout folder to core\packages\dbtechvbshout\images folder.
[ATTACH]11257[/ATTACH] 17kb

and reload site.

As I say, it is far from perfect or anywhere near so advanced as DBTech, but it is better than nothing for 5.1.x users.
Should work for older 5.0.x and newer 5.2.x as well.

Note- reason for [CODE]     </a>[/CODE] is that its required for proper formatting only on some browsers.
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...