The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Change the prefixes by images

View previous topic View next topic Go down

Solved Change the prefixes by images

Post by Milouze14 on October 24th 2015, 10:41 am

Hi to you all,
I'm french, sorry for my language.

I have a script that uses prefixes and I would fit with simple images, is this possible?

Code:

var prefixes = ["Prefix 1","Prefix 2","Prefix 3","Prefix 4","Prefix 5"];
        var _pm = false;
        var chk = false;
        function toMenu(a) {
          var htmlpre = '<select style="margin-right:5px" id="prefix" size="1"><option value=""> Préfixe </option>';
          for (i in a)
          htmlpre += '<option value="' + a[i] + '">' + a[i] + '</option>';
          htmlpre += '</select>';
          return htmlpre;
        }
        function checkpre(ar, input) {
          for (i in ar) {
              var p = new RegExp("\\" + ar[i], "g");
              var title = input.substr(0, input.indexOf(']'));
              if (p.test(title)) return ar[i];
          }
          return "";
        }
        $(function () {
          if (_pm) chk = /\privmsg/.test(location.href);
          if (/\/post/.test(location.href) || chk) {
              $(toMenu(prefixes)).insertBefore("input[name=subject][type=text]");
              var mw = $("#prefix").width() + 5;
              $("input[name=subject]").css("width", $("input[name=subject]").width() - mw);
              var t = $("[name=subject]").val();
              var cur = checkpre(prefixes, t);
              if (cur != "") {
                $("[value=" + cur + "]").attr("selected", "selected");
                $("input[name=subject]").val(t.replace('[' + cur + ']', '').trim());
              }
              $("input[name=post]").click(function () {
                var sub = $("input[name=subject]").val().trim();
                if (sub != "" && $("#prefix").val() != "")
                    $("input[name=subject]").val("[" + $("#prefix").val() + "] " + sub);
              });
          }
        });



Thank you in advance.

a++

Milouze14
Forumember

Male Posts : 39
Reputation : 2
Language : French
Location : Vendée

http://www.milouze14.com/

Back to top Go down

Solved Re: Change the prefixes by images

Post by Ange Tuteur on October 24th 2015, 11:52 am

Hi @Milouze14,

You want to change the text to images, correct ? If so, go to Modules > JavaScript codes management and create a new script with the following settings.

Placement : In all the pages
Code:
$(function() {
  var keywords = {
    '[Prefix 1]' : '<img src="http://i34.servimg.com/u/f34/12/94/96/28/aflag10.png" />',
    '[Prefix 2]' : '<img src="http://illiweb.com/fa/subsilver/icon_minigender_female.gif" />',
    '[Prefix 3]' : '<img src="http://illiweb.com/fa/punbb/online.png" />'
  },
  target = $('.posthead a, .topictitle'), i = 0, j = target.length, k, str, reg;

  for (; i < j; i++) {
    str = target[i].innerHTML;
    for (k in keywords) {
      reg = new RegExp('^' + k.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), 'i');
      if (reg.test(str)) {
        target[i].innerHTML = str.replace(reg, keywords[k]);
        break;
      }
    }
  }
});

At the top is an object named keywords :
Code:
  var keywords = {
    '[Prefix 1]' : '<img src="http://i34.servimg.com/u/f34/12/94/96/28/aflag10.png" />',
    '[Prefix 2]' : '<img src="http://illiweb.com/fa/subsilver/icon_minigender_female.gif" />',
    '[Prefix 3]' : '<img src="http://illiweb.com/fa/punbb/online.png" />'
  },

To the left of the colon is the prefix name, and to the right is the replacement HTML, in short ; prefix:html pairs. Make sure to separate multiple pairs with a comma.

If you want the replacement to take effect in more elements, modify the target selector query :
Code:
target = $('.posthead a, .topictitle')

If any questions let me know. Have a good day.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Change the prefixes by images

Post by Milouze14 on October 24th 2015, 12:16 pm

Hi Ange Tuteur Hello ,

thank you so much for the script it works perfectly only the image is not recognized knew the description of the subject as shown on the picture below and on the header

Code:

$(function() {
  var keywords = {
    '[Prefix 1]' : '<img src="http://i34.servimg.com/u/f34/12/94/96/28/aflag10.png" />',
    '[Prefix 2]' : '<img src="http://illiweb.com/fa/subsilver/icon_minigender_female.gif" />',
    '[Prefix 3]' : '<img src="http://illiweb.com/fa/punbb/online.png" />'
  },

  target = $(' .topictitle , .t-title, div.cattitle'), i = 0, j = target.length, k, str, reg;

  for (; i < j; i++) {
    str = target[i].innerHTML;
    for (k in keywords) {
      reg = new RegExp('^' + k.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), 'i');
      if (reg.test(str)) {
        target[i].innerHTML = str.replace(reg, keywords[k]);
        break;
      }
    }
  }
});




The capture:



thank you in advance .

Edit: more bugger the script is the editor in edit mode



a++


Last edited by Milouze14 on October 24th 2015, 12:23 pm; edited 2 times in total (Reason for editing : Edit: the script is more bugger publisher)

Milouze14
Forumember

Male Posts : 39
Reputation : 2
Language : French
Location : Vendée

http://www.milouze14.com/

Back to top Go down

Solved Re: Change the prefixes by images

Post by Ange Tuteur on October 24th 2015, 12:50 pm

I made some corrections, see if this works better. ^^
Code:
$(function() {
  var keywords = {
    '[Prefix 1]' : '<img src="http://i34.servimg.com/u/f34/12/94/96/28/aflag10.png" />',
    '[Prefix 2]' : '<img src="http://illiweb.com/fa/subsilver/icon_minigender_female.gif" />',
    '[Prefix 3]' : '<img src="http://illiweb.com/fa/punbb/online.png" />'
  },

  target = $('.topictitle, .t-title, .cattitle, .postdetails'), i = 0, j = target.length, k, str, reg;

  for (; i < j; i++) {
    str = target[i].innerHTML;
    for (k in keywords) {
      reg = new RegExp(k.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), 'i');
      if (reg.test(str)) {
        target[i].innerHTML = str.replace(reg, keywords[k]);
        break;
      }
    }
  }
});

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Change the prefixes by images

Post by Milouze14 on October 24th 2015, 4:16 pm

You are a god my friend solved topic ,

Thank you again for all you do for forumactif

a++

Milouze14
Forumember

Male Posts : 39
Reputation : 2
Language : French
Location : Vendée

http://www.milouze14.com/

Back to top Go down

Solved Re: Change the prefixes by images

Post by Ange Tuteur on October 24th 2015, 4:51 pm

You're welcome ! ^^

Topic archived

Have a good weekend. Smile

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum