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.

How do you add a custom button for staff only to the message editor?

View previous topic View next topic Go down

Solved How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 5th 2014, 12:58 pm

How do you add a custom button for staff only to the message editor?


Last edited by ddoesmc on March 6th 2014, 9:39 pm; edited 1 time in total

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Pizza Boi on March 5th 2014, 1:51 pm


Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 5th 2014, 9:00 pm

Hello ddoesmc,

You can try this :
It is a snippet from a project I was working on.

Administration Panel > Modules > Javascript codes management > Create a new script

Title : what you wish
Placement : In all the pages
Code:
$(window).load(function() {
  var settings = {
  img : 'backgroud img for button',
  title : 'title of button',
  message : 'moderation message'
  };
  if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
  $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
  $('.sceditor-button-message').click(function() {
  $('#text_editor_textarea').sceditor('instance').insertText(settings["message"],'');
  });
  }
});

In the code are some settings you can modify :
Code:
var settings = {
  img : 'backgroud img for button',
  title : 'title of button',
  message : 'moderation message'
  };

img : the url of the image that you want the button to show
title : the title displayed when hovering over the button
message : the message you want inserted into the editor on click

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 5th 2014, 11:22 pm

Hi how do I add more then onemoderation message?

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 1:10 am

You would need to turn it into a dropdown list. You would then need to add to the html, and functions that input the messages.

Example :
Code:
$(function() {
  var settings = {
  img : 'backgroud img for button',
  title : 'title of button'
  };
  if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
  $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
  $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="M1" class="listItem" style="cursor:pointer;">Message 1</div><div id="M2" class="listItem" style="cursor:pointer;">Message 2</div><div id="M3" class="listItem" style="cursor:pointer;">Message 3</div></div>');
 

  $('.sceditor-button-message').click(function() {
  var display = $('#messageList').css('display');
  if (display == 'none') {
  var Y = $(this).offset().top;
  var X = $(this).offset().left;
  $('#messageList').show().offset({top:Y + 25,left:X});
  }
  else { $('#messageList').hide(); }
  });
 
  $('#M1').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 1',''); });
  $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 2',''); });
  $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 3',''); });
  $('.listItem').click(function() { $(this).parent().hide(); });
  }
});

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 6th 2014, 1:39 am

I will try this
Edit: I just want text no background

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 2:00 am

@ddoesmc wrote:I will try this
Edit: I just want text no background
I did not comprehend.

Care to explain what you mean ?

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 6th 2014, 2:20 am

Just like a drop down with a list of texts no image etc.

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 2:24 am

scratch

add this :
Code:
$(window).load(function() {
  var settings = {
  img : 'backgroud img for button',
  title : 'title of button'
  };
  if (_userdata["user_level"] == '1' || _userdata["user_level"] == "2") {
  $('.sceditor-group:last').after('<div class="sceditor-group"><a class="sceditor-button sceditor-button-message" title="'+settings["title"]+'"><div style="background:url('+settings["img"]+') no-repeat;"></div></a></div>');
  $('body').append('<div id="messageList" style="z-index:15;display:none;position:absolute;background:#fff;border:1px solid #ccc;padding:3px;"><div id="M1" class="listItem" style="cursor:pointer;">Message 1</div><div id="M2" class="listItem" style="cursor:pointer;">Message 2</div><div id="M3" class="listItem" style="cursor:pointer;">Message 3</div></div>');
 

$('.sceditor-button-message').click(function() {
  var display = $('#messageList').css('display');
  if (display == 'none') {
  var Y = $(this).offset().top;
  var X = $(this).offset().left;
  $('#messageList').show().offset({top:Y + 25,left:X});
  }
  else { $('#messageList').hide(); }
  });
 
  $('#M1').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 1',''); });
  $('#M2').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 2',''); });
  $('#M3').click(function() { $('#text_editor_textarea').sceditor('instance').insertText('Message 3',''); });
  $('.listItem').click(function() { $(this).parent().hide(); });
  }
});


Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 6th 2014, 2:25 am

What part do I edit to make the list of texts?:/

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 2:28 am

Replace your last code in javascripts management.

At the bottom I have written the functions for when you click the list items. They're marked with the ID #M1, #M2, #M3. In the instance 'insertText' you'll see 'message 1' that is the texts you edit.

You can also edit the list itself, it is appended from the body.

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Sir. Mayo on March 6th 2014, 4:08 pm

Does this work on all forum types? Or just phbb3?

Sir. Mayo
Forumember

Male Posts : 969
Reputation : 87
Language : English, Some french.
Location : Working 11Pm-7Am EST I will try to respond ASAP

http://sir-mayo.forumotion.com/

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 4:13 pm

If the forum contains the SCEditor it should work. The list is a bit different from my actual project since I didn't include the full style for this.

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by ddoesmc on March 6th 2014, 9:40 pm

Topic Solved:wouhou:
Thanks to all!

ddoesmc
Forumember

Male Posts : 283
Reputation : 10
Language : Mainly english
Location : New Jersey

http://www.officialmc.forumotion.com

Back to top Go down

Solved Re: How do you add a custom button for staff only to the message editor?

Post by Ange Tuteur on March 6th 2014, 10:19 pm

Welcome Smile

Topic solved and archived

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