Smilie Dropdown with option to view all (4.0.0)

[Todge]

May 8, 2018 19:54:10 GMT -8 JJ said:

Love this option, Todge , could you please add a font size line? For some odd reason, my text in there is now really large. Sorry, I'm rusty, and cannot remember the basics.

Hey ya JJ.. Hope you're well..

No need to apologise, here's an updated version of the code that also allows you to change the size of the button's text..

<script type="text/javascript">
<!--
// Change 'View All Smileys' button content...

$(document).ready(function(){
     $('.smBottom>a').html('View GIF Smileys').css('font-size','20px');
});

// -->
</script>

[JJ]

Great, Thanks, Todge. I'm hanging in there, hope things are well with too.

[aRMY83]

Hello Todge

Is there a way to remove the Select Smiley box (form) from the ProBoards shout box?

Example: (in red)



FYI: the Select Smiley box (form) does not appear when replying to a post nor does it appear in the Quick Reply area.

Installed plugin: Smilie Dropdown Version 3.2.1 Beta

[Todge]

Jun 3, 2018 13:03:35 GMT -8 aRMY83 said:

Hello Todge

Is there a way to remove the Select Smiley box (form) from the ProBoards shout box?

Example: (in red)

View Attachment

FYI: the Select Smiley box (form) does not appear when replying to a post nor does it appear in the Quick Reply area.

Installed plugin: Smilie Dropdown Version 3.2.1 Beta

This may be a silly question, but if the Select Smiley box is not displaying why do you need it removed?

But yes, it can be removed.. Add this to the plugin's popup CSS..

.smTop
{
   display: none;
}

[aRMY83]

Jun 3, 2018 15:17:54 GMT -8 Todge said:

Jun 3, 2018 13:03:35 GMT -8 aRMY83 said:

Hello Todge

Is there a way to remove the Select Smiley box (form) from the ProBoards shout box?

Example: (in red)



FYI: the Select Smiley box (form) does not appear when replying to a post nor does it appear in the Quick Reply area.

Installed plugin: Smilie Dropdown Version 3.2.1 Beta

This may be a silly question, but if the Select Smiley box is not displaying why do you need it removed?

I may have stated wrong to what I was asking, so maybe this will be a bit more clearer.

This is what shows in the Shout box:



This is what shows in the Posting page:



This is what shows in the Quick Reply:



If possible, this is what I need removed from the shout box when clicking on the Insert Smiley icon:

[Todge]

Jun 3, 2018 19:00:40 GMT -8 aRMY83 said:

Jun 3, 2018 15:17:54 GMT -8 Todge said:

This may be a silly question, but if the Select Smiley box is not displaying why do you need it removed?

I may have stated wrong to what I was asking, so maybe this will be a bit more clearer.

This is what shows in the Shout box:

View Attachment

This is what shows in the Posting page:

View Attachment

This is what shows in the Quick Reply:

View Attachment

If possible, this is what I need removed from the shout box when clicking on the Insert Smiley icon:

View Attachment

Ahh.. Gotya..

Try this in your Smilie Plugins CSS

.smMiddle, .smTop
{
   display: none!important;
}

[aRMY83]

Hello Todge

That's it and working like a charm.

[Todge]

Glad it worked..

[Todge]

Version 3.2.2 is available (as direct download)..

It should now work with the XL Signature Plugin.

[bartlesby]

Todge

Would it be possible to update it so a tooltip will display when hovered over the emoji that shows its name (that is, the filename stripped of the extension)? We have quite a few on our board.

My quickfix was sticking this into the footer:

