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.

Custom Button

View previous topic View next topic Go down

Solved Custom Button

Post by Azi on February 16th 2013, 6:48 pm

Yes, i was wondering, on my old forum(vB), i could make buttons and execute what i want them to do pretty easily.

I wanted to know if i could make a custom button for mod+ that is just like the [b][i][u] buttons and it will just post a template we use which is kinda tedious to keep posting and posting [class table]. If someone could help me find this it would be awesome,

I don't need it in the nav bar, i need it next to all the posting options,

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Sanket on February 16th 2013, 7:58 pm


Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 16th 2013, 8:18 pm

Well, the only issue now is.

The code,

Code:
(function(){var f={add:function(c,d,b){$(function(){if(document.getElementById("html_edit")){void 0==b&&(b="");var a=document.createElement("span");a.innerHTML='<button class="button2" style="height: 22px; margin-right: 5px;" onClick="bbfontstyle(\''+d+"', '"+b+"'); return false;\">"+c+"</button>";document.getElementById("new_buttons_area").appendChild(a)}})},list:function(c,d,b){$(function(){if(document.getElementById("text_edit")){var a=document.createElement("span");a.innerHTML='<input type="button" style="height: 22px; margin-right: 5px;" value="'+ c+'" onclick="selectWysiwyg(this, \''+b+'\');" class="button2">';document.getElementById("new_buttons_area").appendChild(a);a=document.createElement("div");a.id=b;a.className="select";a.style.visibility="hidden";for(var e in d)a.innerHTML=/,/.test(d[e])?a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e].replace(/(.*),.*/,"$1")+"', '"+d[e].replace(/.*,(.*)/,"$1")+"');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>"): a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e]+"', '');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>");document.getElementById("text_editor_select_controls").appendChild(a)}})},init:function(){$(function(){if(document.getElementById("html_edit")){var c=document.createElement("div");c.id="new_buttons_area";c.style.paddingTop="5px";document.getElementById("html_edit").parentNode.insertBefore(c,document.getElementById("html_edit").nextSibling)}})}}; window.buttons=f;f.init()})();
buttons.add('Award', '[table class="award"][tr][td][b][color=CHANGEME]Resolved & Thread Locked!
[/td][/tr][/table][/b][/color]');

it works and i see the button, > http://img.chaosera.net/RUHxJ.jpg But, i want it to match the 'other' button aswell, meaning, next to it. The other issue is that when i click my new button, award, it just redirects me to the advanced post link and doesn't post the code that i called for next to 'award' and is there a way to make this only viewable by moderators +?

and http://img.chaosera.net/elXSk.jpg, i really want this button to be before the close tags. ive been tinkering with it and removed the others but how do i format it over to look uniform with the other bottons

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 16th 2013, 9:09 pm

Rideem please read the post before you post one sentence, that didn't help at all unfortunetly.

The issue isn't formatting it, i need it to work lol. Ive double checked the code its flawless, i don't know why when i click 'award' it doesn't give me the output code i need it to

The issue at hand really is that i click the 'Award!' (http://img.chaosera.net/Xce8U.jpg) button i've put in, but when i click it, it simply redirects me to the advanced posts settings and doesn't input any kind of code

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 5:09 pm

bump

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 5:29 pm

Rideem3 wrote:I have read the post. One sentence was enough to solve your problem as it has solved many others before. Are you sure you have changed every instance of new_buttons_area ?

Yes, you can look over the new code, i ctrl f'ed new_ and changed all to 'text_edit'

Code:
(function(){var f={add:function(c,d,b){$(function(){if(document.getElementById("html_edit")){void 0==b&&(b="");var a=document.createElement("span");a.innerHTML='<button class="button2" style="height: 22px; margin-right: 5px;" onClick="bbfontstyle(\''+d+"', '"+b+"'); return false;\">"+c+"</button>";document.getElementById("text_edit").appendChild(a)}})},list:function(c,d,b){$(function(){if(document.getElementById("text_edit")){var a=document.createElement("span");a.innerHTML='<input type="button" style="height: 22px; margin-right: 5px;" value="'+ c+'" onclick="selectWysiwyg(this, \''+b+'\');" class="button2">';document.getElementById("text_edit").appendChild(a);a=document.createElement("div");a.id=b;a.className="select";a.style.visibility="hidden";for(var e in d)a.innerHTML=/,/.test(d[e])?a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e].replace(/(.*),.*/,"$1")+"', '"+d[e].replace(/.*,(.*)/,"$1")+"');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>"): a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e]+"', '');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>");document.getElementById("text_editor_select_controls").appendChild(a)}})},init:function(){$(function(){if(document.getElementById("html_edit")){var c=document.createElement("div");c.id="text_edit";c.style.paddingTop="5px";document.getElementById("html_edit").parentNode.insertBefore(c,document.getElementById("html_edit").nextSibling)}})}}; window.buttons=f;f.init()})();
buttons.add('Award!', '[table class="award"][tr][td][color=CHANGEME][b]Awarded & Thread Locked![/b][/color]
[/td][/tr][/table]');

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 5:38 pm

Code:
(function(){var f={add:function(c,d,b){$(function(){if(document.getElementById("html_edit")){void 0==b&&(b="");var a=document.createElement("span");a.innerHTML='<button class="button2" style="height: 22px; margin-right: 5px;" onClick="bbfontstyle(\''+d+"', '"+b+"'); return false;\">"+c+"</button>";document.getElementById("html_edit").appendChild(a)}})},list:function(c,d,b){$(function(){if(document.getElementById("html_edit")){var a=document.createElement("span");a.innerHTML='<input type="button" style="height: 22px; margin-right: 5px;" value="'+ c+'" onclick="selectWysiwyg(this, \''+b+'\');" class="button2">';document.getElementById("html_edit").appendChild(a);a=document.createElement("div");a.id=b;a.className="select";a.style.visibility="hidden";for(var e in d)a.innerHTML=/,/.test(d[e])?a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e].replace(/(.*),.*/,"$1")+"', '"+d[e].replace(/.*,(.*)/,"$1")+"');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>"): a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e]+"', '');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>");document.getElementById("text_editor_select_controls").appendChild(a)}})},init:function(){$(function(){if(document.getElementById("html_edit")){var c=document.createElement("div");c.id="html_edit";c.style.paddingTop="5px";document.getElementById("html_edit").parentNode.insertBefore(c,document.getElementById("html_edit").nextSibling)}})}}; window.buttons=f;f.init()})();
buttons.add('Award!', '[table class="award"][tr][td][color=CHANGEME][b]Awarded & Thread Locked![/b][/color]
[/td][/tr][/table]');

didn't change anything except break the script so no button appears at all;

Mind slamming this into your js manual entry and seeing if it works for you?

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 5:46 pm

Damn haha, i'm on my phone too, just looking over this script trying to figure it out. the text_edit worked, made the button, but didn't execute the code i told it to..

when you get home you figure you could try this script out? i'm thinking it might just have to do with the code i'm trying to get it to spit out..

EDIT:

So, upon more trouble shooting, i replaced the Html_edits back to text_edits and changed the output code from the [table class] to just 'monkey' and it works fine, that being said, the issue is the code i'm trying to make it execute but it doesn't get it. I can work around this and make a seperate code or something.

The next issue that really is all thats left is how to make this button EXCLUSIVE to moderators and admins only; NOT members

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 6:22 pm

I'm a bit confused now..

I didn't think widgets could create buttons on the quick reply bar.

i removed the button.add(http://img.chaosera.net/Pb8KB.jpg) from the Javascipt manual entry,

then i added that code you gave me into a new widget, http://img.chaosera.net/pgcHs.jpg, i get the permissions, but i don't see how this creates a button that will feed it what i need scratch

of course though, when i click save, all it shows is the new displayed widget, which i can't click on, etc( http://img.chaosera.net/vxKfF.jpg )


Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 6:35 pm

Code:
(function(){var f={add:function(c,d,b){$(function(){if(document.getElementById("text_edit")){void 0==b&&(b="");var a=document.createElement("span");a.innerHTML='<button class="button2" style="height: 22px; margin-right: 5px;" onClick="bbfontstyle(\''+d+"', '"+b+"'); return false;\">"+c+"</button>";document.getElementById("text_edit").appendChild(a)}})},list:function(c,d,b){$(function(){if(document.getElementById("text_edit")){var a=document.createElement("span");a.innerHTML='<input type="button" style="height: 22px; margin-right: 5px;" value="'+ c+'" onclick="selectWysiwyg(this, \''+b+'\');" class="button2">';document.getElementById("text_edit").appendChild(a);a=document.createElement("div");a.id=b;a.className="select";a.style.visibility="hidden";for(var e in d)a.innerHTML=/,/.test(d[e])?a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e].replace(/(.*),.*/,"$1")+"', '"+d[e].replace(/.*,(.*)/,"$1")+"');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>"): a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e]+"', '');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>");document.getElementById("text_editor_select_controls").appendChild(a)}})},init:function(){$(function(){if(document.getElementById("text_edit")){var c=document.createElement("div");c.id="html_edit";c.style.paddingTop="5px";document.getElementById("text_edit").parentNode.insertBefore(c,document.getElementById("text_edit").nextSibling)}})}}; window.buttons=f;f.init()})();
buttons.add('Award!', '[table class="award"][tr][td][color=CHANGEME][b]Awarded & Thread Locked![/b][/color]
[/td][/tr][/table]');
This <<<<< is the javascript manual entry that WORKS but the
Code:
 '[table class="award"][tr][td][color=CHANGEME][b]Awarded & Thread Locked![/b][/color]
[/td][/tr][/table]');
does NOT work, if i replace this section with monkey or killhumans it will spit it out, just not that [table class]

As for the widget, i don't really understand, i created a new widget, named it Award, put the <script> tags in it, assigned the first variable, and the variable i want it to say
Code:
[table class="award"][tr][td][ color=CHANGEME][b]Awarded & Thread Locked![/b][/color]
[/td][/tr][/table]
(http://img.chaosera.net/lXesq.jpg>>) but that just made the widget on the right and no buttons,

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 6:45 pm

when i put this new script in, i definitely got a button, but its messed up and does the exact same thing the javascript manual entry did, i click the button, get redirected to www.mywebsite.forumotion.com/post.

The script in the widget seems right, http://img.chaosera.net/ov8N6.jpg

and the updated javascript is
Code:
(function(){var f={add:function(c,d,b){$(function(){if(document.getElementById("text_edit")){void 0==b&&(b="");var a=document.createElement("span");a.innerHTML='<button class="button2" style="height: 22px; margin-right: 5px;" onClick="bbfontstyle(\''+d+"', '"+b+"'); return false;\">"+c+"</button>";document.getElementById("text_edit").appendChild(a)}})},list:function(c,d,b){$(function(){if(document.getElementById("text_edit")){var a=document.createElement("span");a.innerHTML='<input type="button" style="height: 22px; margin-right: 5px;" value="'+ c+'" onclick="selectWysiwyg(this, \''+b+'\');" class="button2">';document.getElementById("text_edit").appendChild(a);a=document.createElement("div");a.id=b;a.className="select";a.style.visibility="hidden";for(var e in d)a.innerHTML=/,/.test(d[e])?a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e].replace(/(.*),.*/,"$1")+"', '"+d[e].replace(/.*,(.*)/,"$1")+"');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>"): a.innerHTML+("<button onmouseout=\"this.className='';\" onmouseover=\"this.className='selectHover';\" onclick=\"bbfontstyle('"+d[e]+"', '');selectWysiwyg(this, '"+b+"');return false;\">"+e+"</button><br>");document.getElementById("text_editor_select_controls").appendChild(a)}})},init:function(){$(function(){if(document.getElementById("text_edit")){var c=document.createElement("div");c.id="html_edit";c.style.paddingTop="5px";document.getElementById("text_edit").parentNode.insertBefore(c,document.getElementById("text_edit").nextSibling)}})}}; window.buttons=f;f.init()})();
which all seems well, now that i took button.add onward and deleted it, but i still get this messed up button that doesn't spit it out.


http://img.chaosera.net/bGngH.jpg

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 7:28 pm

Rideem3 wrote:Right. You'll have to have a simple button. Such as:
Code:
button.add('Bump', 'Bump');

I'm still working on a patch.

ah, you're still working on a patch to put more complex bbcodes?

so as of now this whole [table class] won't work? haha should've told me that

Evil or Very Mad Evil or Very Mad Evil or Very Mad Evil or Very Mad Evil or Very Mad Evil or Very Mad

thanks anyways haha, i'll be waiting until thats done and hopefully i can make this button work! ^_^

Thanks for all your help

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

Back to top Go down

Solved Re: Custom Button

Post by Azi on February 18th 2013, 7:44 pm

Rideem3 wrote:Right. So is this solved for now?

I'll post in the tutorial topic when I make the patch. Wink

nah, this wasn't really resolved in the slightest but based on what you're saying, its not possible right now until you make the patch.

Azi
Forumember

Female Posts : 61
Reputation : 1
Language : English/Russian

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