[Node-RED][Archlinux] How to install npm in Archlinux

npm is the package manager for JavaScript.
Install npm
$ sudo pacman -S npm

Getting Started
$sudo npm install -g node-red$ node-red

[happy@localhost ~]$ node-red
9 Mar 11:13:48 - [info] 

Welcome to Node-RED
===================

9 Mar 11:13:48 - [info] Node-RED version: v0.16.2
9 Mar 11:13:48 - [info] Node.js  version: v7.5.0
9 Mar 11:13:48 - [info] Linux 4.8.13-1-ARCH x64 LE
9 Mar 11:13:48 - [info] Loading palette nodes
9 Mar 11:13:48 - [warn] ------------------------------------------------------
9 Mar 11:13:48 - [warn] [rpi-gpio] Info : Ignoring Raspberry Pi specific node
9 Mar 11:13:48 - [warn] ------------------------------------------------------
9 Mar 11:13:48 - [info] Settings file  : /home/freeman/.node-red/settings.js
9 Mar 11:13:48 - [info] User directory : /home/freeman/.node-red
9 Mar 11:13:48 - [info] Flows file     : /home/freeman/.node-red/flows_localhost.json
9 Mar 11:13:48 - [info] Creating new flow file
9 Mar 11:13:48 - [info] Server now running at http://127.0.0.1:1880/
9 Mar 11:13:48 - [info] Starting flows
9 Mar 11:13:48 - [info] Started flows

Open the webpage, and type “http://127.0.0.1:1880/“. Start to create your internet of thing.

---

Want more support function about xbee.
This requires the following npm packages to work properly:

node-red-node-serialport
xbee-api

Install these via npm, inside your node-red directory:
cd  ~/.node-red
npm install node-red-node-serialport xbee-api node-red-contrib-zblight

Reference:

• npm is the package manager for JavaScript
• Node-RED A visual tool for wiring the Internet of Things
• node-red-contrib-zblight
• node-red-node-serialport

Read More

[Javascript] How to insert line number automatically for debug

