suche Helfer für Entwicklung ''Resizeable Textarea 0.2''

  • bei mir genau das selbe wie bei caveman. auch im safe mode funktionierts nicht.

    genauere fehlerbeschreibung:

    • sicherheitshalber im safe mode gestartet
    • zur beispiel-1-seite gewechelt

      • textarea durch reinklicken mit der maus fokussiert
      • escape 1x gedrückt
      • textarea an der acke zu packen versucht - doch da gabs nichts zu packen. mauszeiger veränderte sich auch nicht.
    • javascript-konsole leer vorgefunden
    • browser-version: siehe unten
    • betriebssystem: windows xp
  • nix "ecke packen", mitten rein in die fläche. beim anclicken sollte die fläche ausgegraut werden.

    caveman
    mit der bisherigen lösung habe ich probleme bei initial versteckten textareas (z.b. schnellantwort-feld in "hidden" <div>).
    ich möchte eine lösung die konflikte mit anderen erweiterungen "by design" ausschliesst, resourcenschonend ist (kein "mousemove" oder key-events dauerhaft überwacht) und z.b. von solchen versteckten textareas nicht aus dem tritt gebracht wird.

    sagt mal, ihr habt aber nicht zufällig javascript deaktiviert, oder eine extension installiert, die bestimmte sachen blockt?
    beachtet bitte, dass das jetzt noch nicht mit den rechten einer erweiterung läuft, sondern als ganz normales script in der webseite.

    ich hab rein zufällig die gleiche browserversion, es muss also was mit euerm system b.z.w. den extensions zu tun haben.

  • Zitat von Raik

    "funktioniert nicht" ist keine fehlerbeschreibung. :wink:

    • was hast du in welcher reihenfolge gemacht?
    • was sagt die javascript-konsole?
      • fehler?
      • warnungen?
      • mitteilungen?
    • welche browserversion?
    • welches betriebssystem?
    • ...?


    Ich fokus das Ding, klick rein, drücke escape (der Cursor wird dann zum Pfeil). Dann kann ich darauf runklicken oder am Rand schieben oder sonstwas soviel ich will und es passiert nichts. Javakonsole ist leer. Fedora Core 4-Linux. Firefox 1.5 Nightly.

    Zitat


    zu den cursorn: was ist daran falsch? unter windows sind n-resize mit s-resize und w-resize mit o-resize optisch identisch. (doppelpfeile)

    Ja, aber nur unter Windows. Z.B. unter Linux ist (unter manchen Cursor-Themes) n-resize ein Pfeil nach oben, s-resize ein Pfeil nach unten usw. Also bitte wie gesagt anpassen. Das etwas gut aussieht heißt noch lange nicht, dass etwas richtig ist. :wink:

  • nicht am rand, mittenrein.

    Zitat

    Dann kann ich darauf runklicken oder am Rand schieben oder sonstwas soviel ich will und es passiert nichts.


    dann werd ich da nochmal ein paar tests einbauen müssen, die ihre ergebnisse in die TA schreiben. ich melde mich, wenn ich damit fertig bin.

    wird denn auch der background grau, wenn der cursor sich ändert?

    Zitat

    Ja, aber nur unter Windows. ...


    siehste, sowas weis ich ja nicht, weil ich immer noch kein linux hab. wenn ich damit jetzt anfange, bleiben für monate erst mal alle anderen sachen liegen, bis ich da soweit durchseh, wie jetzt mit w2k. was ich mir für win alles an tools zusammengesucht hab, das würde mich unter linux unendlich zeit kosten die alternativen zu finden und zu beherrschen.

    und dann noch eine frage, ehe ich mir darüber den kopf zerbreche: kann ich mit xpath in css überhaupt etwas anfangen?
    wie ist die syntax? muss ich zuerst soetwas, wie ein xpath.objekt initialisieren, um in js damit arbeiten zu können?
    wie komme ich an den pfad zur textarea, möglichst unabhängig von templateänderungen (z.b. unterschiedl. designs der boards)?

    ich hab schon nach sowas gesucht, aber noch nicht das richtige gefunden.

  • Zitat von Raik

    und dann noch eine frage, ehe ich mir darüber den kopf zerbreche: kann ich mit xpath in css überhaupt etwas anfangen?
    wie ist die syntax? muss ich zuerst soetwas, wie ein xpath.objekt initialisieren, um in js damit arbeiten zu können?
    wie komme ich an den pfad zur textarea, möglichst unabhängig von templateänderungen (z.b. unterschiedl. designs der boards)?


    XPATH und CSS lassen sich glaub nicht kombinieren. (außer über Scripte halt)
    zum Arbeiten mit JS:

    Code
    var xpath = "//span";
        var res = document.evaluate(xpath, document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE , null);
        var it = res.snapshotItem(0);


    "it" ist dann das erste (0) DOM-Objekt, auf das dieser XPATH (hier: irgendein span-Tag) passt

    wie du an den XPATH rankommst muss ich selbst nachschauen

  • Zitat von Raik

    nicht am rand, guck mal da oben, da hab ich nen flashmovie verlinkt.


    dann werd ich da nochmal ein paar tests einbauen müssen, die ihre ergebnisse in die TA schreiben. ich melde mich, wenn ich damit fertig bin.

    Kommando zurück. Geht doch bei mir. Das Problem war, dass ich nicht wusste, dass man Escape gedrückt halten muss und dann mit der Maus ziehen muss. Klappt zwar, aber relativ kompliziert finde ich. Dann verändert sich auch die Hintergrundfarbe. Das einzige Problem ist, das der Curosor nach dem Escape-Drücken nicht mehr zum 'Balken' wird, sondern ein Pfeil bleibt.

  • Zitat von JonHa

    Das Problem war, dass ich nicht wusste, dass man Escape gedrückt halten muss und dann mit der Maus ziehen muss.

    stimmt, so funktioniert es auch bei mir ;)

    cu
    Wawuschel

  • Ich tippe mal von Hand :)

    Was anderes, was mich interessiert: Im Moment bekommst du deine Textareas doch über document.getElementsByName oder? Was mich daran wundert ist, dass Elemente die display:hidden sind (oder eins derer Elternelemente) nicht in der Liste auftauchen.
    Verstehe ich doch richtig, könnte höchstens sein, dass Elemente mit visibility:hidden auch nicht auftauchen. Also suchst du eine Methode, die es dir erlaubt alle überhaupt *vorhandenen* Elemente einer Seite zu bekommen, oder? Weil die neue Lösung ist mehr als unkomfortabel und selbst die Erfahrenen User hier haben einige Zeit gebraucht, bis sie rausgefunden haben wie das ganze funktioniert. Ich wette dann gibt's etliche weitere User die nicht verstehen, wie deine Erweiterung funktioniert, ohne eine Anleitung.
    Ich habe xpath noch nicht ausprobiert, aber ich werde es machen und versuchen eine Methode zu finden alle textarea Elemente einer Seite zu bekommen. Und ich glaube nebenbei auch nicht, dass die onDragStart usw. Listener wirklich an der Performance nagen. Erstens gibt es auf den wenigsten Seiten irgendwas zum herumziehen, also kommt der Listener so gut wie nie in Aktion und selbst wenn kann man ihn in den meisten Fällen sowieso "ignorieren", da ja nicht jeder onDragStart in der Textarea ist. Davon abgesehen ist das ganze sogar wunderbar flüssig wenn ich - auch auf komplexeren Seiten als diesem Forum - das Textfeld wie bescheuert resize. Erweiterungen wie Linkification ziehen gewiss mehr an der Power als so ein paar äpsche Listener.

    Achja, was ich dich noch fragen wollte: Was meinst du mit einzeilige Textfelder? textarea mit rows=1 oder ein input type password/text ?

    Grüße

  • Zitat von xeen

    Im Moment bekommst du deine Textareas doch über document.getElementsByName oder?

    Zitat von xeen

    ... die neue Lösung ist mehr als unkomfortabel und selbst die Erfahrenen User hier haben einige Zeit gebraucht, bis sie rausgefunden haben wie das ganze funktioniert.


    nachdem ich mails aus japan, australien und sonstwo bekommen hab, hab ich mal gegoogelt. auch mit der 0.1a haben leute teilweise diese probleme gehabt. deshalb werde ich auch ne gif-animation machen, wo es mal gezeigt wird.
    das mit dem "esc" drücken hab ich schon wieder umgebaut. gibt bald ne neue testseite für euch ... :wink:


    Zitat von xeen

    Und ich glaube nebenbei auch nicht, dass die onDragStart usw. Listener wirklich an der Performance nagen.


    wüsste nicht, wie ich dragstart nutzen kann. wenn du nen beispiel hast ...

    Zitat von xeen

    Was meinst du mit einzeilige Textfelder? textarea mit rows=1 oder ein input type password/text ?


    ja, input.

  • Ja TAGName, ist ja schon in Ordnung.

    Zu OnDragStart: Im Prinzip hast du so einen Listener ja schon - nämlich onmousedown und onmousemove. Diesen speziellen Listener gibt es glaube ich nur für den Internetexplorer, aber wenn du dein onmousedown/move auf deine "resizer divs" beschränkst, ist da ja eh nicht viel Unterschied.

    Sprich: Begrenze deine mousedown listener nur auf die Textarea oder sogar nur auf deine DIVs - aber das machst du ja ohnehin schon.

    Was ich weiterhin nicht verstehe: Ich habs jetzt mal ausprobiert, getElementsByTagName findet auch Textareas die display:none sind. Es könnten also höchstens textareas nicht gefunden werden, die erst später per document.write geschrieben werden.

    Wenn deine "Esc gedrückthalten Methode" auch bei vorher nicht geschriebenen Textareas funktioniert, würde ich es allgemein so machen, dass nur eine fokussierte Textarea resized werden kann - ich glaube das ist sinnvoller als z.B. einen Listener zu schreiben, der eine mögliche Änderung der Seite überwacht. Außer es gäbe natürlich einen onNewElements oder so ;)
    Grüße

  • hast du für solche nachträglich per javascript erzeugten textareas praktrische beispiele? gibt es sowas wirklich in der praxis, oder ist das allenfalls als spielerei auf den seiten einiger "strange" leute zu finden?
    sonst muss ich mich wirklich noch damit beschäftigen ...

    aber jetzt erst mal zu meiner neuen version ohne "Esc" und anstatt dessen mit einem element zum anclicken. schauts euch mal an und denkt mal über die vorteile nach ... (z.b. ne textarea, die extrem rechts an den rand, oder ganz unten ans ende der seite "geklatscht" ist, wo mit der bisherigen methode kaum platz zum resizen blieb)

    als nächstes wäre dann die frage einer effizienten speicherung zu klären.
    wenn ihr keine besseren ideen habt, würde ich die neuen per-site-selectoren benutzen wollen und beim laden der extension dynamisch ein eigenes stylesheet in die usercontent.css einbinden (wobei ich da noch keinen schimmer hab, wie das geht).

  • Finde ich grundsätzlich cool.

    Was ist aber, wenn jemand für die Textarea eine von den Mozilla-spezifischen -moz Eigenschaften verwendet?
    z.B. so:

    Code
    textarea {-moz-border-radius:35px;}.


    Dann liegt das Zieh-Element ausserhalb des Textfeldes. Das finde ich eigentlich unproblematisch, aber wäre ein Fall vorstellbar, bei dem das Element dann verdeckt werden würde?

  • Der neue Modus gefällt mir, allerdings wäre ein automatisches Deaktivieren viel zu nervig, meiner Ansicht nicht. Wenn das Textfeld klein ist, aber trotzdem rechts an den Rand geklatscht ist, dann muss ich irgendwann neu ansetzen, um das Feld zu vergrößern. Dann müsste ich nochmal auf den Button klicken..usw.
    Ich würde daher vorschlagen eine einfachere Methode zum deaktivieren des Resizemodus vorschlagen: Doppelklicken.
    Zum aktivieren wohl eher ungeeignet, da der Doppelklick schon zum markieren des "aktiven" Wortes verwendet wird, aber zum deaktivieren sehe ich da keine Probleme - außerdem fällt die Hand/Auge Koordination einfacher aus, denn nach Fitt's law (http://en.wikipedia.org/wiki/Fitts'_law) erreicht man ein Objekt umso schneller je größer und näher es liegt :)

    Zum späteren erstellen: document.write("<textarea></textarea>"); und das ausführen *nachdem* die Seite geladen hat und *nachdem* dein (Originalscript) gelaufen ist. Ich weiß nicht, wie es bei deinem neuen Script ist, ob das auch noch beim onLoad der Seite etwas mkachen muss. Ich glaube nicht, dass das häufig vorkommt, allerdings verstehe ich nicht, wieso dein Script vorher versteckte Textareas nicht erkannt hat. Deswegen: Welche Textareas hatte RTA 0.1a nicht erkannt?

    Zu input: Die neue Methode ist sicherlich praktisch, allerdings wäre recht wenig Platz für so einen Button in einem Inpufeld, da diese meistens ja so oder so schon recht klein sind.

    Zum Speichern: Ja, halte ich für die effektivste Methode, allerdings solltest du dir erstmal klar werden, wie du überhaupt die Daten speichern willst *bevor* du deinen dynamischen userContent include erstellst. Ich bin sicher, dass man im Profil eine XML Datei speichern kann, allerdings könntest du deine Daten auch einfach in eine Textvariable speichern.
    Ich denke das schreiben wird das geringere Problem sein, wohl eher wie man feststellt, ob die import Zeile sich bereits in der userContent befindet, ohne dass der User irgendwas machen muss. Vielleicht gibt es eine bessere Methode deine Styles per JS irgendwie an die "userContent anzuheften". Ich schau mal nach ob sich was finden lässt.
    Grüße

  • noch ein kleines problem mit der demo:
    wenn man auf dem ausgegrauten feld die mittlere maustaste drückt, funktioniert der automatische bildlauf (autoscroll) nicht mehr. das resizen sollte nur mit der linken maustaste funktionieren.

    insgesamt fand ich die bisherige lösung immernoch besser als die demo, weil sie deutlich schneller war.

  • Zitat von xeen

    Ich würde daher vorschlagen eine einfachere Methode zum deaktivieren des Resizemodus vorschlagen: Doppelklicken.


    gute idee! ich hab einfach alle möglichkeiten drin gelassen:
    onkeypress wird automatisch deaktiviert, ondblclick auch, und für leute mit motorischen problemen, denen es leichter fällt, steht auch noch der schalter zum deaktivieren zur verfügung.

    Zitat von xeen

    Welche Textareas hatte RTA 0.1a nicht erkannt?

    "erkannt" schon, nur werden die drei elemente (unten quer, rechts hochkant, auf der unternen rechten ecke) abhängig von der grösse und position der textarea plaziert und die ist, wie oben im test zu sehen, bei display:none = 0/0. die elemente wurden also falsch plaziert.

    Zitat von xeen

    Zu input: Die neue Methode ist sicherlich praktisch, allerdings wäre recht wenig Platz für so einen Button in einem Inpufeld, da diese meistens ja so oder so schon recht klein sind.


    wurde auf jeden fall gewünscht, also lass ich mir da noch was einfallen ...

    Zitat von xeen

    Zum Speichern: Ja, halte ich für die effektivste Methode, allerdings solltest du dir erstmal klar werden, wie du überhaupt die Daten speichern willst *bevor* du deinen dynamischen userContent include erstellst. ...


    ich hatte mir direkt ne css.datei vorgestellt. wenn ich die parameter anders speichere, muss ich sie ja wieder per script und seite auswerten bei jedem laden einer seite, sonst nur beim schreiben auf vorhandene einträge für die seite prüfen.

    Zitat von xeen

    Ich denke das schreiben wird das geringere Problem sein, wohl eher wie man feststellt, ob die import Zeile sich bereits in der userContent befindet, ohne dass der User irgendwas machen muss.


    die css-datei zeilenweise einlesen in ein array und die domain evtl. als key nehmen. dann sind vielleicht nochmal 3 oder 4 einträge genauer zu prüfen mit indexof.

    Zitat von xeen

    Vielleicht gibt es eine bessere Methode deine Styles per JS irgendwie an die "userContent anzuheften". Ich schau mal nach ob sich was finden lässt.


    prima, danke! :D

    Zitat von cubefox

    ... funktioniert der automatische bildlauf (autoscroll) nicht mehr ...


    was ist das? direkt ne firefox-funktion? wo schaltet man die ein? (mal prüfen muss)
    ich kann ja noch ne prüfung der taste einbauen.

    was das "schneller" angeht: (du meinst von der bedienung, oder der reaktion der TA?)
    mag sein, aber mit der lösung ist es schwer bis teilweise unmöglich, alle möglichen fälle abzudecken.
    und da es in zukunft eine speicherung der werte geben wird, ist das ja auf den häufiger besuchten seiten auch nur noch ein mal nötig.

    PS:
    welche browser ausser mozilla und firefox können mit solchen extensions überhaupt noch was anfangen?
    (welche sollte ich moch berücksichtigen)

    PPS:
    gerade gefunden:
    http://developer.mozilla.org/en/docs/Category:Sample_Code

    • Reading textual data
    • Using the Stylesheet Service
    • Writing textual data

    http://kb.mozillazine.org/Dev_:_Extensio…_Code_:_File_IO

  • Tja, der Stylesheetservice dürfte genau das sein, was du suchst.

    Aber zum Speichern: Ich ändere die Größe der Textarea -> Neuer Eintrag.
    Ich ändere die Größe der Textaera -> Neuer Eintrag.

    Irgendwann hat man 100derte Einträge die sich gegenseitig widerrufen, und ich denke mal das zieht irgendwann doch an der Performance.

    Und was anderes: URL Erkennung. die Erkennung per Domain ist bestimmt nicht sinnvoll, da einige Seiten garantiert mehr als nur ein Formular haben. Die komplette URL ist auch nicht sinnvoll, da so Sachen wie SessionID das ganze unbrauchbar machen würden. Allerdings gibt es beim Querystring ein Problem: Den muss man teilweise beachten, teilweise aber auch nicht.
    Z.B. sieht die URL zu dem Antworten teil so aus:
    http://www.firefox-browser.de/forum/posting.…e=reply&t=25872
    Klar, diese Zahl am Ende wird wohl extrem oft variieren, und sollte nicht beachtet werden. Im gleichen Stil gibt es aber etliche Content Manager Systeme, die z.B. http://www.test.de/index.php?p=seite1 als URL verwenden. Wobei p dann immer eine andere Seite enthält. Das sollte natürlich beachtet werden. Als Mensch hat man natürlich die Gabe das eine vom anderen zu unterscheiden, bloß wie willst du das per JS erkennen?
    Hast du dafür schon eine Lösungsidee?


    achja: Autoscroll: Klick mal in einer webseite auf deine mittlere Maustaste bzw. dein Mausrad

  • Zitat von xeen

    Tja, der Stylesheetservice dürfte genau das sein, was du suchst.


    wohl doch nicht ganz, weil ich mehrere textareas auf einer seite ohne id mit css nicht gezielt ansprechen kann.
    ich werde das wohl doch in xml speichern und bei jedem leitenload parsen müssen.
    und da scheint xpath doch ganz nützlich zu sein.

    Zitat von xeen

    Aber zum Speichern: Ich ändere die Größe der Textarea -> Neuer Eintrag.
    Ich ändere die Größe der Textaera -> Neuer Eintrag.


    wenn ich den pfad zerlege (split("/") b.z.w. split("&") ), kann ich den wunderbar kaskadiert abspeichern.

    Zitat


    da lässt sich alles gut wiederfinden und wenn ich dann noch ein fenster anbiete, wo die regeln alle angezeigt werden, können die leute selber ihre filter editieren und zusammenfassen.
    mit codierter logik ist da eh nichts zu machen, da hast du recht, das müssen die leute schon von hand machen.
    wenn ein eintrag dann schon existiert, können grössenänderungen ja aktualisiert werden.

    Zitat von xeen

    achja: Autoscroll: Klick mal in einer webseite auf deine mittlere Maustaste bzw. dein Mausrad


    sollte jetzt wieder funktionieren, hab ne weiche eingebaut.