Skocz do zawartości

Zdjęcie
* * * * * 1 głosy

kolejny raz thanks 3.9.1


Najlepsza odpowiedź Yeoman, 01 kwietnia 2014 - 14:12

Ok zbadałem ten przypadek z braku zajęcia :)

 

 

thx.php

if(!$b) {
	$post['thanks'] = "<a class=\"thanks\" id=\"a{$post['pid']}\" 
			      onclick=\"javascript:return thx({$post['pid']});\" 
			      href=\"showthread.php?action=thank&tid={$post['tid']}&pid={$post['pid']}\">Podziękuj</a>";
}
else if($mybb->settings['thx_del'] == "1") {
	$post['thanks'] = "<a class=\"removeThanks\" id=\"a{$post['pid']}\" 
			      onclick=\"javascript:return rthx({$post['pid']});\" 
			      href=\"showthread.php?action=remove_thank&tid={$post['tid']}&pid={$post['pid']}\">Nie dziękuj</a>";
}

Tutaj wywaliłem na dobre <img> i ustawiłem w linku treść, którą sprawdza się po odświeżeniu przykładowo.

Kolejną linijkę wywaliłem z xml'a (<image>)

$output = "<thankyou>
		<list><![CDATA[$list]]></list>
		<display>".($list ? "1" : "0")."</display>
		<del>{$mybb->settings['thx_del']}</del>
	   </thankyou>";
echo $output;

Usunąłem to bo przecież tego nie chcesz mieć, a tylko CSS.

Teraz pokaże co zrobiłem żeby tekst się zmieniał. Każdorazowo po kliknięciu leci nowe żądanie a więc przypisałem to tak:

 

thx.js

function thx_action(response)
{
	lin=thx_common(response)
	if(lin!=null)
	{
		lin.onclick= new Function("","return rthx("+pid+");");
		lin.href='showthread.php?action=remove_thank&pid='+pid;
		lin.textContent = "Nie dziękuj";
	}
}

function rthx_action(response)
{
	lin=thx_common(response)
	if (lin!=null) 
	{
		lin.onclick = new Function("", "return thx(" + pid + ");");
		lin.href = 'showthread.php?action=thank&pid=' + pid;
		lin.textContent = "Podziękuj";
	}
	
	
}

Dodałem do nich lin.textContent i jeśli klikniesz w link to wywołasz funkcję która ustawi tekst odpowiedni dla akcji.

 

Z tego pliku poleciało także to:

img = document.getElementById('i' + pid);
img.src = xml.getElementsByTagName('image').item(0).firstChild.data;

Powinno zadziałać. U mnie błędów nie ma.

 

Teraz tylko dodaj klasę do <a> i będziesz mógł stylowac swój button ;)

Przejdź do postu


23 odpowiedzi w tym temacie
  • Zaloguj się, aby dodać odpowiedź
nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 29 marca 2014 - 22:34

#1

Witajcie. Pomogliście mi z poprzednim problemem, mam nadzieję, że z tym będzie tak samo.

Otóż chciałem button thanksa zmienić na CSS, dobra, zrobiłem to, ale przy dawaniu podziękowania wyskakuje error, że nie istnieje src od IMG.

 

No i faktycznie nie istnieje, bo usunąłem obrazek, by działało na CSS. w pliku thx.js kod odpowiadający za to:

img = document.getElementById('i' + pid);
			img.src = xml.getElementsByTagName('image').item(0).firstChild.data;

no i pliku thx.php: 

$output = "<thankyou>
				<list><![CDATA[$list]]></list>
				<display>".($list ? "1" : "0")."</display>
				<image>{$mybb->settings['bburl']}/{$theme['imgdir']}/";
	
	if($mybb->input['action'] == "thankyou")
	{
		$output .= "postbit_rthx.gif";
	}
	else
	{
		$output .= "postbit_thx.gif";
	}
	
	$output .= "</image>
			  <del>{$mybb->settings['thx_del']}</del>	
			 </thankyou>";
	echo $output;

Dobra.

Po usunięciu tego kodu z thx.js działa jak należy, lecz nie do końca. Po kliknięciu w button nie wyskakują błędy, dodaje się podziękowanie (co jest plusem). Teraz tylko niestety nie zmienia się (jeśli mamy "podziękuj" - to gdy klikniemy w podziękuj nadal jest "podziękuj", a powinno być "nie dziękuj" Co może być nie tak?


  • 0

unbreak

    WT Elite

  • 1 937 postów
    • Czas spędzony online: 27d 8h 43m 36s
506
Znakomita!
  • Location/home/unbreak

Napisano 30 marca 2014 - 12:05

#2

Sorry, ale poruszyłeś w tym wątku tyle tematów że w końcu nie wiem co zrobiłeś, co chcesz zrobić, a co nie działa :)

 

