Forked mumble-django project from https://bitbucket.org/Svedrin/mumble-django
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

241 lines
9.4 KiB

  1. // kate: space-indent on; indent-width 4; replace-tabs on;
  2. Ext.namespace('Ext.ux');
  3. if( typeof gettext == "undefined" ){
  4. // Cope with Django's jsi18n not being available by adding dummy gettext
  5. gettext = function( text ){
  6. return text;
  7. };
  8. gettext_noop = gettext;
  9. }
  10. Ext.ux.MumbleChannelNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
  11. renderElements : function(n, a, targetNode, bulkRender){
  12. Ext.ux.MumbleUserNodeUI.superclass.renderElements.call( this, n, a, targetNode, bulkRender );
  13. Ext.DomHelper.applyStyles( this.elNode, 'position: relative' );
  14. var tpl = new Ext.DomHelper.createTemplate(
  15. '<img style="position: absolute; top: 0px; right: {pos}px;" src="{imageurl}/{icon}.png"/>'
  16. );
  17. var icons = []
  18. if( a.chandata.description != "" ) icons.push( "comment_seen" );
  19. var pos = 8;
  20. for( var i = 0; i < icons.length; i++ ){
  21. tpl.append( this.elNode, {'imageurl': a.imageurl, 'icon': icons[i], 'pos': pos} );
  22. pos += 18
  23. }
  24. }
  25. });
  26. Ext.ux.MumbleUserNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
  27. renderElements : function(n, a, targetNode, bulkRender){
  28. Ext.ux.MumbleUserNodeUI.superclass.renderElements.call( this, n, a, targetNode, bulkRender );
  29. Ext.DomHelper.applyStyles( this.elNode, 'position: relative' );
  30. var tpl = new Ext.DomHelper.createTemplate(
  31. '<img style="position: absolute; top: 0px; right: {pos}px;" src="{imageurl}/{icon}.png"/>'
  32. );
  33. var icons = []
  34. if( a.userdata.userid != -1 ) icons.push( "authenticated" );
  35. if( a.userdata.selfDeaf ) icons.push( "deafened_self" );
  36. if( a.userdata.deaf ) icons.push( "deafened_server" );
  37. if( a.userdata.selfMute ) icons.push( "muted_self" );
  38. if( a.userdata.suppress ) icons.push( "muted_suppressed" );
  39. if( a.userdata.mute ) icons.push( "muted_server" );
  40. if( a.userdata.comment != "" ) icons.push( "comment_seen" );
  41. if( a.userdata.prioritySpeaker ) icons.push( "priority_speaker" );
  42. var pos = 8;
  43. for( var i = 0; i < icons.length; i++ ){
  44. tpl.append( this.elNode, {'imageurl': a.imageurl, 'icon': icons[i], 'pos': pos} );
  45. pos += 18
  46. }
  47. }
  48. });
  49. function cmp_channels( left, rite ){
  50. // Compare two channels, first by position, and if that equals, by name.
  51. if( typeof left.position != "undefined" && typeof rite.position != "undefined" ){
  52. byorder = left.position - rite.position;
  53. if( byorder != 0 )
  54. return byorder;
  55. }
  56. return left.name.localeCompare(rite.name);
  57. }
  58. function cmp_names( left, rite ){
  59. return left.name.localeCompare(rite.name);
  60. }
  61. Ext.ux.MumbleChannelViewer = function( config ){
  62. Ext.apply( this, config );
  63. Ext.applyIf( this, {
  64. title: gettext("Channel Viewer"),
  65. refreshInterval: 30000,
  66. idleInterval: 2,
  67. autoScroll: true,
  68. enableDD: false, // Users need to enable this explicitly
  69. root: {
  70. text: gettext("Loading..."),
  71. leaf: true
  72. },
  73. listeners: {}
  74. });
  75. Ext.applyIf( this.listeners, {
  76. dragdrop: function( tree, node, targetdd, ev ){
  77. if( typeof node.attributes.userdata != "undefined" )
  78. tree.fireEvent("moveUser", tree, node.attributes.userdata, targetdd.dragOverData.target.attributes.chandata);
  79. else if( typeof node.attributes.chandata != "undefined" )
  80. tree.fireEvent("moveChannel", tree, node.attributes.chandata, targetdd.dragOverData.target.attributes.chandata);
  81. }
  82. });
  83. Ext.applyIf( this, {
  84. // This stuff needs the above applied already
  85. bbar: [ gettext("Auto-Refresh")+':', {
  86. xtype: "checkbox",
  87. ref: "../cbAutoRefresh",
  88. scope: this,
  89. handler: this.setAutoRefresh,
  90. checked: (this.refreshInterval > 0),
  91. }, {
  92. xtype: "numberfield",
  93. width: 30,
  94. value: this.refreshInterval / 1000,
  95. ref: "../nfAutoRefreshInterval",
  96. scope: this,
  97. selectOnFocus: true,
  98. listeners: {
  99. render: function(c) {
  100. Ext.QuickTips.register({
  101. target: c.getEl(),
  102. text: gettext('Enter the interval in seconds in which the channel viewer should refresh and hit Enter.')
  103. });
  104. },
  105. specialkey: function( field, ev ){
  106. if( ev.getKey() == ev.ENTER ){
  107. this.scope.setAutoRefresh(); // lawl
  108. this.blur();
  109. }
  110. }
  111. },
  112. }, gettext("Seconds"), '->', {
  113. xtype: "button",
  114. text: gettext("Refresh"),
  115. handler: this.refresh,
  116. scope: this
  117. }]
  118. } );
  119. Ext.ux.MumbleChannelViewer.superclass.constructor.call( this );
  120. this.addEvents({
  121. 'moveUser': true,
  122. 'moveChannel': true
  123. });
  124. this.autoRefreshId = 0;
  125. this.setAutoRefresh();
  126. }
  127. Ext.extend( Ext.ux.MumbleChannelViewer, Ext.tree.TreePanel, {
  128. setAutoRefresh: function(){
  129. if( this.autoRefreshId != 0 ){
  130. clearTimeout( this.autoRefreshId );
  131. }
  132. if( this.cbAutoRefresh.getValue() ){
  133. this.refreshInterval = this.nfAutoRefreshInterval.getValue() * 1000;
  134. this.autoRefresh();
  135. }
  136. else{
  137. this.refreshInterval = 0;
  138. }
  139. },
  140. autoRefresh: function(){
  141. this.refresh();
  142. if( this.refreshInterval > 0 ){
  143. this.autoRefreshId = this.autoRefresh.defer( this.refreshInterval, this );
  144. }
  145. },
  146. refresh: function(){
  147. var conn = new Ext.data.Connection();
  148. conn.request({
  149. url: this.source_url,
  150. scope: this,
  151. success: function( resp, opt ){
  152. var respdata = Ext.decode( resp.responseText );
  153. var root = {
  154. text: respdata.name,
  155. nodeType: 'async',
  156. id: "mumbroot",
  157. leaf: false,
  158. icon: this.imageurl+'/mumble.16x16.png',
  159. children: [],
  160. chandata: respdata.root,
  161. imageurl: this.imageurl
  162. };
  163. tree = this;
  164. function populateNode( node, json ){
  165. var subchan_users = 0;
  166. json.channels.sort(cmp_channels);
  167. for( var i = 0; i < json.channels.length; i++ ){
  168. var child = {
  169. text: json.channels[i].name,
  170. id: ("channel_" + json.channels[i].id),
  171. nodeType: 'async',
  172. allowDrag: true,
  173. allowDrop: true,
  174. draggable: true,
  175. icon: tree.imageurl+'/channel.png',
  176. children: [],
  177. uiProvider: Ext.ux.MumbleChannelNodeUI,
  178. chandata: json.channels[i],
  179. imageurl: tree.imageurl
  180. };
  181. node.children.push( child );
  182. subchan_users += populateNode( child, json.channels[i] );
  183. }
  184. json.users.sort(cmp_names);
  185. for( var i = 0; i < json.users.length; i++ ){
  186. var child = {
  187. text: json.users[i].name,
  188. id: ("user_" + json.users[i].session),
  189. nodeType: 'async',
  190. leaf: true,
  191. allowDrag: true,
  192. draggable: true,
  193. uiProvider: Ext.ux.MumbleUserNodeUI,
  194. userdata: json.users[i],
  195. imageurl: tree.imageurl
  196. };
  197. if( json.users[i].idlesecs <= this.idleInterval )
  198. child.icon = tree.imageurl+'/talking_on.png';
  199. else
  200. child.icon = tree.imageurl+'/talking_off.png';
  201. node.leaf = false;
  202. node.children.push( child );
  203. }
  204. if( json.id == 0 || json.users.length > 0 || subchan_users )
  205. node.expanded = true;
  206. return subchan_users + json.users.length;
  207. }
  208. populateNode( root, respdata.root );
  209. this.setRootNode( root );
  210. },
  211. failure: function( resp, opt ){
  212. if( this.refreshInterval > 0 )
  213. this.cbAutoRefresh.setValue(false);
  214. Ext.Msg.show({
  215. title: gettext("Update error"),
  216. msg: gettext("Querying the server failed, so the channel viewer has not been updated."),
  217. icon: Ext.MessageBox.ERROR,
  218. buttons: Ext.MessageBox.OK
  219. });
  220. },
  221. });
  222. },
  223. } );
  224. Ext.reg( 'mumblechannelviewer', Ext.ux.MumbleChannelViewer );