Drag&Drop im Floorplan im fp_arrange Modus

[_Markus_]

Hallo,

beim Einrichten meines Floorplans (als Dashboard, also nicht auf einem Grundriss) hatte ich das Bedürfnis die Devices per Drag&Drop zu verschieben, statt jedesmal eines der Devices aus der Dropdown auszuwählen, zu setzen und dann mit dem "attr" Button zu bestätigen.

Dazu habe ich das draggable-Feature von jQuery genutzt. Nach jedem Drag-Vorgang wird das FP-Attribut des Devices neu gesetzt.

Dazu habe ich folgende Datei angelegt: $FW_ME/pgm2/floorplan_drag.js

Code Auswählen Erweitern


$(document).ready(function($){

        $( ".fp_device_div" ).draggable({
                grid: [10,10],
                snap: true,
                snapTolerance: 8,
                stop: function( event, ui) {

                        var device = ui.helper.context.id.replace(/div-/,"");
                        var X = ui.position.left;
                        var Y = ui.position.top;
                        var style = ui.helper.context.getAttribute("fp_style", "");
                        var text = ui.helper.context.getAttribute("fp_text", "");
                        var text2 = ui.helper.context.getAttribute("fp_text2", "");
                        var fp_name = ui.helper.context.getAttribute("fp_name", "");
                        var cmd = "attr " + device + " fp_" + fp_name + " " + Y + "," + X + "," + style + "," + text + "," + text2;
                        FW_cmd('/fhem/floorplan/'+fp_name+'?XHR=1&cmd='+cmd)

                }
        });

});


Ich benötigte einige Attribute im HTML Dom um den fhem Command zusammen zu bauen. Daher waren auch einige Anpassungen am Floorplan-Modul notwendig. Hier der Diff:

Code Auswählen Erweitern


>:/opt/fhem/FHEM# diff 95_FLOORPLAN_ORIG.pm 95_FLOORPLAN.pm

403c403
<                 "src=\"$FW_ME/js/$h->{SCRIPT}\"></script>";
---
>                 "src=\"$FW_ME$h->{SCRIPT}\"></script>";
485c485
<               FW_pO "\n<div style=\"position:absolute; top:".$top."px; left:".$left."px;\" id=\"div-$d\">";
---
>               FW_pO "\n<div fp_style=\"$style\" fp_text=\"$text\" fp_text2=\"$text2\" fp_name=\"$FP_name\" class=\"fp_device_div\" style=\"position:absolute; top:".$top."px; left:".$left."px;\" id=\"div-$d\">";
654a655,658
>
>       my $jsTemplate = '<script type="text/javascript" src="%s"></script>';
>       FW_pO sprintf($jsTemplate, "$FW_ME/pgm2/floorplan_drag.js");
>


Die erste Anpassung stellt sicher, dass die jQuery-Libraries auch wirklich geladen werden. Bei mir war das mit dem "/js/" im Pfad nicht der Fall.
Die zweite Anpassung setzt die zusätzlichen Attribute, die ich für den fhem-Command benötige (s.o.).
Die dritte Anpassung sorgt dafür, dass die oben gezeigte floorplan_drag.js im fp_arrange Modus eingebunden wird.

Mein Dashboard habe ich übrigens mit einem schönen Hintergrund und der folgenden Änderung im standard floorplan CSS laufen:

Code Auswählen Erweitern

table.fp_dash {
    background-color: rgba(255, 255, 255, 0.5);
    height: 80px;
    padding: 7px;
    width: 80px;
}


Da ich recht neu in der Materie bin, bin ich an eurer Meinung interessiert. Geht das ganze eleganter? Insb: Ginge das ganze auch update-sicher? (Falls nicht wäre es vlt eine Änderung am trunk wert?)

Vielen Dank!
Grüße
Markus

[UliM]

Hallo Markus,
saugut, vielen Dank!
Devices per klick anzuordnen ging schon, aber drag&drop ist natürlich noch viel besser

Zeitlich überscheneidet sich das mit der Umstellung von fhemweb und js durch Rudi. Das wird vermutlich auch Auswirkungen auf floorplan haben. Das würde ich gern erstmal stabilisieren, bevor ich Deinen patch sehr gern aufnehme.

Kannst Du derweil bitte damit testen und sicherstellen, dass es keine unerwünschten Nebeneffelkte hat.
Auch müsste ja sinnvollerweise position-by-click aus floorplan.pm ausgebaut werden, denn beides braucht's nicht, oder?