Możliwe że to przemawia moje zmęczenie. Jak to chcesz zmienić obrazek na CSS? :D


  • 1

webDeveloper


Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 30 marca 2014 - 13:19

#3

Może po prostu nie usuwaj pliku obrazka a jedynie ukryj go za pomocą css ?


  • 1

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 30 marca 2014 - 14:54

#4

Może po prostu nie usuwaj pliku obrazka a jedynie ukryj go za pomocą css ?

masz na myśli display: none;?
  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 30 marca 2014 - 20:04

#5

Miedzy innymi tak :)


  • 1

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 30 marca 2014 - 21:05

#6

Miedzy innymi tak :)

 

Niestety nadal nie zmienia. 

 

Sorry, ale poruszyłeś w tym wątku tyle tematów że w końcu nie wiem co zrobiłeś, co chcesz zrobić, a co nie działa :)

 

Możliwe że to przemawia moje zmęczenie. Jak to chcesz zmienić obrazek na CSS? :D

 

Poruszyłem 1, w którym chcę zmienić, by zamiast buttonu w obrazku, był w CSS, ale gdy usunę <img> to w js (również podany) wyskakuje błąd. 

Po prostu nie odszukuje <img> - którego oczywiście nie ma - a chcę zamiast tego CSS, więc zmieniłem i pokazuje się owy błąd. 


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 31 marca 2014 - 06:35

#7

Czyli jak dasz :

display:none;

to skrypt nadal nie potrafi sobie odszukać obrazka czy po prostu go nie ukrywa ?

Jeśli CSS ukrywa go, a skrypt nie może go odczytać to będziemy inaczej kombinować, a jeśli po prostu ukrywanie za pomocą CSS nie działa poprawnie (a powinno) to też coś wymyślimy.


  • 1

2ed58r7.png


unbreak

    WT Elite

  • 1 937 postów
    • Czas spędzony online: 27d 8h 43m 36s
506
Znakomita!
  • Location/home/unbreak

Napisano 31 marca 2014 - 08:05

#8

nxx, przywróć wszystko do zmian sprzed zmian z pierwszego posta z tego wątku. Wróć obrazek, etc.

Teraz tylko w linii 26 thx.js to:

img.src = xml.getElementsByTagName('image').item(0).firstChild.data;

zmień na to:

img.style.display = "none";

To spowoduje że zamiast podmienić obrazek, schowa obrazek. Rozumiem, że pisząc "chce zmienić na CSS" masz na myśli zmianę obrazka na jakiś tekst w HTMLu?


  • 1

webDeveloper


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 31 marca 2014 - 17:13

#9

nxx, przywróć wszystko do zmian sprzed zmian z pierwszego posta z tego wątku. Wróć obrazek, etc.

Teraz tylko w linii 26 thx.js to:

img.src = xml.getElementsByTagName('image').item(0).firstChild.data;

zmień na to:

img.style.display = "none";

To spowoduje że zamiast podmienić obrazek, schowa obrazek. Rozumiem, że pisząc "chce zmienić na CSS" masz na myśli zmianę obrazka na jakiś tekst w HTMLu?

Obrazek ukryty został pierwszym sposobem podanym przez poprzednika, ale nie dokońca działa jak należy, (tak jak napisałeś z tym HTML - o to chodziło).

Po kliknięciu w Podziękuj, nadal zostaje podziękuj, a powinno zmienić na nie dziękuj.

 

Tak jak było z obrazkiem, po kliknięciu się zmienił na nie dziękuj. :)  


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 31 marca 2014 - 17:43

#10

Zrób otoczkę dla zmiennej (np. span) i nadaj mu klasę.

 

Powiedzmy że:

<span class="thanksButton"><?php $zmienna; ?></span>

W css możesz dać tak:

.thanksButton a img {
    display: none !important;
}

a[href*="showthread.php?action=thank"]:before {
    content: "Podziękuj";
}

a[href*="showthread.php?action=remove_thank"]:before {
    content: "Nie dziękuj";
}

.thanksButton a {
    // Twój css dla buttona
}

Możesz to też zrobić za pomoca jQuery chociażby w podobny sposób co będzie chyba troszkę lepszym rozwiązaniem bo jeśli zależy Ci na uzytkownikach z IE7 to :before nie zadziała.

 

