| 1 |
/* global Redirectioni10n, ajaxurl, document, alert */ |
| 2 |
"use strict"; |
| 3 |
|
| 4 |
/** |
| 5 |
* Saves data in a table to the server |
| 6 |
*/ |
| 7 |
var Redirection_Ajax_Form = function( $, form, on_success ) { |
| 8 |
this.$ = $; |
| 9 |
this.form = form; |
| 10 |
this.on_success = on_success; |
| 11 |
this.LOADING_CLASS = 'loading'; |
| 12 |
}; |
| 13 |
|
| 14 |
Redirection_Ajax_Form.prototype.start = function() { |
| 15 |
var data = this.form.find( 'input, select' ).serialize(); |
| 16 |
var url = this.form.data( 'url' ); |
| 17 |
|
| 18 |
this.form.addClass( this.LOADING_CLASS ); |
| 19 |
|
| 20 |
this.$.post( url, data, this.$.proxy( this.on_submit_form, this ), 'json' ); |
| 21 |
}; |
| 22 |
|
| 23 |
Redirection_Ajax_Form.prototype.on_submit_form = function( response ) { |
| 24 |
this.form.removeClass( this.LOADING_CLASS ); |
| 25 |
this.on_success( response ); |
| 26 |
}; |
| 27 |
|
| 28 |
/** |
| 29 |
* Handles ajax fetching when a link in the table is clicked |
| 30 |
*/ |
| 31 |
var Redirection_Ajax = function( $, container ) { |
| 32 |
this.$ = $; |
| 33 |
this.container = container; |
| 34 |
this.old_content = container.html(); |
| 35 |
|
| 36 |
this.ERROR_CONTAINER = '.error-container'; |
| 37 |
this.SAVE_BUTTON = 'input[name=save]'; |
| 38 |
this.CANCEL_BUTTON = 'input[name=cancel]'; |
| 39 |
this.FORM = 'table.edit'; |
| 40 |
this.COLUMN_TYPE = '.column-type'; |
| 41 |
this.COLUMN_MODULE = '.column-module'; |
| 42 |
}; |
| 43 |
|
| 44 |
Redirection_Ajax.prototype.start = function( ajax_data ) { |
| 45 |
this.container.find( this.ERROR_CONTAINER ).hide(); |
| 46 |
this.show_loading(); |
| 47 |
|
| 48 |
this.$.post( ajaxurl, ajax_data, this.$.proxy( this.on_ajax_response, this ), 'json' ); |
| 49 |
}; |
| 50 |
|
| 51 |
Redirection_Ajax.prototype.on_ajax_response = function( response ) { |
| 52 |
if ( this.show_error( response ) ) |
| 53 |
return; |
| 54 |
|
| 55 |
this.container.html( response.html ); |
| 56 |
this.container.find( this.SAVE_BUTTON ).on( 'click', this.$.proxy( this.on_save, this ) ); |
| 57 |
this.container.find( this.CANCEL_BUTTON ).on( 'click', this.$.proxy( this.on_cancel, this ) ); |
| 58 |
}; |
| 59 |
|
| 60 |
Redirection_Ajax.prototype.show_loading = function() { |
| 61 |
this.container.prepend( '<div class="spinner" style="display: block"></div>' ); |
| 62 |
}; |
| 63 |
|
| 64 |
Redirection_Ajax.prototype.hide_loading = function() { |
| 65 |
this.container.find( '.spinner' ).remove(); |
| 66 |
}; |
| 67 |
|
| 68 |
Redirection_Ajax.prototype.show_error = function( response, error_container ) { |
| 69 |
var error = false; |
| 70 |
|
| 71 |
this.hide_loading(); |
| 72 |
|
| 73 |
if ( parseInt( response, 10 ) <= -1 ) |
| 74 |
error = Redirectioni10n.error_msg; |
| 75 |
else if ( response.error ) |
| 76 |
error = response.error; |
| 77 |
|
| 78 |
if ( error ) { |
| 79 |
if ( typeof error_container !== 'undefined' && error_container ) |
| 80 |
error_container.text( Redirectioni10n.error_msg ).show(); |
| 81 |
else |
| 82 |
alert( Redirectioni10n.error_msg ); |
| 83 |
|
| 84 |
return true; |
| 85 |
} |
| 86 |
|
| 87 |
return false; |
| 88 |
}; |
| 89 |
|
| 90 |
Redirection_Ajax.prototype.on_save = function( ev ) { |
| 91 |
ev.preventDefault(); |
| 92 |
|
| 93 |
this.form = new Redirection_Ajax_Form( this.$, this.$( ev.target ).closest( this.FORM ), this.$.proxy( this.on_save_success, this ) ); |
| 94 |
this.form.start(); |
| 95 |
}; |
| 96 |
|
| 97 |
Redirection_Ajax.prototype.on_cancel = function( ev ) { |
| 98 |
ev.preventDefault(); |
| 99 |
|
| 100 |
this.container.html( this.old_content ); |
| 101 |
}; |
| 102 |
|
| 103 |
Redirection_Ajax.prototype.on_save_success = function( response ) { |
| 104 |
this.form = null; |
| 105 |
|
| 106 |
if ( this.show_error( response, this.container.find( this.ERROR_CONTAINER ) ) ) |
| 107 |
return; |
| 108 |
|
| 109 |
this.container.html( response.html ); |
| 110 |
|
| 111 |
if ( response.code ) |
| 112 |
this.set_column( this.COLUMN_TYPE, response.code ); |
| 113 |
else if ( response.module ) |
| 114 |
this.set_column( this.COLUMN_MODULE, response.module ); |
| 115 |
}; |
| 116 |
|
| 117 |
Redirection_Ajax.prototype.set_column = function( selector, content ) { |
| 118 |
var column = this.container.closest( 'tr' ).find( selector ); |
| 119 |
|
| 120 |
column.html( content ); |
| 121 |
}; |
| 122 |
|
| 123 |
/** |
| 124 |
* Items in a table |
| 125 |
*/ |
| 126 |
var Redirection_Items = function( $ ) { |
| 127 |
this.$ = $; |
| 128 |
}; |
| 129 |
|
| 130 |
Redirection_Items.prototype.setup = function( table_items ) { |
| 131 |
this.$( table_items ).on( 'click', '.advanced-toggle', this.$.proxy( this.toggle_advanced_editing, this ) ); |
| 132 |
this.$( table_items ).on( 'click', '.row-actions a.red-auto', this.$.proxy( this.perform_single_bulk_action, this ) ); |
| 133 |
this.$( table_items ).on( 'click', '.row-actions a.red-ajax', this.$.proxy( this.perform_ajax_action, this ) ); |
| 134 |
|
| 135 |
this.$( document ).on( 'change', 'select.change-user-agent', this.$.proxy( this.copy_user_agent, this ) ); |
| 136 |
}; |
| 137 |
|
| 138 |
Redirection_Items.prototype.copy_user_agent = function( ev ) { |
| 139 |
var select = this.$( ev.target ); |
| 140 |
|
| 141 |
select.closest( 'td' ).find( 'input[type=text]' ).val( select.val() ); |
| 142 |
}; |
| 143 |
|
| 144 |
Redirection_Items.prototype.toggle_advanced_editing = function( ev ) { |
| 145 |
var edit_button = this.$( ev.target ); |
| 146 |
|
| 147 |
ev.preventDefault(); |
| 148 |
|
| 149 |
edit_button.toggleClass( 'advanced-toggled' ); |
| 150 |
edit_button.closest( 'table' ).find( '.advanced' ).toggle(); |
| 151 |
}; |
| 152 |
|
| 153 |
Redirection_Items.prototype.perform_single_bulk_action = function( ev ) { |
| 154 |
var action = this.$( ev.target ); |
| 155 |
|
| 156 |
ev.preventDefault(); |
| 157 |
|
| 158 |
action.closest( 'tr' ).find( 'input[type=checkbox]' ).prop( 'checked', true ); |
| 159 |
this.$( 'select[name=action]' ).find( 'option[value=' + action.data( 'action' ) + ']' ).prop( 'selected', true ); |
| 160 |
this.$( '#doaction' ).click(); |
| 161 |
}; |
| 162 |
|
| 163 |
Redirection_Items.prototype.perform_ajax_action = function( ev ) { |
| 164 |
var container = this.$( ev.target ).closest( 'td' ); |
| 165 |
var action = this.$( ev.target ); |
| 166 |
var ajax_data = { |
| 167 |
action: action.data( 'action' ), |
| 168 |
_ajax_nonce: action.data( 'nonce' ), |
| 169 |
id: action.data( 'id' ) |
| 170 |
}; |
| 171 |
|
| 172 |
ev.preventDefault(); |
| 173 |
|
| 174 |
if ( typeof this.ajax !== 'undefined' ) |
| 175 |
delete this.ajax; |
| 176 |
|
| 177 |
this.ajax = new Redirection_Ajax( this.$, container ); |
| 178 |
this.ajax.start( ajax_data ); |
| 179 |
}; |
| 180 |
|
| 181 |
/** |
| 182 |
* Connects the 'add redirect' link to the Redirection_Add form |
| 183 |
*/ |
| 184 |
|
| 185 |
var Redirection_Logs = function( $, add_form, added_notice, source_url ) { |
| 186 |
this.$ = $; |
| 187 |
this.add_form = add_form; |
| 188 |
this.addded_notice = added_notice; |
| 189 |
this.source_url = source_url; |
| 190 |
}; |
| 191 |
|
| 192 |
Redirection_Logs.prototype.setup = function( add_log ) { |
| 193 |
this.$( add_log ).on( 'click', this.$.proxy( this.on_add_log, this ) ); |
| 194 |
}; |
| 195 |
|
| 196 |
Redirection_Logs.prototype.on_add_log = function( ev ) { |
| 197 |
ev.preventDefault(); |
| 198 |
|
| 199 |
this.$( this.added_notice ).hide(); |
| 200 |
this.$( this.add_form ).show(); |
| 201 |
|
| 202 |
// Copy details |
| 203 |
this.$( this.source_url ).val( this.$( ev.target ).attr( 'href' ) ); |
| 204 |
this.$( 'html, body' ).scrollTop( this.$( this.add_form ).offset().top ); |
| 205 |
}; |
| 206 |
|
| 207 |
|
| 208 |
/** |
| 209 |
* Add a redirect form |
| 210 |
*/ |
| 211 |
var Redirection_Add = function( $, target, add_to_screen ) { |
| 212 |
this.$ = $; |
| 213 |
this.target = target; |
| 214 |
this.add_to_screen = add_to_screen; |
| 215 |
|
| 216 |
this.ALT_CLASS = 'alternate'; |
| 217 |
this.LOADING_CLASS = 'loading'; |
| 218 |
this.LOADED_CLASS = 'loaded'; |
| 219 |
this.LOADED_ERROR_CLASS = 'loaded-error'; |
| 220 |
this.TEXT_FIELD = 'input[type=text]'; |
| 221 |
this.ERROR_CONTAINER = '.red-error'; |
| 222 |
this.ITEM_TABLE = 'table.items'; |
| 223 |
this.EMPTY_TABLE = 'table tr.no-items'; |
| 224 |
}; |
| 225 |
|
| 226 |
Redirection_Add.prototype.setup = function( selector, add_form ) { |
| 227 |
this.add_form = add_form; |
| 228 |
|
| 229 |
this.$( selector ).on( 'change', this.$.proxy( this.on_change_type, this ) ); |
| 230 |
this.$( add_form ).find( 'form' ).ajaxForm( { |
| 231 |
beforeSubmit: this.$.proxy( this.before_submit, this ), |
| 232 |
success: this.$.proxy( this.on_success, this ), |
| 233 |
dataType: 'json' |
| 234 |
} ); |
| 235 |
}; |
| 236 |
|
| 237 |
Redirection_Add.prototype.on_change_type = function( ev ) { |
| 238 |
var val = this.$( ev.target ).val(); |
| 239 |
|
| 240 |
this.$( this.target ).toggle( val === 'url' || val === 'pass' ); |
| 241 |
}; |
| 242 |
|
| 243 |
Redirection_Add.prototype.before_submit = function() { |
| 244 |
this.$( this.add_form ).removeClass( this.LOADED_ERROR_CLASS + ' ' + this.LOADED_CLASS ).addClass( this.LOADING_CLASS ); |
| 245 |
}; |
| 246 |
|
| 247 |
Redirection_Add.prototype.on_success = function( response ) { |
| 248 |
var error = this.get_redirect_error( response ); |
| 249 |
|
| 250 |
this.reset_form(); |
| 251 |
|
| 252 |
if ( error ) |
| 253 |
this.add_error( this.add_form, error ); |
| 254 |
else if ( this.add_to_screen === true ) |
| 255 |
this.add_redirect_to_list( this.add_form, response.html ); |
| 256 |
else |
| 257 |
this.show_added_notice( this.add_form ); |
| 258 |
}; |
| 259 |
|
| 260 |
Redirection_Add.prototype.reset_form = function() { |
| 261 |
this.$( this.add_form ).find( this.TEXT_FIELD ).val( '' ); |
| 262 |
this.$( this.add_form ).removeClass( this.LOADING_CLASS ); |
| 263 |
}; |
| 264 |
|
| 265 |
Redirection_Add.prototype.add_error = function( add_form, error ) { |
| 266 |
this.$( add_form ).addClass( this.LOADED_ERROR_CLASS ); |
| 267 |
this.$( add_form ).find( this.ERROR_CONTAINER ).html( error ); |
| 268 |
}; |
| 269 |
|
| 270 |
Redirection_Add.prototype.add_redirect_to_list = function( add_form, html ) { |
| 271 |
this.$( this.ITEM_TABLE ).append( html ); |
| 272 |
|
| 273 |
this.show_added_notice( add_form ); |
| 274 |
this.set_alternate_rows( this.ITEM_TABLE + ' tr' ); |
| 275 |
this.remove_empty_row( this.EMPTY_TABLE ); |
| 276 |
}; |
| 277 |
|
| 278 |
Redirection_Add.prototype.show_added_notice = function( add_form ) { |
| 279 |
this.$( add_form ).addClass( this.LOADED_CLASS ); |
| 280 |
}; |
| 281 |
|
| 282 |
Redirection_Add.prototype.remove_empty_row = function( empty_rows ) { |
| 283 |
this.$( empty_rows ).remove(); |
| 284 |
}; |
| 285 |
|
| 286 |
Redirection_Add.prototype.set_alternate_rows = function( table_rows ) { |
| 287 |
this.$( table_rows ).each( this.$.proxy( this.alt_rows, this ) ); |
| 288 |
}; |
| 289 |
|
| 290 |
Redirection_Add.prototype.alt_rows = function( pos, item ) { |
| 291 |
this.$( item ).removeClass( this.ALT_CLASS ); |
| 292 |
|
| 293 |
if ( pos % 2 === 0 ) |
| 294 |
this.$( item ).addClass( this.ALT_CLASS ); |
| 295 |
}; |
| 296 |
|
| 297 |
Redirection_Add.prototype.get_redirect_error = function( response ) { |
| 298 |
if ( parseInt( response, 10 ) === 0 || parseInt( response, 10 ) === -1 ) |
| 299 |
return Redirectioni10n.error_msg; |
| 300 |
else if ( response.error ) |
| 301 |
return response.error; |
| 302 |
return false; |
| 303 |
}; |
| 304 |
|