LG, Uli

[justme1968]

sehr geil. die idee hatte ich auch schon.

ich habe hier: http://forum.fhem.de/index.php/topic,31293.msg243580.html#msg243580 einen patch gepostet der den jQuery/javascript im floorplan wieder auf den gleichen stand wie fhemweb bringt und noch ein paar dinge repariert.

vielleicht magst du mal schauen wie sich das mit deinen änderungen verträgt bzw. den teil aus meinem patch übernehmen wenn es geht und deine änderungen dort dazu bauen.

gruss
  andre

[UliM]

Hi,
hab's jetzt engebaut auf Basis der an fhemweb.js angepassten Version von Rudi.

- floorplan_drag.js angelegt wie oben gepostet
- floorplan.pm angepasst - mit folgenden weiteren Änderungen:

• das Arrange-Menü hat nun keine Felder mehr zur Eingabe der Koordinaten - um zu vermeiden, dass der user für ein device erst das arrange-menü öffnet, dann dassselbe device per drag&drop verschiebt und danach im arrange-Menü den attr-button klickt - in den Koordinatenfeldern stehen ja dann noch die alten Koordinaten, das drag&drop-Ergebnis würde also wieder übergebügelt.
• Drag&Drop ist nur dann aktiviert, wenn der arrange-mode eingeschaltet ist (um zu vermeiden, dass man auf seinem floorplan ein device verschiebt, das man eigentlich nur schalten wollte)
• Das bisherige arrangeByMouseclick hab ich rausgenommen

Für Tests wäre ich dankbar, die entspr. Dateien sind angehängt. floorplan.pm ist noch eine unaufgeräumte aber funktionsfähige Version, mach ich dann vor dem einchecken. Zielordner sind
www/pgm2/floorplan_drag.js
FHEM/95_FLOORPLAN.pm

Freue mich auf Testergebnisse, würde das dann alsbald einchecken.
Vielen Dank auf jeden Fall an Markus!

Gruß, Uli

[mbenker]

Hallo,

so habe es mal kurz getestet und funktioniert soweit ganz gut.
Habe einige Icons mal verschoben und auch einige readinggroups.

(wie gesagt nur kurzer Test)

Ich habe allerdings das Gefühl (wie gesagt nur Gefühl) das das Raster noch etwas grob ist.
Kann man das noch etwas feiner einstellen ?

Markus

[UliM]

Ich habe allerdings das Gefühl (wie gesagt nur Gefühl) das das Raster noch etwas grob ist.
Kann man das noch etwas feiner einstellen ?

Hi,
danke für's Testen
Raster: wenn ich das richtig sehe, ist das in floorplan_drag.js in Zeile 4 auf 10x10 px gesetzt.
Pass es doch dort mal auf einen niedrigeren Wert an (5,5?). Als Ausrichtungshilfe ist das sicher gut, kann aber wohl auch stören.
Welchen Wert schlägst Du vor?
Gruß, Uli

[mbenker]

So habe mit den Werten mal rumgespielt.
Und ich für meinen Teil finde 3,3 recht gut. Damit lässt sich es sehr flüssig und gut platzieren.
Besonders wenn man Überschriften entsprechend platzieren will (StarTrek Floorplan als Beispiel)..

5,5 war zwar schon besser aber mit 3,3 bin ich sehr zufrieden

[Mr.Heat]

Erstmal danke dafür!
Es sollte auf jeden Fall noch eine einfache Möglichkeit geben, pixelgenau Positionen anzugeben; wenn das nur per drag&drop geht wird das sonst zur Qual. Wie wäre es, wenn beim Verschieben per d&d beim verschobenen Element die Position x/y direkt dabei angezeigt wird und während des Verschiebens (also Maustaste gedrückt) mit den Pfeiltasten pixelgenau positioniert werden kann?

[UliM]

Wie wäre es, wenn beim Verschieben per d&d beim verschobenen Element die Position x/y direkt dabei angezeigt wird und während des Verschiebens (also Maustaste gedrückt) mit den Pfeiltasten pixelgenau positioniert werden kann?

Das wäre bestimmt toll, hab aber keine Ahnung wie man das hinkriegt..