Przykładowo w jQuery możesz sprawdzić:

 

Link

 

Te metody powinny jakoś pomóc :P


  • 1

2ed58r7.png


unbreak

    WT Elite

  • 1 937 postów
    • Czas spędzony online: 27d 8h 43m 36s
506
Znakomita!
  • Location/home/unbreak

Napisano 31 marca 2014 - 21:56

#11

To jest gotowy plugin do forum, ja bym na się nie dorabiał do niego nic niezgodnego z dotychczasowym schematem. Proponuję rozwiązanie:

THX.PHP:

$output = "<thankyou>
				<list><![CDATA[$list]]></list>
				<display>".($list ? "1" : "0")."</display>
				<image>{$mybb->settings['bburl']}/{$theme['imgdir']}/";
	
	if($mybb->input['action'] == "thankyou")
	{
		$output .= "postbit_rthx.gif";
	}
	else
	{
		$output .= "postbit_thx.gif";
	}
	
	$output .= "</image>
<text>";
if($mybb->input['action'] == "thankyou")
	{
		$output .= "TUTAJ TEKST 1";
	}
	else
	{
		$output .= "TUTAJ TEKST 2";
	}
$output .= "</text>
			  <del>{$mybb->settings['thx_del']}</del>	
			 </thankyou>";
	echo $output;

Teraz w miejscu gdzie masz te buttony etc umieść element div /span etc i nadaj mu Id wg schematu czyli id="text<ID_POSTU>"

THX.JS (po linii ok 26 w ifie):

text = document.getElementById('text' + pid);
text.innerHTML = xml.getElementsByTagName('text').item(0).firstChild.data;

  • 2

webDeveloper


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 31 marca 2014 - 22:23

#12

Nadal nic..


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 01 kwietnia 2014 - 14:12   Najlepsza odpowiedź

#13

Ok zbadałem ten przypadek z braku zajęcia :)

 

 

thx.php

if(!$b) {
	$post['thanks'] = "<a class=\"thanks\" id=\"a{$post['pid']}\" 
			      onclick=\"javascript:return thx({$post['pid']});\" 
			      href=\"showthread.php?action=thank&tid={$post['tid']}&pid={$post['pid']}\">Podziękuj</a>";
}
else if($mybb->settings['thx_del'] == "1") {
	$post['thanks'] = "<a class=\"removeThanks\" id=\"a{$post['pid']}\" 
			      onclick=\"javascript:return rthx({$post['pid']});\" 
			      href=\"showthread.php?action=remove_thank&tid={$post['tid']}&pid={$post['pid']}\">Nie dziękuj</a>";
}

Tutaj wywaliłem na dobre <img> i ustawiłem w linku treść, którą sprawdza się po odświeżeniu przykładowo.

Kolejną linijkę wywaliłem z xml'a (<image>)

$output = "<thankyou>
		<list><![CDATA[$list]]></list>
		<display>".($list ? "1" : "0")."</display>
		<del>{$mybb->settings['thx_del']}</del>
	   </thankyou>";
echo $output;

Usunąłem to bo przecież tego nie chcesz mieć, a tylko CSS.

Teraz pokaże co zrobiłem żeby tekst się zmieniał. Każdorazowo po kliknięciu leci nowe żądanie a więc przypisałem to tak:

 

thx.js

function thx_action(response)
{
	lin=thx_common(response)
	if(lin!=null)
	{
		lin.onclick= new Function("","return rthx("+pid+");");
		lin.href='showthread.php?action=remove_thank&pid='+pid;
		lin.textContent = "Nie dziękuj";
	}
}

function rthx_action(response)
{
	lin=thx_common(response)
	if (lin!=null) 
	{
		lin.onclick = new Function("", "return thx(" + pid + ");");
		lin.href = 'showthread.php?action=thank&pid=' + pid;
		lin.textContent = "Podziękuj";
	}
	
	
}

Dodałem do nich lin.textContent i jeśli klikniesz w link to wywołasz funkcję która ustawi tekst odpowiedni dla akcji.

 

Z tego pliku poleciało także to:

img = document.getElementById('i' + pid);
img.src = xml.getElementsByTagName('image').item(0).firstChild.data;

Powinno zadziałać. U mnie błędów nie ma.

 

Teraz tylko dodaj klasę do <a> i będziesz mógł stylowac swój button ;)


  • 3

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 01 kwietnia 2014 - 18:54

#14

