Staff Options

[Kaizer Lee]

Alright, first off, I'd just like to state that all the Javascript codes I used do not conflict with each other so it's a bit vague to me why the sudden change of the Table code on the same script won't work since it's adding an extra button code to your forum.

As for that, in case you would ask what are the Javascript in my forum, the following stated are the codes:

1. Rainbow name code
2. Christmas decoration code
3. Staff options
4. The modified profile code which introduces people automatically
5. Select content code
6. The custom navigation bar code
7. Nivo slider

http://www.medievalchaos.net/forum In case you need my forum link.

Okay, now here's the problem, I'd like for these codes to work on my Staff options code:

Code:

[table style="background: url('http://i810.photobucket.com/albums/zz27/kaizer20/Information-2_zpsd6d5163c.png') no-repeat left center #cfdce8; border: 1px solid #b8c5d0; padding: 5px 5px 5px 30px; width: 97%; font-weight: bold; color: #26547a; border-radius: 3px;"][tr][td](Information)
[/td][/tr][/table]

Code:

[table style="background: url('http://i810.photobucket.com/albums/zz27/kaizer20/lock_zps4a88582b.png') no-repeat left center #d7e2b7; border: 1px solid #b7c19a; padding: 5px 5px 5px 30px; width: 97%; font-weight: bold; color: #626f3d; border-radius: 3px;"][tr][td](Lock)[/td][/tr][/table]

Code:

[table style="background: url('http://i810.photobucket.com/albums/zz27/kaizer20/WarningSign-2_zps143f18bd.png') no-repeat left center #F2C7C7; border: 1px solid #ED6B6B; padding: 5px 5px 5px 30px; width: 97%; font-weight: bold; color: #A11F1F; border-radius: 3px;"][tr][td](Warn a member)[/td][/tr][/table]

Code:

[table style="background: url('http://i810.photobucket.com/albums/zz27/kaizer20/Smiley_Face-2_zps5eabd338.png') no-repeat left center #ffff7f; border: 1px solid #ffff30; padding: 5px 5px 5px 30px; width: 97%; font-weight: bold; color: #ffcd05; border-radius: 3px;"][tr][td]Approved by a pro staff!
[/td][/tr][/table]

Whenever I replace the codes in the original Staff Options code in the widget here:

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Info": "<table style='background:url\(http://i810.photobucket.com/albums/zz27/kaizer20/Information-1.png\) no-repeat; font-family:verdana; font-weight:bold; font-size:13px; color:#000; text-align:left; padding-left:5px; width:500px; height: 75px; text-shadow: 1px 1px #808080;' align='center'><tr><td style='line-height:16px;' valign='top' align='center' width='100%'><br />\(YOUR TEXT HERE\)</td></tr></table>",
    "Solved and Locked": "<table style='background:url\(http://i810.photobucket.com/albums/zz27/kaizer20/checkmark-1.png\) no-repeat; font-family:verdana; font-weight:bold; font-size:25px; color:#FFFFFF; text-align:left; padding-left:5px; width:500px; height: 75px; text-shadow: 1px 1px #808080;' align='center'><tr><td style='line-height:16px;' align='left'></td></tr></table>",
    "Approved": "<table style='background:url\(http://i810.photobucket.com/albums/zz27/kaizer20/Smiley_Face-1.png\) no-repeat; font-family:verdana; font-weight:bold; font-size:25px; color:#FFFFFF; text-align:left; padding-left:5px; width:500px; height: 75px; text-shadow: 1px 1px #808080;' align='center'><tr><td style='line-height:16px;' align='left'></td></tr></table>",
    "Warning": "<table style='background:url\(http://i810.photobucket.com/albums/zz27/kaizer20/WarningSign-1.png\) no-repeat; font-family:verdana; font-weight:bold; font-size:13px; color:#fff; text-align:left; padding-left:5px; width:500px; height: 75px; text-shadow: 1px 1px #808080;' align='center'><tr><td style='line-height:16px;' valign='top' align='center' width='100%'><br />\(Who will you give the warning to and then please indicate the following steps to be done to avoid the mistake in the future BELOW the warning sign\)</td></tr></table>"
}, "bbcode_list_1");</script>

The button completely disappears.

I tried modifying the Javascript but still nothing happened:

Code:

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

I really don't get why it won't appear because [Language] far as I know, it would be the same result even if you change the code originally inputted over and over again.

To summarize everything up, please help me how I can make the 4 table codes provided above work on the original code in the widget and the javascript already. I've been trying to solve this for some time but my capacity to solve it isn't enough.

[Kaizer Lee]

Bumpalala Bumpalala

[Kaizer Lee]

Bump.

[Kaizer Lee]

Bumpidy bumpidy bump

[Kaizer Lee]

Bump...

[Kaizer Lee]

Bump e.e

[Kaizer Lee]

Yeah, that one, the main problem with it now is that I want to change the content of the option but when I did, the Button didn't appear anymore.

I checked the JS and I didn't see anything wrong with it, I got the cached and cookies cleared too, so I really have no clue what's wrong with it anymore :|.

[Kaizer Lee]

Bump.

[Kaizer Lee]

When I tried the sample code you gave, the only thing that appeared is a text box with no color and picture.

And I completely lost you with the whole escape thing ._.

[Kaizer Lee]

Yeah, I had it solved by LG once so that's the code that appeared now.

And I tried doing it in a post first, still the same.

[Kaizer Lee]

Bump

[Kaizer Lee]

Alright, please don't lock this topic yet. I'll try something out first .

[Kaizer Lee]

Okay, staff options won't appear O_o. I made it into a class and still nothing:

Here's my widget code:

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Info": "<table class="info"><tr><td align="left">(Information)
</td></tr></table>",
    "Solved and Locked": "<table class="lock"><tr><td align="left">(Lock)</td></tr></table>",
    "Approved": "<table class="approve"><tr><td align="left">Approved by a pro staff!
</td></tr></table>",
    "Warning": "<table class="warn"><tr><td align="left">(Warn a member)</td></tr></table>"
}, "bbcode_list_1");</script>

Here's my CSS, I made it a class as you suggested:

Code:

.lock {
  background: url('http://i810.photobucket.com/albums/zz27/kaizer20/lock_zps4a88582b.png') no-repeat left center #d7e2b7;
  border: 1px solid #b7c19a;
  padding: 5px 5px 5px 30px;
  width: 97%;
  font-weight: bold;
  color: #626f3d;
  border-radius: 3px;
}

.approve {
  background: url('http://i810.photobucket.com/albums/zz27/kaizer20/Smiley_Face-2_zps5eabd338.png') no-repeat left center #ffff7f;
  border: 1px solid #ffff30;
  padding: 5px 5px 5px 30px;
  width: 97%;
  font-weight: bold;
  color: #ffcd05;
  border-radius: 3px;
}

.warn {
  background: url('http://i810.photobucket.com/albums/zz27/kaizer20/WarningSign-2_zps143f18bd.png') no-repeat left center #F2C7C7;
  border: 1px solid #ED6B6B;
  padding: 5px 5px 5px 30px;
  width: 97%;
  font-weight: bold;
  color: #A11F1F;
  border-radius: 3px;
}

Here's my Javascript:

Code:

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

I don't know why it's not appearing, please help D:. Thanks in advance.

Edit:

Is there anyway that when I click it, the thing will appear as a [td] instead of a <td>?

[PENSAR.]

SO I don't get what are this Staff options.. like buttons only for staff?

[Kaizer Lee]

Widget code: Marked as non-table type in case.

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Info": '<table class="info"><tr><td align="left">(Information)
</td></tr></table>',
    "Solved and Locked": '<table class="lock"><tr><td align="left">(Lock)</td></tr></table>',
    "Approved": '<table class="approve"><tr><td align="left">Approved by a pro staff!
</td></tr></table>',
    "Warning": '<table class="warn"><tr><td align="left">(Warn a member)</td></tr></table>'
}, "bbcode_list_1");</script>

[Kaizer Lee]

None would still appear =/. I already changed the error with the whole ILLEGAL issue (Literally caps in the format I saw) which is in syntax error to the class name I gave it. I changed it to the class="bit" instead and still, the button wouldn't appear and I still get this message:



Is this the cause of the problem as to why the Staff Options wouldn't appear? If yes, how do I get rid of it?

[Kaizer Lee]

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Information": '<table class="bit"><tr><td align="left">\(Infomation\)
</td></tr></table>',
    "Solved and Locked": '<table class="lock"><tr><td align="left">\(Lock)\</td></tr></table>',
    "Approved": '<table class="approve"><tr><td align="left">Approved by a pro staff!
</td></tr></table>',
    "Warning": '<table class="warn"><tr><td align="left">\(Warn a member\)</td></tr></table>'
}, "bbcode_list_1");</script>

I did that and still, the same problem, it wouldn't appear and the Illegal Token thing is still there.

[Kaizer Lee]

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Information": '<table class="bit"><tr><td align="left">\(Infomation\)
</td></tr></table>',
    "Solved and Locked": '<table class="lock"><tr><td align="left">\(Lock\)</td></tr></table>',
    "Approved": '<table class="approve"><tr><td align="left">Approved by a pro staff!
</td></tr></table>',
    "Warning": '<table class="warn"><tr><td align="left">\(Warn a member\)</td></tr></table>'
}, "bbcode_list_1");</script>

That and still nothing ._."

[Kaizer Lee]

Bump.

[Kaizer Lee]

Bump....

[Kaizer Lee]

I'm confused as to which class I should use ._.

[Kaizer Lee]

I already did though...

[Kaizer Lee]

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Information": '<table class="bit"><tr><td align="left">Information</td></tr></table>',
    "Solved and Locked": '<table class="lock"><tr><td align="left">\Lock</td></tr></table>',
    "Approved": '<table class="approve"><tr><td align="left">Approved by a pro staff!</td></tr></table>',
    "Warning": '<table class="warn"><tr><td align="left">Warn a member</td></tr></table>'
}, "bbcode_list_1");</script>

You meant these codes, right? I removed them. And they still have the same output (Like in the screen shot), is it in the JS?

[SLGray]

You left something - \Lock.

[Kaizer Lee]

Still the same :s

[SLGray]

Try leaving the \'s but remove the ()'s.

[Kaizer Lee]

Code:

<script type="text/javascript">
buttons.list('Staff Tools', {
    "Information": '<table class="bit"><tr><td align="left">Information</td></tr></table>',
    "Solved and Locked": '<table class="lock"><tr><td align="left">Lock</td></tr></table>',
    "Approved": '<table class="approve"><tr><td align="left">Approved by a pro staff!</td></tr></table>',
    "Warning": '<table class="warn"><tr><td align="left">Warn a member</td></tr></table>'
}, "bbcode_list_1");</script>

There's no more parenthesis... but yeah, still the same outcome, the codes appeared out of whack in the screen.

[Kaizer Lee]

Bump...

[Kaizer Lee]

bump...

[Kaizer Lee]

Bump ._."