-
Notifications
You must be signed in to change notification settings - Fork 28
/
Copy pathchatWindow.html
94 lines (86 loc) · 3.12 KB
/
chatWindow.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html>
<head>
<link id="siteicon" rel="icon" href="./firefox.png"/>
<link id="activity" rel="activity"/>
<link rel="stylesheet" href="./panel.css"/>
<title>Me!</title>
<script src="./panel.js" type="text/javascript"></script>
<script>
// we can update the icon and title of the chat through normal web
// functionality
var origTitle = document.title;
var counter = 0;
function changeTitle() {
document.title = origTitle + "("+(++counter)+")";
}
function changeSiteIcon() {
var icon = document.getElementById("activity");
icon.parentNode.removeChild(icon);
if (icon.getAttribute("href")== "./icon.png")
icon.setAttribute("href", "./message.png");
else
icon.setAttribute("href", "./icon.png");
document.getElementsByTagName('head')[0].appendChild(icon);
}
function notifyActivity() {
changeSiteIcon();
changeTitle();
// this event is used to indicate to Firefox that some chat activity
// has occured. Firefox updates UI based on this event.
var evt = document.createEvent("CustomEvent");
evt.initCustomEvent("socialChatActivity", true, true, { "color": "white", "backgroundColor": "blue" });
document.documentElement.dispatchEvent(evt);
}
function startActivity() {
window.setInterval(notifyActivity, 3000);
}
function startMediaRequest() {
// just initiating permission request and camera ui
navigator.mozGetUserMedia({video: true, audio: true}, function(stream) {
}, function(err) {
});
}
function goFullScreen() {
document.body.mozRequestFullScreen();
}
</script>
</head>
<body onload="onLoad()">
<div id="content">
<input />
<!-- this is just a way to test the icon, title and activity notification -->
<button onclick="startActivity()" title="pretend we have chat activity">start activity interval</button>
<!-- we can simply use window.close if we want to close this panel -->
<button onclick="window.close()">close panel</button>
<button onclick="goFullScreen();">full screen body</button>
<button onclick="startMediaRequest();">start camera</button>
<!-- video test with full screen controls (bug 821073) -->
<video controls src="https://videos-cdn.mozilla.net/serv/webmademovies/Moz_Doc_0329_GetInvolved_ST.webm"
width="180" height="180" id="myvideo">
</div>
</body>
<script>
var videoElement = document.getElementById("myvideo");
function toggleFullScreen() {
if (!document.mozFullScreen && !document.webkitFullScreen) {
if (videoElement.mozRequestFullScreen) {
videoElement.mozRequestFullScreen();
} else {
videoElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else {
document.webkitCancelFullScreen();
}
}
}
document.addEventListener("keydown", function(e) {
if (e.keyCode == 13) {
toggleFullScreen();
}
}, false);
</script>
</html>