Please login or register. Welcome to the Studio, guest!


Quick Links:


newBookmarkLockedFalling

crazynarutard

crazynarutard Avatar

*****
Senior Studio Member

1,470


August 2005
Written by CrAzY_J and most not be redistributed without his permission.


A basic idea on how to make a admin editable code.
Now you have to know the basics of javascript to understand this tutorials, I'm not going through everything.
This tutorial is not a step by step guide on how to make a code, but to basically give you an idea on how it's done.


Let's say we want to make a admin editable PM bar, first thing to know is where will the PM bar code be placed?
the main footers, the global footers or the board footers. Most likely it will be the global footers.
Now, the url to the global footers page is, "/index.cgi?action=headersfooters2&id=*".

A small part on how to make a new page: you can make a new page by just typing it in, in your address bar of your browser.
For example, if you go to viewprofile page, add "&whateveryouwant" to it and the page will remain the same, but the url is different.
So that's how a new page is made.

So we're going to make a new page for the PM bar from the global headers and footers page. So the url looked like this "headersfooters2&id=*".
All we need to do is add anything you find in a valid/normal url in there. Here we're going to add "&pmbararea".
Now the url should look like this: "/index.cgi?action=headersfooters2&id=*&pmbararea".
So if you just type that in your address bar you will see the normal headers and footers page, so we will need to modify this.

Now the coding start, if you don't know how to check the location of where the user is currently browsing, here's a part:

if(location.href.match(/URL CHECK/)){


So we want to edit the PM page which looks like the normal global headers and footers page, so we will need to make sure we
only edit that page and nowhere else. so in the "URL CHECK" you just add "&pmarea".
Now to edit the page, we will want to remove the tables with all the textareas and stuff like that right?

WRONG, you need to HIDE them and not remove them. Why not remove but hide?
Well we will need the headers (because we're working with a PM bar) textarea to change all the stuff(don't worry I'm going deeper on this).
When once makes a normal PM bar, he saves all the data in the global headers, so he will probably have some variables for the PM images and stuff like that.
Now the idea of a admin editable hack, is that the user of the code (the admin/gmod) does not have to go to the headers/footers area >> look for the code in the headers >> change the url of the image, whenever he wants to change it.
No, he will just need to go to a page where everything is ready for him, and that's what we're going to do.
We're going to put some new tables in the "pmbar area" with some nice text fields for the URLs to be put in, and how do we save the data of this?
Simple, we take the headers textarea and replace the variable of the images and replace it with the new url the user has put into the textfields we made for him.
still dint quite get it? Don't worry, you'll develop once reading through.

So the key is to HIDE the table, here's the code to do this
<script type='text/javascript'>
var table=document.getElementsByTagName("table");
for(t=4;t<table.length;t++){
table[t].style.display="none";
}</script>

What this code does, is it start at the FIFTH table,"for(t=4" means it starts counting from 5, it skips the first 4,and then hides the all the rest of the tables.
Now there's nothing but the menu bar and banner etc... So start making a table (I hope this can be done by yourself) and make some textfields (<input type='text'>).
Be sure to give the text fields some nice IDs, so we can grab the value of them later.
If you don't know what the text fields are for yet, they are for the URLs of the images to be put in, or w/e a PM bar needs.

I kinda missed this part, but I'll tell you it now. You will need to make a normal PM bar for this of course, and add it to the headers. Make sure the variable names are a bit unique.

Now for the last part of the code, a function to change the data. This function will be called when you click on a button, so i hope you have added a button in the pmarea page where you had added some textfields.
Here's an idea on how to call a function: <input type='button' value='your button value' onClick='functionname()'>
You will of course have to change that to your likings.
Making the function is the only hard part of this code, what the function needs to do is, grab all the data from the textfields (the on you made with the ID's) and put that new data in the global headers (where the PM bar code is).
Now we can't just add the data to the headers textarea, we need to replace the variables where the original data is.
Here's a example. Say we have these variables in the global headers, they belong to your PM bar:


var one_new_message_image="Url for one new message image";
var alot_new_message_image="Alot new message image";


So in this case we need 2 textfields that you made, on for "one_new_message_image" and the other for "alot_new_message_image".
Grab the values of the 2 textfields (that's why i said to give them ID's, to make this part easier).
To replace those 2 variables i just posted, you will need to grab the textarea of the global header.
For this part you need to know abit about forms and stuff, the header textarea with the name "header" is under the first form (which is without a name). so to access this
we will need to use "document.forms[0].header.value" That will be the value of the header textarea where the variables are in.
Now you need to replace the 2 variable with "replace()", with the 2 text fields values.

document.forms[0].header.value=document.forms[0].headers.value.replace(/var one_new_message_image=".+?"/,'var one_new_message_image="'+the value of the text field, the one with the ids ;)'+"');


That basically how you do it. Do the same for the other variables you wish to replace with the textfields values you made.

So now we're done with the function? Well what happens if we click the button??
NOTHING, we need to add one more thing to the function.
document.forms[0].submit()

What does part does is submit the first form, which is the form used to save the headers and footers.
So if the variables in the header are replaces and it's saved, that means it has the same affect as if you would go to the
headers and footers and replace the values yourself.
That's how admin editable codes work.
Now you will need to add a link to the admin area to the pmarea page.


I really hope this helped some of you, of course like i said, this is not a guide on how to make a admin editable code.
But a simple tutorial to give you a IDEA on how it's done.
So i advice you now to read some admin editable code, Kenshin's PB theater or even Moose's ADMIN EDITABLE PM BAR CODE !!.

cheers :)


Last Edit: Sept 23, 2005 1:20:46 GMT by Team Studio

hpmad

hpmad Avatar



858


September 2005
This is great... good job crazy!

tenkabuto

tenkabuto Avatar

****
Senior Member

420


January 1970
Excellent! You'll see admin hacks from me soon. ;)

Chris

Chris Avatar

******
Head Coder

19,519


June 2005
Still say you aren't ready for admin editable TK :-/ But if you can comprehend that, then you can go ahead.

ChrisS

ChrisS Avatar
RIP Personal Text. . . . .

***
Dedicated Member

232


August 2005
Is there many Admin hacks these days are is it just me ?

I Stand Here With My Views

Chris

Chris Avatar

******
Head Coder

19,519


June 2005
There's quite a few now adays, just only one here.


Last Edit: Sept 12, 2005 18:46:21 GMT by Chris

Zero Insanity

Zero Insanity Avatar
Show Me Ya Moves!

****
Senior Member

493


August 2005
Great job CrAZy_J!! You will see some new codes from me now. :)