Aber 2 workarounds kann ich vorschlagen 
1. Beim Positionieren per Ctrl+Mausrad die Zoomstufe im Browser erhöhen, dann sieht man besser.
2. Wenn man irgendwas unbedingt pixelgenau auf derselben Zeile/Spalte haben will wie ein anderes device, kann man immer noch manuell das Attribut auf dem device anpassen.

Ich fänds auch schön, wenn die Positionsfelder top/left im arrange-Menü bleiben könnten - dazu müsste aber der Wert in diesen Feldern aktualisiert werden, sofern der Anwender genau dieses device der d&d verschiebt. Und auch hier weiss ich nicht, wie das geht...

Über patches freu ich mich aber immer 

Gruß, Uli

[mbenker]

Hallo Uli,

folgende Fehler habe ich gerade im Log gefunden :

PERL WARNING: Missing argument in sprintf at ./FHEM/95_FLOORPLAN.pm line 432.
PERL WARNING: Use of uninitialized value $text2 in concatenation (.) or string at ./FHEM/95_FLOORPLAN.pm line 519.

[_Markus_]

Ich schreibe die Woche mal einen Patch mit euren Wünschen.

Du schriebst von zeitlichen Überschneidungen mit der Umstellung von Rudi. Wie sieht es damit aus? Was ist geplant?

[UliM]

Hi,
ja wunderbar
Bei Rudis Umstellungen dürfte floorplan kaum mehr betroffen sein, es kann hier also weitergehen.
Wär gut wenn Du auf Basis der oben angehängten floorplan.pm weitermachen könntest.
Gruß aus Dänemark,
Uli

[_Markus_]

Hi,

anbei eine aktualisierte Version der 95_FLOORPLAN.pm mit den folgenden Änderungen:

• Drag&Drop standardmäßig im Raster 10:10
• Bei bedrückter Shift-Taste wird das Raster 3:3 genutzt
• Bei gedrückter Strg-Taste wird das Raster 1:1 genutzt (also kein Raster)
• Aktuelle Koordinaten werden direkt in den Feldern Top/Left aktualisiert (ich habe die Felder wieder aktiviert)
• Die Koordinaten können auch in den Feldern direkt geändert werden, das Widget verschiebt sich dann auch direkt (WYSIWYG) wenn man das Feld verlässt
• Wenn man in den Top/Left Feldern die Pfeiltasten Hoch/Runter drückt, wird der enthaltene Wert erhöht/verringert und das Widget verschoben (bestätigt werden muss durch Klick auf "attr")
• Wenn man Shift+Hoch/Runter drückt, ändern sich die Werte in 10er-Schritten
• Cursor "Move" bei Drag&Drop

Ich hänge auch die floorplan_click.js an, die die "klickbare" Fläche eines Widgets erhöht (hilft mir auf meinem 7'' Display).

Außerdem anbei mein passendes CSS und ein Screenshot für die Interessierten : )

Würde mich über Feedback freuen!

@Uli, btw: Die Version, die ich von dir genutzt habe hat noch zwei kleine Fehler (wenn ein Widget ausgewählt wurde):
<script attr='/fhem/pgm2/cordova-2.3.0.js">  <-- Öffnendes einfaches Anführungszeichen, schließendes doppeltes.
mehrere <body>-Tags

VG
Markus

[UliM]

Hi Markus,
vielen Dank - das klingt ja klasse.
Werd mich am WE mal hinsetzen, das einbauen, testen und vsl. auch einchecken.
Gespannte Grüße,
Uli

[DerJens]

Hallo Markus,

eine extrem sinnvolle und zeitsparende Erweiterung hast du da gebaut, vielen Dank. Ich arbeite mich gerade ein...

[UliM]

Hi Markus,
habs mal eingebaut, funktioniert wunderbar mit den von Dir zuletzt angehängten js-scripts. Vielen vielen Dank dafür.

Was ich bezgl. Usability gewöhnungsbedürftig finde, ist im arrange-Menü den cursor im Feld "left" zu platzieren und dann das device mit den cursortasten für hoch/runter nach links und rechts zu bewegen. Da fänd ich die linke und rechte cursortaste eingängiger, aber das ist Kleinkram, es funktioniert auch so wie's jetzt ist prima.

Den Effekt von floorplan_click.js hab ich nicht beobachten/finden können. Wenn es das macht, was ich vermute, würd ich ein Attribut zum (de)aktivieren spendieren, damit das Schalten weiterhin funktioniert, wenn jemand devices sehr dich beieinander anordnet - oder erwartest Du da keine Probleme?

