1 /*

     2 YUI 3.10.3 (build 2fb5187)

     3 Copyright 2013 Yahoo! Inc. All rights reserved.

     4 Licensed under the BSD License.

     5 http://yuilibrary.com/license/

     6 */

     7 

     8 YUI.add('io-upload-iframe', function (Y, NAME) {

     9 

    10 /**

    11 Extends the IO  to enable file uploads, with HTML forms

    12 using an iframe as the transport medium.

    13 @module io

    14 @submodule io-upload-iframe

    15 @for IO

    16 **/

    17 

    18 var w = Y.config.win,

    19     d = Y.config.doc,

    20     _std = (d.documentMode && d.documentMode >= 8),

    21     _d = decodeURIComponent,

    22     _end = Y.IO.prototype.end;

    23 

    24 /**

    25  * Creates the iframe transported used in file upload

    26  * transactions, and binds the response event handler.

    27  *

    28  * @method _cFrame

    29  * @private

    30  * @param {Object} o Transaction object generated by _create().

    31  * @param {Object} c Configuration object passed to YUI.io().

    32  * @param {Object} io

    33  */

    34 function _cFrame(o, c, io) {

    35     var i = Y.Node.create('<iframe src="#" id="io_iframe' + o.id + '" name="io_iframe' + o.id + '" />');

    36         i._node.style.position = 'absolute';

    37         i._node.style.top = '-1000px';

    38         i._node.style.left = '-1000px';

    39         Y.one('body').appendChild(i);

    40     // Bind the onload handler to the iframe to detect the file upload response.

    41     Y.on("load", function() { io._uploadComplete(o, c); }, '#io_iframe' + o.id);

    42 }

    43 

    44 /**

    45  * Removes the iframe transport used in the file upload

    46  * transaction.

    47  *

    48  * @method _dFrame

    49  * @private

    50  * @param {Number} id The transaction ID used in the iframe's creation.

    51  */

    52 function _dFrame(id) {

    53 	Y.Event.purgeElement('#io_iframe' + id, false);

    54 	Y.one('body').removeChild(Y.one('#io_iframe' + id));

    55 	Y.log('The iframe transport for transaction ' + id + ' has been destroyed.', 'info', 'io');

    56 }

    57 

    58 Y.mix(Y.IO.prototype, {

    59    /**

    60     * Parses the POST data object and creates hidden form elements

    61     * for each key-value, and appends them to the HTML form object.

    62     * @method appendData

    63     * @private

    64     * @static

    65     * @param {Object} f HTML form object.

    66     * @param {String} s The key-value POST data.

    67     * @return {Array} o Array of created fields.

    68     */

    69     _addData: function(f, s) {

    70         // Serialize an object into a key-value string using

    71         // querystring-stringify-simple.

    72         if (Y.Lang.isObject(s)) {

    73             s = Y.QueryString.stringify(s);

    74         }

    75 

    76         var o = [],

    77             m = s.split('='),

    78             i, l;

    79 

    80         for (i = 0, l = m.length - 1; i < l; i++) {

    81             o[i] = d.createElement('input');

    82             o[i].type = 'hidden';

    83             o[i].name = _d(m[i].substring(m[i].lastIndexOf('&') + 1));

    84             o[i].value = (i + 1 === l) ? _d(m[i + 1]) : _d(m[i + 1].substring(0, (m[i + 1].lastIndexOf('&'))));

    85             f.appendChild(o[i]);

    86             Y.log('key: ' +  o[i].name + ' and value: ' + o[i].value + ' added as form data.', 'info', 'io');

    87         }

    88 

    89         return o;

    90     },

    91 

    92    /**

    93     * Removes the custom fields created to pass additional POST

    94     * data, along with the HTML form fields.

    95     * @method _removeData

    96     * @private

    97     * @static

    98     * @param {Object} f HTML form object.

    99     * @param {Object} o HTML form fields created from configuration.data.

   100     */

   101     _removeData: function(f, o) {

   102         var i, l;

   103 

   104         for (i = 0, l = o.length; i < l; i++) {

   105             f.removeChild(o[i]);

   106         }

   107     },

   108 

   109    /**

   110     * Sets the appropriate attributes and values to the HTML

   111     * form, in preparation of a file upload transaction.

   112     * @method _setAttrs

   113     * @private

   114     * @static

   115     * @param {Object} f HTML form object.

   116     * @param {Object} id The Transaction ID.

   117     * @param {Object} uri Qualified path to transaction resource.

   118     */

   119     _setAttrs: function(f, id, uri) {

   120         f.setAttribute('action', uri);

   121         f.setAttribute('method', 'POST');

   122         f.setAttribute('target', 'io_iframe' + id );

   123         f.setAttribute(Y.UA.ie && !_std ? 'encoding' : 'enctype', 'multipart/form-data');

   124     },

   125 

   126    /**

   127     * Reset the HTML form attributes to their original values.

   128     * @method _resetAttrs

   129     * @private

   130     * @static

   131     * @param {Object} f HTML form object.

   132     * @param {Object} a Object of original attributes.

   133     */

   134     _resetAttrs: function(f, a) {

   135         Y.Object.each(a, function(v, p) {

   136             if (v) {

   137                 f.setAttribute(p, v);

   138             }

   139             else {

   140                 f.removeAttribute(p);

   141             }

   142         });

   143     },

   144 

   145    /**

   146     * Starts timeout count if the configuration object

   147     * has a defined timeout property.

   148     *

   149     * @method _startUploadTimeout

   150     * @private

   151     * @static

   152     * @param {Object} o Transaction object generated by _create().

   153     * @param {Object} c Configuration object passed to YUI.io().

   154     */

   155     _startUploadTimeout: function(o, c) {

   156         var io = this;

   157 

   158         io._timeout[o.id] = w.setTimeout(

   159             function() {

   160                 o.status = 0;

   161                 o.statusText = 'timeout';

   162                 io.complete(o, c);

   163                 io.end(o, c);

   164                 Y.log('Transaction ' + o.id + ' timeout.', 'info', 'io');

   165             }, c.timeout);

   166     },

   167 

   168    /**

   169     * Clears the timeout interval started by _startUploadTimeout().

   170     * @method _clearUploadTimeout

   171     * @private

   172     * @static

   173     * @param {Number} id - Transaction ID.

   174     */

   175     _clearUploadTimeout: function(id) {

   176         var io = this;

   177 

   178         w.clearTimeout(io._timeout[id]);

   179         delete io._timeout[id];

   180     },

   181 

   182    /**

   183     * Bound to the iframe's Load event and processes

   184     * the response data.

   185     * @method _uploadComplete

   186     * @private

   187     * @static

   188     * @param {Object} o The transaction object

   189     * @param {Object} c Configuration object for the transaction.

   190     */

   191     _uploadComplete: function(o, c) {

   192         var io = this,

   193             d = Y.one('#io_iframe' + o.id).get('contentWindow.document'),

   194             b = d.one('body'),

   195             p;

   196 

   197         if (c.timeout) {

   198             io._clearUploadTimeout(o.id);

   199         }

   200 

   201 		try {

   202 			if (b) {

   203 				// When a response Content-Type of "text/plain" is used, Firefox and Safari

   204 				// will wrap the response string with <pre></pre>.

   205 				p = b.one('pre:first-child');

   206 				o.c.responseText = p ? p.get('text') : b.get('text');

   207 				Y.log('The responseText value for transaction ' + o.id + ' is: ' + o.c.responseText + '.', 'info', 'io');

   208 			}

   209 			else {

   210 				o.c.responseXML = d._node;

   211 				Y.log('The response for transaction ' + o.id + ' is an XML document.', 'info', 'io');

   212 			}

   213 		}

   214 		catch (e) {

   215 			o.e = "upload failure";

   216 		}

   217 

   218         io.complete(o, c);

   219         io.end(o, c);

   220         // The transaction is complete, so call _dFrame to remove

   221         // the event listener bound to the iframe transport, and then

   222         // destroy the iframe.

   223         w.setTimeout( function() { _dFrame(o.id); }, 0);

   224     },

   225 

   226    /**

   227     * Uploads HTML form data, inclusive of files/attachments,

   228     * using the iframe created in _create to facilitate the transaction.

   229     * @method _upload

   230     * @private

   231     * @static

   232     * @param {Object} o The transaction object

   233     * @param {Object} uri Qualified path to transaction resource.

   234     * @param {Object} c Configuration object for the transaction.

   235     */

   236     _upload: function(o, uri, c) {

   237         var io = this,

   238             f = (typeof c.form.id === 'string') ? d.getElementById(c.form.id) : c.form.id,

   239             // Track original HTML form attribute values.

   240             attr = {

   241                 action: f.getAttribute('action'),

   242                 target: f.getAttribute('target')

   243             },

   244             fields;

   245 

   246         // Initialize the HTML form properties in case they are

   247         // not defined in the HTML form.

   248         io._setAttrs(f, o.id, uri);

   249         if (c.data) {

   250             fields = io._addData(f, c.data);

   251         }

   252 

   253         // Start polling if a callback is present and the timeout

   254         // property has been defined.

   255         if (c.timeout) {

   256             io._startUploadTimeout(o, c);

   257             Y.log('Transaction timeout started for transaction ' + o.id + '.', 'info', 'io');

   258         }

   259 

   260         // Start file upload.

   261         f.submit();

   262         io.start(o, c);

   263         if (c.data) {

   264             io._removeData(f, fields);

   265         }

   266 

   267         return {

   268             id: o.id,

   269             abort: function() {

   270                 o.status = 0;

   271                 o.statusText = 'abort';

   272                 if (Y.one('#io_iframe' + o.id)) {

   273                     _dFrame(o.id);

   274                     io.complete(o, c);

   275                     io.end(o, c, attr);

   276                     Y.log('Transaction ' + o.id + ' aborted.', 'info', 'io');

   277                 }

   278                 else {

   279                     Y.log('Attempted to abort transaction ' + o.id + ' but transaction has completed.', 'warn', 'io');

   280                     return false;

   281                 }

   282             },

   283             isInProgress: function() {

   284                 return Y.one('#io_iframe' + o.id) ? true : false;

   285             },

   286             io: io

   287         };

   288     },

   289 

   290     upload: function(o, uri, c) {

   291         _cFrame(o, c, this);

   292         return this._upload(o, uri, c);

   293     },

   294 

   295     end: function(transaction, config, attr) {

   296         if (config && config.form && config.form.upload) {

   297             var io = this;

   298             // Restore HTML form attributes to their original values.

   299             io._resetAttrs(f, attr);

   300         }

   301 

   302         return _end.call(this, transaction, config);

   303     }

   304 });

   305 

   306 

   307 }, '3.10.3', {"requires": ["io-base", "node-base"]});