瀏覽代碼

Make clicking on a contact the same as clicking on their video.

j8
fo 11 年之前
父節點
當前提交
da1e4183e5
共有 5 個檔案被更改,包括 43 行新增5 行删除
  1. 21
    0
      contact_list.js
  2. 7
    1
      css/contact_list.css
  3. 9
    0
      css/main.css
  4. 4
    4
      index.html
  5. 2
    0
      videolayout.js

+ 21
- 0
contact_list.js 查看文件

38
 
38
 
39
         var newContact = document.createElement('li');
39
         var newContact = document.createElement('li');
40
         newContact.id = resourceJid;
40
         newContact.id = resourceJid;
41
+        newContact.className = "clickable";
42
+        newContact.onclick = function(event) {
43
+            if(event.currentTarget.className === "clickable") {
44
+                var jid = event.currentTarget.id;
45
+                var videoContainer = $("#participant_" + jid);
46
+                if (videoContainer.length > 0) {
47
+                    videoContainer.click();
48
+                } else if (jid == Strophe.getResourceFromJid(connection.emuc.myroomjid)) {
49
+                    $("#localVideoContainer").click();
50
+                }
51
+            }
52
+        };
41
 
53
 
42
         newContact.appendChild(createAvatar());
54
         newContact.appendChild(createAvatar());
43
         newContact.appendChild(createDisplayNameParagraph("Participant"));
55
         newContact.appendChild(createDisplayNameParagraph("Participant"));
194
             contactName.html(displayName);
206
             contactName.html(displayName);
195
     });
207
     });
196
 
208
 
209
+    my.setClickable = function(resourceJid, isClickable) {
210
+        var contact = $('#contactlist>ul>li[id="' + resourceJid + '"]');
211
+        if(isClickable) {
212
+            contact.addClass('clickable');
213
+        } else {
214
+            contact.removeClass('clickable');
215
+        }
216
+    };
217
+
197
     return my;
218
     return my;
198
 }(ContactList || {}));
219
 }(ContactList || {}));

+ 7
- 1
css/contact_list.css 查看文件

1
 #contactlist {
1
 #contactlist {
2
     background-color: black;
2
     background-color: black;
3
+    cursor: default;
3
 }
4
 }
4
 
5
 
5
 #contactlist>ul {
6
 #contactlist>ul {
12
     text-align: left;
13
     text-align: left;
13
     color: #FFF;
14
     color: #FFF;
14
     font-size: 10pt;
15
     font-size: 10pt;
15
-    padding: 8px 10px;
16
+    padding: 7px 10px;
17
+    margin: 2px;
16
 }
18
 }
17
 
19
 
18
 #contactlist>ul>li>p {
20
 #contactlist>ul>li>p {
32
     margin-right: 10px;
34
     margin-right: 10px;
33
     vertical-align: middle;
35
     vertical-align: middle;
34
     font-size: 22pt;
36
     font-size: 22pt;
37
+}
38
+
39
+#contactlist .clickable {
40
+    cursor: pointer;
35
 }
41
 }

+ 9
- 0
css/main.css 查看文件

1
+* {
2
+    -webkit-user-select: none;
3
+    user-select: none;
4
+}
5
+
1
 html, body{
6
 html, body{
2
     margin:0px;
7
     margin:0px;
3
     height:100%;
8
     height:100%;
30
     border-left:1px solid #424242;
35
     border-left:1px solid #424242;
31
 }
36
 }
32
 
37
 
38
+#chatspace * {
39
+    -webkit-user-select: text;
40
+    user-select: text;
41
+}
33
 #chatconversation {
42
 #chatconversation {
34
     visibility: hidden;
43
     visibility: hidden;
35
     position: relative;
44
     position: relative;

+ 4
- 4
index.html 查看文件

37
     <script src="app.js?v=13"></script><!-- application logic -->
37
     <script src="app.js?v=13"></script><!-- application logic -->