Die überflüssige <body>-Definition hab ich gefunden und erstmal auskommentiert. cordova wird bei mir nicht geladen, in den scripts die ich in "meinem" html finde sind alle script-loads korrekt mit Anführungszeichen versehen. Kannst Du in Deiner Installation noch mal schauen, woher das wohl kommt?

Anbei meine floorplan.pm. Könntest Du bitte auch damit noch einmal testen. Wenn alles ok ist, würd ich noch den commandref-Text sowie das floorplan.pdf anpassen, im floorplan.pm aufräumen und alles einchecken.

Gruß,
Uli

PS: In dieser Version sind auch copy, rename, delete drin, die die global userattr mitbehandeln. Dazu brauchts in copy.pm einen zusätzlichen Aufruf, siehe http://forum.fhem.de/index.php/topic,32759.0.html

[DerJens]

So, kleine Rückmeldung von mir:
Ich habe jetzt von mehreren Räumen den Floorplan mit deiner tollen Erweiterung umgestaltet. Das war bislang eine ziemlich langwierige Angelegenheit, jetzt ordne ich so eine Floorplan mit 50+ Elementen in wenigen Minuten neu an UND es macht sogar Spaß. Dabei muss ich sagen, dass ich noch häufig umbaue und optimiere auf dem Weg zu einer sinnvollen und hilfreichen Visualisierung/Steuerung im LCARS Stil für's 7 Zoll Tablet-an-der-Wand-häng-Format.
Folgende Punkte sind mir aufgefallen:

• Die Erweiterung ist genial und spart mir unheimlich viel Zeit!
• Das Einrasten (Snapping) verhält sich bei Chrome und Safari teilweise unterschiedlich. Manchmal bekomme ich bei Chrome nicht ein Element genau in die Mitte auf ein anderes Element positioniert, was beim Safari dann problemlos geht.
• Bislang ungelöste Probleme habe ich, wenn ich einen state in Textform auf dem Floorplan bringe. Der liegt ja dann in einem Div/Tabellen-Konstrukt und dieses Konstrukt ist bei mir immer größer als der Text darin. Das ist nicht weiter schlimm, da man es nicht sieht ABER wenn man im 10x10 Raster verschiebt lässt sich der Text nie genau ausrichten, da ich oben immer noch 4 Pixel Rand habe. Ich musste mir hier mit margin-top: -4px im CSS helfen.
• Gewöhnungsbedürftig ist, dass eine Verschiebung gleich gespeichert wird. Das spart super Zeit, allerdings gibt es für versehentlich verschobene Elemente kein Undo.

[UliM]

Hi,
jupp, sehe ich ebenso.
Bezgl Raster bin ich immer mehr der Meinung, dass sich d&d ebenso verhalten sollte, wie für cursor up/down, also zB:
- ohne zusätzl. Taste Raster 1x1 (kein Raster)
- mit Shift: 10x10
- zB mit ctrl: 3x3
Wichtig scheint mir, dass ohen zusätzl. shift/ctrl-Taste das Raster 1x1 anliegt. Anderenfalls befürchte ich viele Forums-Freds, die besagen, dass man widgets nicht an die gewünschte Stelle schieben kann (weil nicht jeder die Doku so weit liest, dass er/sie wüsste, dass die Nutzung von shift/ctrl was am Verhalten ändert).

Meinungen?

Gruß, Uli

[Kakaomonster]

Hi,

...

Ich hänge auch die floorplan_click.js an, die die "klickbare" Fläche eines Widgets erhöht (hilft mir auf meinem 7'' Display).

Außerdem anbei mein passendes CSS und ein Screenshot für die Interessierten : )

Hallo Markus,

Dein Dash Floorplan gfällt ir richtig gut, wie hast Du den eingebunden? Über Floorplan oder das Dashboard? Würde den für das 7" auch gerne genau so haben.

Zurück zum Fred Hammer geile Erleichterung mit dem drag n drop. Habe mir meinen rechten Arm verletzt und kann nur noch mit links arbeiten, die modifikation erleichtert mir dies ungemein, da ich kaum an die Tasten muss was doch schon anstrengend genug ist.... Super ... vielen Dank
Grüsse, Ralf

[_Markus_]

