1 (function($){ 2 if ( typeof(window.xataface) == 'undefined' ){ 3 window.xataface = {}; 4 } 5 6 window.xataface.RecordDialog = RecordDialog; 7 8 9 /** 10 * @name Callback 11 * @memberOf xataface.RecordDialog 12 * @function 13 * @description The callback function that is to be passed to a RecordDialog so that it can be 14 * called on completion. 15 * 16 * @param {Object} o 17 * @param {String} o.__title__ The record title of the record that was just saved. 18 * @param {String} o.__id__ The id of the record that was just saved. 19 * @param {String} o.$$key$$ Each field of the record is included in this data as key value pairs. 20 */ 21 22 23 /** 24 * @name RecordDialog 25 * @class 26 * @memberOf xataface 27 * @description A dialog that opens a new record form or edit record form as an internal 28 * jQuery dialog. 29 * 30 * @property {HTMLElement} el The HTML element that is used to house this dialog. 31 * @property {String} recordid The ID of the record to edit (if null then this will be a new record form). 32 * @property {String} table The table of the record to edit or to add to. 33 * @property {String} baseURL The base URL of the RecordDialog folder. Default is DATAFACE_URL+'/js/RecordDialog' 34 * 35 * @param {Object} o 36 * @param {String} o.recordid The Record ID of the record to edit. 37 * @param {String} o.table The name of the table to add new records to. 38 * @param {xataface.RecordDialog.Callback} o.callback The callback method to be called when saving is complete. 39 * 40 */ 41 function RecordDialog(o){ 42 this.el = document.createElement('div'); 43 this.recordid = null; 44 this.table = null; 45 this.baseURL = DATAFACE_URL+'/js/RecordDialog'; 46 this.formChanged = false; 47 for ( var i in o ) this[i] = o[i]; 48 }; 49 50 RecordDialog.prototype = { 51 52 53 /** 54 * @function 55 * @name display 56 * @memberOf xataface.RecordDialog# 57 * @description Displays the record dialog. 58 */ 59 display: function(){ 60 var dialog = this; 61 $(this.el).load(this.baseURL+'/templates/dialog.html', function(){ 62 var frame = $(this).find('.xf-RecordDialog-iframe') 63 .css({ 64 'width': '100%', 65 'height': '96%', 66 'padding':0, 67 'margin':0, 68 'border': 'none' 69 }) 70 .attr('src', dialog.getURL()); 71 72 73 $(frame).hide(); 74 //alert(frame.attr('width')); 75 frame.load(function(){ 76 $(frame).hide(); 77 dialog.formChanged = false; 78 var iframe = $(this).contents(); 79 try { 80 var parsed = null; 81 82 eval('parsed = '+iframe.text()+';'); 83 if ( parsed['response_code'] == 200 ){ 84 85 // We saved it successfully 86 // so we can close our window 87 if ( dialog.callback ){ 88 dialog.callback(parsed['record_data']); 89 } 90 91 $(dialog.el).dialog('close'); 92 if ( parsed['response_message'] ){ 93 alert(parsed['response_message']); 94 } 95 return; 96 97 } 98 } catch (err){ 99 //alert(err); 100 101 } 102 103 var portalMessage = iframe.find('.portalMessage'); 104 portalMessage.detach(); 105 106 iframe.find('.xf-button-bar').remove(); 107 108 var dc =iframe.find('.documentContent'); 109 if ( dc.length == 0 ) dc = iframe.find('#main_section'); 110 if ( dc.length == 0 ) dc = iframe.find('#main_column'); 111 112 dc.remove(); 113 dc.prepend(portalMessage); 114 115 var ibody = iframe.find('body'); 116 var hidden = $(':hidden', ibody); 117 118 iframe.find('body').empty(); 119 $('script', dc).remove(); // So script tags don't get run twice. 120 dc.appendTo(ibody); 121 hidden.each(function(){ 122 if ( this.tagName == 'SCRIPT' ){ 123 return; 124 } 125 //alert('About to append tag: '+this.tagName+' '+ $(this).text()); 126 $('script',this).remove(); 127 $(this).appendTo(ibody); 128 $(this).hide(); 129 130 }); 131 //hidden.appendTo(ibody); 132 //hidden.hide(); 133 $('#details-controller, .contentViews, .contentActions', ibody).hide(); 134 $(ibody).css('background-color','transparent'); 135 $('.documentContent', ibody).css({ 136 'border':'none', 137 'background-color': 'transparent' 138 }); 139 $(frame).fadeIn(); 140 141 142 $('input, textarea, select', ibody).change(function(){ 143 dialog.formChanged = true; 144 }); 145 146 147 }); 148 149 150 }); 151 $(this.el).appendTo('body'); 152 153 154 $(this.el).dialog({ 155 beforeClose: function(){ 156 if ( dialog.formChanged ){ 157 return confirm('You have unsaved changes. Clicking "OK" will discard these changes. Do you wish to proceed?'); 158 159 } 160 }, 161 buttons: { 162 OK : function(){ 163 164 if ( dialog.callback ){ 165 dialog.callback(); 166 } 167 $(this).dialog('close'); 168 } 169 170 }, 171 height: $(window).height()-25, 172 width: $(window).width()-25, 173 title: (this.recordid?'Edit '+this.table+' Record':'Create New '+this.table+' Record'), 174 modal: true 175 }); 176 177 }, 178 179 /** 180 * @function 181 * @name getURL 182 * @memberOf xataface.RecordDialog 183 * @description Gets the URL to the form for this dialog. 184 * @returns {String} The url for the form of this dialog. 185 */ 186 getURL: function(){ 187 var action; 188 if ( !this.recordid ){ 189 action='new'; 190 } else { 191 action='edit'; 192 } 193 var url = DATAFACE_SITE_HREF+'?-table='+encodeURIComponent(this.table)+(this.recordid?'&-recordid='+encodeURIComponent(this.recordid):'')+'&-action='+encodeURIComponent(action)+'&-response=json'; 194 195 if ( typeof(this.params) == 'object' ){ 196 // We have some parameters to pass along 197 198 $.each(this.params, function(key,val){ 199 url += '&'+encodeURIComponent(key)+'='+encodeURIComponent(val); 200 }); 201 } 202 return url; 203 204 } 205 }; 206 207 RecordDialog.constructor = RecordDialog; 208 209 210 211 $.fn.RecordDialog = function(options){ 212 return this.each(function(){ 213 214 $(this).click(function(){ 215 var d = new RecordDialog(options); 216 d.display(); 217 }); 218 }); 219 }; 220 221 222 223 })(jQuery);