KNOB, zusätzlich mit Wertebereich-Skala (SVG generiert)

[TirochH]

Morgen Allerseits. Dann wäre so was in der Richtung auch möglich?

http://codepen.io/planetoftheweb/pen/HCLzc

Hans um die Bibliotheken zu bekommen muss ich mich Anmelden?

Alles ist möglich. https://codepen.io/TirochH/pen/oWNoeX?editors=0011

Ich habe eine Entwicklerlizenz und darf Sie mit eigenen Code weitergeben.

Hans

[Andreas1986]

Hallo Hans habe gesehen das heute der Code geändert wurde. Das mit Knob, Slider, Switch sind die sachen die für mic das ganze erst zeitgemäß machen.

Habe nebenbei paar Sachen am laufen aus denen ich nicht ganz schlau werde. In einem anderen Thread geht es um einen Switch den auch Hans Peter anscheinend einsetzt. Allerdings wird der laut einem Update (Zitat: https://knx-user-forum.de/forum/play...-wipen-touchen ) verhunzt dagestellt.

Unbenannt.png
Code Custom.css
.toggle-orange .toggle-slide,
.toggle-green .toggle-slide {
border-radius: 9999px;
box-shadow: 0 0 0 1px #999;
}
.toggle-orange .toggle-on,
.toggle-orange .toggle-off,
.toggle-green .toggle-on,
.toggle-green .toggle-off {
font-size: 24px;
font-weight: bold;
font-family: Calibri;
}
.toggle-orange .toggle-on,
.toggle-orange .toggle-select .toggle-inner .active {
background: #f69300;
text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
color: #ffffff;
}
.toggle-green .toggle-on,
.toggle-green .toggle-select .toggle-inner .active {
background: #a5ca00;
text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
color: #ffffff;
}
.toggle-orange .toggle-off,
.toggle-orange .toggle-select .toggle-on,
.toggle-green .toggle-off,
.toggle-green .toggle-select .toggle-on {
color: #a0a0a0;
text-shadow: 0 1px rgba(255, 255, 255, 0.2);
background: #d2d2d2;
}
.toggle-orange .toggle-blob,
.toggle-green .toggle-blob {
border-radius: 50px;
background: #f5f5f5;
box-shadow: 1px 1px 2px #888;
}










Code Custom.js


hs.functions.element_loader([
"own/toggles.min.js",
"own/toggles.css",
"own/toggles-full.css"
]
);

"use strict";
xxAPI.functions.XXMYSWITCH = function ( oarg ) {
debug(2,"XXMYSWITCH",oarg);
if (oarg.item.action_id != 9) {
debug(1,"XXMYSWITCH needs Action 'Werteingabe'",oarg);
return;
}
oarg.item.text = "";
oarg.item.value = parseInt(oarg.args[1] || 0);
if (oarg.item.xxapi.hasOwnProperty("myswitch")) {
oarg.item.xxapi.myswitch.toggle(oarg.item.value);
} else {
oarg.item.click = false;
oarg.item.customcss = {
"background-color" : "transparent",
"pointer-events" : "auto",
"overflow" : "initial"
}
}
if($.isEmptyObject(oarg.item.info)) {
debug(4,"XXMYSWITCH no item info " + oarg.item.uid,oarg);
oarg.item.item_callback = function() {
oarg.iscallback = true;
xxAPI.functions.XXMYSWITCH( oarg );
}
return;
}
if(!oarg.item.xxapi.hasOwnProperty("myswitch")) {
oarg.item.xxapi.myswitch_options = {
"width" : oarg.item.width,
"height": oarg.item.height,
"text" : { on: "I", off: "O" },
"on" : oarg.item.value
};
oarg.item.xxapi.myswitch = $("<div />", {
"class" : "toggle toggle-orange"
});
oarg.item.xxapi.myswitch.toggles(oarg.item.xxapi.m yswitch_options);
oarg.item.xxapi.myswitch.on('toggle',function(e, active) {
oarg.item.value = oarg.item.info._val = active;
hs.functions.do_valset( oarg );
});
}
if(oarg.iscallback) {
oarg.item.object.html(oarg.item.xxapi.myswitch);
} else {
oarg.item.html = oarg.item.xxapi.myswitch;
}
}






Ich kanns leider nicht... Aber kann man sowas fixen? (weiß das ist mit Aufwand verbunden)....

Orginal Bild wie es aussehen sollte.
Unbenannt1.png



Mfg Andy

[TirochH]

Hallo Hans habe gesehen das heute der Code geändert wurde. Das mit Knob, Slider, Switch sind die sachen die für mic das ganze erst zeitgemäß machen.
....
Ich kanns leider nicht... Aber kann man sowas fixen? (weiß das ist mit Aufwand verbunden)....

Orginal Bild wie es aussehen sollte.
Unbenannt1.png
Mfg Andy

Lieber Andy,

tut mir leid, bei diesem Problem "will" und kann ich nicht weiterhelfen.
Dieser Code entspricht nicht meinen Qualitätsansprüchen. Obwohl vieles aus der xxapi.js kopiert ist.
Muss mich im Vergleich zum "NilsS" selbst schon ziemlich anstrengen um das einigermaßen hinzubekommen.

Ich kann zwar grob dem Muster von "NilsS" folgen, aber nur zu max. 90 %. Wie NilsS das mit den "verblüffend" wenig Codezeilen hinbekommen hat ist Programmierlevel auf höchstem Niveau. Bei den großen amerikanischen Softwareunternehmen, sind diese Klasse von Entwicklern ab einem Jahresgehalt ab 200.000 USD engagiert.

Die eingearbeitete "callback"-logik muß erst verstanden werden.

Hans

[Andreas1986]

Okay kann ich verstehen.

[Andreas1986]

Was auch sehr Interessant wäre ein Carousel.
So wie bei Gira´s neuem G1 die Uhr bzw Zeitschaltuhren.
Ist im Prinzip wie ein Image Slider. Leider wieder mit Javascript verbunden.

Carousel.png

http://through-the-interface.typepad...747be67970b-pi


Mfg Andy