Guten Abend zusammen,

danke, werde eure Anmerkungen umsetzen, bin allerdings die Woche unterwegs, daher vermutlich erst am Wochenende.

Raster 1x1 als Standard klingt sinnvoll. Hatte auch schon drüber nachgedacht bei gedrückter Shift Taste nur horizontale bzw vertikale Verschiebung zuzulassen, wie etwa in PowerPoint.

Auch das Hinzufügen und Entfernen von Widgets könnte ggf mit JS erleichtert werden. Gibt es aktuell irgendwelche Pläne in diese Richtung? Automatisches Speichern o.ä. könnte man dann auch über Checkboxen aktivierten und deaktivieren.

@Ralf: Jep, floorplan. Hänge die tage mal noch ein anderes, freundlicheres Design (Css) an. Das von Screenshot hast du ja schon. Meld dich einfach wenn du Hilfe brauchst.

VG
Markus

[UliM]

Hallo Markus,

daher vermutlich erst am Wochenende.

Kein Stress

Raster 1x1 als Standard klingt sinnvoll. Hatte auch schon drüber nachgedacht bei gedrückter Shift Taste nur horizontale bzw vertikale Verschiebung zuzulassen, wie etwa in PowerPoint.

Auch ne Variante. Ob Raster oder nur horizontal/vertikal praktischer ist, kommt m.E. darauf an, was der jeweilige Anwender so macht, kann man schwer vorhersagen. Aber konsistentes Verhalten find ich immer gut, daher fänd ichs gut wenn Schrittweiten bei d&d und per cursortasten gleichartig ist bezgl. Kombination mit zusätzlich gedrückter Taste. Orientierung an etablierten Standards (zB Powerpoint bzw Windows) find ich auch gut. Your choice

Auch das Hinzufügen und Entfernen von Widgets könnte ggf mit JS erleichtert werden. Gibt es aktuell irgendwelche Pläne in diese Richtung?

Nein, bisher nicht. Wenn Dir dazu was Nettes einfällt - gern, weiß nicht wie groß da der Optimierungsbedarf ist - lasse mich gern überraschen.

Automatisches Speichern o.ä. könnte man dann auch über Checkboxen aktivierten und deaktivieren.

Kann man tun. Aber persistent wird's ja eh erst nach einem expliziten SAVE nach fhem.cfg, daher ist das m.E. nice to have.

Anbei meine aktuellste lokale floorplan.pm, wäre prima wenn Du auf der aufsetzen könntest. Aktivierung floorplan_click.js ist da ohne Attribut drin - könnten da Nebeneffekte auftreten, so dass man das über Attribut deaktivierbar machen können müsste? (siehe mein vorheriger fred).

LG, Uli

[MiWe58]

Hallo,

eine sehr schöne Erweiterung zu fhem ist das Floorplan-Modul. Ich arbeite mich gerade ein und mache alles nach dem pdf- Dokument. Nachdem ich gesehen habe, dass diverse Updates der floorplan.pm vorliegen habe ich gerade eben das fhem-Update durchgeführt, bei dem auch eine neue floorplan.pm geladen wurde. Nach dem "shutdown restart" kann ich leider weiterhin keine Icons per Drag & Drop verschieben. Das bedeutet, dass die verschobenen Positionen nicht in die Konfiguration übernommen werden.

Liegt das Problem auf meiner Seite?
Was sollte ich versuchen?

Ich benutze Firefox und IE

Guuß
Michael

[justme1968]

die version mit dem drag&drop ist noch nicht eingecheckt. du musst das file oben aus dem posting verwenden.

gruss
  andre

[UliM]

Hi,
richtig. in der per update verteilten Version geht
-device im arrange-Menū auswãhlen
- dann an der gewūnschten Position klicken (!), geht such mehrfach
- schließlich auf den attr-button klicken

Wenn Du d&d testen willst, brauchst Du aus diesem fred hier die jeweils letzten Versionen von floorplan.pm, floorplan_drag.js und floorplan_click.js

Gruß Uki

[kud]

Tolle Geschichte 
Habe mal die 3 Dateien gespeichert. Klappt super mit dem verschieben.
Jedoch eine Frage. Wie binde ich diese Kachelanzeige ein (ein paar Kommentare
davor von mluckey) ?
Das heisst jedes Objekt ist immer so und so groß ?

Danke und Gruss
Kai-Uwe