Pięknie dziękuję kolego. 


hmm... a jak jeszcze do tego dodać ikonkę z font avesome? Bo nie można używć chyba html w js.


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 02 kwietnia 2014 - 10:28

#15

Co masz na myśli pisząc używć ? ;)

 

Da się dodać ikonkę ale z tego co widzę to znów jak klika się w dziękuje/nie dziękuje to on usuwa ikonę z htmla, a więc trzeba stworzyć element w JS i go przypisać do dwóch funkcji po kliknięciu.

 

Przede wszystkim w templatce musisz sobie dać link css do FontAwesome + wgrać folder z fontami.

 

Generalnie w pliku thx.php możesz podać to tak:

if(!$b) {
	$post['thanks'] = "<a id=\"a{$post['pid']}\" onclick=\"javascript:return thx({$post['pid']});\" href=\"showthread.php?action=thank&tid={$post['tid']}&pid={$post['pid']}\">Podziękuj <i class=\"fa fa-plus\"></i></a>";
	}
else if($mybb->settings['thx_del'] == "1") {
	$post['thanks'] = "<a id=\"a{$post['pid']}\" onclick=\"javascript:return rthx({$post['pid']});\" href=\"showthread.php?action=remove_thank&tid={$post['tid']}&pid={$post['pid']}\">Nie dziękuj <i class=\"fa fa-minus\"></i></a>";
}

Dodałem sobie odpowiednie ikony fa fa-minus oraz fa fa-plus które po odświeżeniu będą na miejscu.

W pliku thx.js dałem tak:

var icon = document.createElement('i');

function thx_action(response)
{
	lin=thx_common(response)
	if(lin!=null)
	{
		lin.onclick= new Function("","return rthx("+pid+");");
		lin.href='showthread.php?action=remove_thank&pid='+pid;
		lin.textContent = "Nie dziękuj";
		icon.className = "fa fa-minus"
		lin.appendChild(icon);
	}
}

function rthx_action(response)
{
	lin=thx_common(response)
	if (lin!=null) 
	{
		lin.onclick = new Function("", "return thx(" + pid + ");");
		lin.href = 'showthread.php?action=thank&pid=' + pid;
		lin.textContent = "Podziękuj";
		icon.className = "fa fa-plus";
		lin.appendChild(icon);

	}
}

Tutaj stworzyłem nowy element <i> ponieważ po kliknięciu znika ikona którą dodajemy w pliku PHP.

Następnie w odpowiedniej funkcji dodaje odpowiednią klasę i dołączam całość wewnątrz <a>.

 

U mnie działa to fajnie, stabilnie.

 

Ogólnie szkoda że nie ma tam jQuery.


  • 2

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 02 kwietnia 2014 - 18:22

#16

No dobra, jest ikonka, ale po kliknięciu znika. 


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 02 kwietnia 2014 - 19:22

#17

Dziwne...

 

Mam dokładnie taki kod i działa fajnie.

icon.className = "fa fa-minus"

powyższy wpis spróbuj na wszelki wypadek domknąć za pomocą średnika, ponieważ umknęło mi to, aczkolwiek nie sądzę by to miało aż taki wpływ na to.

 

Podane wyżej rozwiązanie działa prawie identycznie jak rozwiązanie z tekstem.

 

Jaką przeglądarką testujesz ? Jakieś błędy w konsoli ? jak zachowuje się element ikony w środku znacznika <a> w czasie kliknięcia ? Usuwa go całkowicie czy może ukrywa czy może też po prostu coś nie tak z fontami ?

 

Możesz podać link do forum ?


  • 2

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 03 kwietnia 2014 - 20:39

#18

A podesłałbyś mi oba pliki? thx.php i js? Niestety nie mogę ujawnić adresu, bardzo przepraszam. 


  • 0

Yeoman

    Stary wyjadacz

  • 358 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 03 kwietnia 2014 - 21:27

#19

Ok na PW Ci podeślę pliki.


  • 1

2ed58r7.png


nxx

    Nowy użytkownik

  • 25 postów
    • :
0
Neutralna

Napisano 03 kwietnia 2014 - 22:36

#20

No. Teraz jest wyśmienicie.

Najwyraźniej coś źle skopiowałem. Przepraszam.

Teraz ostatnie pytanie, jak zrobić, by ikonka wyświetlała się przed tekstem, nie za? :D


  • 0





Podone tematy Collapse

Użytkownicy przeglądający ten temat: 0

0 użytkowników, 0 gości, 0 anonimowych