js/util.js

   1 /*
   2  * StatusNet - a distributed open-source microblogging tool
   3  * Copyright (C) 2008, StatusNet, Inc.
   4  *
   5  * This program is free software: you can redistribute it and/or modify
   6  * it under the terms of the GNU Affero General Public License as published by
   7  * the Free Software Foundation, either version 3 of the License, or
   8  * (at your option) any later version.
   9  *
  10  * This program is distributed in the hope that it will be useful,
  11  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  12  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  13  * GNU Affero General Public License for more details.
  14  *
  15  * You should have received a copy of the GNU Affero General Public License
  16  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  17  *
  18  * @category  UI interaction
  19  * @package   StatusNet
  20  * @author    Sarven Capadisli <csarven@status.net>
  21  * @author    Evan Prodromou <evan@status.net>
  22  * @author    Brion Vibber <brion@status.net>
  23  * @copyright 2009,2010 StatusNet, Inc.
  24  * @license   http://www.fsf.org/licensing/licenses/agpl-3.0.html GNU Affero General Public License version 3.0
  25  * @link      http://status.net/
  26  */
  27
  28 var SN = { // StatusNet
  29     C: { // Config
  30         I: { // Init
  31             CounterBlackout: false,
  32             MaxLength: 140,
  33             PatternUsername: /^[0-9a-zA-Z\-_.]*$/,
  34             HTTP20x30x: [200, 201, 202, 203, 204, 205, 206, 300, 301, 302, 303, 304, 305, 306, 307],
  35         },
  36
  37         /**
  38          * @fixme are these worth the trouble? They seem to mostly just duplicate
  39          * themselves while slightly obscuring the actual selector, so it's hard
  40          * to pop over to the HTML and find something.
  41          *
  42          * In theory, minification could reduce them to shorter variable names,
  43          * but at present that doesn't happen with yui-compressor.
  44          */
  45         S: { // Selector
  46             Disabled: 'disabled',
  47             Warning: 'warning',
  48             Error: 'error',
  49             Success: 'success',
  50             Processing: 'processing',
  51             CommandResult: 'command_result',
  52             FormNotice: 'form_notice',
  53             NoticeDataGeo: 'notice_data-geo',
  54             NoticeDataGeoCookie: 'NoticeDataGeo',
  55             NoticeDataGeoSelected: 'notice_data-geo_selected',
  56             StatusNetInstance: 'StatusNetInstance'
  57         }
  58     },
  59
  60     V: {    // Variables
  61     },
  62
  63     /**
  64      * Map of localized message strings exported to script from the PHP
  65      * side via Action::getScriptMessages().
  66      *
  67      * Retrieve them via SN.msg(); this array is an implementation detail.
  68      *
  69      * @access private
  70      */
  71     messages: {},
  72
  73     /**
  74      * Grabs a localized string that's been previously exported to us
  75      * from server-side code via Action::getScriptMessages().
  76      *
  77      * @example alert(SN.msg('coolplugin-failed'));
  78      *
  79      * @param {String} key: string key name to pull from message index
  80      * @return matching localized message string
  81      */
  82     msg: function (key) {
  83         if (SN.messages[key] === undefined) {
  84             return '[' + key + ']';
  85         }
  86         return SN.messages[key];
  87     },
  88
  89     U: { // Utils
  90         /**
  91          * Setup function -- DOES NOT trigger actions immediately.
  92          *
  93          * Sets up event handlers on the new notice form.
  94          *
  95          * @param {jQuery} form: jQuery object whose first matching element is the form
  96          * @access private
  97          */
  98         FormNoticeEnhancements: function (form) {
  99             if ($.data(form[0], 'ElementData') === undefined) {
 100                 var MaxLength = form.find('.count').text();
 101                 if (MaxLength === undefined) {
 102                     MaxLength = SN.C.I.MaxLength;
 103                 }
 104                 $.data(form[0], 'ElementData', {MaxLength: MaxLength});
 105
 106                 SN.U.Counter(form);
 107
 108                 var NDT = form.find('.notice_data-text:first');
 109
 110                 NDT.on('keyup', function (e) {
 111                     SN.U.Counter(form);
 112                 });
 113
 114                 var delayedUpdate = function (e) {
 115                     // Cut and paste events fire *before* the operation,
 116                     // so we need to trigger an update in a little bit.
 117                     // This would be so much easier if the 'change' event
 118                     // actually fired every time the value changed. :P
 119                     window.setTimeout(function () {
 120                         SN.U.Counter(form);
 121                     }, 50);
 122                 };
 123                 // Note there's still no event for mouse-triggered 'delete'.
 124                 NDT.on('cut', delayedUpdate)
 125                     .on('paste', delayedUpdate);
 126             } else {
 127                 form.find('.count').text($.data(form[0], 'ElementData').MaxLength);
 128             }
 129         },
 130
 131         /**
 132          * To be called from event handlers on the notice import form.
 133          * Triggers an update of the remaining-characters counter.
 134          *
 135          * Additional counter updates will be suppressed during the
 136          * next half-second to avoid flooding the layout engine with
 137          * updates, followed by another automatic check.
 138          *
 139          * The maximum length is pulled from data established by
 140          * FormNoticeEnhancements.
 141          *
 142          * @param {jQuery} form: jQuery object whose first element is the notice posting form
 143          * @access private
 144          */
 145         Counter: function (form) {
 146             SN.C.I.FormNoticeCurrent = form;
 147
 148             var MaxLength = $.data(form[0], 'ElementData').MaxLength;
 149
 150             if (MaxLength <= 0) {
 151                 return;
 152             }
 153
 154             var remaining = MaxLength - SN.U.CharacterCount(form);
 155             var counter = form.find('.count');
 156
 157             if (remaining.toString() != counter.text()) {
 158                 if (!SN.C.I.CounterBlackout || remaining === 0) {
 159                     if (counter.text() != String(remaining)) {
 160                         counter.text(remaining);
 161                     }
 162                     if (remaining < 0) {
 163                         form.addClass(SN.C.S.Warning);
 164                     } else {
 165                         form.removeClass(SN.C.S.Warning);
 166                     }
 167                     // Skip updates for the next 500ms.
 168                     // On slower hardware, updating on every keypress is unpleasant.
 169                     if (!SN.C.I.CounterBlackout) {
 170                         SN.C.I.CounterBlackout = true;
 171                         SN.C.I.FormNoticeCurrent = form;
 172                         window.setTimeout("SN.U.ClearCounterBlackout(SN.C.I.FormNoticeCurrent);", 500);
 173                     }
 174                 }
 175             }
 176         },
 177
 178         /**
 179          * Pull the count of characters in the current edit field.
 180          * Plugins replacing the edit control may need to override this.
 181          *
 182          * @param {jQuery} form: jQuery object whose first element is the notice posting form
 183          * @return number of chars
 184          */
 185         CharacterCount: function (form) {
 186             return form.find('.notice_data-text:first').val().length;
 187         },
 188
 189         /**
 190          * Called internally after the counter update blackout period expires;
 191          * runs another update to make sure we didn't miss anything.
 192          *
 193          * @param {jQuery} form: jQuery object whose first element is the notice posting form
 194          * @access private
 195          */
 196         ClearCounterBlackout: function (form) {
 197             // Allow keyup events to poke the counter again
 198             SN.C.I.CounterBlackout = false;
 199             // Check if the string changed since we last looked
 200             SN.U.Counter(form);
 201         },
 202
 203         /**
 204          * Helper function to rewrite default HTTP form action URLs to HTTPS
 205          * so we can actually fetch them when on an SSL page in ssl=sometimes
 206          * mode.
 207          *
 208          * It would be better to output URLs that didn't hardcode protocol
 209          * and hostname in the first place...
 210          *
 211          * @param {String} url
 212          * @return string
 213          */
 214         RewriteAjaxAction: function (url) {
 215             // Quick hack: rewrite AJAX submits to HTTPS if they'd fail otherwise.
 216             if (document.location.protocol === 'https:' && url.substr(0, 5) === 'http:') {
 217                 return url.replace(/^http:\/\/[^:\/]+/, 'https://' + document.location.host);
 218             }
 219             return url;
 220         },
 221
 222         FormNoticeUniqueID: function (form) {
 223             var oldId = form.attr('id');
 224             var newId = 'form_notice_' + Math.floor(Math.random()*999999999);
 225             var attrs = ['name', 'for', 'id'];
 226             for (var key in attrs) {
 227                 if (form.attr(attrs[key]) === undefined) {
 228                     continue;
 229                 }
 230                 form.attr(attrs[key], form.attr(attrs[key]).replace(oldId, newId));
 231             }
 232             for (var key in attrs) {
 233                 form.find("[" + attrs[key] + "*='" + oldId + "']").each(function () {
 234                         if ($(this).attr(attrs[key]) === undefined) {
 235                             return; // since we're inside the each(function () { ... });
 236                         }
 237                         var newAttr = $(this).attr(attrs[key]).replace(oldId, newId);
 238                         $(this).attr(attrs[key], newAttr);
 239                     });
 240             }
 241         },
 242
 243         /**
 244          * Grabs form data and submits it asynchronously, with 'ajax=1'
 245          * parameter added to the rest.
 246          *
 247          * If a successful response includes another form, that form
 248          * will be extracted and copied in, replacing the original form.
 249          * If there's no form, the first paragraph will be used.
 250          *
 251          * This will automatically be applied on the 'submit' event for
 252          * any form with the 'ajax' class.
 253          *
 254          * @fixme can sometimes explode confusingly if returnd data is bogus
 255          * @fixme error handling is pretty vague
 256          * @fixme can't submit file uploads
 257          *
 258          * @param {jQuery} form: jQuery object whose first element is a form
 259          * @param function onSuccess: something extra to do on success
 260          *
 261          * @access public
 262          */
 263         FormXHR: function (form, onSuccess) {
 264             $.ajax({
 265                 type: 'POST',
 266                 dataType: 'xml',
 267                 url: SN.U.RewriteAjaxAction(form.attr('action')),
 268                 data: form.serialize() + '&ajax=1',
 269                 beforeSend: function (xhr) {
 270                     form
 271                         .addClass(SN.C.S.Processing)
 272                         .find('.submit')
 273                             .addClass(SN.C.S.Disabled)
 274                             .prop(SN.C.S.Disabled, true);
 275                 },
 276                 error: function (xhr, textStatus, errorThrown) {
 277                     // If the server end reported an error from StatusNet,
 278                     // find it -- otherwise we'll see what was reported
 279                     // from the browser.
 280                     var errorReported = null;
 281                     if (xhr.responseXML) {
 282                         errorReported = $('#error', xhr.responseXML).text();
 283                     }
 284                     window.alert(errorReported || errorThrown || textStatus);
 285
 286                     // Restore the form to original state.
 287                     // Hopefully. :D
 288                     form
 289                         .removeClass(SN.C.S.Processing)
 290                         .find('.submit')
 291                             .removeClass(SN.C.S.Disabled)
 292                             .prop(SN.C.S.Disabled, false);
 293                 },
 294                 success: function (data, textStatus) {
 295                     if ($('form', data)[0] !== undefined) {
 296                         var form_new = document._importNode($('form', data)[0], true);
 297                         form.replaceWith(form_new);
 298                         if (onSuccess) {
 299                             onSuccess();
 300                         }
 301                     } else if ($('p', data)[0] !== undefined) {
 302                         form.replaceWith(document._importNode($('p', data)[0], true));
 303                         if (onSuccess) {
 304                             onSuccess();
 305                         }
 306                     } else {
 307                         window.alert('Unknown error.');
 308                     }
 309                 }
 310             });
 311         },
 312
 313         /**
 314          * Setup function -- DOES NOT trigger actions immediately.
 315          *
 316          * Sets up event handlers for special-cased async submission of the
 317          * notice-posting form, including some pre-post validation.
 318          *
 319          * Unlike FormXHR() this does NOT submit the form immediately!
 320          * It sets up event handlers so that any method of submitting the
 321          * form (click on submit button, enter, submit() etc) will trigger
 322          * it properly.
 323          *
 324          * Also unlike FormXHR(), this system will use a hidden iframe
 325          * automatically to handle file uploads via <input type="file">
 326          * controls.
 327          *
 328          * @fixme tl;dr
 329          * @fixme vast swaths of duplicate code and really long variable names clutter this function up real bad
 330          * @fixme error handling is unreliable
 331          * @fixme cookieValue is a global variable, but probably shouldn't be
 332          * @fixme saving the location cache cookies should be split out
 333          * @fixme some error messages are hardcoded english: needs i18n
 334          *
 335          * @param {jQuery} form: jQuery object whose first element is a form
 336          *
 337          * @access public
 338          */
 339         FormNoticeXHR: function (form) {
 340             SN.C.I.NoticeDataGeo = {};
 341             form.append('<input type="hidden" name="ajax" value="1"/>');
 342
 343             // Make sure we don't have a mixed HTTP/HTTPS submission...
 344             form.attr('action', SN.U.RewriteAjaxAction(form.attr('action')));
 345
 346             /**
 347              * Hide the previous response feedback, if any.
 348              */
 349             var removeFeedback = function () {
 350                 form.find('.form_response').remove();
 351             };
 352
 353             form.ajaxForm({
 354                 dataType: 'xml',
 355                 timeout: '60000',
 356                 beforeSend: function (formData) {
 357                     if (form.find('.notice_data-text:first').val() == '') {
 358                         form.addClass(SN.C.S.Warning);
 359                         return false;
 360                     }
 361                     form
 362                         .addClass(SN.C.S.Processing)
 363                         .find('.submit')
 364                             .addClass(SN.C.S.Disabled)
 365                             .prop(SN.C.S.Disabled, true);
 366
 367                     SN.U.normalizeGeoData(form);
 368
 369                     return true;
 370                 },
 371                 error: function (xhr, textStatus, errorThrown) {
 372                     form
 373                         .removeClass(SN.C.S.Processing)
 374                         .find('.submit')
 375                             .removeClass(SN.C.S.Disabled)
 376                             .prop(SN.C.S.Disabled, false);
 377                     removeFeedback();
 378                     if (textStatus == 'timeout') {
 379                         // @fixme i18n
 380                         SN.U.showFeedback(form, 'error', 'Sorry! We had trouble sending your notice. The servers are overloaded. Please try again, and contact the site administrator if this problem persists.');
 381                     } else {
 382                         var response = SN.U.GetResponseXML(xhr);
 383                         if ($('.' + SN.C.S.Error, response).length > 0) {
 384                             form.append(document._importNode($('.' + SN.C.S.Error, response)[0], true));
 385                         } else {
 386                             if (parseInt(xhr.status) === 0 || $.inArray(parseInt(xhr.status), SN.C.I.HTTP20x30x) >= 0) {
 387                                 form
 388                                     .resetForm()
 389                                     .find('.attach-status').remove();
 390                                 SN.U.FormNoticeEnhancements(form);
 391                             } else {
 392                                 // @fixme i18n
 393                                 SN.U.showFeedback(form, 'error', '(Sorry! We had trouble sending your notice (' + xhr.status + ' ' + xhr.statusText + '). Please report the problem to the site administrator if this happens again.');
 394                             }
 395                         }
 396                     }
 397                 },
 398                 success: function (data, textStatus) {
 399                     removeFeedback();
 400                     var errorResult = $('#' + SN.C.S.Error, data);
 401                     if (errorResult.length > 0) {
 402                         SN.U.showFeedback(form, 'error', errorResult.text());
 403                     } else {
 404                         SN.E.ajaxNoticePosted(form, data, textStatus);
 405                     }
 406                 },
 407                 complete: function (xhr, textStatus) {
 408                     form
 409                         .removeClass(SN.C.S.Processing)
 410                         .find('.submit')
 411                             .prop(SN.C.S.Disabled, false)
 412                             .removeClass(SN.C.S.Disabled);
 413
 414                     form.find('[name=lat]').val(SN.C.I.NoticeDataGeo.NLat);
 415                     form.find('[name=lon]').val(SN.C.I.NoticeDataGeo.NLon);
 416                     form.find('[name=location_ns]').val(SN.C.I.NoticeDataGeo.NLNS);
 417                     form.find('[name=location_id]').val(SN.C.I.NoticeDataGeo.NLID);
 418                     form.find('[name=notice_data-geo]').prop('checked', SN.C.I.NoticeDataGeo.NDG);
 419                 }
 420             });
 421         },
 422
 423         FormProfileSearchXHR: function (form) {
 424             $.ajax({
 425                 type: 'POST',
 426                 dataType: 'xml',
 427                 url: form.attr('action'),
 428                 data: form.serialize() + '&ajax=1',
 429                 beforeSend: function (xhr) {
 430                     form
 431                         .addClass(SN.C.S.Processing)
 432                         .find('.submit')
 433                             .addClass(SN.C.S.Disabled)
 434                             .prop(SN.C.S.Disabled, true);
 435                 },
 436                 error: function (xhr, textStatus, errorThrown) {
 437                     window.alert(errorThrown || textStatus);
 438                 },
 439                 success: function (data, textStatus) {
 440                     var results_placeholder = $('#profile_search_results');
 441                     if ($('ul', data)[0] !== undefined) {
 442                         var list = document._importNode($('ul', data)[0], true);
 443                         results_placeholder.replaceWith(list);
 444                     } else {
 445                         var _error = $('<li/>').append(document._importNode($('p', data)[0], true));
 446                         results_placeholder.html(_error);
 447                     }
 448                     form
 449                         .removeClass(SN.C.S.Processing)
 450                         .find('.submit')
 451                             .removeClass(SN.C.S.Disabled)
 452                             .prop(SN.C.S.Disabled, false);
 453                 }
 454             });
 455         },
 456
 457         FormPeopletagsXHR: function (form) {
 458             $.ajax({
 459                 type: 'POST',
 460                 dataType: 'xml',
 461                 url: form.attr('action'),
 462                 data: form.serialize() + '&ajax=1',
 463                 beforeSend: function (xhr) {
 464                     form.find('.submit')
 465                             .addClass(SN.C.S.Processing)
 466                             .addClass(SN.C.S.Disabled)
 467                             .prop(SN.C.S.Disabled, true);
 468                 },
 469                 error: function (xhr, textStatus, errorThrown) {
 470                     window.alert(errorThrown || textStatus);
 471                 },
 472                 success: function (data, textStatus) {
 473                     var results_placeholder = form.parents('.entity_tags');
 474                     if ($('.entity_tags', data)[0] !== undefined) {
 475                         var tags = document._importNode($('.entity_tags', data)[0], true);
 476                         $(tags).find('.editable').append($('<button class="peopletags_edit_button"/>'));
 477                         results_placeholder.replaceWith(tags);
 478                     } else {
 479                         results_placeholder.find('p').remove();
 480                         results_placeholder.append(document._importNode($('p', data)[0], true));
 481                         form.removeClass(SN.C.S.Processing)
 482                             .find('.submit')
 483                                 .removeClass(SN.C.S.Disabled)
 484                                 .prop(SN.C.S.Disabled, false);
 485                     }
 486                 }
 487             });
 488         },
 489
 490         normalizeGeoData: function (form) {
 491             SN.C.I.NoticeDataGeo.NLat = form.find('[name=lat]').val();
 492             SN.C.I.NoticeDataGeo.NLon = form.find('[name=lon]').val();
 493             SN.C.I.NoticeDataGeo.NLNS = form.find('[name=location_ns]').val();
 494             SN.C.I.NoticeDataGeo.NLID = form.find('[name=location_id]').val();
 495             SN.C.I.NoticeDataGeo.NDG = form.find('[name=notice_data-geo]').prop('checked'); // @fixme (does this still need to be fixed somehow?)
 496
 497             var cookieValue = $.cookie(SN.C.S.NoticeDataGeoCookie);
 498
 499             if (cookieValue !== undefined && cookieValue != 'disabled') {
 500                 cookieValue = JSON.parse(cookieValue);
 501                 SN.C.I.NoticeDataGeo.NLat = form.find('[name=lat]').val(cookieValue.NLat).val();
 502                 SN.C.I.NoticeDataGeo.NLon = form.find('[name=lon]').val(cookieValue.NLon).val();
 503                 if (cookieValue.NLNS) {
 504                     SN.C.I.NoticeDataGeo.NLNS = form.find('[name=location_ns]').val(cookieValue.NLNS).val();
 505                     SN.C.I.NoticeDataGeo.NLID = form.find('[name=location_id]').val(cookieValue.NLID).val();
 506                 } else {
 507                     form.find('[name=location_ns]').val('');
 508                     form.find('[name=location_id]').val('');
 509                 }
 510             }
 511             if (cookieValue == 'disabled') {
 512                 SN.C.I.NoticeDataGeo.NDG = form.find('[name=notice_data-geo]').prop('checked', false).prop('checked');
 513             } else {
 514                 SN.C.I.NoticeDataGeo.NDG = form.find('[name=notice_data-geo]').prop('checked', true).prop('checked');
 515             }
 516
 517         },
 518
 519         /**
 520          * Fetch an XML DOM from an XHR's response data.
 521          *
 522          * Works around unavailable responseXML when document.domain
 523          * has been modified by Meteor or other tools, in some but not
 524          * all browsers.
 525          *
 526          * @param {XMLHTTPRequest} xhr
 527          * @return DOMDocument
 528          */
 529         GetResponseXML: function (xhr) {
 530             try {
 531                 return xhr.responseXML;
 532             } catch (e) {
 533                 return (new DOMParser()).parseFromString(xhr.responseText, "text/xml");
 534             }
 535         },
 536
 537         /**
 538          * Setup function -- DOES NOT trigger actions immediately.
 539          *
 540          * Sets up event handlers on all visible notice's option <a> elements
 541          * with the "popup" class so they behave as expected with AJAX.
 542          *
 543          * (without javascript the link goes to a page that expects you to verify
 544          * the action through a form)
 545          *
 546          * @access private
 547          */
 548         NoticeOptionsAjax: function () {
 549             $(document).on('click', '.notice-options > a.popup', function (e) {
 550                 e.preventDefault();
 551                 var noticeEl = $(this).closest('.notice');
 552                 $.ajax({
 553                     url: $(this).attr('href'),
 554                     data: {ajax: 1},
 555                     success: function (data, textStatus, xhr) {
 556                         SN.U.NoticeOptionPopup(data, noticeEl);
 557                     },
 558                 });
 559                 return false;
 560             });
 561         },
 562
 563         NoticeOptionPopup: function (data, noticeEl) {
 564             title = $('head > title', data).text();
 565             body = $('body', data).html();
 566             dialog = $(body).dialog({
 567                     height: "auto",
 568                     width: "auto",
 569                     modal: true,
 570                     resizable: true,
 571                     title: title,
 572                 });
 573         },
 574
 575         /**
 576          * Setup function -- DOES NOT trigger actions immediately.
 577          *
 578          * Sets up event handlers on all visible notice's reply buttons to
 579          * tweak the new-notice form with needed variables and focus it
 580          * when pushed.
 581          *
 582          * (This replaces the default reply button behavior to submit
 583          * directly to a form which comes back with a specialized page
 584          * with the form data prefilled.)
 585          *
 586          * @access private
 587          */
 588         NoticeReply: function () {
 589             $(document).on('click', '#content .notice_reply', function (e) {
 590                 e.preventDefault();
 591                 var notice = $(this).closest('li.notice');
 592                 SN.U.NoticeInlineReplyTrigger(notice);
 593                 return false;
 594             });
 595         },
 596
 597         /**
 598          * Stub -- kept for compat with plugins for now.
 599          * @access private
 600          */
 601         NoticeReplyTo: function (notice) {
 602         },
 603
 604         /**
 605          * Open up a notice's inline reply box.
 606          *
 607          * @param {jQuery} notice: jQuery object containing one notice
 608          * @param {String} initialText
 609          */
 610         NoticeInlineReplyTrigger: function (notice, initialText) {
 611             // Find the notice we're replying to...
 612             var id = $($('.notice_id', notice)[0]).text();
 613             var replyForm;
 614             var parentNotice = notice;
 615             var stripForm = true; // strip a couple things out of reply forms that are inline
 616
 617             var list = notice.find('.threaded-replies');
 618             if (list.length == 0) {
 619                 list = notice.closest('.threaded-replies');
 620             }
 621             if (list.length == 0) {
 622                 list = $('<ul class="notices threaded-replies xoxo"></ul>');
 623                 notice.append(list);
 624                 list = notice.find('.threaded-replies');
 625             }
 626
 627             var nextStep = function () {
 628                 // Override...?
 629                 replyForm.find('input[name=inreplyto]').val(id);
 630                 if (stripForm) {
 631                     // Don't do this for old-school reply form, as they don't come back!
 632                     replyForm.find('#notice_to').prop('disabled', true).hide();
 633                     replyForm.find('#notice_private').prop('disabled', true).hide();
 634                     replyForm.find('label[for=notice_to]').hide();
 635                     replyForm.find('label[for=notice_private]').hide();
 636                 }
 637                 replyItem.show();
 638
 639                 // Set focus...
 640                 var text = replyForm.find('textarea');
 641                 if (text.length == 0) {
 642                     throw "No textarea";
 643                 }
 644                 var replyto = '';
 645                 if (initialText) {
 646                     replyto = initialText + ' ';
 647                 }
 648                 text.val(replyto + text.val().replace(new RegExp(replyto, 'i'), ''));
 649                 text.data('initialText', $.trim(initialText));
 650                 text.focus();
 651                 if (text[0].setSelectionRange) {
 652                     var len = text.val().length;
 653                     text[0].setSelectionRange(len, len);
 654                 }
 655             };
 656
 657             // Create the reply form entry
 658             var replyItem = $('li.notice-reply', list);
 659             if (replyItem.length == 0) {
 660                 replyItem = $('<li class="notice-reply"></li>');
 661             }
 662             replyForm = replyItem.children('form');
 663             if (replyForm.length == 0) {
 664                 // Let's try another trick to avoid fetching by URL
 665                 var noticeForm = $('#input_form_status > form');
 666                 if (noticeForm.length == 0) {
 667                     // No notice form found on the page, so let's just
 668                     // fetch a fresh copy of the notice form over AJAX.
 669                     $.ajax({
 670                         url: SN.V.urlNewNotice,
 671                         data: {ajax: 1, inreplyto: id},
 672                         success: function (data, textStatus, xhr) {
 673                             var formEl = document._importNode($('form', data)[0], true);
 674                             replyForm = $(formEl);
 675                             replyItem.append(replyForm);
 676                             list.append(replyItem);
 677
 678                             SN.Init.NoticeFormSetup(replyForm);
 679                             nextStep();
 680                         },
 681                     });
 682                     // We do everything relevant in 'success' above
 683                     return;
 684                 }
 685                 replyForm = noticeForm.clone();
 686                 SN.Init.NoticeFormSetup(replyForm);
 687                 replyItem.append(replyForm);
 688                 list.append(replyItem);
 689             }
 690             // replyForm is set, we're not fetching by URL...
 691             // Next setp is to configure in-reply-to etc.
 692             nextStep();
 693         },
 694
 695         /**
 696          * Setup function -- DOES NOT apply immediately.
 697          *
 698          * Uses 'on' rather than 'live' or 'bind', so applies to future as well as present items.
 699          */
 700         NoticeInlineReplySetup: function () {
 701             // Expand conversation links
 702             $(document).on('click', 'li.notice-reply-comments a', function () {
 703                     var url = $(this).attr('href');
 704                     var area = $(this).closest('.threaded-replies');
 705                     $.ajax({
 706                         url: url,
 707                         data: {ajax: 1},
 708                         success: function (data, textStatus, xhr) {
 709                             var replies = $('.threaded-replies', data);
 710                             if (replies.length) {
 711                                 area.replaceWith(document._importNode(replies[0], true));
 712                             }
 713                         },
 714                     });
 715                     return false;
 716                 });
 717         },
 718
 719         /**
 720          * Setup function -- DOES NOT trigger actions immediately.
 721          *
 722          * Sets up event handlers for repeat forms to toss up a confirmation
 723          * popout before submitting.
 724          *
 725          * Uses 'on' rather than 'live' or 'bind', so applies to future as well as present items.
 726          *
 727          */
 728         NoticeRepeat: function () {
 729             $('body').on('click', '.form_repeat', function (e) {
 730                 e.preventDefault();
 731
 732                 SN.U.NoticeRepeatConfirmation($(this));
 733                 return false;
 734             });
 735         },
 736
 737         /**
 738          * Shows a confirmation dialog box variant of the repeat button form.
 739          * This seems to use a technique where the repeat form contains
 740          * _both_ a standalone button _and_ text and buttons for a dialog.
 741          * The dialog will close after its copy of the form is submitted,
 742          * or if you click its 'close' button.
 743          *
 744          * The dialog is created by duplicating the original form and changing
 745          * its style; while clever, this is hard to generalize and probably
 746          * duplicates a lot of unnecessary HTML output.
 747          *
 748          * @fixme create confirmation dialogs through a generalized interface
 749          * that can be reused instead of hardcoded text and styles.
 750          *
 751          * @param {jQuery} form
 752          */
 753         NoticeRepeatConfirmation: function (form) {
 754             var submit_i = form.find('.submit');
 755
 756             var submit = submit_i.clone();
 757             submit
 758                 .addClass('submit_dialogbox')
 759                 .removeClass('submit');
 760             form.append(submit);
 761             submit.on('click', function () { SN.U.FormXHR(form); return false; });
 762
 763             submit_i.hide();
 764
 765             form
 766                 .addClass('dialogbox')
 767                 .append('<button class="close">&#215;</button>')
 768                 .closest('.notice-options')
 769                     .addClass('opaque');
 770
 771             form.find('button.close').click(function () {
 772                 $(this).remove();
 773
 774                 form
 775                     .removeClass('dialogbox')
 776                     .closest('.notice-options')
 777                         .removeClass('opaque');
 778
 779                 form.find('.submit_dialogbox').remove();
 780                 form.find('.submit').show();
 781
 782                 return false;
 783             });
 784         },
 785
 786         /**
 787          * Setup function -- DOES NOT trigger actions immediately.
 788          *
 789          * Goes through all notices currently displayed and sets up attachment
 790          * handling if needed.
 791          */
 792         NoticeAttachments: function () {
 793             $('.notice a.attachment').each(function () {
 794                 SN.U.NoticeWithAttachment($(this).closest('.notice'));
 795             });
 796         },
 797
 798         /**
 799          * Setup function -- DOES NOT trigger actions immediately.
 800          *
 801          * Sets up special attachment link handling if needed. Currently this
 802          * consists only of making the "more" button used for OStatus message
 803          * cropping turn into an auto-expansion button that loads the full
 804          * text from an attachment file.
 805          *
 806          * @param {jQuery} notice
 807          */
 808         NoticeWithAttachment: function (notice) {
 809             if (notice.find('.attachment').length === 0) {
 810                 return;
 811             }
 812
 813                         $(document).on('click','.attachment.more',function () {
 814                                 var m = $(this);
 815                                 m.addClass(SN.C.S.Processing);
 816                                 $.get(m.attr('href'), {ajax: 1}, function (data) {
 817                                         m.parent('.e-content').html($(data).find('#attachment_view .e-content').html());
 818                                 });
 819
 820                                 return false;
 821                         });
 822
 823         },
 824
 825         /**
 826          * Setup function -- DOES NOT trigger actions immediately.
 827          *
 828          * Sets up event handlers for the file-attachment widget in the
 829          * new notice form. When a file is selected, a box will be added
 830          * below the text input showing the filename and, if supported
 831          * by the browser, a thumbnail preview.
 832          *
 833          * This preview box will also allow removing the attachment
 834          * prior to posting.
 835          *
 836          * @param {jQuery} form
 837          */
 838         NoticeDataAttach: function (form) {
 839             var i;
 840             var NDA = form.find('input[type=file]');
 841             NDA.change(function (event) {
 842                 form.find('.attach-status').remove();
 843
 844                 var filename = $(this).val();
 845                 if (!filename) {
 846                     // No file -- we've been tricked!
 847                     return false;
 848                 }
 849
 850                 var attachStatus = $('<div class="attach-status ' + SN.C.S.Success + '"><code></code> <button class="close">&#215;</button></div>');
 851                 attachStatus.find('code').text(filename);
 852                 attachStatus.find('button').click(function () {
 853                     attachStatus.remove();
 854                     NDA.val('');
 855
 856                     return false;
 857                 });
 858                 form.append(attachStatus);
 859
 860                 if (typeof this.files === "object") {
 861                     // Some newer browsers will let us fetch the files for preview.
 862                     for (i = 0; i < this.files.length; i++) {
 863                         SN.U.PreviewAttach(form, this.files[i]);
 864                     }
 865                 }
 866             });
 867         },
 868
 869         /**
 870          * Get PHP's MAX_FILE_SIZE setting for this form;
 871          * used to apply client-side file size limit checks.
 872          *
 873          * @param {jQuery} form
 874          * @return int max size in bytes; 0 or negative means no limit
 875          */
 876         maxFileSize: function (form) {
 877             var max = $(form).find('input[name=MAX_FILE_SIZE]').attr('value');
 878             if (max) {
 879                 return parseInt(max);
 880             }
 881             return 0;
 882         },
 883
 884         /**
 885          * For browsers with FileAPI support: make a thumbnail if possible,
 886          * and append it into the attachment display widget.
 887          *
 888          * Known good:
 889          * - Firefox 3.6.6, 4.0b7
 890          * - Chrome 8.0.552.210
 891          *
 892          * Known ok metadata, can't get contents:
 893          * - Safari 5.0.2
 894          *
 895          * Known fail:
 896          * - Opera 10.63, 11 beta (no input.files interface)
 897          *
 898          * @param {jQuery} form
 899          * @param {File} file
 900          *
 901          * @todo use configured thumbnail size
 902          * @todo detect pixel size?
 903          * @todo should we render a thumbnail to a canvas and then use the smaller image?
 904          */
 905         PreviewAttach: function (form, file) {
 906             var tooltip = file.type + ' ' + Math.round(file.size / 1024) + 'KB';
 907             var preview = true;
 908
 909             var blobAsDataURL;
 910             if (window.createObjectURL !== undefined) {
 911                 /**
 912                  * createObjectURL lets us reference the file directly from an <img>
 913                  * This produces a compact URL with an opaque reference to the file,
 914                  * which we can reference immediately.
 915                  *
 916                  * - Firefox 3.6.6: no
 917                  * - Firefox 4.0b7: no
 918                  * - Safari 5.0.2: no
 919                  * - Chrome 8.0.552.210: works!
 920                  */
 921                 blobAsDataURL = function (blob, callback) {
 922                     callback(window.createObjectURL(blob));
 923                 };
 924             } else if (window.FileReader !== undefined) {
 925                 /**
 926                  * FileAPI's FileReader can build a data URL from a blob's contents,
 927                  * but it must read the file and build it asynchronously. This means
 928                  * we'll be passing a giant data URL around, which may be inefficient.
 929                  *
 930                  * - Firefox 3.6.6: works!
 931                  * - Firefox 4.0b7: works!
 932                  * - Safari 5.0.2: no
 933                  * - Chrome 8.0.552.210: works!
 934                  */
 935                 blobAsDataURL = function (blob, callback) {
 936                     var reader = new FileReader();
 937                     reader.onload = function (event) {
 938                         callback(reader.result);
 939                     };
 940                     reader.readAsDataURL(blob);
 941                 };
 942             } else {
 943                 preview = false;
 944             }
 945
 946             var imageTypes = ['image/png', 'image/jpeg', 'image/gif', 'image/svg+xml'];
 947             if ($.inArray(file.type, imageTypes) == -1) {
 948                 // We probably don't know how to show the file.
 949                 preview = false;
 950             }
 951
 952             var maxSize = 8 * 1024 * 1024;
 953             if (file.size > maxSize) {
 954                 // Don't kill the browser trying to load some giant image.
 955                 preview = false;
 956             }
 957
 958             if (preview) {
 959                 blobAsDataURL(file, function (url) {
 960                     var img = $('<img>')
 961                         .attr('title', tooltip)
 962                         .attr('alt', tooltip)
 963                         .attr('src', url)
 964                         .attr('style', 'height: 120px');
 965                     form.find('.attach-status').append(img);
 966                 });
 967             } else {
 968                 var img = $('<div></div>').text(tooltip);
 969                 form.find('.attach-status').append(img);
 970             }
 971         },
 972
 973         /**
 974          * Setup function -- DOES NOT trigger actions immediately.
 975          *
 976          * Initializes state for the location-lookup features in the
 977          * new-notice form. Seems to set up some event handlers for
 978          * triggering lookups and using the new values.
 979          *
 980          * @param {jQuery} form
 981          *
 982          * @fixme tl;dr
 983          * @fixme there's not good visual state update here, so users have a
 984          *        hard time figuring out if it's working or fixing if it's wrong.
 985          *
 986          */
 987         NoticeLocationAttach: function (form) {
 988             // @fixme this should not be tied to the main notice form, as there may be multiple notice forms...
 989             var NLat = form.find('[name=lat]');
 990             var NLon = form.find('[name=lon]');
 991             var NLNS = form.find('[name=location_ns]').val();
 992             var NLID = form.find('[name=location_id]').val();
 993             var NLN = ''; // @fixme
 994             var NDGe = form.find('[name=notice_data-geo]');
 995             var check = form.find('[name=notice_data-geo]');
 996             var label = form.find('label.notice_data-geo');
 997
 998             function removeNoticeDataGeo(error) {
 999                 label
1000                     .attr('title', $.trim(label.text()))
1001                     .removeClass('checked');
1002
1003                 form.find('[name=lat]').val('');
1004                 form.find('[name=lon]').val('');
1005                 form.find('[name=location_ns]').val('');
1006                 form.find('[name=location_id]').val('');
1007                 form.find('[name=notice_data-geo]').prop('checked', false);
1008
1009                 $.cookie(SN.C.S.NoticeDataGeoCookie, 'disabled', { path: '/' });
1010
1011                 if (error) {
1012                     form.find('.geo_status_wrapper').removeClass('success').addClass('error');
1013                     form.find('.geo_status_wrapper .geo_status').text(error);
1014                 } else {
1015                     form.find('.geo_status_wrapper').remove();
1016                 }
1017             }
1018
1019             function getJSONgeocodeURL(geocodeURL, data) {
1020                 SN.U.NoticeGeoStatus(form, 'Looking up place name...');
1021                 $.getJSON(geocodeURL, data, function (location) {
1022                     var lns, lid, NLN_text;
1023
1024                     if (location.location_ns !== undefined) {
1025                         form.find('[name=location_ns]').val(location.location_ns);
1026                         lns = location.location_ns;
1027                     }
1028
1029                     if (location.location_id !== undefined) {
1030                         form.find('[name=location_id]').val(location.location_id);
1031                         lid = location.location_id;
1032                     }
1033
1034                     if (location.name === undefined) {
1035                         NLN_text = data.lat + ';' + data.lon;
1036                     } else {
1037                         NLN_text = location.name;
1038                     }
1039
1040                     SN.U.NoticeGeoStatus(form, NLN_text, data.lat, data.lon, location.url);
1041                     label
1042                         .attr('title', NoticeDataGeo_text.ShareDisable + ' (' + NLN_text + ')');
1043
1044                     form.find('[name=lat]').val(data.lat);
1045                     form.find('[name=lon]').val(data.lon);
1046                     form.find('[name=location_ns]').val(lns);
1047                     form.find('[name=location_id]').val(lid);
1048                     form.find('[name=notice_data-geo]').prop('checked', true);
1049
1050                     var cookieValue = {
1051                         NLat: data.lat,
1052                         NLon: data.lon,
1053                         NLNS: lns,
1054                         NLID: lid,
1055                         NLN: NLN_text,
1056                         NLNU: location.url,
1057                         NDG: true
1058                     };
1059
1060                     $.cookie(SN.C.S.NoticeDataGeoCookie, JSON.stringify(cookieValue), { path: '/' });
1061                 });
1062             }
1063
1064             if (check.length > 0) {
1065                 if ($.cookie(SN.C.S.NoticeDataGeoCookie) == 'disabled') {
1066                     check.prop('checked', false);
1067                 } else {
1068                     check.prop('checked', true);
1069                 }
1070
1071                 var NGW = form.find('.notice_data-geo_wrap');
1072                 var geocodeURL = NGW.attr('data-api');
1073
1074                 label.attr('title', label.text());
1075
1076                 check.change(function () {
1077                     if (check.prop('checked') === true || $.cookie(SN.C.S.NoticeDataGeoCookie) === null) {
1078                         label
1079                             .attr('title', NoticeDataGeo_text.ShareDisable)
1080                             .addClass('checked');
1081
1082                         if ($.cookie(SN.C.S.NoticeDataGeoCookie) === null || $.cookie(SN.C.S.NoticeDataGeoCookie) == 'disabled') {
1083                             if (navigator.geolocation) {
1084                                 SN.U.NoticeGeoStatus(form, 'Requesting location from browser...');
1085                                 navigator.geolocation.getCurrentPosition(
1086                                     function (position) {
1087                                         form.find('[name=lat]').val(position.coords.latitude);
1088                                         form.find('[name=lon]').val(position.coords.longitude);
1089
1090                                         var data = {
1091                                             lat: position.coords.latitude,
1092                                             lon: position.coords.longitude,
1093                                             token: $('#token').val()
1094                                         };
1095
1096                                         getJSONgeocodeURL(geocodeURL, data);
1097                                     },
1098
1099                                     function (error) {
1100                                         switch(error.code) {
1101                                             case error.PERMISSION_DENIED:
1102                                                 removeNoticeDataGeo('Location permission denied.');
1103                                                 break;
1104                                             case error.TIMEOUT:
1105                                                 //$('#' + SN.C.S.NoticeDataGeo).prop('checked', false);
1106                                                 removeNoticeDataGeo('Location lookup timeout.');
1107                                                 break;
1108                                         }
1109                                     },
1110
1111                                     {
1112                                         timeout: 10000
1113                                     }
1114                                 );
1115                             } else {
1116                                 if (NLat.length > 0 && NLon.length > 0) {
1117                                     var data = {
1118                                         lat: NLat,
1119                                         lon: NLon,
1120                                         token: $('#token').val()
1121                                     };
1122
1123                                     getJSONgeocodeURL(geocodeURL, data);
1124                                 } else {
1125                                     removeNoticeDataGeo();
1126                                     check.remove();
1127                                     label.remove();
1128                                 }
1129                             }
1130                         } else {
1131                             try {
1132                                 var cookieValue = JSON.parse($.cookie(SN.C.S.NoticeDataGeoCookie));
1133
1134                                 form.find('[name=lat]').val(cookieValue.NLat);
1135                                 form.find('[name=lon]').val(cookieValue.NLon);
1136                                 form.find('[name=location_ns]').val(cookieValue.NLNS);
1137                                 form.find('[name=location_id]').val(cookieValue.NLID);
1138                                 form.find('[name=notice_data-geo]').prop('checked', cookieValue.NDG);
1139
1140                                SN.U.NoticeGeoStatus(form, cookieValue.NLN, cookieValue.NLat, cookieValue.NLon, cookieValue.NLNU);
1141                                 label
1142                                     .attr('title', NoticeDataGeo_text.ShareDisable + ' (' + cookieValue.NLN + ')')
1143                                     .addClass('checked');
1144                             } catch (e) {
1145                                 console.log('Parsing error:', e);
1146                             }
1147                         }
1148                     } else {
1149                         removeNoticeDataGeo();
1150                     }
1151                 }).change();
1152             }
1153         },
1154
1155         /**
1156          * Create or update a geolocation status widget in this notice posting form.
1157          *
1158          * @param {jQuery} form
1159          * @param {String} status
1160          * @param {String} lat (optional)
1161          * @param {String} lon (optional)
1162          * @param {String} url (optional)
1163          */
1164         NoticeGeoStatus: function (form, status, lat, lon, url)
1165         {
1166             var wrapper = form.find('.geo_status_wrapper');
1167             if (wrapper.length == 0) {
1168                 wrapper = $('<div class="' + SN.C.S.Success + ' geo_status_wrapper"><button class="close" style="float:right">&#215;</button><div class="geo_status"></div></div>');
1169                 wrapper.find('button.close').click(function () {
1170                     form.find('[name=notice_data-geo]').prop('checked', false).change();
1171                     return false;
1172                 });
1173                 form.append(wrapper);
1174             }
1175             var label;
1176             if (url) {
1177                 label = $('<a></a>').attr('href', url);
1178             } else {
1179                 label = $('<span></span>');
1180             }
1181             label.text(status);
1182             if (lat || lon) {
1183                 var latlon = lat + ';' + lon;
1184                 label.attr('title', latlon);
1185                 if (!status) {
1186                     label.text(latlon)
1187                 }
1188             }
1189             wrapper.find('.geo_status').empty().append(label);
1190         },
1191
1192         /**
1193          * Setup function -- DOES NOT trigger actions immediately.
1194          *
1195          * Initializes event handlers for the "Send direct message" link on
1196          * profile pages, setting it up to display a dialog box when clicked.
1197          *
1198          * Unlike the repeat confirmation form, this appears to fetch
1199          * the form _from the original link target_, so the form itself
1200          * doesn't need to be in the current document.
1201          *
1202          * @fixme breaks ability to open link in new window?
1203          */
1204         NewDirectMessage: function () {
1205             NDM = $('.entity_send-a-message a');
1206             NDM.attr({'href': NDM.attr('href') + '&ajax=1'});
1207             NDM.on('click', function () {
1208                 var NDMF = $('.entity_send-a-message form');
1209                 if (NDMF.length === 0) {
1210                     $(this).addClass(SN.C.S.Processing);
1211                     $.get(NDM.attr('href'), null, function (data) {
1212                         $('.entity_send-a-message').append(document._importNode($('form', data)[0], true));
1213                         NDMF = $('.entity_send-a-message .form_notice');
1214                         SN.U.FormNoticeXHR(NDMF);
1215                         SN.U.FormNoticeEnhancements(NDMF);
1216                         NDMF.append('<button class="close">&#215;</button>');
1217                         $('.entity_send-a-message button').click(function () {
1218                             NDMF.hide();
1219                             return false;
1220                         });
1221                         NDM.removeClass(SN.C.S.Processing);
1222                     });
1223                 } else {
1224                     NDMF.show();
1225                     $('.entity_send-a-message textarea').focus();
1226                 }
1227                 return false;
1228             });
1229         },
1230
1231         /**
1232          * Return a date object with the current local time on the
1233          * given year, month, and day.
1234          *
1235          * @param {number} year: 4-digit year
1236          * @param {number} month: 0 == January
1237          * @param {number} day: 1 == 1
1238          * @return {Date}
1239          */
1240         GetFullYear: function (year, month, day) {
1241             var date = new Date();
1242             date.setFullYear(year, month, day);
1243
1244             return date;
1245         },
1246
1247         /**
1248          * Some sort of object interface for storing some structured
1249          * information in a cookie.
1250          *
1251          * Appears to be used to save the last-used login nickname?
1252          * That's something that browsers usually take care of for us
1253          * these days, do we really need to do it? Does anything else
1254          * use this interface?
1255          *
1256          * @fixme what is this?
1257          * @fixme should this use non-cookie local storage when available?
1258          */
1259         StatusNetInstance: {
1260             /**
1261              * @fixme what is this?
1262              */
1263             Set: function (value) {
1264                 var SNI = SN.U.StatusNetInstance.Get();
1265                 if (SNI !== null) {
1266                     value = $.extend(SNI, value);
1267                 }
1268
1269                 $.cookie(
1270                     SN.C.S.StatusNetInstance,
1271                     JSON.stringify(value),
1272                     {
1273                         path: '/',
1274                         expires: SN.U.GetFullYear(2029, 0, 1)
1275                     });
1276             },
1277
1278             /**
1279              * @fixme what is this?
1280              */
1281             Get: function () {
1282                 var cookieValue = $.cookie(SN.C.S.StatusNetInstance);
1283                 if (cookieValue !== undefined) {
1284                     return JSON.parse(cookieValue);
1285                 }
1286                 return null;
1287             },
1288
1289             /**
1290              * @fixme what is this?
1291              */
1292             Delete: function () {
1293                 $.cookie(SN.C.S.StatusNetInstance, null);
1294             }
1295         },
1296
1297         /**
1298          * Check if the current page is a timeline where the current user's
1299          * posts should be displayed immediately on success.
1300          *
1301          * @fixme this should be done in a saner way, with machine-readable
1302          * info about what page we're looking at.
1303          *
1304          * @param {DOMElement} notice: HTML chunk with formatted notice
1305          * @return boolean
1306          */
1307         belongsOnTimeline: function (notice) {
1308             var action = $("body").attr('id');
1309             if (action == 'public') {
1310                 return true;
1311             }
1312
1313             var profileLink = $('#nav_profile a').attr('href');
1314             if (profileLink) {
1315                 var authorUrl = $(notice).find('.h-card.p-author').attr('href');
1316                 if (authorUrl == profileLink) {
1317                     if (action == 'all' || action == 'showstream') {
1318                         // Posts always show on your own friends and profile streams.
1319                         return true;
1320                     }
1321                 }
1322             }
1323
1324             // @fixme tag, group, reply timelines should be feasible as well.
1325             // Mismatch between id-based and name-based user/group links currently complicates
1326             // the lookup, since all our inline mentions contain the absolute links but the
1327             // UI links currently on the page use malleable names.
1328
1329             return false;
1330         },
1331
1332         /**
1333          * Switch to another active input sub-form.
1334          * This will hide the current form (if any), show the new one, and
1335          * update the input type tab selection state.
1336          *
1337          * @param {String} tag
1338          */
1339         switchInputFormTab: function (tag, setFocus) {
1340             if (typeof setFocus === 'undefined') { setFocus = true; }
1341             // The one that's current isn't current anymore
1342             $('.input_form_nav_tab.current').removeClass('current');
1343             if (tag != null) {
1344                 $('#input_form_nav_' + tag).addClass('current');
1345             }
1346
1347             // Don't remove 'current' if we also have the "nonav" class.
1348             // An example would be the message input form. removing
1349             // 'current' will cause the form to vanish from the page.
1350             var nonav = $('.input_form.current.nonav');
1351             if (nonav.length > 0) {
1352                 return;
1353             }
1354
1355             $('.input_form.current').removeClass('current');
1356             if (tag == null) {
1357                 // we're done here, no new inputform to focus on
1358                 return false;
1359             }
1360
1361             var noticeForm = $('#input_form_' + tag)
1362                     .addClass('current')
1363                     .find('.ajax-notice').each(function () {
1364                         var form = $(this);
1365                         SN.Init.NoticeFormSetup(form);
1366                     });
1367             if (setFocus) {
1368                 noticeForm.find('.notice_data-text').focus();
1369             }
1370
1371             return false;
1372         },
1373
1374         showMoreMenuItems: function (menuid) {
1375             $('#' + menuid + ' .more_link').remove();
1376             var selector = '#' + menuid + ' .extended_menu';
1377             var extended = $(selector);
1378             extended.removeClass('extended_menu');
1379             return void(0);
1380         },
1381
1382         /**
1383          * Show a response feedback bit under a form.
1384          *
1385          * @param {Element} form: the new-notice form usually
1386          * @param {String}  cls: CSS class name to use ('error' or 'success')
1387          * @param {String}  text
1388          * @access public
1389          */
1390         showFeedback: function (form, cls, text) {
1391             form.append(
1392                 $('<p class="form_response"></p>')
1393                     .addClass(cls)
1394                     .text(text)
1395             );
1396         },
1397     },
1398
1399     E: {    /* Events */
1400         /* SN.E.ajaxNoticePosted, called when a notice has been posted successfully via an AJAX form
1401             @param  form        the originating form element
1402             @param  data        data from success() callback
1403             @param  textStatus  textStatus from success() callback
1404         */
1405         ajaxNoticePosted: function (form, data, textStatus) {
1406             var commandResult = $('#' + SN.C.S.CommandResult, data);
1407             if (commandResult.length > 0) {
1408                 SN.U.showFeedback(form, 'success', commandResult.text());
1409             } else {
1410                 // New notice post was successful. If on our timeline, show it!
1411                 var notice = document._importNode($('li', data)[0], true);
1412                 var notices = $('#notices_primary .notices:first');
1413                 var replyItem = form.closest('li.notice-reply');
1414
1415                 if (replyItem.length > 0) {
1416                     // If this is an inline reply, remove the form...
1417                     var list = form.closest('.threaded-replies');
1418
1419                     var id = $(notice).attr('id');
1420                     if ($('#' + id).length == 0) {
1421                         $(notice).insertBefore(replyItem);
1422                     } // else Realtime came through before us...
1423
1424                     replyItem.remove();
1425
1426                 } else if (notices.length > 0 && SN.U.belongsOnTimeline(notice)) {
1427                     // Not a reply. If on our timeline, show it at the top!
1428
1429                     if ($('#' + notice.id).length === 0) {
1430                         var notice_irt_value = form.find('[name=inreplyto]').val();
1431                         var notice_irt = '#notices_primary #notice-' + notice_irt_value;
1432                         if ($('body')[0].id == 'conversation') {
1433                             if (notice_irt_value.length > 0 && $(notice_irt + ' .notices').length < 1) {
1434                                 $(notice_irt).append('<ul class="notices"></ul>');
1435                             }
1436                             $($(notice_irt + ' .notices')[0]).append(notice);
1437                         } else {
1438                             notices.prepend(notice);
1439                         }
1440                         $('#' + notice.id)
1441                             .css({display: 'none'})
1442                             .fadeIn(2500);
1443                         SN.U.NoticeWithAttachment($('#' + notice.id));
1444                         SN.U.switchInputFormTab(null);
1445                     }
1446                 } else {
1447                     // Not on a timeline that this belongs on?
1448                     // Just show a success message.
1449                     // @fixme inline
1450                     SN.U.showFeedback(form, 'success', $('title', data).text());
1451                 }
1452             }
1453             form.resetForm();
1454             form.find('[name=inreplyto]').val('');
1455             form.find('.attach-status').remove();
1456             SN.U.FormNoticeEnhancements(form);
1457             alert('notice posted: ' + $(notice).attr('id'));
1458         },
1459     },
1460
1461
1462     Init: {
1463         /**
1464          * If user is logged in, run setup code for the new notice form:
1465          *
1466          *  - char counter
1467          *  - AJAX submission
1468          *  - location events
1469          *  - file upload events
1470          */
1471         NoticeForm: function () {
1472             if ($('body.user_in').length > 0) {
1473                 // SN.Init.NoticeFormSetup() will get run
1474                 // when forms get displayed for the first time...
1475
1476                 // Initialize the input form field
1477                 $('#input_form_nav .input_form_nav_tab.current').each(function () {
1478                     current_tab_id = $(this).attr('id').substring('input_form_nav_'.length);
1479                     SN.U.switchInputFormTab(current_tab_id, false);
1480                 });
1481
1482                 // Make inline reply forms self-close when clicking out.
1483                 $('body').on('click', function (e) {
1484                     var openReplies = $('li.notice-reply');
1485                     if (openReplies.length > 0) {
1486                         var target = $(e.target);
1487                         openReplies.each(function () {
1488                             // Did we click outside this one?
1489                             var replyItem = $(this);
1490                             if (replyItem.has(e.target).length == 0) {
1491                                 var textarea = replyItem.find('.notice_data-text:first');
1492                                 var cur = $.trim(textarea.val());
1493                                 // Only close if there's been no edit.
1494                                 if (cur == '' || cur == textarea.data('initialText')) {
1495                                     var parentNotice = replyItem.closest('li.notice');
1496                                     replyItem.hide();
1497                                     parentNotice.find('li.notice-reply-placeholder').show();
1498                                 }
1499                             }
1500                         });
1501                     }
1502                 });
1503             }
1504         },
1505
1506         /**
1507          * Encapsulate notice form setup for a single form.
1508          * Plugins can add extra setup by monkeypatching this
1509          * function.
1510          *
1511          * @param {jQuery} form
1512          */
1513         NoticeFormSetup: function (form) {
1514             if (form.data('NoticeFormSetup')) {
1515                 return false;
1516             }
1517             SN.U.NoticeLocationAttach(form);
1518             SN.U.FormNoticeUniqueID(form);
1519             SN.U.FormNoticeXHR(form);
1520             SN.U.FormNoticeEnhancements(form);
1521             SN.U.NoticeDataAttach(form);
1522             form.data('NoticeFormSetup', true);
1523         },
1524
1525         /**
1526          * Run setup code for notice timeline views items:
1527          *
1528          * - AJAX submission for fave/repeat/reply (if logged in)
1529          * - Attachment link extras ('more' links)
1530          */
1531         Notices: function () {
1532             if ($('body.user_in').length > 0) {
1533                 SN.U.NoticeRepeat();
1534                 SN.U.NoticeReply();
1535                 SN.U.NoticeInlineReplySetup();
1536                 SN.U.NoticeOptionsAjax();
1537             }
1538
1539             SN.U.NoticeAttachments();
1540         },
1541
1542         /**
1543          * Run setup code for user & group profile page header area if logged in:
1544          *
1545          * - AJAX submission for sub/unsub/join/leave/nudge
1546          * - AJAX form popup for direct-message
1547          */
1548         EntityActions: function () {
1549             if ($('body.user_in').length > 0) {
1550                 $(document).on('click', '.form_user_subscribe', function () { SN.U.FormXHR($(this)); return false; });
1551                 $(document).on('click', '.form_user_unsubscribe', function () { SN.U.FormXHR($(this)); return false; });
1552                 $(document).on('click', '.form_group_join', function () { SN.U.FormXHR($(this)); return false; });
1553                 $(document).on('click', '.form_group_leave', function () { SN.U.FormXHR($(this)); return false; });
1554                 $(document).on('click', '.form_user_nudge', function () { SN.U.FormXHR($(this)); return false; });
1555                 $(document).on('click', '.form_peopletag_subscribe', function () { SN.U.FormXHR($(this)); return false; });
1556                 $(document).on('click', '.form_peopletag_unsubscribe', function () { SN.U.FormXHR($(this)); return false; });
1557                 $(document).on('click', '.form_user_add_peopletag', function () { SN.U.FormXHR($(this)); return false; });
1558                 $(document).on('click', '.form_user_remove_peopletag', function () { SN.U.FormXHR($(this)); return false; });
1559
1560                 SN.U.NewDirectMessage();
1561             }
1562         },
1563
1564         ProfileSearch: function () {
1565             if ($('body.user_in').length > 0) {
1566                 $(document).on('click', '.form_peopletag_edit_user_search input.submit', function () {
1567                     SN.U.FormProfileSearchXHR($(this).parents('form')); return false;
1568                 });
1569             }
1570         },
1571
1572         /**
1573          * Run setup code for login form:
1574          *
1575          * - loads saved last-used-nickname from cookie
1576          * - sets event handler to save nickname to cookie on submit
1577          *
1578          * @fixme is this necessary? Browsers do their own form saving these days.
1579          */
1580         Login: function () {
1581             if (SN.U.StatusNetInstance.Get() !== null) {
1582                 var nickname = SN.U.StatusNetInstance.Get().Nickname;
1583                 if (nickname !== null) {
1584                     $('#form_login #nickname').val(nickname);
1585                 }
1586             }
1587
1588             $('#form_login').on('submit', function () {
1589                 SN.U.StatusNetInstance.Set({Nickname: $('#form_login #nickname').val()});
1590                 return true;
1591             });
1592         },
1593
1594         /**
1595          * Run setup for the ajax people tags editor
1596          *
1597          * - show edit button
1598          * - set event handle for click on edit button
1599          *   - loads people tag autocompletion data if not already present
1600          *     or if it is stale.
1601          *
1602          */
1603         PeopleTags: function () {
1604             $('.user_profile_tags .editable').append($('<button class="peopletags_edit_button"/>'));
1605
1606             $(document).on('click', '.peopletags_edit_button', function () {
1607                 var form = $(this).parents('dd').eq(0).find('form');
1608                 // We can buy time from the above animation
1609
1610                 $.ajax({
1611                     url: _peopletagAC,
1612                     dataType: 'json',
1613                     data: {token: $('#token').val()},
1614                     ifModified: true,
1615                     success: function (data) {
1616                         // item.label is used to match
1617                         for (i=0; i < data.length; i++) {
1618                             data[i].label = data[i].tag;
1619                         }
1620
1621                         SN.C.PtagACData = data;
1622                     }
1623                 });
1624
1625                 $(this).parents('ul').eq(0).fadeOut(200, function () {form.fadeIn(200).find('input#tags')});
1626             });
1627
1628             $(document).on('click', '.user_profile_tags form .submit', function () {
1629                 SN.U.FormPeopletagsXHR($(this).parents('form')); return false;
1630             });
1631         },
1632
1633         /**
1634          * Set up any generic 'ajax' form so it submits via AJAX with auto-replacement.
1635          */
1636         AjaxForms: function () {
1637             $(document).on('submit', 'form.ajax', function () {
1638                 SN.U.FormXHR($(this));
1639                 return false;
1640             });
1641             $(document).on('click', 'form.ajax input[type=submit]', function () {
1642                 // Some forms rely on knowing which submit button was clicked.
1643                 // Save a hidden input field which'll be picked up during AJAX
1644                 // submit...
1645                 var button = $(this);
1646                 var form = button.closest('form');
1647                 form.find('.hidden-submit-button').remove();
1648                 $('<input class="hidden-submit-button" type="hidden" />')
1649                     .attr('name', button.attr('name'))
1650                     .val(button.val())
1651                     .appendTo(form);
1652             });
1653         },
1654
1655         /**
1656          * Add logic to any file upload forms to handle file size limits,
1657          * on browsers that support basic FileAPI.
1658          */
1659         UploadForms: function () {
1660             $('input[type=file]').change(function (event) {
1661                 if (typeof this.files === "object" && this.files.length > 0) {
1662                     var size = 0;
1663                     for (var i = 0; i < this.files.length; i++) {
1664                         size += this.files[i].size;
1665                     }
1666
1667                     var max = SN.U.maxFileSize($(this.form));
1668                     if (max > 0 && size > max) {
1669                         var msg = 'File too large: maximum upload size is %d bytes.';
1670                         alert(msg.replace('%d', max));
1671
1672                         // Clear the files.
1673                         $(this).val('');
1674                         event.preventDefault();
1675                         return false;
1676                     }
1677                 }
1678             });
1679         },
1680
1681         CheckBoxes: function () {
1682             $("span[class='checkbox-wrapper']").addClass("unchecked");
1683             $(".checkbox-wrapper").click(function () {
1684                 if ($(this).children("input").prop("checked")) {
1685                     // uncheck
1686                     $(this).children("input").prop("checked", false);
1687                     $(this).removeClass("checked");
1688                     $(this).addClass("unchecked");
1689                     $(this).children("label").text("Private?");
1690                 } else {
1691                     // check
1692                     $(this).children("input").prop("checked", true);
1693                     $(this).removeClass("unchecked");
1694                     $(this).addClass("checked");
1695                     $(this).children("label").text("Private");
1696                 }
1697             });
1698         }
1699     }
1700 };
1701
1702 /**
1703  * Run initialization functions on DOM-ready.
1704  *
1705  * Note that if we're waiting on other scripts to load, this won't happen
1706  * until that's done. To load scripts asynchronously without delaying setup,
1707  * don't start them loading until after DOM-ready time!
1708  */
1709 $(function () {
1710     SN.Init.AjaxForms();
1711     SN.Init.UploadForms();
1712     SN.Init.CheckBoxes();
1713     if ($('.' + SN.C.S.FormNotice).length > 0) {
1714         SN.Init.NoticeForm();
1715     }
1716     if ($('#content .notices').length > 0) {
1717         SN.Init.Notices();
1718     }
1719     if ($('#content .entity_actions').length > 0) {
1720         SN.Init.EntityActions();
1721     }
1722     if ($('#form_login').length > 0) {
1723         SN.Init.Login();
1724     }
1725     if ($('#profile_search_results').length > 0) {
1726         SN.Init.ProfileSearch();
1727     }
1728     if ($('.user_profile_tags .editable').length > 0) {
1729         SN.Init.PeopleTags();
1730     }
1731 });
1732