Moose

Moose Avatar

****
Senior Member

449


August 2005
sonicxx said:
Great job CrAZy_J!! You will see some new codes from me now. :)

Oh for the love of God! >_>
Greg says:
Coding music...
Greg says:
Hmm...
Greg says:
I wouldn't rule it out. :P
Chris 3.0 [New features? Yes.] says:
:P
Greg says:
If you think about machine code it's a bunch of 1s and 0s
Chris 3.0 [New features? Yes.] says:
Anything is possible.
Greg says:
Yeah try to code Metallica
Chris 3.0 [New features? Yes.] says:
:P Yeah, I'll get right on that... right after I learn to fly.

Zero Insanity

Zero Insanity Avatar
Show Me Ya Moves!

****
Senior Member

493


August 2005
... :(

Moose

Moose Avatar

****
Senior Member

449


August 2005
I was kidding SonicX.

And as for my PM marker, please don't rip it just look at methods. That isn't my best hack, Star Gaze is and Falcon will be now. :P Falcon > All until the RPGs come out. XD I think Falcon will be done way before them. :P
Greg says:
Coding music...
Greg says:
Hmm...
Greg says:
I wouldn't rule it out. :P
Chris 3.0 [New features? Yes.] says:
:P
Greg says:
If you think about machine code it's a bunch of 1s and 0s
Chris 3.0 [New features? Yes.] says:
Anything is possible.
Greg says:
Yeah try to code Metallica
Chris 3.0 [New features? Yes.] says:
:P Yeah, I'll get right on that... right after I learn to fly.

Vanagew

Vanagew Avatar

*
New Member

5


September 2005
WOW! Had to miss out most of the CSS rubbish in there, hard of reading for my tired eyes




Fear/Keep your distance from Vanagew (level-87)/ 3 more options

Team Studio

Team Studio Avatar

******
Administrator

120


June 2005
vanagew said:
WOW! Had to miss out most of the CSS rubbish in there, hard of reading for my tired eyes


:-/

It's javascript vanegew..

Kahless™

Kahless™ Avatar
Coding noob

****
Senior Member

280


October 2005
Sweet tutorial Cj Im now attempting my own admin hack :P, that tutorial is great
"In the end, we will not remember the words of our enemies, but the silence of our friends." Martin Luther King


dja

dja Avatar

*
New Member

24


February 2006
I'm almost finnished with my first admin hack :)

11823
Guest
Very good tutorial Crazy :)

newBookmarkLockedFalling