Index: /branches/testa/local_storage.html
===================================================================
--- /branches/testa/local_storage.html	(revision 32)
+++ /branches/testa/local_storage.html	(revision 32)
@@ -0,0 +1,137 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+    <title>md2site-localstorage</title>
+  </head>
+  <body>
+    <H2>localstorage [info]</H2>
+    <textarea id="lstainfo" cols="100" rows="25" ></textarea>
+    <H2>localstorage [0/data]</H2>
+    <textarea id="lsta0data" cols="100" rows="25" ></textarea>
+    <H2>localstorage [0/setting]</H2>
+    <textarea id="lsta0setting" cols="100" rows="25" ></textarea>
+    <H2>localstorage [0/output]</H2>
+    <textarea id="lsta0output" cols="100" rows="25" ></textarea>
+    <H2>localstorage [x]</H2>
+    <textarea id="lstax" cols="100" rows="2" ></textarea>
+<table cellpadding="0" cellspacing="0" border="0" class="tbl">
+<col width="15%" />
+<col width="15%" />
+<col width="70%" />
+<tbody>
+<tr>
+<th></th>
+<td></td>
+</tr>
+</tbody>
+</table>
+
+    <script type="text/javascript">
+function m_receive(ev){
+console.log( "m_rec")
+
+    let value = localStorage.getItem(ev.originalEvent.key)
+    let sel = null
+    switch (ev.originalEvent.key) {
+    case 'info':
+        sel = `#lstainfo`
+	break
+    case '0/data':
+        sel = `#lsta0data`
+	break
+    case '0/setting':
+        sel = `#lsta0setting`
+	break
+    case '0/output':
+        sel = `#lsta0output`
+	break
+    default:
+	break
+    }
+    if( sel !== null ){
+	$( sel ).val( value )
+    }
+}
+
+function show_localstorage(){
+    let nums=["0"]
+    let parts=["data", "setting", "output"]
+    
+    let key 
+    let content
+    let sel 
+
+//console.log( Object.keys( localStorage ) )
+
+    nums.map( (num) => {
+        parts.map( (part) => {
+            key = `${num}/${part}`
+//	    console.log("key=" + key )
+            content = localStorage.getItem(key)
+//	    console.log("content=" + content )
+            sel = `#lsta${num}${part}`
+//	    console.log("sel=" + sel )
+	    //            let obj = JSON.parse(content)
+	    //            $( sel ).val( JSON.stringify( obj, null, "\t") )
+            $( sel ).val( content  )
+	} )
+    })
+}
+
+function show_info(){
+    key = "info"
+//    console.log("key=" + key )
+    let content_info = localStorage.getItem(key)
+//    console.log("content_info=" + content_info )
+    let sel_info = `#lsta${key}`
+    
+//    console.log("sel_info=" + sel_info )
+    $( sel_info ).val( content_info )
+}
+
+function show_x(strx){
+    localStorage.setItem('x' , strx)
+    let ct = localStorage.getItem('x')
+    $('#lstax').val( ct )
+}
+
+function message_broadcast(message)
+{
+    localStorage.setItem('message',JSON.stringify(message));
+    localStorage.removeItem('message');
+}
+
+function message_receive(ev)
+{
+    if (ev.originalEvent.key!='message') return; // ignore other keys
+    var message=JSON.parse(ev.originalEvent.newValue);
+    if (!message) return; // ignore empty msg or msg reset
+
+    // here you act on messages.
+    // you can send objects like { 'command': 'doit', 'data': 'abcd' }
+    if (message.command == 'doit') alert(message.data);
+
+    // etc.
+}
+
+/* message_broadcast({'command':'reset'}) */
+
+/* $(window).on('storage', message_receive) */
+$(window).on('storage', m_receive)
+
+let strx = "aBc"
+
+show_info()
+show_localstorage()
+
+console.log( $(window) )
+
+      //HTMLを初期化
+//      $("table.tbl tbody").html("");
+
+    </script>
+  </body>
+</html>