function add_smiley_tooltip() {    
   var pbn = pb.data("route").name;
   if (proboards.dataHash.css_wysiwyg_style || pbn == "thread" || pbn.indexOf("recent") != -1 || pbn == "conversation") {
    var i = $("td .content .message img");
    $(i).each(function() {
      var s = $(this).attr("src");
      if (s != undefined) {
      s = s.split(/[//.]+/);
           }
           if (s[2] == "postimg" || s[2] == "proboards") {
      var len = s.length-2;          
      $(this).attr("title", s[len]);
           }
    });
   }
}
$(function() {
   add_smiley_tooltip();
   proboards.on("pageChange", add_smiley_tooltip);          
});
... but it would be more efficient to have it done within the plugin.

Thanks in advance if you do.

[Todge]

Sept 6, 2018 14:41:15 GMT -8 bartlesby said:

Todge

Would it be possible to update it so a tooltip will display when hovered over the emoji that shows its name (that is, the filename stripped of the extension)? We have quite a few on our board.

My quickfix was sticking this into the footer:

function add_smiley_tooltip() {    
   var pbn = pb.data("route").name;
   if (proboards.dataHash.css_wysiwyg_style || pbn == "thread" || pbn.indexOf("recent") != -1 || pbn == "conversation") {
    var i = $("td .content .message img");
    $(i).each(function() {
      var s = $(this).attr("src");
      if (s != undefined) {
      s = s.split(/[//.]+/);
           }
           if (s[2] == "postimg" || s[2] == "proboards") {
      var len = s.length-2;          
      $(this).attr("title", s[len]);
           }
    });
   }
}
$(function() {
   add_smiley_tooltip();
   proboards.on("pageChange", add_smiley_tooltip);          
});
... but it would be more efficient to have it done within the plugin.

Thanks in advance if you do.

The reason a tooltip was not added to the posted smilies is because it screwed with the function for posting them, specifically the function to convert them to and from the images and codes as you switched from the Preview to the BBCode areas, but I'll have another look at it.

[bai]

Hey all!

So I was wondering if anyone knows how to adapt this w3Schools Tab code to this plugin so I can make the smileys a bit more organized? I have at least 50 smileys and a bad case of perfectionism so I think this would be good.

Here is the w3schools code/link

www.w3schools.com/howto/howto_js_tabs.asp

[Todge]

Not easily.

The pop-up is created when you click the button, so they'd be nothing for the code to organise when the screen is loaded.

[bai]

Sept 20, 2018 13:28:13 GMT -8 Todge said:

Not easily.

The pop-up is created when you click the button, so they'd be nothing for the code to organise when the screen is loaded.

Okay! Then I will just try condensing things and utilize the CSS box in the plugin. Thank you!

[dimitris99]

Nov 13, 2012 11:52:12 GMT -8 Todge said:

This is a rewrite of the code in the Code Index, you should be able to simply copy/paste your smilie array from the code in your V4.5 forum into the plugin. The drop-down will appear below the standard smileys on the posting page.

Plug-in
Current Version 3.2.2

Direct Link

There is now a plugin to help you create and edit your smiley array.

Put your smilie array in the large box entitled 'List your smilies here'...

'URL OF SMILIE';
URL OF SMILIE
URL OF SMILIE
URL OF SMILIE
etc..

You can add titles/categories to your smilies by putting the title into the smilie array..

<b>Happy Smileys</b>
URL OF SMILIE
URL OF SMILIE
URL OF SMILIE
etc..

Notice you can use simple HTML to style the title.

The rest of the settings are fairly self explanatory (I hope).

This plugin creates the smiley code from the image filename, for example, if you have an image with the URL 'http://myhost/mysmilies/cheerful.png', the smiley code will be ::cheerful::, taking that into account, if your filename is 'cheerful_123_456_xyp.png', then you'll end up with a smiley code of '::cheerful_123_456_xyp::', not very helpful if you want to type it directly.
Please take that into consideration when uploading your smiley images.

There is also a new tab, 'Popup CSS'. Here you can use CSS styling to edit the look of the entire coding.
The classes you need are:-

.smTop {} The top of the smilie box, containing the dropdown selector.
.smMiddle {} The middle of the smilie box, where the selected smilie is displayed.
.smBottom {} The bottom of the smilie box, containing the 'View all smilies' button.

.showsmilies {} The pop-up itself.
.smTitle {} The title bar at the top of the pop-up.
.smTable {} The table containing all the smilies within the pop-up.
.smCell {} The boxes containing each smilie.
.smGroup {} The subtitle cells which separate the smilie groups within the smilie table.

You can also have 'Board Specific' smilies by placing this code in the HEADER of the board(s) you wish to have it's own smilies..

<script type="text/javascript">
// Board Smilies for Smiley Drop Down Plugin

var smilie = new Array(
'SMILEY URL',
'SMILEY URL',
'SMILEY URL',
'SMILEY URL',
'SMILEY URL',
'SMILEY URL',
'SMILEY URL' // NOTE: The last smiley URL has no comma!!!
);

</script>

Many thanks to Chris for the awesome function allowing me to add content to the WYSIWYG editor.

SPOILER: Click to show

3.2.2
Updated to work with the XL Signature plugin.

3.2.0
Fixed smiley title issue when smileys are displayed along the top of the QR.

3.1.9
Updated the 'JJ' option.

3.1.8
Fixed issue where smiley titles where converted to URLs

3.1.7
Added 'JJ' option

3.1.6
Fixed scroll position after smiley conversion on pageload.
Fixed issue where smiley menu remained visible after pop-up is selected.

3.1.5
Fixed pop-up in shout-box and re-enabled it.
Fixed 'cross-talk' issue when selecting smilies in one area would effect them in the other.
Fixed issue with Signature smiles not showing unless page was refreshed.
Reduced delay on smilies being displayed in the shout-box for those not posting them.

3.1.4
Small bug fix.

3.1.3
Added option to use smilies in chat box.

3.1.2
Updated QR submit call.

3.1.1
Fixed strange QR issue.

3.1.0
No longer necessary to list your smileys in JS format.

3.0.9
Minor bug fix.

3.0.8
Added option to display smileys along the top of the Quick Reply.

3.0.7
Updated Quick Reply function.

3.0.6
Updated quick reply smiley codes.

3.0.5
Updated to reduce oversized images to fit the dropdown.

3.0.4
Added maximum width option for the smiley pop-up box to make it neater for oversized smileys.

3.0.3
Updated cursor position function.

3.0.2
Fixed issue where pop-up box would collapse even if set not to.
Added function to set the caret position after the previously entered smiley in the quick reply box.

3.0.1
Fixed issue where standard smileys would remain open over the top of the pop-up.
Fixed error that stopped smileys from working in PMs.
Fixed conflict with chat-box when adding smileys to your signature.

3.0.0
Complete rewrite, and added option to have smileys in your signatures.

2.1.9
Updated to hopefully make QR selection more reliable.

2.1.8
Corrected issue with matching filenames.

2.1.7
Edited to open smilie pop-up at top of scroll.

2.1.6
Edited to take spaces in URLs into consideration. (again)

2.1.5
Added option for using Eton Bones' UBBC Plugin.

2.1.4
Fixed multiple spaces that occur when previewing post multiple times.

2.1.3
Fixed problem with message QR.

2.1.2
Updated to allow for more CSS styling.

2.1.1
Updated to take shoutbox into consideration when moved to top of forum.

2.1.0
Updated for compatibility with the Smiley Management Plugin.

2.0.3
Edited to allow header array.

2.0.2
Edited to take spaces in URLs into consideration.

2.0.1
Fixed error with smiley categories.
Fixed error when switching from Visual to BBCode in IE.
Updated user interface.

2.0.0
Re-arranged coding into functions and updated QR to eliminate location check.

1.9.94
Updated Quick Reply function call.

1.9.93
Updated location check.

1.9.92
Fixed error on thread creation page.

1.9.91
Fixed small error with pagination.

I cannot add them for example i want to add i.imgur.com/Lu8GajH.png but with name flagsweden (i mean when i will write flagsweden the flag of sweden will appeared