[UliM]

Hi,
hab's nun eingecheckt - und aus meinen älteren posts die angehängten Programmdateien gelöscht.
http://forum.fhem.de/index.php/topic,33781.0.html
Gruß, Uli

[_Markus_]

Guten Abend zusammen,

sry für die lange Ruhe...
Anbei eine neue Version der floorplan_drag.js. Darin ist das Grid nun 1x1, mit Shift 10x10 und mit Strg wird das Snap deaktiviert. Das war nach vielen Versuchen die für mich intuitivste Variante.

Ich musste noch ein paar kleinere Anpassungen machen, da ich Devicenamen mit "." (Punkt) nutze und diese mit CSS Selektoren kollidieren.

Ich habe auch die neue Tastenbelegung "Rechts/Links" für das verschieben mittels Cursor-Tasten getestet. Allerdings habe ich davon wieder Abstand genommen, da ich festgestellt habe, dass man Rechts und Links zum Navigieren im Feld benötigt ; )

@Uli: Die floorplan_click.js sollten wir wieder rausnehmen aus der floorplan.pm, da es sich hierbei eher um ein konkretes Theme für den Floorplan handelt (siehe nächstes Post). Ich konnte in deinen letzten Posts leider deine floorplan.pm nicht mehr angehängt sehen, daher hänge ich jetzt auch keine an um Auseinanderlaufen zu vermeiden. Wenn du mir deine schickst, mache ich nochmal einen finalen Check.

VG
Markus

[_Markus_]

Theming
In einigen Posts zuvor wurde die floorplan_click.js bzw das genutzte Theme/Layout/CSS angesprochen. Ich würde dazu tendieren, die floorplan_click.js als spezielles Theme zu verstehen und daher über das Attribut "Javascripts" einzubinden, wie auch die css. Die floorplan_click.js macht

• Erweiterung des Click-Radius: Es muss nicht genau auf das Icon geklickt werden, sondern auch klicken auf die darum liegende Table ist erlaubt. Das Event wird dann runter propagiert.
• Es werden ja nach Device-Status (an/aus) verschiedene CSS Styles zugewiesen.

Anbei die floorplan_click.js die über das Javascripts Attribut zugewiesen wird. Dazu die js in das Verzeichnis www/pgm2/ legen und dem Attribut Javascripts mit "pgm2/floorplan_click.js" zuweisen. Ebenfalls anbei die passende CSS Datei, die dafür sorgt, dass alle Devices die gleiche Größe haben. Diese wird über das Attribut stylesheet mit "dash_floorplanstyle.css" zugewiesen und liegt ebenfalls im Ordner www/pgm2/. Außerdem anbei ein Screenshot von meinem Dashboard mit ebendiesem Style.

Ich würde eine Sammlung von Styles in einem separaten Fred befürworten, in dem CSS, JS und Screenshot pro Post angehängt werden.

[UliM]

Hi Markus,
welcome back
Just heute hab ich alles eingecheckt. Meine akzuellste floorplan.pm gibt's daher im SVn.
Wenn die von Dir trad angehängte Version des floorplan_drag verteilt werden soll, check sie nach nem Test einfach ein - oder wenn ich das machen soll, sag einfach bescheid.

Deine Ausführungen zu click.js hab ich nicht verstanden, v.a. nicht den Zusammenhang mit stylesheets...?

LG Uli

[UliM]

Ich würde eine Sammlung von Styles in einem separaten Fred befürworten, in dem CSS, JS und Screenshot pro Post angehängt werden.

Jupp, prima

Ich musste noch ein paar kleinere Anpassungen machen, da ich Devicenamen mit "." (Punkt) nutze und diese mit CSS Selektoren kollidieren.

Hab grad mal kurz Deine neue floorplan_drag mit der nun eingcheckten verglichen: Ich hab ebenfalls grid-Werte angepasst (wobei mit der Maus ctrlKey derzeit keinen Effekt hat, weiss nicht warum). Ich wäre DIr dankbar, wenn auch Du den Vergleich dieser beiden Versionen anschauen könntest, dann entscheidest wie's aussehen soll und mir ne aktualisierte Version von floorplan_drag schickst, ok?
Siehe auch http://forum.fhem.de/index.php/topic,33781.0.html - ggf müsste ich dort wie auch im Einrichtungsleitfaden.pdf anpassen.

