API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Apr 30th, 2014
233
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 16.40 KB | None | 0 0
raw download clone embed print report
  1. <div class="devType">WifiLight</div></td></tr>
  2. <tr><td>
  3. <table class="block wide" id="TYPE_WifiLight">
  4.  
  5. <tbody><tr class="even"><td><div class="col1"><a href="/fhem?detail=led.wz">led.wz</a></div></td>
  6. <td informid="led.wz">      <script language="JavaScript">     window.addEventListener("load", led.wz_widgetInit(), false);       function led.wz_widgetInit()     {       if (typeof window.rawDataSrc=="undefined")        {         window.rawDataSrcDispatcher = [];         window.rawDataSrcDispatcherFn = function()         {           for (var i=0; i < window.rawDataSrcDispatcher.length; i++)           {             window.rawDataSrcDispatcher[i]();           }         }         window.rawDataSrc = new XMLHttpRequest();         window.rawDataSrc.addEventListener("progress", window.rawDataSrcDispatcherFn, true);         window.rawDataSrc.open("GET", "/fhem?XHR=1&inform=type=raw;filter=room=all&timestamp="+new Date().getTime());         setTimeout(function() {window.rawDataSrc.send();}, 350);       }       //document.getElementById("led.wz_state").parsedLines = -1;       //document.getElementById("led.wz_state_icon").setState(0, 100, 100, 255, 0, 0);       window.addEventListener("mousedown", led.wz_widgetCtrl, false);       window.addEventListener("touchstart", led.wz_widgetCtrl, false);     }          function led.wz_widgetCtrl(e)     {       e = e ? e : window.event;       if (String(e.target.id).substring(0, String("led.wz").length) != "led.wz") {         if (document.getElementById("led.wz_state").showState != "icon") {           document.getElementById("led.wz_state").showState = "icon";           document.getElementById("led.wz_state").style.display = "inline";           document.getElementById("led.wz_state_pane").style.display = "none";           document.getElementById("led.wz_color_button").style.display = "none";           if(document.removeEventListener) {             document.getElementById("led.wz_state_slider_handle").removeEventListener("mousedown", document.getElementById("led.wz_state_slider_handle").startSlide, false);             document.getElementById("led.wz_state_slider_handle").removeEventListener("touchstart", document.getElementById("led.wz_state_slider_handle").startSlide, false);           }           else if(document.detachEvent) {             document.detachEvent("mousedown", document.getElementById("led.wz_state_slider_handle").startSlide);           }         }       }       return e;     }      function led.wz_widgetSetState()     {       if (window.rawDataSrc.readyState == 3 && window.rawDataSrc.status == 200)       {         var lines = rawDataSrc.responseText.split("\n");         var pattern = /^[0-9-]+\s[0-9:]+\s*[0-9]*\sWifiLight\sled.wz\s(c1:)([0-9]+),([0-9]+),([0-9]+),([0-9]+),([0-9]+),([0-9]+)<br>$/;         var parsedLines = document.getElementById("led.wz_state").parsedLines;         parsedLines = parsedLines ? parsedLines : 0;         //for (var i = document.getElementById("led.wz_state").parsedLines; i < lines.length; i++) {         for (var i = parsedLines; i < lines.length; i++) {           var c1match = pattern.exec(lines[i]);           document.getElementById("led.wz_state").parsedLines = i;           if (c1match) {             console.warn("led.wz c1 match: " + c1match[0]);                          var leftStop = 0;             var rightStop = parseInt(document.getElementById("led.wz_state_slider").style.width) + leftStop - parseInt(document.getElementById("led.wz_state_slider_handle").style.width) -4;             var newSliderPos = parseInt((rightStop - leftStop) / 100 * c1match[4]);             document.getElementById("led.wz_state_slider_handle").style.left = newSliderPos + "px";             document.getElementById("led.wz_state_icon").setState(c1match[2], c1match[3], c1match[4], c1match[5], c1match[6], c1match[7]);           }         }         //console.warn("led.wz in set state: " + rawDataSrc.responseText);       }     }      function led.wz_doCmd(cmd)     {       var sendCmd = new XMLHttpRequest();       sendCmd.open("GET", "/fhem?XHR=1&"+cmd+"&timestamp="+new Date().getTime());       sendCmd.send();       //var sliderPos = led.wz_getPosition(document.getElementById("led.wz_state_slider"));       //console.warn("in cmd state slider: " + sliderPos);       //var handlePos = led.wz_getPosition(document.getElementById("led.wz_state_slider_handle"));       //console.warn("in cmd state handle: " + handlePos);     }      function led.wz_getPosition(obj)     {       var cleft = ctop = 0;       while (obj.offsetParent)       {          cleft += obj.offsetLeft;         ctop += obj.offsetTop;          obj = obj.offsetParent;       }       cleft += obj.offsetLeft;       ctop += obj.offsetTop;       return [cleft, ctop];     }   </script>    <div id="led.wz_state" style="display:inline;">     <canvas id="led.wz_state_icon" onclick="led.wz_showPane()" width="48" height="48" style="display:inline; float:center;"></canvas>     <script language="JavaScript">       var led.wz_state_icon = document.getElementById("led.wz_state_icon");       led.wz_state_icon.setState = function(h,s,v,r,g,b) {         this.width = this.width;          var context = this.getContext("2d");         var x = this.width /2;         var y = this.height /2;         var rad = 18;         var start = 1.1 * Math.PI;         var end = 1.9 * Math.PI;         context.beginPath();         context.arc(x,y -2,rad, start,end,false);         context.lineWidth = 3;         context.lineCap = "round";         context.strokeStyle = "grey";         context.stroke();          rad = 12;         start = 0 * Math.PI;         end = 2 * Math.PI;         context.beginPath();         context.arc(x,y -4,rad, start,end,false);         context.lineWidth = 1;         context.strokeStyle = "grey";         context.stroke();         context.fillStyle = "rgba("+ r +"," + g +"," + b + ",0.5)";         context.fill();          for (var i = 10; i <= v; i = i +10) {           y = parseInt(this.height * 0.85);           context.beginPath();           context.moveTo((i/10)*4, 46);           context.lineTo((i/10)*4, 36);           context.lineWidth = 2;           context.lineCap = "round";           context.strokeStyle = "grey";           context.stroke();         }       }     </script>   </div>   <div id="led.wz_color_button" style="display:none; position:relative; height:42px; margin:4px; padding:0px;">     <div id="led.wz_0" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 0,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(255, 0, 0, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_1" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 60,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(255, 255, 0, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_2" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 120,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(0, 255, 0, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_3" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 180,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(0, 255, 255, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_4" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 240,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(0, 0, 255, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_5" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 300,100,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(255, 0, 255, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_6" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 0,0,100')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(255, 255, 255, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>        <div id="led.wz_7" onclick="led.wz_doCmd('cmd.led.wz=set led.wz HSV 0,0,0')" style="         position:relative;         margin:4px;         float:left;         width:24px;         height:24px;         background-color:rgba(0, 0, 0, 0.5);         border-width:1px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>      </div>   <div id="led.wz_state_pane" style="display:none; position:relative; height:42px; margin:4px; padding:0px;">     <div id="led.wz_state_slider" style="         position:relative;         top:0px;         width:262px;          height:24px;         margin:4px;         background-image:-webkit-linear-gradient(to right, lightgrey, white);          background-image:-o-linear-gradient(to right, lightgrey, white);         background-image:-moz-linear-gradient(to right, lightgrey, white);         background-image:linear-gradient(to right, lightgrey, white);         border-width:1px;          border-color:grey;          border-style:solid;          border-radius:8px;         z-index:100;">     </div>     <div id="led.wz_state_slider_handle" style="         position:relative;         top:-35px;         left:234px;         width:24px;         height:30px;         margin:4px;         border-width:3px;         border-color:grey;         border-style:solid;         border-radius:8px;         -moz-box-shadow: 4px 4px 2px 0px #ccc;         -webkit-box-shadow: 4px 4px 2px 0px #ccc;         box-shadow: 4px 4px 2px 0px #ccc;         z-index:100;">     </div>     <script language="JavaScript">       var led.wz_sliderPos = led.wz_getPosition(document.getElementById("led.wz_state_slider"));       document.getElementById("led.wz_state").parentNode.setAttribute("informId", "led.wz_dont_touch_please");       window.rawDataSrcDispatcher.push(led.wz_widgetSetState);       document.getElementById("led.wz_state_icon").setState(0, 100, 100, 255, 0, 0);       document.getElementById("led.wz_state").showState = "icon";        var sh = document.getElementById("led.wz_state_slider_handle");        sh.startSlide = function(e) {         me = document.getElementById("led.wz_state_slider_handle");         e = e ? e : window.event;         if (e.changedTouches) e = e.changedTouches[0];         me.startPosX = e.clientX;         me.startPosY = e.clientY;         me.sliderPosX = parseInt(me.style.left);         if(document.addEventListener) {           document.addEventListener("mousemove", me.goSlide, false);           document.addEventListener("touchmove", me.goSlide, false);         }         else if(document.attachEvent) {           document.attachEvent("onmousemove", me.goSlide);         }         if(document.addEventListener) {           document.addEventListener("mouseup", me.endSlide, false);           document.addEventListener("touchend", me.endSlide, false);         }         else if(document.attachEvent) {           document.attachEvent("onmouseup", e.endSlide);         }         if(e.stopPropagation) e.stopPropagation();         if(e.preventDefault) e.preventDefault();         e.cancelBubble = true;         e.cancel = true;         e.returnValue = false;         return false;       }       sh.goSlide = function(e) {         me = document.getElementById("led.wz_state_slider_handle");         e = e ? e : window.event;         if(e.stopPropagation) e.stopPropagation();         if(e.preventDefault) e.preventDefault();         e.cancelBubble = true;         e.cancel = true;         e.returnValue = false;         if (e.changedTouches) e = e.changedTouches[0];         var x = e.clientX;         var y = e.clientX;         var leftStop = 0;         var rightStop = parseInt(document.getElementById("led.wz_state_slider").style.width) + leftStop - parseInt(me.style.width) -4;         var newSliderPos = me.sliderPosX + (x - me.startPosX);         newSliderPos = (newSliderPos < leftStop) ? leftStop : newSliderPos;         newSliderPos = (newSliderPos > rightStop) ? rightStop : newSliderPos;         me.style.left = newSliderPos + "px";          return false;       }       sh.endSlide = function(e) {         me = document.getElementById("led.wz_state_slider_handle");         var leftStop = 0;         var rightStop = parseInt(document.getElementById("led.wz_state_slider").style.width) + leftStop - parseInt(me.style.width) -4;         var newSetting = 100 / (rightStop - leftStop) * parseInt(me.style.left);         led.wz_doCmd("cmd.led.wz=set led.wz dim "+parseInt(newSetting));         if(document.removeEventListener) {           document.removeEventListener("mousemove", me.goSlide, false);           document.removeEventListener("touchmove", me.goSlide, false);         }         else if(document.detachEvent) {           document.detachEvent("onmousemove", me.goSlide);         }         if(document.removeEventListener) {           document.removeEventListener("mouseup", me.endSlide, false);           document.removeEventListener("touchend", me.endSlide, false);         }         else if(document.detachEvent) {           document.detachEvent("onmouseup", me.endSlide);         }         if(e.stopPropagation) e.stopPropagation();         if(e.preventDefault) e.preventDefault();         e.cancelBubble = true;         e.cancel = true;         e.returnValue = false;         return false;       }     </script>   </div>   <script language="JavaScript">     function led.wz_showPane()      {       document.getElementById("led.wz_state").style.display = "none";       document.getElementById("led.wz_state").showState = "pane";       document.getElementById("led.wz_state_pane").style.display = "block";       document.getElementById("led.wz_color_button").style.display = "block";       if(document.addEventListener) {         document.getElementById("led.wz_state_slider_handle").addEventListener("mousedown", document.getElementById("led.wz_state_slider_handle").startSlide, false);         document.getElementById("led.wz_state_slider_handle").addEventListener("touchstart", document.getElementById("led.wz_state_slider_handle").startSlide, false);       }       else if(document.attachEvent) {         document.attachEvent("onmousemove", me.goSlide);       }     }   </script> </td>
  7. <td><div class="col3"><a style="cursor:pointer" onclick="FW_cmd('/fhem?XHR=1&amp;cmd.led.wz=set led.wz on&amp;room=Wohnzimmer')">on</a></div></td>
  8. <td><div class="col3"><a style="cursor:pointer" onclick="FW_cmd('/fhem?XHR=1&amp;cmd.led.wz=set led.wz off&amp;room=Wohnzimmer')">off</a>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!