1. add “Line # 999 \n” to each line in the script that you want numbered, e.g.,
   alert ( “Line # 999 \n”);
   
2. run the perl below:
   cat my_js.js | perl -ane “{ s/Line # \d+ /Line # $. /; print$_;}” > C_my_js.js; mv C_my_js.js my_js.js

Reference:

• LINE equivalent in Javascript

Read More

[Javascript] How to check FQDN and IPv6 valid check

FQDN

function validfqdn(obj){
var fqdnRegex = new RegExp("^[a-z0-9-]+(\.[a-z0-9-]+)*\.([a-z]{2,4})$");
if(!fqdnRegex.test(obj.value)){
alert(obj.value +" <#JS_validip#>");
obj.focus();
obj.select();
return false;
}
return true;
}


IPv6 valid check

function ipv6_valid(obj){
//var rangere=new RegExp("^[a-f0-9]{1,4}:([a-f0-9]{0,4}:){2,6}[a-f0-9]{1,4}$", "gi");
var rangere=new RegExp("^((([0-9A-Fa-f]{1,4}:){7}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}:[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){5}:([0-9A-Fa-f]{1,4}:)?[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){4}:([0-9A-Fa-f]{1,4}:){0,2}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){3}:([0-9A-Fa-f]{1,4}:){0,3}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){2}:([0-9A-Fa-f]{1,4}:){0,4}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(([0-9A-Fa-f]{1,4}:){0,5}:((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(::([0-9A-Fa-f]{1,4}:){0,5}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|([0-9A-Fa-f]{1,4}::([0-9A-Fa-f]{1,4}:){0,5}[0-9A-Fa-f]{1,4})|(::([0-9A-Fa-f]{1,4}:){0,6}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){1,7}:))$", "gi");
if(rangere.test(obj.value)){
//alert(obj.value+"good");
return true;
}else{
alert(obj.value+" <#JS_validip#>");
obj.focus();
obj.select();
return false;
}
}


Reference:

• ASUS OpenWRT - RMerl/asuswrt-merlin
• Client side validation: Using Regular expression in Java-script

Read More

[bootstrap] HTML, CSS, and JS framework for developing

1.Download bootstrap source code from bootstrap
2.Import it & enjoy it.
Reference:
1.Bootstrap 3 & HTML5 入門
2.Bootstrap

Read More

[Javascript] Add row into Table

Javascript

var table_list;

function addRow()
{
    a = table_list.insertRow(1);
    a.insertCell(0).innerHTML="happy";
    a.insertCell(1).innerHTML="happy";
    a.insertCell(2).innerHTML="happy";
    a.insertCell(3).innerHTML="happy";


}

function init()
{
    table_list = document.getElementById("table");
}

HTML

<table id="table">
<thead>
      <tr>
          <th>Address</th>
          <th>Protocol</th>
          <th>Start</th>
          <th>End</th>
      </tr>
</thead>
<tbody>
</tbody>
</table>

Reference:

TableRow insertCell() Method

Read More

[Javascript] Title bar X button close event trigger

Javascript

/* 
window.opener.top.unblockUI();
The function unblockUI at the most top html.
*/
window.onbeforeunload = function(event)
{
  return  window.opener.top.unblockUI();
}

/* 
Q : When press F5 also trigger this function. 
A : Add window.opener.top.blockUI(); under function init()
*/

function init()
{
    window.opener.top.blockUI();
}

HTML

<button onClick="self.close();" type="button"><span>Close</span></button>

Reference:

Modal - Return value when Close (‘X’) button is clicked.

How to check whether (X) button in clicked in popup window

onbeforeunload event | beforeunload event

disable f5 and browser refresh using javascript

Close Event In Javascript For Firefox, IE and Chrome

Read More

[Javascript] Disable Parent Window

Disable function (javascript)

function toggleDisabled() {
    el = document.getElementById ('MainDiv');
    el.style.visibility = 'hidden';
}

Disable function (html)

<html>
<body>
<div id=MainDiv> Good Job </div>
</body>
</html>

Reference

1. Disable Parent Window

Read More

[Javascript] function return true/false

Explain :

When myFunction() return false will popup the window which show bingo.

<script>
function myFunction() {
    return false;
}

if (myFunction() == false)
    alert("bingo");
</script>

Reference

1. w3schools

Read More

[Javascript] Target window or Frame

[Javascript] Target window or Frame

Reference :

• 
  Target Window or Frame

Read More

[Javascript] Call top frame function by using javascript

[Javascript] Call top frame function by using javascript

At top frame:

<script language="javascript">

function freezy(){

if(parseInt(InProgress)  == 1)

{

    alert("in");

    var myList = document.getElementById('ha');

    alert("1");

    var anchors = myList.getElementsByTagName('a');

    alert("2");

    for (var i=0, end=anchors.length; i<end; i++)

    {

        anchors[i].onclick = function()

        {

            return false;

        }

    }

}

}

</script>

<div id="ha">

<a >

<a >

<a >

</div>





Second frame:

function init() {

 top.freezy();  // or parent.freezy();

}

 

Reference:

• 
  how to call a javascript function in the top frame?

Read More

[HTML][Javascript] Select of html tag - Delete option

 

[HTML][Javascript] Select of html tag - Delete option

The value of i must point to the max length.

And countdown to 0.

cf.remove will work, otherwise don't work properly.

 

    var cf = document.getElementById("happy");

 

    for (i = cf.length - 1; i >= 0; i--)

    {

        if (select == cf.options[i].text)

        {

            cf.remove(i);

        }

    }

 

Reference :

• 
  HTML/JavaScript - Select list - Add/Remove Options (DOM)

Read More

[HTML][Javascript] How to input a value, then send to select field

 

[HTML][Javascript] How to input a value, then send to select field

Method 1 :

 

var cf = document.forms[0];

var tbox=cf.List;

 

tbox.options[Policy]=new Option(MacAddress,MacAddress);

alert(tbox.options[Policy].text);

 

Method 2:

 

document.getElementById("List").add(new Option(MacAddress, Policy))

alert(document.getElementById("List").options[Policy].text);

 

Reference :

1. 
   JavaScript Reference Select and Option objects 用法介紹

 

 

Read More

[HTML][JavaScript] How to assign variable about form

[HTML][JavaScript] How to assign variable about form

JavaScript:

1. var form=document.forms[0];

2. var form=document.forms['happy'];

3. var form=document.happy;



HTML:



<form name=happy>





</form>

Read More

[HTML] Change Text button in input file

[HTML] Change Text button in input file

CSS :









  .happy {

    position: absolute;

    height: 25px;

    width: 90px;

    left:20px;

    opacity: 0;

    filter: alpha(opacity = 1);

    z-index: 2;

    cursor: none;

    border-width: 100px;

}



Javascript :



function Backup()

{

   document.formname.file_name.value = document.formname.browse.value;

}



HTML :



Safari :

<input type=file name=browse style="visibility: hidden" onchange="Backup();" readonly>

<input name=file_name style="margin-left:-215px;">

<button  type="button" onclick="document.forms[0].browse.click();"><span>Select File</span></button>



IE :

<input type=file name=browse class="happy" onchange="Backup();" hidefocus>

<input name=file_name >

<button  type="button" onclick="document.formname.browse.click();" hidefocus><span>Select File</span></button>



FF & Chrome;

<input type=file name=browse style="display:none" onchange="Backup();" readonly>

<input name=file_name>

<button  type="button" onclick="document.formname.browse.click();"><span>Select File</span></button>



Reference :

• 
  Change Text button in input file

Read More

[HTML] How to control iframe height

[HTML] How to control iframe height

I use iframe skill in every page.

So How can I control every iframe height.

function height()

{

    if (navigator.userAgent.indexOf("MSIE") != -1)

    {

      parent.document.getElementById("abc").height = document.getElementsByTagName('body')[0].clientHeight;

    }

    else if (navigator.userAgent.indexOf("Chrome") != -1 )

    {

      parent.document.getElementById("abc").height = document.body.clientHeight;

    }

    else if (navigator.userAgent.indexOf("Firefox") != -1)

    {

      parent.document.getElementById("abc").height = document.body.clientHeight;

    }

    else if (navigator.userAgent.indexOf("Safari") != -1 )

    {

      parent.document.getElementById("abc").height = document.body.clientHeight;

    }

}



Put the height() in every iframe page like below

<body onload="height();">

 

Reference :

1. 
   Iframe自适应高度 IE6、7、8、firefox、chrome下测试通过

Read More

[JavaScript] How to combine string and become javascript command

[JavaScript] How to combine string and become javascript command



for (var i=1;i<=6;i++)

{

    var MAC='mac'+i;

    var DateMac='a'+i;

    var b='main_window_a'+i;

    var DocumentValue='document.frm.'+MAC+'.value';

    var DateMac =  eval(DocumentValue);

    window.opener.document.getElementById(b).value = DateMac;  



    if(i != 6)

        MacAddress = MacAddress + DateMac + ':' ;

    else

        MacAddress = MacAddress + DateMac ;

}



Reference:

1. 
   Efficient JavaScript

Read More

[Popup Windows][Javascript][HTML] How to transfer data from popup window to parent window

Reference :

1. Popups

Read More

[HTML][JavaScript] How to Upload file by using Javascript & HTML

[HTML][JavaScript] How to Upload file by using Javascript & HTML

JAVASCRIPT :



function fileUpload()

{

   var form=document.forms[0];



   form.loadfile.value=form.happy.value;

}



HTML :



<button class="upc_button4 width150" type="button" onclick="document.forms[0].happy.click();"><span>Upload file</span></button>'

<input style="visibility: hidden" type="FILE" name="happy" size="40" maxlength="128" onchange="fileUpload();">'

<input size="32" name="loadfile" maxlength="32" value="" type="text" class="width150" style="margin-left:-215px;" readonly><div class="clear">&nbsp;</div>'

Reference :

1. 
   Ajax file upload with pure JavaScript


2. 
   safari and fileupload form doesnt work


3. 
   模拟input type=file

Read More

[Javascript][reserved characters] How to let the characters become "reserved characters"

[Javascript][reserved characters] How to let the characters become "reserved characters"



reserved characters (保留字元)



\  -->  Let the characters become "reserved characters".



<script language="JavaScript">

<!--

document.write("\"輸出字串\"");

//-->

</script>



Reference :

• 
  簡單實用的幾個 JavaScript 範例

Read More

[HTML][Different Web Browser] How to determine the different Web Browser and use different method

[HTML][Different Web Browser] How to determine the different Web Browser and use different method

1. using [if !IE] determine IE browser.

2. using JavaScript determine FireFox or Chrome



<html>

<!--[if !IE]><!--><body id="top" onload="init();"><!--<![endif]-->

<!--[if IE 9]><body class="ie9" id="top" onload="init();"><![endif]-->

<!--[if IE 8]><body class="ie8" id="top" onload="init();"><![endif]-->

<!--[if IE 7]><body class="ie7" id="top" onload="init();"><![endif]-->

<!--[if lt IE 7]><body id="top" onload="init();"><![endif]-->

 

<script type="text/javascript">

    if (navigator.userAgent.toLowerCase().indexOf('chrome')!=-1){

      alert('happy')

    }else

    {

      alert('happy1')

    }  

</script>



</body>

</html>

Read More