38
     <script src="commands.js?v=1"></script><!-- application logic -->
38
     <script src="commands.js?v=1"></script><!-- application logic -->
39
     <script src="chat.js?v=11"></script><!-- chat logic -->
39
     <script src="chat.js?v=11"></script><!-- chat logic -->
40
-    <script src="contact_list.js?v=3"></script><!-- contact list logic -->
40
+    <script src="contact_list.js?v=4"></script><!-- contact list logic -->
41
     <script src="util.js?v=6"></script><!-- utility functions -->
41
     <script src="util.js?v=6"></script><!-- utility functions -->
42
     <script src="etherpad.js?v=9"></script><!-- etherpad plugin -->
42
     <script src="etherpad.js?v=9"></script><!-- etherpad plugin -->
43
     <script src="prezi.js?v=6"></script><!-- prezi plugin -->
43
     <script src="prezi.js?v=6"></script><!-- prezi plugin -->
47
     <script src="analytics.js?v=1"></script><!-- google analytics plugin -->
47
     <script src="analytics.js?v=1"></script><!-- google analytics plugin -->
48
     <script src="rtp_sts.js?v=1"></script><!-- RTP stats processing -->
48
     <script src="rtp_sts.js?v=1"></script><!-- RTP stats processing -->
49
     <script src="local_sts.js?v=1"></script><!-- Local stats processing -->
49
     <script src="local_sts.js?v=1"></script><!-- Local stats processing -->
50
-    <script src="videolayout.js?v=11"></script><!-- video ui -->
50
+    <script src="videolayout.js?v=12"></script><!-- video ui -->
51
     <script src="toolbar.js?v=6"></script><!-- toolbar ui -->
51
     <script src="toolbar.js?v=6"></script><!-- toolbar ui -->
52
     <script src="toolbar_toggler.js?v=2"></script>
52
     <script src="toolbar_toggler.js?v=2"></script>
53
     <script src="canvas_util.js?v=1"></script><!-- canvas drawing utils -->
53
     <script src="canvas_util.js?v=1"></script><!-- canvas drawing utils -->
60
     <script src="message_handler.js?v=1"></script>
60
     <script src="message_handler.js?v=1"></script>
61
     <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
61
     <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
62
     <link rel="stylesheet" href="css/font.css?v=4"/>
62
     <link rel="stylesheet" href="css/font.css?v=4"/>
63
-    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=25"/>
63
+    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=26"/>
64
     <link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=12" id="videolayout_default"/>
64
     <link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=12" id="videolayout_default"/>
65
     <link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
65
     <link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
66
     <link rel="stylesheet" href="css/modaldialog.css?v=3">
66
     <link rel="stylesheet" href="css/modaldialog.css?v=3">
67
     <link rel="stylesheet" href="css/popup_menu.css?v=4">
67
     <link rel="stylesheet" href="css/popup_menu.css?v=4">
68
     <link rel="stylesheet" href="css/popover.css?v=2">
68
     <link rel="stylesheet" href="css/popover.css?v=2">
69
-    <link rel="stylesheet" href="css/contact_list.css?v=2">
69
+    <link rel="stylesheet" href="css/contact_list.css?v=3">
70
     <link rel="stylesheet" href="css/welcome_page.css?v=2">
70
     <link rel="stylesheet" href="css/welcome_page.css?v=2">
71
     <!--
71
     <!--
72
         Link used for inline installation of chrome desktop streaming extension,
72
         Link used for inline installation of chrome desktop streaming extension,

+ 2
- 0
videolayout.js 查看文件

507
 
507
 
508
         VideoLayout.resizeThumbnails();
508
         VideoLayout.resizeThumbnails();
509
 
509
 
510
+        ContactList.setClickable(resourceJid, isShow);
511
+
510
     };
512
     };
511
 
513
 
512
     /**
514
     /**

Loading…
取消
儲存