Visit Our UNIX and Linux User Community


New Icons Coming from Font Awesome


 
Thread Tools Search this Thread
The Lounge What is on Your Mind? New Icons Coming from Font Awesome
# 1  
Old 07-27-2018
New Icons Coming from Font Awesome

Finally making some progress on getting rid of the 10 year old buttons with modern day fonts and icons thanks to a responsive web design tutorial by Brad Traversy who's video pointed me to Font Awesome.

The buttons and icons were pretty easy to implement but it too me a number of hours (embarrassingly enough) to rewrite the 10 year old Javascript vBulletin code so "multiquote selection" worked. But it works now! LOL



Image

Original JS code by vBulletin, maybe 10 years old:


Code:
https://www.unix.com/clientscript/vbulletin_multi_quote.js?v=387

New hacked code which could be better, but nevermind, it works fine I think:

Code:
function mq_init(D) {
    var C = fetch_cookie("vbulletin_multiquote");

    if (C != null && C != "") { C = C.split(",") }
    else { C = new Array() } var E; var A = fetch_tags(D, "i");
    for (var B = 0; B < A.length; B++) {
        if (A[B].id && A[B].id.substr(0, 3) == "mq_") {
            E = A[B].id.substr(3); A[B].onclick = function (F) { return mq_click(this.id.substr(3)) };
            change_mq_image(E, (PHP.in_array(E, C) > -1 ? true : false))
        }
    }
}
function mq_click(F) {
    var D = fetch_cookie("vbulletin_multiquote");
    var B = new Array(); var E = false; if (D != null && D != "") {
        D = D.split(","); for (C in D) {
            if (!YAHOO.lang.hasOwnProperty(D, C)) { continue } if (D[C] == F) { E = true }
            else { if (D[C]) { B.push(D[C]) } }
       }
    } change_mq_image(F, (E ? false : true));
    if (!E) {
        B.push(F);
        if (typeof mqlimit != "undefined" && mqlimit > 0) {
            for (var C = 0; C < (B.length - mqlimit); C++) {
                var A = B.shift();
                change_mq_image(A, false)
            }
        }
    } set_cookie("vbulletin_multiquote", B.join(",")); return false
}
function change_mq_image(C, B) {
    var A = "mq_"+C;
    
         if (B == true) {
            if($("#"+A).hasClass("far"))
            {
              $("#"+A).removeClass("far");
              $("#"+A).addClass("fas");
        }
            }
        else {
            if($("#"+A).hasClass("fas"))
            {
              $("#"+A).removeClass("fas");
              $("#"+A).addClass("far");
            }
        }
  }
//mq_init(fetch_object("posts"));

I will implement this for everyone when I am not so tired for getting this to work.

Yeah! Finally we are moving off those terrible legacy vB buttons!!!!
These 2 Users Gave Thanks to Neo For This Post:
# 2  
Old 07-28-2018
OK

The first step of replacing the legacy vB buttons with fonts icons from Font Awesome is done.

Of course, there is a lot of legacy code and buttons, so I might have missed something, in fact I'm sure I did; so if you see any old legacy buttons please post a link and a screen shot attachment (if you can).

Also, I want to again thank Brad Traversy and his awesome YT channel, Traversy Media, for pointing me in this direction.

