client/assets/src/views/serverselect.js

   1 _kiwi.view.ServerSelect = function () {
   2     // Are currently showing all the controlls or just a nick_change box?
   3     var state = 'all';
   4
   5     var model = Backbone.View.extend({
   6         events: {
   7             'submit form': 'submitForm',
   8             'click .show_more': 'showMore',
   9             'change .have_pass input': 'showPass',
  10             'change .have_key input': 'showKey',
  11             'click .icon-key': 'channelKeyIconClick'
  12         },
  13
  14         initialize: function () {
  15             var that = this,
  16                 text = {
  17                     think_nick: _kiwi.global.i18n.translate('Think of a nickname...').fetch(),
  18                     nickname: _kiwi.global.i18n.translate('Nickname').fetch(),
  19                     have_password: _kiwi.global.i18n.translate('I have a password').fetch(),
  20                     password: _kiwi.global.i18n.translate('Password').fetch(),
  21                     channel: _kiwi.global.i18n.translate('Channel').fetch(),
  22                     channel_key: _kiwi.global.i18n.translate('Channel Key').fetch(),
  23                     require_key: _kiwi.global.i18n.translate('Channel requires a key').fetch(),
  24                     key: _kiwi.global.i18n.translate('Key').fetch(),
  25                     start: _kiwi.global.i18n.translate('Start...').fetch(),
  26                     server_network: _kiwi.global.i18n.translate('Server and network').fetch(),
  27                     server: _kiwi.global.i18n.translate('Server').fetch(),
  28                     port: _kiwi.global.i18n.translate('Port').fetch(),
  29                     powered_by: _kiwi.global.i18n.translate('Powered by Kiwi IRC').fetch()
  30                 };
  31
  32             this.$el = $(_.template($('#tmpl_server_select').html().trim(), text));
  33
  34             // Remove the 'more' link if the server has disabled server changing
  35             if (_kiwi.app.server_settings && _kiwi.app.server_settings.connection) {
  36                 if (!_kiwi.app.server_settings.connection.allow_change) {
  37                     this.$el.find('.show_more').remove();
  38                     this.$el.addClass('single_server');
  39                 }
  40             }
  41
  42             this.more_shown = false;
  43
  44             _kiwi.gateway.bind('onconnect', this.networkConnected, this);
  45             _kiwi.gateway.bind('connecting', this.networkConnecting, this);
  46             _kiwi.gateway.bind('onirc_error', this.onIrcError, this);
  47         },
  48
  49         dispose: function() {
  50             _kiwi.gateway.off('onconnect', this.networkConnected, this);
  51             _kiwi.gateway.off('connecting', this.networkConnecting, this);
  52             _kiwi.gateway.off('onirc_error', this.onIrcError, this);
  53
  54             this.$el.remove();
  55         },
  56
  57         submitForm: function (event) {
  58             event.preventDefault();
  59
  60             // Make sure a nick is chosen
  61             if (!$('input.nick', this.$el).val().trim()) {
  62                 this.setStatus(_kiwi.global.i18n.translate('Select a nickname first!').fetch());
  63                 $('input.nick', this.$el).select();
  64                 return;
  65             }
  66
  67             if (state === 'nick_change') {
  68                 this.submitNickChange(event);
  69             } else {
  70                 this.submitLogin(event);
  71             }
  72
  73             $('button', this.$el).attr('disabled', 1);
  74             return;
  75         },
  76
  77         submitLogin: function (event) {
  78             // If submitting is disabled, don't do anything
  79             if ($('button', this.$el).attr('disabled')) return;
  80
  81             var values = {
  82                 nick: $('input.nick', this.$el).val(),
  83                 server: $('input.server', this.$el).val(),
  84                 port: $('input.port', this.$el).val(),
  85                 ssl: $('input.ssl', this.$el).prop('checked'),
  86                 password: $('input.password', this.$el).val(),
  87                 channel: $('input.channel', this.$el).val(),
  88                 channel_key: $('input.channel_key', this.$el).val()
  89             };
  90
  91             this.trigger('server_connect', values);
  92         },
  93
  94         submitNickChange: function (event) {
  95             _kiwi.gateway.changeNick(null, $('input.nick', this.$el).val());
  96             this.networkConnecting();
  97         },
  98
  99         showPass: function (event) {
 100             if (this.$el.find('tr.have_pass input').is(':checked')) {
 101                 this.$el.find('tr.pass').show().find('input').focus();
 102             } else {
 103                 this.$el.find('tr.pass').hide().find('input').val('');
 104             }
 105         },
 106
 107         channelKeyIconClick: function (event) {
 108             this.$el.find('tr.have_key input').click();
 109         },
 110
 111         showKey: function (event) {
 112             if (this.$el.find('tr.have_key input').is(':checked')) {
 113                 this.$el.find('tr.key').show().find('input').focus();
 114             } else {
 115                 this.$el.find('tr.key').hide().find('input').val('');
 116             }
 117         },
 118
 119         showMore: function (event) {
 120             if (!this.more_shown) {
 121                 $('.more', this.$el).slideDown('fast');
 122                 $('.show_more', this.$el)
 123                     .children('.icon-caret-down')
 124                     .removeClass('icon-caret-down')
 125                     .addClass('icon-caret-up');
 126                 $('input.server', this.$el).select();
 127                 this.more_shown = true;
 128             } else {
 129                 $('.more', this.$el).slideUp('fast');
 130                 $('.show_more', this.$el)
 131                     .children('.icon-caret-up')
 132                     .removeClass('icon-caret-up')
 133                     .addClass('icon-caret-down');
 134                 $('input.nick', this.$el).select();
 135                 this.more_shown = false;
 136             }
 137         },
 138
 139         populateFields: function (defaults) {
 140             var nick, server, port, channel, channel_key, ssl, password;
 141
 142             defaults = defaults || {};
 143
 144             nick = defaults.nick || '';
 145             server = defaults.server || '';
 146             port = defaults.port || 6667;
 147             ssl = defaults.ssl || 0;
 148             password = defaults.password || '';
 149             channel = defaults.channel || '';
 150             channel_key = defaults.channel_key || '';
 151
 152             $('input.nick', this.$el).val(nick);
 153             $('input.server', this.$el).val(server);
 154             $('input.port', this.$el).val(port);
 155             $('input.ssl', this.$el).prop('checked', ssl);
 156             $('input#server_select_show_pass', this.$el).prop('checked', !(!password));
 157             $('input.password', this.$el).val(password);
 158             if (!(!password)) {
 159                 $('tr.pass', this.$el).show();
 160             }
 161             $('input.channel', this.$el).val(channel);
 162             $('input#server_select_show_channel_key', this.$el).prop('checked', !(!channel_key));
 163             $('input.channel_key', this.$el).val(channel_key);
 164             if (!(!channel_key)) {
 165                 $('tr.key', this.$el).show();
 166             }
 167         },
 168
 169         hide: function () {
 170             this.$el.slideUp();
 171         },
 172
 173         show: function (new_state) {
 174             new_state = new_state || 'all';
 175
 176             this.$el.show();
 177
 178             if (new_state === 'all') {
 179                 $('.show_more', this.$el).show();
 180
 181             } else if (new_state === 'more') {
 182                 $('.more', this.$el).slideDown('fast');
 183
 184             } else if (new_state === 'nick_change') {
 185                 $('.more', this.$el).hide();
 186                 $('.show_more', this.$el).hide();
 187                 $('input.nick', this.$el).select();
 188             }
 189
 190             state = new_state;
 191         },
 192
 193         infoBoxShow: function() {
 194             var $side_panel = this.$el.find('.side_panel');
 195
 196             // Some theme may hide the info panel so check before we
 197             // resize ourselves
 198             if (!$side_panel.is(':visible'))
 199                 return;
 200
 201             this.$el.animate({
 202                 width: parseInt($side_panel.css('left'), 10) + $side_panel.find('.content:first').outerWidth()
 203             });
 204         },
 205
 206         infoBoxHide: function() {
 207             var $side_panel = this.$el.find('.side_panel');
 208             this.$el.animate({
 209                 width: parseInt($side_panel.css('left'), 10)
 210             });
 211         },
 212
 213         infoBoxSet: function($info_view) {
 214             this.$el.find('.side_panel .content')
 215                 .empty()
 216                 .append($info_view);
 217         },
 218
 219         setStatus: function (text, class_name) {
 220             $('.status', this.$el)
 221                 .text(text)
 222                 .attr('class', 'status')
 223                 .addClass(class_name||'')
 224                 .show();
 225         },
 226         clearStatus: function () {
 227             $('.status', this.$el).hide();
 228         },
 229
 230         networkConnected: function (event) {
 231             this.setStatus(_kiwi.global.i18n.translate('Connected').fetch() + ' :)', 'ok');
 232             $('form', this.$el).hide();
 233         },
 234
 235         networkConnecting: function (event) {
 236             this.setStatus(_kiwi.global.i18n.translate('Connecting..').fetch(), 'ok');
 237         },
 238
 239         onIrcError: function (data) {
 240             $('button', this.$el).attr('disabled', null);
 241
 242             switch(data.error) {
 243             case 'nickname_in_use':
 244                 this.setStatus(_kiwi.global.i18n.translate('Nickname already taken').fetch());
 245                 this.show('nick_change');
 246                 this.$el.find('.nick').select();
 247                 break;
 248             case 'erroneus_nickname':
 249                 this.setStatus(_kiwi.global.i18n.translate('Erroneus nickname').fetch());
 250                 this.show('nick_change');
 251                 this.$el.find('.nick').select();
 252                 break;
 253             case 'password_mismatch':
 254                 this.setStatus(_kiwi.global.i18n.translate('Incorrect Password').fetch());
 255                 this.show('nick_change');
 256                 this.$el.find('.password').select();
 257                 break;
 258             }
 259         },
 260
 261         showError: function (error_reason) {
 262             var err_text = _kiwi.global.i18n.translate('Error Connecting').fetch();
 263
 264             if (error_reason) {
 265                 switch (error_reason) {
 266                 case 'ENOTFOUND':
 267                     err_text = _kiwi.global.i18n.translate('Server not found').fetch();
 268                     break;
 269
 270                 case 'ECONNREFUSED':
 271                     err_text += ' (' + _kiwi.global.i18n.translate('Connection refused').fetch() + ')';
 272                     break;
 273
 274                 default:
 275                     err_text += ' (' + error_reason + ')';
 276                 }
 277             }
 278
 279             this.setStatus(err_text, 'error');
 280             $('button', this.$el).attr('disabled', null);
 281             this.show();
 282         }
 283     });
 284
 285
 286     return new model(arguments);
 287 };