Oficjalne forum pomocy serwisu PUN.pl

Niestety, nikt nie powie Ci czym jest FluxBB - musisz go poznać sam!

Nie jesteś zalogowany na forum.

#1 2013-07-28 13:06:35

Baczus
Użytkownik
Skąd: ten spam?
Dołączył: 2010-02-25
Liczba postów: 448
WWW

Zaawansowany Generator Kart Postaci

Witam!

Dzisiaj zacząłem bawić się z generatorem do swojego najnowszego forum, nad którym wciąż pracuję. Pomyślałem, że jest to świetny moment, aby udostępnić wam jeden z najlepszych kodów, do którego uzyskałem uprawnienia. Ten kod jest dość trudny (jak się może zdawać na początku) jednak jeśli macie jakieś pojęcie o języku Java Script to po kilkunastu minutach pracy z nim będziecie w stanie przerobić go do potrzeb waszych forum.

Zaczynając od podstaw, to generatory kart postaci najlepiej tworzyć na Dodatkowych Stronach, które tworzymy w:
Administracja > Dodatki > Dodatkowe strony
Po założeniu takowej strony możemy zająć się kodem i dostosować go do naszych potrzeb.

A oto kod:

<form id="form" onsubmit="return false;">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="91%" id="AutoNumber1" height="1">
<title>
Karta postaci
</title>
</head>
<body>
<div id="main">
<div id="lewo">
<form action="index.php" method="post">
<table border="0">

<tr><td class="prawy">
Nagłówek
</td></tr>
<tr><td class="lewy">
<input type="text" name="Nagłówek" size="75" id="n1" /></input>
</td></tr>

<tr><td class="lewy">
Wpisz:
</td>
<td><input type="text" name="Wpisz" />
</td></tr>

<tr><td class="lewy">
Wybór:
</td><td>
<select name="Wybór">
<option>opcja 1</option>
<option>opcja 2</option>
<option>opcja 3</option>
<option>opcja 4</option>
</select>
</td></tr>

<tr><td class="lewy">
Bez zmiany:
</td><td>
<input type="text" disabled="disabled" name="Bez zmiany" value="Wpisane" />
</tr></td>

<tr><td colspan="2">
<input type="submit" value="Zatwierdź" onclick="generator();" />
<br />
</td></tr>
</table>
</form>

</div>

<div id="prawo">
</div>
</div>

<script type="text/javascript">
function generator() {

//////////////////////////////////
////// USTAWIENIA SKRYPTU ////////
//////////////////////////////////

// pamiętaj, że atrybut name pola formularza
// jest jednocześnie nazwą wyświetloną w oknie

// tekst wyświetlony na stronie nad elementami
// można używać HTML, przed każdym " lub ' umieść \ (backslash)
// cały tekst musi zostać umieszczony w jednej linijce
tekst = "";

// USTAWIENIA WYGLĄDU STRONY

// kolor tekstu (RGB lub angielska nazwa)
kolor = "KOLOR_CZCIONKI";

// wielkość czcionki (wyrażona w px)
wielkosc = "WIELKOŚĆ_CZCIONKI";

// tło strony (RGB lub angielska nazwa)
// możesz podać tło obrazkowe, np.: #ffffff url()
tlo = "#ffffff url(LINK_DO_OBRAZKA_TŁA)";

// rozmiary wyskakującego okna (bez cudzysłowiów)
szerokosc = W_PX;
wysokosc = W_PX;




//////////////////////////////////
///////// WŁAŚCIWY KOD ///////////
//////////////////////////////////

form = document.getElementById("form");
ile = form.length;

strona = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"";
strona += "\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">";
strona += "<html xmlns=\"http://www.w3.org/1999/xhtml\">";
strona += "<head>";
strona += "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-2\" />";
strona += "<style type=\"text/css\">body { padding: 20px; color:" + kolor + "; font: " + wielkosc + " Verdana, sans-serif; background:" + tlo + "; } a { color:" + kolor + "; }</style>";
strona += "<title>";
strona += "Generator kart postaci";
strona += "</title>";
strona += "</head>";
strona += "<body>";
strona += tekst;

for (i = 0; i < (ile - 1); i++) {

nazwa = form.elements[i].name;
wartosc = form.elements[i].value;

strona += nazwa + ": " + wartosc + "<br />";

}

strona += "<br />";
strona += "</body>";
strona += "</html>";

ustawienia = "width = " + szerokosc + ", height = " + wysokosc + ", left = 50, top = 50, location = no";

window1 = window.open("", "Nowe okno", ustawienia);
window1.document.write(strona);

form.reset();
}
</script>
</body>
</html>

Jak widać jest to generator rozróżniający cztery metody nanoszenia tekstu do nowej karty:
- Nagłówek - czyli po prostu tekst, który zostanie wpisany, a nie jest wyznacznikiem atrybutu, np. posiadanej magii przez gracza.
- Wpisz - jest to typowy sposób wprowadzenia tekstu do naszej karty, poprzez wprowadzenie go przez użytkownika bezpośrednio. Jednak posiada on dwa pola, w którym jeden jest wyznacznikiem co to ma opisać, np. Imię , a drugie to tego opis, np. Damian.
- Wybór - jest to opcja ograniczająca nam nieco możliwy do wpisania tekst, ponieważ możemy tylko dokonać wyboru, miedzy istniejącymi opcjami. Jednak posiada on dwa pola, w którym jeden jest wyznacznikiem co to ma opisać, np. Płeć , a drugie to co nam to opisuje, za pomocą tego, co możemy wybrać, np. Mężczyzna lub Kobieta.
- Bez zmiany -  jest to opcja całkowicie ograniczająca nam możliwy do wpisania tekst, ponieważ nie możemy dokonać wyboru, miedzy istniejącymi opcjami, ani wpisać samemu. Jednak to pole także posiada dwa pola, w którym jeden jest wyznacznikiem co to ma opisać, np. Ranga , a drugie to co nam to opisuje, za pomocą tego, co nam zostało przypisane np. Nowicjusz

Istnieje pewne ale jeśli chodzi o Nagłówki. Jak widzicie w kodzie są im przypisywane pewne zmienne ( id ) w naszym przypadku jest to "n1". Istnieje ona w celu zablokowania możliwości wpisania tekstu przy zmiennej. Aby spełniała ona swoją powinność, musimy zablokować tą opcją, poprzez wstawienie takiego kodu do stopki:

<style type="text/css">
input#n1 { display: none; }
</style>

W przypadku nie korzystania z nagłówka, ten kod jest zbędny.

Gdy już utworzymy odpowiednio skonfigurowany generator, nie zapomnijmy dodać gdzieś odnośnika do niego, ponieważ jeśli o tym zapomnimy, to dla zwykłych graczy będzie on niewidzialny (nie będą o nim wiedzieć). Możemy to zrobić poprzez podanie linku przy wątku do zakładania Kart Postaci albo dodać go jako dodatkowe odnośnik w menu.

Dziękuję za uwagę [dblpt])

Ostatnio edytowany przez Baczus (2014-01-06 22:50:18)

Offline

Użytkowników czytających ten temat: 0, gości: 1
[Bot] claudebot

Stopka

Forum oparte na FluxBB

Darmowe Forum
nowydom - plugidwuskibowerpgedition - mythofempire - forumdream - forum-xytheria2