Thanks.
# 3  
Old 07-28-2018
I'm not seeing old icons, but I am seeing a little bit of strange behavior:
  1. When I click on the poster's name in the upper left corner of a post, I believe I used to get a drop down menu of things I could do like view all posts by that user, visit that user's profile, etc.; now clicking on the poster's name is a no-op. Please reinstate the old behavior.
  2. When I hover over the new Thanks icon in the lower left corner of a post, there is no text indicating what that icon does. Please add something like "Give thanks to the user who submitted this post".
  3. When I hover over the new edit/delete post icon in the lower right corner of a post, I see the text "Edit/Delete Unix or Linux Message". To me, that sounds like it will allow me to edit or delete a mail message in my UNIX and Linux Forum mailbox. Consider changing the text to something like "Edit or Delete this post".
  4. When I hover over the new quick reply icon in the lower right corner of a post, I see the text "Quick reply to Unix / Linux message". To me, that sounds like it will allow me to reply to a mail message in my UNIX and Linux Forum mailbox. Consider changing the text to something like "Reply to this thread without quoting any posts".
  5. I never understood how multi-quote was supposed to work, but after playing around with it for about an hour this afternoon I think I have figured it out (although there is some inconsistent behavior if I select and deselect some posts for multi-quoting without actually posting a reply). Consider changing the text you see when you hover over the new multi-quote icon in the lower right corner of a post from "Multi-Quote Unix/Linux Message" to something like "Add this post to the list of posts to be Multi-Quoted" (when the post has not been selected) and "Remove this post from list of posts to be Multi-Quoted" (when the post has been selected).
  6. When I hover over the new quote reply icon in the lower right corner of a post I see the text "Unix or Linux Quote Reply". Consider making this a little bit clearer for new (and experienced) users by changing the text to something like "Quote this post and any posts selected for Multi-Quoting in a Reply to this thread".
This User Gave Thanks to Don Cragun For This Post:
# 4  
Old 07-28-2018
Thanks so much Don!

Will do !
# 5  
Old 07-28-2018
Hello Neo,

Also can we make THANKS button looking like pressed already in case someone has given THANKS on a post(apologies if I am missing here something) but it doesn't look like that as of now. It can help if that looks like already pressed kind of thing.

Also can we have a THANKS icon while replying to a POST too, so that we could mention it on the header of post itself?

Thanks,
R. Singh
This User Gave Thanks to RavinderSingh13 For This Post:
# 6  
Old 07-29-2018
Quote:
Originally Posted by RavinderSingh13
Hello Neo,

Also can we make THANKS button looking like pressed already in case someone has given THANKS on a post(apologies if I am missing here something) but it doesn't look like that as of now. It can help if that looks like already pressed kind of thing.
This like / thanks button disappears after a post is liked.

This is the normal behavior and has not changed.
This User Gave Thanks to Neo For This Post:
# 7  
Old 07-29-2018
Quote:
Originally Posted by Don Cragun
I'm not seeing old icons, but I am seeing a little bit of strange behavior:
[*]When I click on the poster's name in the upper left corner of a post, I believe I used to get a drop down menu of things I could do like view all posts by that user, visit that user's profile, etc.; now clicking on the poster's name is a no-op. Please reinstate the old behavior.
TODO.

Quote:
Originally Posted by Don Cragun
[*]When I hover over the new Thanks icon in the lower left corner of a post, there is no text indicating what that icon does. Please add something like "Give thanks to the user who submitted this post".
Done.

Quote:
Originally Posted by Don Cragun
[*]When I hover over the new edit/delete post icon in the lower right corner of a post, I see the text "Edit/Delete Unix or Linux Message". To me, that sounds like it will allow me to edit or delete a mail message in my UNIX and Linux Forum mailbox. Consider changing the text to something like "Edit or Delete this post".
Done.

Quote:
Originally Posted by Don Cragun
[*]When I hover over the new quick reply icon in the lower right corner of a post, I see the text "Quick reply to Unix / Linux message". To me, that sounds like it will allow me to reply to a mail message in my UNIX and Linux Forum mailbox. Consider changing the text to something like "Reply to this thread without quoting any posts".
Done.

Quote:
Originally Posted by Don Cragun
[*]I never understood how multi-quote was supposed to work, but after playing around with it for about an hour this afternoon I think I have figured it out (although there is some inconsistent behavior if I select and deselect some posts for multi-quoting without actually posting a reply). Consider changing the text you see when you hover over the new multi-quote icon in the lower right corner of a post from "Multi-Quote Unix/Linux Message" to something like "Add this post to the list of posts to be Multi-Quoted" (when the post has not been selected) and "Remove this post from list of posts to be Multi-Quoted" (when the post has been selected).
Halfway done. TODO: Change mouse over text after selected (temporarily the text is Add/Remove ... blah blah)

