code_manager.js
4 years ago
code_manager_dashboard.js
4 years ago
code_manager_listmode.js
4 years ago
code_manager_tabmode.js
4 years ago
notify.min.js
4 years ago
code_manager_tabmode.js
829 lines
| 1 | /** |
| 2 | * JavaScript code to build Code Manager IDE in tab mode |
| 3 | * |
| 4 | * @author Peter Schulz |
| 5 | * @since 1.0.0 |
| 6 | */ |
| 7 | |
| 8 | const PHP_DEFAULT = '<?php\n\n?>'; |
| 9 | |
| 10 | var user_has_edited = {}; |
| 11 | |
| 12 | var current_url = window.location.href.split('?'); |
| 13 | var default_url = current_url[0] + '?page=code_manager'; |
| 14 | |
| 15 | var href = window.location.href; |
| 16 | var pathname = href.substring(0, href.lastIndexOf('/')) + '/admin-ajax.php'; |
| 17 | |
| 18 | var tabs = 0; |
| 19 | var cm_editors = {}; |
| 20 | var new_label_index = 0; |
| 21 | |
| 22 | function option_in_code_list(option_value) { |
| 23 | found = false; |
| 24 | jQuery('#code_manager_code_list option').each(function() { |
| 25 | if (this.value === option_value) { |
| 26 | found = true; |
| 27 | return true; |
| 28 | } |
| 29 | }); |
| 30 | return found; |
| 31 | } |
| 32 | |
| 33 | function get_code_list(callback) { |
| 34 | jQuery.ajax({ |
| 35 | method: 'POST', |
| 36 | url: pathname + '?action=code_manager_get_code_list', |
| 37 | data: { |
| 38 | wpnonce: wpnonce, |
| 39 | page: 'code_manager_post' |
| 40 | } |
| 41 | }).done( |
| 42 | function(msg) { |
| 43 | try { |
| 44 | obj = JSON.parse(msg); |
| 45 | |
| 46 | if (Array.isArray(obj)) { |
| 47 | jQuery('#code_manager_code_list').empty(); |
| 48 | for (var key in obj) { |
| 49 | if (!is_code_edited(obj[key].code_id)) { |
| 50 | jQuery('#code_manager_code_list') |
| 51 | .append( |
| 52 | jQuery('<option>', {value: obj[key].code_id}) |
| 53 | .html(obj[key].code_name + " <span style='float:right'>" + obj[key].code_type + "</span>") |
| 54 | .attr('data-name', obj[key].code_name) |
| 55 | .attr('data-type', obj[key].code_type) |
| 56 | .attr('data-enabled', obj[key].code_enabled) |
| 57 | .attr('data-preview', obj[key].preview_enabled) |
| 58 | ); |
| 59 | } |
| 60 | } |
| 61 | callback(); |
| 62 | } |
| 63 | } |
| 64 | catch (e) { |
| 65 | if (msg.substr(0, 3) === 'ERR') { |
| 66 | jQuery.notify(msg, "error"); |
| 67 | } else { |
| 68 | jQuery.notify(e, "error"); |
| 69 | } |
| 70 | } |
| 71 | } |
| 72 | ); |
| 73 | } |
| 74 | |
| 75 | function is_code_edited(code_id) { |
| 76 | for (var editor in cm_editors) { |
| 77 | if (cm_editors[editor].tab_code_index==code_id) { |
| 78 | return true; |
| 79 | } |
| 80 | } |
| 81 | return false; |
| 82 | } |
| 83 | |
| 84 | function get_code(code_id, code_name, code_type, code_enabled, preview_enabled) { |
| 85 | jQuery.ajax({ |
| 86 | method: 'POST', |
| 87 | url: pathname + '?action=code_manager_get_code', |
| 88 | data: { |
| 89 | wpnonce: wpnonce_get_code, |
| 90 | code_id: code_id, |
| 91 | page: 'code_manager_post' |
| 92 | } |
| 93 | }).done( |
| 94 | function(msg) { |
| 95 | if (msg==='ERR-Not authorized') { |
| 96 | jQuery.notify('Not authorized', 'error'); |
| 97 | } else if (msg==='ERR-Wrong arguments') { |
| 98 | jQuery.notify('Wrong arguments', 'error'); |
| 99 | } else { |
| 100 | tab_load(code_id, code_name, code_type, msg, code_enabled, preview_enabled); |
| 101 | } |
| 102 | } |
| 103 | ); |
| 104 | } |
| 105 | |
| 106 | function set_copy_shortcode_link(tab) { |
| 107 | if (cm_editors[tab].tab_code_index!==-1 && jQuery("#tab-" + tab + "-code_type").val().includes("shortcode")) { |
| 108 | code_name = jQuery("#tab-" + tab + "-label").text(); |
| 109 | jQuery("#tab-" + tab + "-shortcode_link").html(` |
| 110 | <a href="javascript:void(0)" class="dashicons dashicons-image-rotate" onclick="jQuery('#cm_copy_id${tab}').toggle(); jQuery('#cm_copy_name${tab}').toggle();" style="vertical-align:middle"></a> |
| 111 | <span id="cm_copy_id${tab}" style="display:none"> |
| 112 | [cmruncode id="${cm_editors[tab].tab_code_index}"] |
| 113 | <a href="javascript:void(0)" class="dashicons dashicons-clipboard c2c" |
| 114 | onclick="jQuery.notify("Shortcode copied to clipboard", "info")" |
| 115 | data-clipboard-text="[cmruncode id="${cm_editors[tab].tab_code_index}"]" |
| 116 | title="Copy shortcode to clipboard" style="vertical-align:middle" |
| 117 | ></a> |
| 118 | </span> |
| 119 | <span id="cm_copy_name${tab}"> |
| 120 | [cmruncode name="${code_name}"] |
| 121 | <a href="javascript:void(0)" class="dashicons dashicons-clipboard c2c" |
| 122 | onclick="jQuery.notify("Shortcode copied to clipboard", "info")" |
| 123 | data-clipboard-text="[cmruncode name="${code_name}"]" |
| 124 | title="Copy shortcode to clipboard" style="vertical-align:middle" |
| 125 | ></a> |
| 126 | </span> |
| 127 | `); |
| 128 | new ClipboardJS('.c2c'); |
| 129 | } else { |
| 130 | jQuery("#tab-" + tab + "-shortcode_link").html(''); |
| 131 | } |
| 132 | } |
| 133 | |
| 134 | function tab_unselect() { |
| 135 | jQuery('.nav-tab-active').removeClass('nav-tab-active'); |
| 136 | jQuery('.nav-tab-content').hide(); |
| 137 | } |
| 138 | |
| 139 | function tab_new(tab_label, code_id = -1, code_type = 'PHP Shortcode', code = '', code_enabled = 0, preview_enabled = 'false') { |
| 140 | tab_unselect(); |
| 141 | |
| 142 | code_types = ''; |
| 143 | for (var code_group in code_manager_code_groups) { |
| 144 | code_types += '<optgroup label="' + code_group + '">'; |
| 145 | code_manager_code_group = code_manager_code_groups[code_group]; |
| 146 | for (var label in code_manager_code_group ) { |
| 147 | if (code_type===label) { |
| 148 | selected = ' selected'; |
| 149 | } else { |
| 150 | selected = ''; |
| 151 | } |
| 152 | code_types += |
| 153 | '<option value="' + label + '"' + selected + '>' + |
| 154 | code_manager_code_group[label] + |
| 155 | '</option>'; |
| 156 | } |
| 157 | code_types += '</optgroup>'; |
| 158 | } |
| 159 | |
| 160 | jQuery('#code_manager_taskbar_tabmode') |
| 161 | .append( |
| 162 | '<a id="tab-' + tabs + '" href="javascript:void(0)" class="nav-tab nav-tab-active" onclick="tab_clicked(' + tabs + ')" data-code-manager-tab="' + tabs + '">' + |
| 163 | '<span id="tab-' + tabs + '-label" contenteditable="true" class="code_manager_tab_label cm_tooltip" data-code-manager-tab="' + tabs + '" title="Double click to change code name">' + tab_label + '</span>' + |
| 164 | '<span id="tab-' + tabs + '-icon" class="dashicons dashicons-dismiss icon_close" onclick="tab_close(this,event,' + tabs + ')"></span>' + |
| 165 | '</a>' |
| 166 | ); |
| 167 | |
| 168 | var editorSettings = cm_settings; |
| 169 | if (code_type.includes('html')) { |
| 170 | // Load HTML settings |
| 171 | editorSettings = wp.codeEditor.defaultSettings ? _.clone( wp.codeEditor.defaultSettings ) : {}; |
| 172 | editorSettings.codemirror = _.extend( |
| 173 | {}, |
| 174 | editorSettings.codemirror, |
| 175 | { |
| 176 | mode: 'html', |
| 177 | } |
| 178 | ); |
| 179 | } else if (code_type.includes('css')) { |
| 180 | // Load CSS settings |
| 181 | editorSettings = wp.codeEditor.defaultSettings ? _.clone( wp.codeEditor.defaultSettings ) : {}; |
| 182 | editorSettings.codemirror = _.extend( |
| 183 | {}, |
| 184 | editorSettings.codemirror, |
| 185 | { |
| 186 | mode: 'css', |
| 187 | } |
| 188 | ); |
| 189 | } if (code_type.includes('javascript')) { |
| 190 | // Load JavaScript settings |
| 191 | editorSettings = wp.codeEditor.defaultSettings ? _.clone( wp.codeEditor.defaultSettings ) : {}; |
| 192 | editorSettings.codemirror = _.extend( |
| 193 | {}, |
| 194 | editorSettings.codemirror, |
| 195 | { |
| 196 | mode: 'javascript', |
| 197 | } |
| 198 | ); |
| 199 | } else { |
| 200 | // Load PHP settings (default = cm_settings) |
| 201 | if (code==='') { |
| 202 | code = PHP_DEFAULT; |
| 203 | } |
| 204 | } |
| 205 | |
| 206 | code_id_displayed = code_id==-1 ? 'new' : code_id; |
| 207 | code_is_enabled = code_enabled==0 ? '' : 'checked'; |
| 208 | code_preview_enabled = preview_enabled=='false' ? '' : 'checked'; |
| 209 | |
| 210 | if (code_type.includes('file')) { |
| 211 | element_code_enabled = |
| 212 | '<select id="tab-' + tabs + '-cb-enable" ' + code_is_enabled + ' onchange="return tab_icon_enable(' + tabs + ')" title="Enable code" class="cm_tooltip" style="margin-right:15px">' + |
| 213 | '<option value="0">Disabled</option>' + |
| 214 | '<option value="1">Admin enabled</option>' + |
| 215 | '<option value="2">Public enabled</option>' + |
| 216 | '<option value="3">Both enabled</option>' + |
| 217 | '</select>'; |
| 218 | } else { |
| 219 | element_code_enabled = |
| 220 | '<label class="cm_tooltip" style="padding-right:15px" title="Enable code">' + |
| 221 | '<input type="checkbox" id="tab-' + tabs + '-cb-enable" ' + code_is_enabled + ' onclick="return tab_icon_enable(' + tabs + ')" />' + |
| 222 | 'Enable' + |
| 223 | '</label>'; |
| 224 | } |
| 225 | |
| 226 | jQuery('#code_manager_workspace_tabmode') |
| 227 | .append( |
| 228 | '<div id="tab-' + tabs + '-div" class="nav-tab-content">' + |
| 229 | '<div id="tab-' + tabs + '-taskbar" class="tab_task_bar">' + |
| 230 | '<a href="javascript:void(0)" class="button non-active cm_tooltip" id="tab-' + tabs + '-icon-save" disabled="true" onclick="tab_icon_save(' + tabs + ')" title="Save code">' + |
| 231 | '<span class="dashicons dashicons-yes-alt" style="padding-top: 4px;"></span>' + |
| 232 | '</a>' + |
| 233 | ' ' + |
| 234 | '<select id="tab-' + tabs + '-code_type" class="cm_tooltip" title="Select code type">' + |
| 235 | code_types + |
| 236 | '</select>' + |
| 237 | ' ' + |
| 238 | '<span>ID: ' + |
| 239 | '<span id="tab-' + tabs + '-code_id" style="font-weight: bold">' + code_id_displayed + '</span>' + |
| 240 | '</span>' + |
| 241 | '<span id="tab-' + tabs + '-shortcode_link" style="padding-left:10px"></span>' + |
| 242 | '<span style="float:right;line-height:2">' + |
| 243 | element_code_enabled + |
| 244 | '<label class="cm_tooltip" style="padding-right:5px" title="Enable preview mode for this code"><input type="checkbox" class="cm-cb-preview" id="tab-' + tabs + '-cb-preview"' + code_preview_enabled + ' onclick="return tab_icon_preview(' + tabs + ')" />Preview</label>' + |
| 245 | '<label class="material-icons cm_tooltip" title="Refresh tab" onclick="return tab_refresh(' + tabs + ')">refresh</label>' + |
| 246 | '</span>' + |
| 247 | '</div>' + |
| 248 | '<div id="tab-' + tabs + '-code" class="tab_code" data-code-manager-tab="' + tabs + '">' + |
| 249 | '<textarea id="tab-' + tabs + '-content">' + |
| 250 | code.replace(/&(?!amp;)/g, '&')+ |
| 251 | '</textarea>' + |
| 252 | '</div>' + |
| 253 | '</div>' |
| 254 | ); |
| 255 | |
| 256 | var tab_editor = wp.codeEditor.initialize(jQuery('#tab-' + tabs + '-content'), editorSettings); |
| 257 | |
| 258 | tab_editor.codemirror.focus(); |
| 259 | tab_editor.codemirror.setCursor(1); |
| 260 | tab_editor.codemirror.setOption('tabindex', tabs); |
| 261 | |
| 262 | var editor = { |
| 263 | tab_index: tabs, |
| 264 | tab_code_index: code_id, |
| 265 | tab_label: tab_label, |
| 266 | tab_editor: tab_editor |
| 267 | }; |
| 268 | cm_editors[tabs] = editor; |
| 269 | user_has_edited[tabs] = false; |
| 270 | |
| 271 | tab_editor.codemirror.on('change', function(cm_editor){ |
| 272 | tab_changed(cm_editor.getOption('tabindex')); |
| 273 | }); |
| 274 | |
| 275 | // Enable tooltip |
| 276 | jQuery('.cm_tooltip').tooltip(); |
| 277 | |
| 278 | // Add shortcode link if applicable |
| 279 | set_copy_shortcode_link(tabs); |
| 280 | |
| 281 | jQuery('#tab-' + tabs + '-code_type').on('focus', function(event) { |
| 282 | jQuery(this).data({current_value:jQuery(this).val()}); |
| 283 | }); |
| 284 | |
| 285 | jQuery('#tab-' + tabs + '-code_type').on('change', {tab:tabs,cid:code_id}, function(event) { |
| 286 | if (event.data.cid===-1) { |
| 287 | if (jQuery('#tab-' + event.data.tab + '-code_type option:selected').text().toLowerCase().includes('php')) { |
| 288 | // Add php tags |
| 289 | if (cm_editors[event.data.tab].tab_editor.codemirror.getValue()==='') { |
| 290 | cm_editors[event.data.tab].tab_editor.codemirror.setValue(PHP_DEFAULT); |
| 291 | } |
| 292 | } else { |
| 293 | // Remove php tags (clear field) |
| 294 | if (cm_editors[event.data.tab].tab_editor.codemirror.getValue()===PHP_DEFAULT) { |
| 295 | cm_editors[event.data.tab].tab_editor.codemirror.setValue(''); |
| 296 | } |
| 297 | } |
| 298 | |
| 299 | tab_changed(event.data.tab); |
| 300 | return; |
| 301 | } |
| 302 | |
| 303 | html = '<div>Are you sure you want to change the code type? Due to possible errors, this code will be disabled!</div>'; |
| 304 | var dialog = |
| 305 | jQuery(html) |
| 306 | .data('current_element',jQuery(this)) |
| 307 | .data('current_value',jQuery.data(this, 'current_value')) |
| 308 | .data('current_tab',event.data.tab) |
| 309 | .dialog({ |
| 310 | dialogClass: 'no-close', |
| 311 | title: 'Change code type?', |
| 312 | buttons: { |
| 313 | 'Yes': function() { |
| 314 | tab_changed(jQuery.data(this, 'current_tab')); |
| 315 | jQuery("#tab-" + tab + "-cb-enable").prop("checked", false); |
| 316 | set_copy_shortcode_link(tab); |
| 317 | dialog.dialog('destroy'); |
| 318 | }, |
| 319 | 'No': function() { |
| 320 | jQuery(jQuery.data(this, 'current_element')).val(jQuery.data(this, 'current_value')); |
| 321 | dialog.dialog('destroy'); |
| 322 | }, |
| 323 | 'Cancel': function() { |
| 324 | jQuery(jQuery.data(this, 'current_element')).val(jQuery.data(this, 'current_value')); |
| 325 | dialog.dialog('destroy'); |
| 326 | } |
| 327 | } |
| 328 | }); |
| 329 | }); |
| 330 | |
| 331 | jQuery('#tab-' + tabs + '-label').on('input', {tab:tabs}, function(event) { |
| 332 | tab_changed(event.data.tab); |
| 333 | }); |
| 334 | |
| 335 | jQuery('#tab-' + tabs + '-label').on('dblclick', function() { |
| 336 | var cell = this; |
| 337 | var range, selection; |
| 338 | if (document.body.createTextRange) { |
| 339 | range = document.body.createTextRange(); |
| 340 | range.moveToElementText(cell); |
| 341 | range.select(); |
| 342 | } else if (window.getSelection) { |
| 343 | selection = window.getSelection(); |
| 344 | range = document.createRange(); |
| 345 | range.selectNodeContents(cell); |
| 346 | selection.removeAllRanges(); |
| 347 | selection.addRange(range); |
| 348 | } |
| 349 | }); |
| 350 | |
| 351 | tabs++; |
| 352 | } |
| 353 | |
| 354 | function tab_changed(tabindex) { |
| 355 | user_has_edited[tabindex] = true; |
| 356 | jQuery('#tab-' + tabindex + '-icon').addClass('tab_unsaved_changes'); |
| 357 | jQuery('#tab-' + tabindex + '-icon-save').removeClass('non-active').attr('disabled', false); |
| 358 | } |
| 359 | |
| 360 | function activate_code_on_server(tab, val, txt) { |
| 361 | jQuery.ajax({ |
| 362 | type: 'POST', |
| 363 | url: pathname + '?action=code_manager_activate_code', |
| 364 | data: { |
| 365 | code_id: cm_editors[tab].tab_code_index, |
| 366 | code_item_value: val, |
| 367 | wpnonce: wpnonce, |
| 368 | page: 'code_manager_post' |
| 369 | } |
| 370 | }).done( |
| 371 | function (msg) { |
| 372 | if ( msg.substr(0, 3) === 'UPD' ) { |
| 373 | jQuery.notify(txt, 'success'); |
| 374 | } else { |
| 375 | jQuery.notify('Settings not saved', 'error'); |
| 376 | } |
| 377 | } |
| 378 | ).fail( |
| 379 | function () { |
| 380 | jQuery.notify('The request could not be handled', 'error'); |
| 381 | } |
| 382 | ); |
| 383 | |
| 384 | } |
| 385 | |
| 386 | function tab_refresh(tab) { |
| 387 | if (cm_editors[tab].tab_code_index===-1) { |
| 388 | jQuery.notify('Code needs to be saved first', 'error'); |
| 389 | } else { |
| 390 | jQuery.ajax({ |
| 391 | method: 'POST', |
| 392 | url: pathname + '?action=code_manager_get_code', |
| 393 | data: { |
| 394 | wpnonce: wpnonce_get_code, |
| 395 | code_id: cm_editors[tab].tab_code_index, |
| 396 | page: 'code_manager_post', |
| 397 | wpda_action: 'all' |
| 398 | } |
| 399 | }).done( |
| 400 | function(data) { |
| 401 | json = jQuery.parseJSON(data); |
| 402 | |
| 403 | cm_editors[tab].tab_label = json.code_name; |
| 404 | |
| 405 | cm = cm_editors[tab].tab_editor.codemirror; |
| 406 | cm.setValue(json.code); |
| 407 | cm.save(); |
| 408 | |
| 409 | jQuery("#tab-" + tab + "-label").text(json.code_name); |
| 410 | jQuery("#tab-" + tab + "-code_type").val(json.code_type); |
| 411 | jQuery("#tab-" + tab + "-cb-enable").prop("checked", json.code_enabled==="1"); |
| 412 | |
| 413 | mark_tab_as_unchanged(cm); |
| 414 | |
| 415 | set_copy_shortcode_link(tab); |
| 416 | |
| 417 | jQuery.notify('Refresh completed', 'success'); |
| 418 | } |
| 419 | ); |
| 420 | jQuery.ajax({ |
| 421 | method: 'POST', |
| 422 | url: pathname + '?action=code_manager_is_code_preview_enabled', |
| 423 | data: { |
| 424 | wpnonce: wpnonce_get_code, |
| 425 | code_id: cm_editors[tab].tab_code_index, |
| 426 | page: 'code_manager_post', |
| 427 | } |
| 428 | }).done( |
| 429 | function(data) { |
| 430 | jQuery("#tab-" + tab + "-cb-preview").prop("checked", data==="true"); |
| 431 | } |
| 432 | ); |
| 433 | } |
| 434 | } |
| 435 | |
| 436 | function activate_preview_on_server(tab) { |
| 437 | jQuery.ajax({ |
| 438 | method: 'POST', |
| 439 | url: pathname + '?action=code_manager_activate_code_preview', |
| 440 | data: { |
| 441 | wpnonce: wpnonce, |
| 442 | code_id: cm_editors[tab].tab_code_index, |
| 443 | page: 'code_manager_post' |
| 444 | } |
| 445 | }).done( |
| 446 | function(msg) { |
| 447 | if (msg==='OK') { |
| 448 | jQuery.notify('Preview activated', 'success'); |
| 449 | } else { |
| 450 | jQuery.notify(msg, 'error'); |
| 451 | } |
| 452 | } |
| 453 | ); |
| 454 | } |
| 455 | |
| 456 | function tab_open() { |
| 457 | get_code_list(tab_open_callback); |
| 458 | } |
| 459 | |
| 460 | function tab_open_callback() { |
| 461 | var dialog = jQuery(jQuery('#code_manager_open_frame')).dialog({ |
| 462 | dialogClass: 'no-close', |
| 463 | width: "inherit", |
| 464 | resizable: false, |
| 465 | title: 'Select code from list', |
| 466 | buttons: { |
| 467 | 'Open': function() { |
| 468 | var code_list = jQuery('#code_manager_code_list').val(); |
| 469 | if (code_list.length===0) { |
| 470 | alert("Nothing selected!") |
| 471 | } else { |
| 472 | if (code_list[0]==='Loading data...') { |
| 473 | alert("Nothing selected!") |
| 474 | } else { |
| 475 | for (var i=0; i<code_list.length; i++) { |
| 476 | get_code( |
| 477 | code_list[i], |
| 478 | jQuery('#code_manager_code_list option[value=' + code_list[i] + ']').attr('data-name'), |
| 479 | jQuery('#code_manager_code_list option[value=' + code_list[i] + ']').attr('data-type'), |
| 480 | jQuery('#code_manager_code_list option[value=' + code_list[i] + ']').attr('data-enabled'), |
| 481 | jQuery('#code_manager_code_list option[value=' + code_list[i] + ']').attr('data-preview') |
| 482 | ); |
| 483 | } |
| 484 | dialog.dialog('close'); |
| 485 | } |
| 486 | } |
| 487 | }, |
| 488 | 'Cancel': function() { |
| 489 | dialog.dialog('close'); |
| 490 | } |
| 491 | } |
| 492 | }); |
| 493 | jQuery("#code_manager_code_list").unbind("dblclick"); |
| 494 | jQuery("#code_manager_code_list").on("dblclick", function() { |
| 495 | tab = jQuery(this).val()[0]; |
| 496 | get_code( |
| 497 | tab, |
| 498 | jQuery('#code_manager_code_list option[value=' + tab + ']').attr('data-name'), |
| 499 | jQuery('#code_manager_code_list option[value=' + tab + ']').attr('data-type'), |
| 500 | jQuery('#code_manager_code_list option[value=' + tab + ']').attr('data-enabled'), |
| 501 | jQuery('#code_manager_code_list option[value=' + tab + ']').attr('data-preview') |
| 502 | ); |
| 503 | dialog.dialog('close'); |
| 504 | }); |
| 505 | } |
| 506 | |
| 507 | function tab_close(elem, event, tab) { |
| 508 | if (user_has_edited[tab]===true) { |
| 509 | html = '<div>Your changes will not be saved!</div>'; |
| 510 | var dialog = jQuery(html).dialog({ |
| 511 | dialogClass: 'no-close', |
| 512 | title: 'Close tab?', |
| 513 | buttons: { |
| 514 | 'Yes': function() { |
| 515 | close_tab(elem, tab); |
| 516 | dialog.dialog('destroy'); |
| 517 | }, |
| 518 | 'No': function() { |
| 519 | dialog.dialog('destroy'); |
| 520 | }, |
| 521 | 'Cancel': function() { |
| 522 | dialog.dialog('destroy'); |
| 523 | } |
| 524 | } |
| 525 | }); |
| 526 | } else { |
| 527 | close_tab(elem, tab); |
| 528 | } |
| 529 | event.stopPropagation(); |
| 530 | } |
| 531 | function close_tab(elem, tab) { |
| 532 | jQuery(elem).parent().remove(); |
| 533 | jQuery('#tab-' + tab + '-div').remove(); |
| 534 | |
| 535 | cm = cm_editors[tab].tab_editor.codemirror; |
| 536 | cm.setOption('mode', 'text/x-csrc'); |
| 537 | cm.getWrapperElement().parentNode.removeChild(cm.getWrapperElement()); |
| 538 | cm=null; |
| 539 | delete cm_editors[tab]; |
| 540 | delete user_has_edited[tab]; |
| 541 | |
| 542 | if (!jQuery('.nav-tab-active').length) { |
| 543 | index_selected = -1; |
| 544 | |
| 545 | for (editor in cm_editors) { |
| 546 | tab_index = cm_editors[editor].tab_editor.codemirror.getOption('tabindex'); |
| 547 | if (index_selected>tab) { |
| 548 | break; |
| 549 | } |
| 550 | index_selected = tab_index; |
| 551 | } |
| 552 | |
| 553 | if (index_selected>-1) { |
| 554 | tab_activate(index_selected); |
| 555 | } |
| 556 | } |
| 557 | } |
| 558 | |
| 559 | function tab_activate(tab) { |
| 560 | jQuery('#tab-' + tab).addClass('nav-tab-active'); |
| 561 | jQuery('#tab-' + tab + '-div').show(); |
| 562 | } |
| 563 | |
| 564 | function tab_load(code_id, tab_label, code_type, code, code_enabled, preview_enabled) { |
| 565 | tab_new(tab_label, code_id, code_type, code, code_enabled, preview_enabled); |
| 566 | } |
| 567 | |
| 568 | function tab_clicked(tab) { |
| 569 | source_id = jQuery('.nav-tab-active').attr('data-code-manager-tab'); |
| 570 | if (source_id===tab) { |
| 571 | return; |
| 572 | } |
| 573 | |
| 574 | jQuery('.nav-tab-active').removeClass('nav-tab-active'); |
| 575 | jQuery('.nav-tab-content').hide(); |
| 576 | jQuery('#tab-' + tab).addClass('nav-tab-active'); |
| 577 | jQuery('#tab-' + tab + '-div').show(); |
| 578 | } |
| 579 | |
| 580 | function tab_icon_save(tab) { |
| 581 | tab_label = jQuery('#tab-' + tab + '-label').text(); |
| 582 | old_label = cm_editors[tab].tab_label; |
| 583 | if (old_label!==tab_label) { |
| 584 | code_name_exists(tab_label, old_label, tab) |
| 585 | } else { |
| 586 | save_code(tab); |
| 587 | } |
| 588 | } |
| 589 | |
| 590 | function code_name_exists(code_name, old_label, tab) { |
| 591 | jQuery.ajax({ |
| 592 | method: 'POST', |
| 593 | url: pathname + '?action=code_manager_code_name_exists', |
| 594 | data: { |
| 595 | wpnonce: wpnonce_get_code, |
| 596 | code_name: code_name, |
| 597 | page: 'code_manager_post' |
| 598 | } |
| 599 | }).done( |
| 600 | function(msg) { |
| 601 | if (msg!=='OK') { |
| 602 | jQuery.notify('Name already exists', 'error'); |
| 603 | jQuery('#tab-' + tab + '-label').text(old_label); |
| 604 | } else { |
| 605 | save_code(tab); |
| 606 | } |
| 607 | } |
| 608 | ); |
| 609 | } |
| 610 | |
| 611 | function save_code(tab, successmsg = 'Code saved') { |
| 612 | if (user_has_edited[tab]===false) { |
| 613 | return; |
| 614 | } |
| 615 | |
| 616 | cm = cm_editors[tab].tab_editor.codemirror; |
| 617 | cm.save(); |
| 618 | |
| 619 | jQuery.ajax({ |
| 620 | method: 'POST', |
| 621 | url: pathname + '?action=code_manager_update_code', |
| 622 | data: { |
| 623 | wpnonce: wpnonce, |
| 624 | code_id: cm_editors[tab].tab_code_index, |
| 625 | code_name: jQuery('#tab-' + tab + '-label').text(), |
| 626 | code_type: jQuery('#tab-' + tab + '-code_type').val(), |
| 627 | code: jQuery('#tab-' + tab + '-content').val(), |
| 628 | page: 'code_manager_post' |
| 629 | } |
| 630 | }).done( |
| 631 | function(msg) { |
| 632 | if ( msg.substr(0, 3) === 'UPD' ) { |
| 633 | jQuery.notify(successmsg, 'success'); |
| 634 | mark_tab_as_unchanged(cm); |
| 635 | } else if ( msg.substr(0, 3) === 'INS' ) { |
| 636 | code_id = msg.substr(4); |
| 637 | cm_editors[tab].tab_code_index = code_id; |
| 638 | jQuery('#tab-' + tab + '-code_id').html(code_id); |
| 639 | jQuery.notify(successmsg, 'success'); |
| 640 | mark_tab_as_unchanged(cm); |
| 641 | } else { |
| 642 | if (msg.length>50) { |
| 643 | errormsg = 'ERROR : ' + msg.substr(0,50) + '...'; |
| 644 | } else { |
| 645 | errormsg = msg; |
| 646 | } |
| 647 | jQuery.notify(errormsg, 'error'); |
| 648 | } |
| 649 | } |
| 650 | ); |
| 651 | } |
| 652 | |
| 653 | function mark_tab_as_unchanged(cm_editor) { |
| 654 | tabindex = cm_editor.getOption('tabindex'); |
| 655 | user_has_edited[tabindex] = false; |
| 656 | jQuery('#tab-' + tabindex + '-icon').removeClass('tab_unsaved_changes'); |
| 657 | jQuery('#tab-' + tabindex + '-icon-save').addClass('non-active').attr('disabled', true); |
| 658 | } |
| 659 | |
| 660 | function tab_icon_enable(tab) { |
| 661 | if (cm_editors[tab].tab_code_index===-1) { |
| 662 | jQuery.notify('Your code must be saved before it can be enabled', 'info'); |
| 663 | return false; |
| 664 | } |
| 665 | |
| 666 | if (jQuery('#tab-' + tab + '-cb-enable').attr('type')==='checkbox') { |
| 667 | if (jQuery('#tab-' + tab + '-cb-enable').is(':checked')) { |
| 668 | val = '1'; |
| 669 | txt = 'Code enabled'; |
| 670 | } else { |
| 671 | val = '0'; |
| 672 | txt = 'Code disabled'; |
| 673 | } |
| 674 | } else { |
| 675 | val = jQuery('#tab-' + tab + '-cb-enable').val(); |
| 676 | txt = 'Code ' + jQuery('#tab-' + tab + '-cb-enable :selected').text().toLowerCase(); |
| 677 | } |
| 678 | |
| 679 | activate_code_on_server(tab, val, txt); |
| 680 | |
| 681 | return true; |
| 682 | } |
| 683 | |
| 684 | function tab_icon_preview(tab) { |
| 685 | if (cm_editors[tab].tab_code_index===-1) { |
| 686 | jQuery.notify('Your code must be saved before it can be previewed', 'info'); |
| 687 | return false; |
| 688 | } |
| 689 | |
| 690 | if (jQuery('#tab-' + tab + '-cb-preview').is(':checked')) { |
| 691 | // Activate preview |
| 692 | activate_preview_on_server(tab); |
| 693 | } else { |
| 694 | // Deactivate preview |
| 695 | tab_icon_deactivate(tab); |
| 696 | } |
| 697 | |
| 698 | return true; |
| 699 | } |
| 700 | |
| 701 | function tab_icon_deactivate(tab) { |
| 702 | jQuery.ajax({ |
| 703 | method: 'POST', |
| 704 | url: pathname + '?action=code_manager_deactivate_code_preview', |
| 705 | data: { |
| 706 | wpnonce: wpnonce, |
| 707 | code_id: cm_editors[tab].tab_code_index, |
| 708 | page: 'code_manager_post' |
| 709 | } |
| 710 | }).done( |
| 711 | function(msg) { |
| 712 | if ( msg === 'OK' ) { |
| 713 | jQuery.notify('Preview deactivated', 'success'); |
| 714 | } else { |
| 715 | jQuery.notify(msg, 'error'); |
| 716 | } |
| 717 | } |
| 718 | ); |
| 719 | } |
| 720 | |
| 721 | function unsaved_changes() { |
| 722 | has_edited = false; |
| 723 | |
| 724 | for (var tabindex in user_has_edited) { |
| 725 | if (user_has_edited[tabindex]===true) { |
| 726 | has_edited = true; |
| 727 | } |
| 728 | } |
| 729 | |
| 730 | return has_edited; |
| 731 | } |
| 732 | |
| 733 | function reset_preview() { |
| 734 | jQuery.ajax({ |
| 735 | type: 'POST', |
| 736 | url: pathname + '?action=code_manager_reset_preview', |
| 737 | data: { |
| 738 | wpnonce: wpnonce, |
| 739 | page: 'code_manager_post' |
| 740 | } |
| 741 | }).done( |
| 742 | function (msg) { |
| 743 | if ( msg === 'OK' ) { |
| 744 | jQuery.notify(msg, 'success'); |
| 745 | jQuery('.cm-cb-preview').prop('checked', false); |
| 746 | } else { |
| 747 | jQuery.notify(msg, 'info'); |
| 748 | } |
| 749 | } |
| 750 | ).fail( |
| 751 | function () { |
| 752 | jQuery.notify(msg, 'error'); |
| 753 | } |
| 754 | ); |
| 755 | } |
| 756 | |
| 757 | jQuery(function() { |
| 758 | tab_new('New'); |
| 759 | new_label_index++; |
| 760 | |
| 761 | jQuery('#code_manager_new').on('click', function(e) { |
| 762 | tab_new('New_' + (new_label_index++), -1); |
| 763 | }); |
| 764 | |
| 765 | jQuery('#code_manager_open').on('click', function(e) { |
| 766 | tab_open(); |
| 767 | }); |
| 768 | |
| 769 | jQuery('#code_manager_cancel_file').on('click', function() { |
| 770 | jQuery('#code_manager_open_frame').hide(); |
| 771 | }); |
| 772 | |
| 773 | jQuery('#code_manager_taskbar_tabmode').sortable(); |
| 774 | |
| 775 | jQuery(window).on('keydown', function(event) { |
| 776 | if ((event.ctrlKey || event.metaKey) && String.fromCharCode(event.which).toLowerCase()==='s') { |
| 777 | if ( |
| 778 | jQuery(event.target).hasClass('CodeMirror-code') || |
| 779 | jQuery(event.target).hasClass('code_manager_tab_label') |
| 780 | ) { |
| 781 | if (jQuery(event.target).hasClass('CodeMirror-code')) { |
| 782 | tab_code = jQuery(event.target).closest('.tab_code'); |
| 783 | tab = tab_code.attr('data-code-manager-tab'); |
| 784 | } else { |
| 785 | tab = jQuery(event.target).attr('data-code-manager-tab'); |
| 786 | } |
| 787 | if (typeof tab !== typeof undefined && tab !== false) { |
| 788 | save_code(tab); |
| 789 | event.preventDefault(); |
| 790 | } |
| 791 | } |
| 792 | } else if ( |
| 793 | (event.ctrlKey || event.metaKey) && |
| 794 | String.fromCharCode(event.which).toLowerCase()==='v' && |
| 795 | jQuery(event.target).hasClass('code_manager_tab_label') |
| 796 | ) { |
| 797 | event.preventDefault(); // Prevent ctrl-v on tab label |
| 798 | } |
| 799 | }); |
| 800 | |
| 801 | jQuery('.cm_menu_title').tooltip(); |
| 802 | jQuery('#disable_preview').tooltip(); |
| 803 | jQuery('#disable_preview').on('click', function() { |
| 804 | html = "<div>This turns of preview mode for all code IDs for all users. Do you want to continue?</div>"; |
| 805 | var dialog = jQuery(html).dialog({ |
| 806 | dialogClass: 'no-close', |
| 807 | title: 'Reset preview', |
| 808 | buttons: { |
| 809 | 'Yes': function() { |
| 810 | dialog.dialog('destroy'); |
| 811 | reset_preview(); |
| 812 | }, |
| 813 | 'No': function() { |
| 814 | dialog.dialog('destroy'); |
| 815 | }, |
| 816 | 'Cancel': function() { |
| 817 | dialog.dialog('destroy'); |
| 818 | } |
| 819 | } |
| 820 | }); |
| 821 | }); |
| 822 | |
| 823 | jQuery(window).on('beforeunload', function() { |
| 824 | if ( unsaved_changes() ) { |
| 825 | return 'Your changes will not be saved! Are you sure you want to leave this page?'; |
| 826 | } |
| 827 | }); |
| 828 | }); |
| 829 |