I hava main page which subsrcribes on onstorage event.
This page has a button to open some windows which also subcribe
onstorage event. These pages have a button to write some data into
localstorage.
The problem/bug is that the main window doesnt receive onstorage event
while the res do.
Main window
-----------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<h1>
localStorage window broadcast example</h1>
<script type="text/javascript">
function openwindows(n) {
var h = window.screen.height / n,
w = window.screen.width / n, i, j;
for (i = 0; i < n; i += 1) {
for (j = 0; j < n; j += 1) {
window.open('1.htm', '_blank', "width=" + (w - 10) + ",height=" +
(h - 60) + ",resizable=yes,scrollbars=no,status=no,left=" + (i * w) +
",top=" + (j * h));
}
}
}
function openwindow() {
var h = window.screen.height,
w = window.screen.width;
window.open('1.htm', '_blank',
"width=200,height=200,resizable=yes,scrollbars=no, status=no,left=" +
(~ ~(Math.random() * w)) + ",top=" + (~ ~(Math.random() * h)));
}
function onStorage() {
var cmd = localStorage.getItem('command');
if (cmd.match(/close/)) {
window.close();
} else {
document.body.style.backgroundColor = 'rgb(' + ~ ~(cmd * 255) +
',' + ~ ~(cmd * 255) + ',' + ~ ~(cmd * 255) + ')';
document.body.style.color = 'rgb(' + ~ ~(Math.random() * 255) +
',' + ~ ~(Math.random() * 255) + ',' + ~ ~(Math.random() * 255) + ')';
}
}
var webkit = !!navigator.userAgent.match(/AppleWebKit\/(\d+\.\d+)/);
if (window.addEventListener) {
window.addEventListener("storage", onStorage, false);
} else {
window.attachEvent("onstorage", onStorage);
};
function broadcast(cmd) {
localStorage.setItem('command', cmd);
onStorage();
}
</script>
<button onclick="openwindow();">
Open 1 window</button>
<button onclick="openwindows(4);">
Open 16 windows</button>
<button onclick="openwindows(5);">
Open 25 windows</button>
<button onclick="broadcast(Math.random());">
Broadcast</button>
</body>
</html>
Opened windows = 1.htm
---------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Broadcast target</title>
</head>
<body>
<script type="text/javascript">
function onStorage() {
var cmd = localStorage.getItem('command');
document.getElementById("result").innerHTML = cmd;
if (cmd.match(/close/)) {
window.close();
} else {
document.body.style.backgroundColor = 'rgb(' + ~ ~(cmd * 255) +
',' + ~ ~(cmd * 255) + ',' + ~ ~(cmd * 255) + ')';
document.body.style.color = 'rgb(' + ~ ~(Math.random() * 255) +
',' + ~ ~(Math.random() * 255) + ',' + ~ ~(Math.random() * 255) + ')';
}
}
var webkit = !!navigator.userAgent.match(/AppleWebKit\/(\d+\.\d+)/);
if (window.addEventListener) {
window.addEventListener("storage", onStorage, false);
} else {
window.attachEvent("onstorage", onStorage);
};
function openwindow() {
var h = window.screen.height,
w = window.screen.width;
window.open('1.htm', '_blank',
"width=200,height=200,resizable=yes,scrollbars=no, status=no,left=" +
(~ ~(Math.random() * w)) + ",top=" + (~ ~(Math.random() * h)));
}
function broadcast(cmd) {
localStorage.setItem('command', cmd);
onStorage();
}
</script>
<button onclick="broadcast(Math.random());">
Broadcast</button>
<button onclick="broadcast('close-'+Math.random());">
Close all</button>
<button onclick="openwindow();">
Open Window</button>
<pre id="result"></pre>
</body>
</html>
Linear Mode