Quote:
Originally Posted by Don Cragun
[*]When I hover over the new quote reply icon in the lower right corner of a post I see the text "Unix or Linux Quote Reply". Consider making this a little bit clearer for new (and experienced) users by changing the text to something like "Quote this post and any posts selected for Multi-Quoting in a Reply to this thread".
Done (but I this icon (far bottom right) does not add any selected "multi-quoted". It is strictly a "quick reply without quotes kinda action).

Thanks for all your very detailed comments.

It's pretty easy to fix the kind of things when your comments are so precise, as it takes less time to fix the issue than to understand what you want to fix.

Much appreciated Don! Thanks!!


TODO:

Transfer Bits to a Poster when the "Thanks You / Like Button" is pressed, or maybe add a quick popup menu to ask "how much to you like it? how many bits do you want to give? LOL" or something that that. Or maybe just keep it simple or as it is?

Previous Thread | Next Thread
Test Your Knowledge in Computers #522
Difficulty: Medium
11,223 = 0x2BD7
True or False?

8 More Discussions You Might Find Interesting

1. What is on Your Mind?

Quick Update on UNIX.COM Site Renovation: Bootstrap, Font Awesome and jQuery

Here is an update on the site renovation: After a lot of analysis and example programming, including testing out a number of Javascript framework and libraries, in the short term, we are getting the most bang-for-the-buck from these three basic, core tech areas: Bootstrap (CSS and... (2 Replies)
Discussion started by: Neo
2 Replies

2. Web Development

New Font Awesome Icons in Quick Reply Editor

Working on the Quick Reply Editor, I have replaced a number of icons (see image below) with Font Awesome Icons. Was planning to replace all of them, but for some reason, replacing a few of them causes the script / template to break (which is odd) so I left them for now. ... (6 Replies)
Discussion started by: Neo
6 Replies

3. What is on Your Mind?

New Mobile Navbar Icons from Font Awesome

Just changed the mobile site to use Font Awesome icons. Here is the new top navbar view (unregistered users) https://www.unix.com/members/1-albums214-picture903.jpeg (2 Replies)
Discussion started by: Neo
2 Replies

4. AIX

CDE: why no icons?

Why my cde show no icons? I have installed X11.Dt.ToolTalk 7.1.3.15 C F AIX CDE ToolTalk Support X11.Dt.adt 7.1.3.0 C F AIX CDE Application X11.Dt.bitmaps 7.1.0.0 C F AIX CDE Bitmaps X11.Dt.compat ... (8 Replies)
Discussion started by: Linusolaradm1
8 Replies

5. Red Hat

Menu Icons for the Application

Hi All, I created an RPM for my application. After clicking the rpm, I managed to place the files in repective locations also I have "JServer" menus in the "Application" menu (The redhat one). But the problem is the icons are not appearing in that menu. I placed my icons/images in... (0 Replies)
Discussion started by: jw_amp
0 Replies

6. Solaris

How to get a second Icons - Window!

Hey everybody! I'd like to get a second Window for my program Icons, any Idea how to solve this problem?? :confused: thanks, Tom (3 Replies)
Discussion started by: TomStyria
3 Replies

7. Post Here to Contact Site Administrators and Moderators

Dotted thread icons

Can you guys please enable the "dotted" icon option, so that the thread icon for a thread in which a user has posted in will appear with a dot in it? Thanks, Aaron (2 Replies)
Discussion started by: Spetnik
2 Replies

8. UNIX for Dummies Questions & Answers

redhat 7.2 icons on desktop

Hello all, Is there a way to change the behavior of the gnome desktop manager so that when your iconify a window it will be place on the desktop intead on on the task manager (gnome-panel)? It gets confusing having to loook throught the gnome-panle for the window I want when you have alot of... (1 Reply)
Discussion started by: larry
1 Replies

Featured Tech Videos