Bin heut den ganzen Tag unterwegs und erst am Abend wieder am Rechner.

Gruß, Uli

[cotecmania]

Guten morgen,

seit dem heutigen Update funktioniert das WebViewControl nicht mehr zusammen mit Floorplan.
Nach Restore von 95_Floorplan.pm von gestern gehts wieder.

Mir ist aber nicht klar ob der Fehler nun an Floorplan oder WebViewControl liegt.

siehe hier :
http://forum.fhem.de/index.php/topic,10628.msg261862.html#msg261862

PS : Das Drag&Drop ist übrigens Klasse !

Gruss
Joe

[UliM]

seit dem heutigen Update funktioniert das WebViewControl nicht mehr zusammen mit Floorplan.
Nach Restore von 95_Floorplan.pm von gestern gehts wieder.

Mir ist aber nicht klar ob der Fehler nun an Floorplan oder WebViewControl liegt.

siehe hier :
http://forum.fhem.de/index.php/topic,10628.msg261862.html#msg261862

Hi Joe,
den Namen webviewcontrol hab ich schon oft gelesen, benutze es aber selbst nicht und hab keine Ahnung was es tut.
Daher kann ich zu Interferenzen auch nix sagen.
LG, Uli

[justme1968]

seit gestern gibt es die möglichkeit im devStateIcon attribut auch set kommandos anzugeben die einen parameter benötigen. also z.b kommandos die im web frontend sonst einen slider oder ein dropDown menü bekommen.

diese kommandos erzeugen beim klick auf das icon ein popup mit dem/den entsprechenden wirdgets.

leider habe ich gerade bemerkt das sich das mit dem neuen floorplan_click.js beisst und dadurch der dialog beim klick auf das icon doppelt aufgerufen wird.

ich hab noch nicht ganz verstanden was floorplan_click.js macht. vielleicht sollte es aber nur im arange modus aktiv sein ?

gruss
  andre

[karl0123]

Das mit dem doppelt Aufrufen passiert ja beim ? Dialog hinter save auch. So wie auch der codemirror nicht mehr zuverlässig arbeitet. Ich bin langsam wirklich auch der Meinung, dass solche Neurungen zwar gut und schön sind aber aktuell zu viele Probleme machen.

[UliM]

ich hab noch nicht ganz verstanden was floorplan_click.js macht. vielleicht sollte es aber nur im arange modus aktiv sein ?

Hi,
floorplan_click vergrößert wohl den klickbaren Bereich je device.
Siehe oben: Markus ist der Ansicht, dass man das nicht immer laden muss, es also ggf. im javascript-Attribut mitgegeben werden sollte.
Dann gibt's den Konflikt wenigstens nur dann, wenn das jemand ausdrücklich lädt

Soll ich das automatische Laden rausnehmen?
Auch brauch ich noch Rückmeldung von Markus, welche Änderungen an floorplan_drag ich übernehmen soll.

Grüßle, Uli

[_Markus_]

Ich setze mich jetzt dran 

[_Markus_]

Hi Uli,

ja ich würde dazu tendieren die floorplan_click.js rauszunehmen, da sie eigentlich auch nur mit bestimmten CSS Styles sinnvoll ist, nämlich dann, wenn man der table feste Größen mitgibt (in meinem Beispiel um die Kachelansicht zu erstellen). Die floorplan_click.js kann dann bei Bedarf über das Javascripts Attribut geladen werden.

Bzgl. der floorplan_drag.js würde ich zu meiner letzten Version von Samstag tendieren. Die Ctrl-Taste hat auch bei mir nicht ohne Weiteres funktioniert. Zudem hatte ich den Wunsch auch das "snap" deaktivieren zu können. Das geht nun mit der Ctrl Taste. Außerdem hatte ich noch kleine Anpassungen für Devicenamen, die einen "." enthalten eingefügt.

Leider verweigert mir mein SVN Client gerade den Zugriff aufs Repo, daher würde ich dich bitten die aktuelle floorplan_drag.js einzuchecken - Danke! (hängt an).

Viele Grüße
Markus

[justme1968]

mir ist eben noch ein problem mit dem drag&drop mode aufgefallen:

wenn man in devStateicon kommandos definiert hat dann werden diese nach dem drop ausgefürt wenn man ein icon verschoben hat. vielleicht sollte man im arange modus alle interaktionen mit icons und kommandos abschalten.

