Grundkurs Plugins schreiben
Hi Leute,
es wäre schön wenn jemand an ganz simplen Beispielen erklären könnte,
wie man eigene Plugins erstellt die auch funktionieren ;-)
Dabei verlange ich für mich überhaupt keinen Kursus in HTML, JS und CSS.
Ich erkläre mal worum es mir geht.
Ich habe immer mal wieder kleine Codes in der Kopf- oder Fußzeile, die auch funktionieren.
Diese werden je nach Anlass wieder gelöscht und durch andere ersetzt.
Um sie nicht zu verlieren, speichere ich die Codes in separaten Textdateien ab die ich archiviere und bei Bedarf wieder hervorholen kann.
Die meisten Codes habe ich im Netz gefunden und nur meinen Vorstellungen angepasst.
Ich verstehe also nur einen Teil davon.
Ich teste sie im Testforum bevor ich sie ins Hauptforum einsetze.
Nun habe ich versucht einen Code in ein Plugin zu verpacken.
Hier der Code um den es aktuell geht und mit welchem ich experimentiert habe.
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<SCRIPT language="JavaScript">
document.writeln('');
var fishRurl='https://files.homepagemodules.de/b572886/a_698_23bb7855.gif'; //* Hier die Adressen der Fische rein !!!!!!! *//
var fishLurl='https://files.homepagemodules.de/b572886/a_697_08e943ab.gif';
document.write('');
var speed=1;
var change=5000;
var xmax=2; //* Hier kann man die horizontale Geschwindigkeit veraendern *//
var ymax=2; //* Hier kann man die vertikale Geschwindigkeit veraendern *//
var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var px = (window.opera)?'':'px';
var w_x, w_y, bothfish,pich,picw;
var incrx=Math.floor(Math.random()*xmax);
var incry=Math.floor(Math.random()*ymax);
var xdir=true;
var ydir=true;
var imagex=new Image(); imagex.src=fishLurl;
var t=(ns4)? '<layer name="bothfish" top="-100" left="0">' : '<div id="bothfish" style="position:absolute; top:0px; left;0px; width:1px; height:1px; z-index: 99999;">';
t+='<img src="'+fishRurl+'" border="0" name="fishpic">';
t+=(ns4)?'</layer>':'</div>';
document.write(t);
function getid(id){
if(ns4) return document.layers[id];
else if(ie4)return document.all[id];
else return document.getElementById(id);
}
function moveidto(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+px;
id.style.top=y+px;
}}
function moveidby(id,x,y){
if(ns4)id.moveBy(x,y);
else{
id.style.left=parseInt(id.style.left)+x+px;
id.style.top=parseInt(id.style.top)+y+px;
}}
function getwindowsize(){
if((ie4||ie5)&&!window.opera){
w_x=document.body.clientWidth;
w_y=document.body.clientHeight;
}else{
w_x=window.innerWidth-15;
w_y=window.innerHeight-15;
}}
function changedirs(){
if(Math.floor(Math.random()*5)>2)xdir=(Math.floor(Math.random()*2)==0);
if(Math.floor(Math.random()*5)>2)ydir=(Math.floor(Math.random()*2)==0);
if(Math.floor(Math.random()*5)>2)incrx=Math.floor(Math.random()*xmax);
if(Math.floor(Math.random()*5)>2)incry=Math.floor(Math.random()*ymax);
checkdirs();
setTimeout('changedirs()',Math.ceil(Math.random()*change));
}
function checkdirs(){
if(xdir) (ns4)? bothfish.document.images["fishpic"].src=fishRurl:document.images["fishpic"].src=fishRurl;
else (ns4)? bothfish.document.images["fishpic"].src=fishLurl:document.images["fishpic"].src=fishLurl;
}
function animate(){
tx=(ns4)?bothfish.left:parseInt(bothfish.style.left);
ty=(ns4)?bothfish.top:parseInt(bothfish.style.top);
if((ie4||ie5)&&!window.opera){
xo=document.body.scrollLeft;
yo=document.body.scrollTop;
}else{
xo=window.pageXOffset;
yo=window.pageYOffset;
}
if(ydir) if((ty+incry+pich)>(w_y+yo)){ydir=false; checkdirs(); moveidby(bothfish,0,-incry);}else{ moveidby(bothfish,0,incry); }
else if((ty-incry)<yo){ ydir=true; checkdirs(); moveidby(bothfish,0,incry); }else{ moveidby(bothfish,0,-incry); }
if(xdir) if((tx+incrx+picw)>(w_x+xo)){ xdir=false; checkdirs(); moveidby(bothfish,-incrx,0); }else{ moveidby(bothfish,incrx,0); }
else if((tx-incrx)<xo){ xdir=true; checkdirs(); moveidby(bothfish,incrx,0); }else{ moveidby(bothfish,-incrx,0); }
}
window.onresize=function(){
if(ns4)setTimeout('history.go(0)',400);
else getwindowsize();
}
window.onload=function(){
bothfish=getid('bothfish');
if(ns4){
picw=bothfish.document.images['fishpic'].width;
pich=bothfish.document.images['fishpic'].height;
}else{
picw=document.images['fishpic'].width;
pich=document.images['fishpic'].height;
}
getwindowsize();
moveidto(bothfish,(w_x-picw)/2,(w_y-pich)/2);
setInterval('animate()',speed);
changedirs();
}
</SCRIPT>
Diesen habe ich aus dem Kopfbereich gelöscht und versucht in ein eigfenes Plugin zu packen.
Hier meine Vorgehensweise.
Admin - Plugins - Plugin-Entwicklung
"Neues Plugin erstellen"
"PluginID" - Clown
"Pluginname" - Clownfisch
"Plugin anlegen"
"Speichern"
Im Bereich "Plugin bearbeiten" habe ich nichts verändert.
Dann habe ich nach unten gescrollt.
"Neues Element erstellen"
"Template Element"
"Obere Leiste" und "Header"
"Template Name" - "automatisch vergeben"
"Hinzufügen"
Dann das neue Element ganz unten über den Stift bearbeitet.
Code eingefügt und gespeichert.
Das Plugin ist aktiviert.
Es passiert aber nichts.
Wahrscheinlich habe ich nur ne Kleinigkeit falsch gemacht oder nicht beachtet.
Aber genau um diese Kleinigkeiten geht es mir.
Nicht so sehr um die eigentlichen Codes.
Edit:
Boah ich fasse es nicht.
Ich habe für diesen Beitrag alle meine Schritte noch einmal wiederholt.
Und nun funktioniert es.
Keine Ahnung was ich nun anders gemacht habe als vorher.
Das ändert aber nichts daran daß ich mir (und einige andere wohl auch) einen kleinen Kursus zum Einstieg wünsche.
Einfache Beispiele wie man mit Variablen für die Rechteeinstellungen arbeitet wären toll.
Das Menü habe ich mir grad angesehen.
Aber ich finde keinen Anhaltspunkt mit dem ich experimentieren kann.
Ich habe eben erst die Wiki-Seite
Wiki:Praxisbeispiel-Plugin-Close-Old-Threads
gesehen.
Eventuell hat sich damit mein Anliegen erledigt.
Mal schauen.
Sonst melde ich mich hier wieder ;-)
Frank, das ist ja toll! Und praktisch ganz allein geschafft. Ich ziehe echt meinen Hut vor Dir!
Liebhaber des Business Templates
#4 RE: Grundkurs Plugins schreiben
Hi Romulus,
der Code ist ein Fundstück aus dem Netz.
Da habe ich nur einiges angepasst.
Ein, zwei Kleinigkeiten waren für mich schon schwer korrekt zu platzieren.
Im Nachhinein ist es logisch.
Aber am Anfang habe ich wie blöde rum getestet.
Das Plugin dazu war bis dahin eigentlich nicht schwer.
Ich musste mich zwar mal kurz entscheiden was ich auswähle
aber es war für mich die logischste Option.
Ich war nur verwirrt, weil es beim erstem Mal nicht klappte.
Hab auch keinen Plan was ich vorher falsch gemacht habe.
Bis hierhin, "Hut ab".
Das Pluginsystem ist ein mächtiges Tool, das super strukturiert ist.
Auch wenn ich nicht einmal einen Bruchteil verstehe.
Hab aber vor etlichen Jahren mal ne Website (aus meiner damaligen Sicht sogar recht umfangreich an verschiedenen Funktionen) geschrieben und mich mit dem Thema HTML intensiv beschäftigt.
Das war aber Zielorientiert.
Ich habe das also nicht richtig gelernt sondern mich an das gewünschte Ergebnis ran gearbeitet.
Auch mit VBA habe ich oft zu tun.
Gleiche Vorgehensweise.
Bis zu einem gewisssen Punkt kann ich es ohne Hilfe.
Danach improvisiere ich mit Beispielen aus dem Netz.
Ok, wieder zurück zum Thema.
Ich habe mir das mit den Config-Variablen angesehen.
In meiner Naivität dachte ich, daß man damit die Gruppenrechte einfach zusammen klicken kann.
Man definiert aber nur Variablen.
Ist eigentlich auch logisch.
Denn das Pluginsystem ist sehr offen.
Man muss die Variablen also noch auslesen und dementsprechende Zeilen einbauen die z.B. sagen ob etwas gezeigt wird oder nicht.
Und da komme ich wirklich nicht weiter.
Hab zwar schon die Doku zum System durchgeschaut und mir auch das Praxisbeispiel angesehen
aber da steht nichts hilfreiches für mich drin.
Mir fehlt der Durchblick.
Wie lautet z.B. eine Zeile um eine Rechtevariable auszulesen?
Wird die Variable automatisch je nach Gruppenzugehörigkeit auf "False" oder "True" gesetzt?
Wenn ja, dann würde eine solche Zeile ja äquivalent zum VBA etwa so aussehen: if variable=true then... else ...
Das wäre der nächste Schritt den ich gerne verstehen möchte bevor ich versuchen kann einen Schalter einzubauen mit dem jemand eine Funktion ein- und ausschalten kann.
In meinem Plugin habe ich eine Config-Variable (Typ - grouprights) namens "onoff" erstellt.
Haken kann ich nun in den Einstellungen des Plugins setzen.
Aber Auswirkungen hat das natürlich noch nicht.
Hier mal eine Eingabe für die Variable "grouprights"(Userrechte):(Bild1)
Zuerst legst Du einen Variablennamen für diese Funktion an.Der sollte schon aussagekräftig sein,damit Du ihn nachher wieder eindeutig benutzen kannst.
Im nächsten Feld gibt Du die Position im späteren Einstellfenster ein.
Dann kommt der Text,der nachher in den Einstellungen erscheinen soll.
Unter "Type" gibst Du "grouprights" an.
Unter "Grouprights" kannst Du schon die Voreinstellung für die Benutzer machen ("Default wiederherstellen" in Einstellungen).
Nun "Speichern" drücken.
In Bild2 ist nun die Variable angelegt worden.
In Bild3:
Und so wird die Abfrage im Editor eingesetzt.
Cursor im Editor setzen wo die Variable erscheinen soll,im rechten Fenster dann die Variable auswählen als Template-Variable,dann nur noch die Abfrage zu den Code setzen,ob true oder false.
Mit "start" und "ende" makierst Du den Bereich im Code,der für die Usergruppen dann erlaubt wird oder eben nicht.
In meinem Beispiel also das ganze Eingabefeld.
Ein wenig üben und dann versteht Du auch,was da vorgeht.
Gruß
Olaf
Aufgrund eingeschränkter Benutzerrechte werden nur die Namen und (falls vorhanden) Vorschau-Grafiken der Dateianhänge angezeigt Jetzt anmelden!
Danke Olaf,
dieses einfache Beispiel war schon sehr hilfreich.
Punkt 1 und zwei waren bis dahin klar.
Der dritte Schritt fehlte mir.
Nur die Schreibweise hätte ich so nicht hinbekommen.
Alles wurde durchgehend mit Unterstrichen getrennt.
Ich hätte andere Trennzeichen erwartet.
zumindest direkt vor der Variable hätte ich z.B. einen "." erwartet.
Ich habe es ausprobiert und es funzt nicht.
Daß die Variablen im Editor aufgelistet werden, wusste ich nicht.
Das ist ne super Sache.
Zuerst hatte ich die beiden Zeilen manuell übernommen und die Namen angepasst.
Es hatte keinerlei Auswirkungen.
Dann habe ich gesehen, daß man im Editor auf die Variable klicken kann und die entsprechende Zeile automatisch eingefügt wird.
Dabei kam aber das heraus:
xobor.plugin('clown').getConf('visiblegroup')
Das war ja nicht was ich wollte.
Dann sah ich, daß man 2 Möglichkeiten hat wenn man mit der Maus über die Variable fährt und nicht sofort drauf klickt.
Es war für mich aber nicht sofort ersichtlich, daß man nun auswählen kann.
Nachdem ich aber die "Tpl-Text"_Variante angeklickt habe,
kam folgende Zeile heraus:
{{plugin_clown_config_visiblegroup}}
Somit war die Schreibweise vorgegeben und ich brauchte die Zeile nur um ==true.start erweitern.
{{plugin_clown_config_visiblegroup==true.start}}
Natürlich kam noch die Zeile mit end ans Ende.
Der Code sah so aus:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<SCRIPT language="JavaScript">
{{plugin_clown_config_visiblegroup==true.start}}
document.writeln('');
var fishRurl='https://files.homepagemodules.de/b572886/a_698_23bb7855.gif'; //* Hier die Adressen der Fische rein !!!!!!! *//
var fishLurl='https://files.homepagemodules.de/b572886/a_697_08e943ab.gif';
document.write('');
var speed=1;
var change=5000;
var xmax=2; //* Hier kann man die horizontale Geschwindigkeit veraendern *//
var ymax=2; //* Hier kann man die vertikale Geschwindigkeit veraendern *//
var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var px = (window.opera)?'':'px';
var w_x, w_y, bothfish,pich,picw;
var incrx=Math.floor(Math.random()*xmax);
var incry=Math.floor(Math.random()*ymax);
var xdir=true;
var ydir=true;
var imagex=new Image(); imagex.src=fishLurl;
var t=(ns4)? '<layer name="bothfish" top="-100" left="0">' : '<div id="bothfish" style="position:absolute; top:0px; left;0px; width:1px; height:1px; z-index: 99999;">';
t+='<img src="'+fishRurl+'" border="0" name="fishpic">';
t+=(ns4)?'</layer>':'</div>';
document.write(t);
function getid(id){
if(ns4) return document.layers[id];
else if(ie4)return document.all[id];
else return document.getElementById(id);
}
function moveidto(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+px;
id.style.top=y+px;
}}
function moveidby(id,x,y){
if(ns4)id.moveBy(x,y);
else{
id.style.left=parseInt(id.style.left)+x+px;
id.style.top=parseInt(id.style.top)+y+px;
}}
function getwindowsize(){
if((ie4||ie5)&&!window.opera){
w_x=document.body.clientWidth;
w_y=document.body.clientHeight;
}else{
w_x=window.innerWidth-15;
w_y=window.innerHeight-15;
}}
function changedirs(){
if(Math.floor(Math.random()*5)>2)xdir=(Math.floor(Math.random()*2)==0);
if(Math.floor(Math.random()*5)>2)ydir=(Math.floor(Math.random()*2)==0);
if(Math.floor(Math.random()*5)>2)incrx=Math.floor(Math.random()*xmax);
if(Math.floor(Math.random()*5)>2)incry=Math.floor(Math.random()*ymax);
checkdirs();
setTimeout('changedirs()',Math.ceil(Math.random()*change));
}
function checkdirs(){
if(xdir) (ns4)? bothfish.document.images["fishpic"].src=fishRurl:document.images["fishpic"].src=fishRurl;
else (ns4)? bothfish.document.images["fishpic"].src=fishLurl:document.images["fishpic"].src=fishLurl;
}
function animate(){
tx=(ns4)?bothfish.left:parseInt(bothfish.style.left);
ty=(ns4)?bothfish.top:parseInt(bothfish.style.top);
if((ie4||ie5)&&!window.opera){
xo=document.body.scrollLeft;
yo=document.body.scrollTop;
}else{
xo=window.pageXOffset;
yo=window.pageYOffset;
}
if(ydir) if((ty+incry+pich)>(w_y+yo)){ydir=false; checkdirs(); moveidby(bothfish,0,-incry);}else{ moveidby(bothfish,0,incry); }
else if((ty-incry)<yo){ ydir=true; checkdirs(); moveidby(bothfish,0,incry); }else{ moveidby(bothfish,0,-incry); }
if(xdir) if((tx+incrx+picw)>(w_x+xo)){ xdir=false; checkdirs(); moveidby(bothfish,-incrx,0); }else{ moveidby(bothfish,incrx,0); }
else if((tx-incrx)<xo){ xdir=true; checkdirs(); moveidby(bothfish,incrx,0); }else{ moveidby(bothfish,-incrx,0); }
}
window.onresize=function(){
if(ns4)setTimeout('history.go(0)',400);
else getwindowsize();
}
window.onload=function(){
bothfish=getid('bothfish');
if(ns4){
picw=bothfish.document.images['fishpic'].width;
pich=bothfish.document.images['fishpic'].height;
}else{
picw=document.images['fishpic'].width;
pich=document.images['fishpic'].height;
}
getwindowsize();
moveidto(bothfish,(w_x-picw)/2,(w_y-pich)/2);
setInterval('animate()',speed);
changedirs();
}
{{plugin_clown_config_visiblegroup==true.end}}
</SCRIPT>
In Zeile 2 und 108 stehen die neuen Zeilen.
Die Gruppenrechte habe ich in den Einstellungen so vergeben:
Nun bin ich ins Testforum als Admin und habe alles aktualisiert.
Der Fisch ist zu sehen.
Ok, dann abgemeldet und erneut aktualisiert.
Aber selbst als Gast wird mir der Fisch gezeigt.
Als letzten Versuch habe ich die beiden Zeilen außerhalb des Skriptes auf Pos 1 und 111 gelegt und alles wiederholt.
Trotzdem hat es keinerlei Auswirkungen.
Hab leider keinen Plan warum das so ist.
Das habe ich jetzt bei meiner Abfrage auch gesehen.
Für Abfragen ob "true" oder "false" braucht die Abfrage im Plugin noch das Objekt "boolean",die man im Editorfenster in der rechten Seite beim drüberfahren auch lesen kann (Dein zweites Bild).
So muß Deine Abfrage aussehen:
{{plugin_clown_config_visiblegroup_boolean==true.start}}
....
{{plugin_clown_config_visiblegroup_boolean==true.end}}
Dieses hat Xobor wahrscheinlich jetzt erst zugefügt bei der Eingabe,denn beim letzten Mal wo ich es benutzt habe,fehlte dieses wichtige Objekt auch.
Gruß
Olaf
Vielen Dank Olaf.
So hat es nun geklappt.
Die Darstellung der Auswahlmöglichkeiten ist nicht besonders gut.
Es sind also in dem Fall 4 verschiedene Möglichkeiten.
Das wäre evtl. etwas was am Pluginsystem verbessert werden kann.
Ich hänge mich mal an diesen Thread wie eine Klette an jemandes Beine.
Das gefällt mir und ist ganz nach meinem Sinn.
Ich frage nach ,damit ich was lerne
Ich hänge auch schon dran. Am anderen Bein. 
Viele Grüße .BiL.
Friends of Xobor
Fragen zu Plugins und Pluginideen bitte nicht per PN, sondern öffentlich oder im FoXum stellen.
Zitat von Olaf im Beitrag #8
So muß Deine Abfrage aussehen:{{plugin_clown_config_visiblegroup_boolean==true.start}}....{{plugin_clown_config_visiblegroup_boolean==true.end}}Dieses hat Xobor wahrscheinlich jetzt erst zugefügt bei der Eingabe,denn beim letzten Mal wo ich es benutzt habe,fehlte dieses wichtige Objekt auch.
Ihr seid ja klasse...
Jetzt wollte ich hier grade ein bisschen helfen aber ich sehe schon ihr schafft das auch alleine ;-)
@Olaf
Danke für's helfen und wenn du eine konkrete Frage hast gerne auch per PN anfragen - ich antworte dann sobald ich dazu komme.
Technik · 
Hier wird es aber demnächst bald eine Änderung noch geben, sodass "_boolean" nicht mehr benötigt wird.
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!