gruss
  andre

ps: hier gibt es noch einen floorplan patch: http://forum.fhem.de/index.php/topic,33935.0.html

[_Markus_]

Hi andre,

das sollte eigentlich mit einem "return false;" am Ende der Stop-Function zu beheben sein.
Ich kanns leider nicht testen heute, aktualisierte Version hängt aber an. Vielleicht magst du es kurz ausprobieren?

VG
Markus

[UliM]

Moin,
Ok.
Idee+ Vorschlag: unsnap mit Alt-Taste wie bei ppt.
Wat meinste?
=8-)

[_Markus_]

Der Alt key hat bei mir den unangenehmen Effekt dass sich das Menü des Browsers aktiviert ☺️ ich kann aber nochmal testen.

[justme1968]

@mluckey: nein. das hilft leider nicht.

mit dem return false kommt sogar noch dazu das nur das erste drag&drop geht. dann wird geschaltet und alle weiteren drag versuche funktionieren bis zum nächsten seitenaufbau nicht mehr.

gruss
  andre

[UliM]

D.h. es dürfte hier:

Code Auswählen Erweitern

  my $commands = FP_digestCgi($htmlpart[1]) if $htmlpart[1];                       # analyze URL-commands
  my $FP_ret = AnalyzeCommand(undef, $commands,
                            AttrVal($FW_wname,"allowedCommands",undef)) if $commands;  #Execute commands
das AnalyzeCommand nur ausgeführt werden, wenn fp_arrange nicht gesetzt ist.
Ich bau's mal ein...
Edit: Falsch gedacht, das würde nur das Setzen der Attribute aushebeln. Hmmm...  hier ist ne Idee gefragt, wie man das device-Schlaten während d&d deaktivieren kann.

=8-)

[UliM]

@Markus: jetzt hab ich zum ersten mal den Effekt von Snap gesehen - hab mit der zuletzt von Dir geposteten Version von floorplan_drag getestet.

Snapt bei mir nur bis ich das erste mal Ctrl gedrückt hab. Danach snapt nix mehr, selbst wenn ich ctrl loslasse.
Bei Dir auch so?
Edit: nachdem "return false" raus ist, geht auch snappen wiederholt, wenn man zwischendurch die Maustaste loslässt.

Und: mit dieser Version kann ich ein device nur ein einziges mal verschieben. Sobald ich Maustaste loslasse und danach nochmal verschieben will, geht nix mehr (Mauszeigericon "verschieben nicht möglich)". Das ist doof.
Edit: dass es nur einmalig funktioniert, liegt am "return false" ziemlich am Ende. Wofür ist das gedacht?

Gruß, Uli

Firefox 35.0.1

[UliM]

Hi,
Ich check jetzt mal alles so ein in der Hoffnung, dass es Aspekte verbessert und WebViewControl wieder tut, auch das Laden von floorplan_click hab ich rausgenommen.
@Markus + Andre: bitte testet weiter und gebt mir bescheid wenn weitere Veränderungen vorgenommen werden sollen.
Gruß, Uli

[wex_storm]

Hallo zusammen,

vielen herzlichen Dank für das Update. Hilft wirklich sehr. Eine Sache "nervt" mich jedoch. Wenn ich z.B. eine Lampe verschiebe, dann wird sie beim loslassen der Maustaste geschaltet.
Ich habe schon versucht das Event (welches in FW_replaceLink gesetzt wird) zu "unbinden" und danach wieder hinzuzufügen. Leider will es mir nicht gelingen.
Gibt es dafür eine Lösung?
Kann denn jeder von euch auch an der fhemweb.js was ändern oder nur in seinen Bereichen?

Mein "Vorschlag" wäre folgender:
fhemweb.js
- in der Funktion FW_replaceLink ein custom-data-Attribut wie data-href an den Link hängen
- href-Attribut entfernen lassen
- mit on/bind Event binden
floorplan_drag.js
- beim drag das Event "unbinden" (evtl. einmalig)
- beim stop des drag das data-href-Attribut in das href-Attribut schreiben und FW_replaceLink erneut aufrufen

Warum so kompliziert?! Ich denke damit macht man am wenigsten kaputt.

Gruß

   Björn

Edit: Okay, wenn ich auf den Titel des Elementes klicke und dann ziehe besteht das Problem nicht. Nur den Switch darf man nicht treffen.