From c1f2f1c0c092672d71861dc9af59420b39c56e8a Mon Sep 17 00:00:00 2001 From: "Md.Harun-Ur-Rashid" Date: Sun, 25 Aug 2024 08:51:29 +0600 Subject: [PATCH] v1.0.6 --- ajax.php | 2 +- assets/admin/css/style.css | 37 ++++++- assets/admin/css/style.less | 71 ++++++++++--- assets/admin/src/angular-app/app.js | 139 +++++++++++++++----------- assets/admin/src/angular-app/utils.js | 51 ++++++++++ readme.md | 2 +- src/Updater/plugin.json | 6 +- src/Views/index-angular.php | 59 +++++++---- 8 files changed, 267 insertions(+), 100 deletions(-) create mode 100644 assets/admin/src/angular-app/utils.js diff --git a/ajax.php b/ajax.php index 0e65030..743894b 100644 --- a/ajax.php +++ b/ajax.php @@ -3,7 +3,7 @@ * Plugin Name: Ajax * Description: Ajax request testing * Author: haruncpi - * Version: 1.0.5 + * Version: 1.0.6 * Author URI: https://github.com/haruncpi * Requires PHP: 7.4 * Requires at least: 5.3 diff --git a/assets/admin/css/style.css b/assets/admin/css/style.css index c620124..618a058 100644 --- a/assets/admin/css/style.css +++ b/assets/admin/css/style.css @@ -29,7 +29,8 @@ } .ajax-inspector textarea { font-family: "FiraCode" !important; - border-color: #ddd; + border-color: #fff; + border-radius: 0; padding: 10px; background: #f9f9f9; } @@ -80,6 +81,25 @@ min-width: 50%; margin-right: 25px; } +.ajax-inspector .input-wrapper .ajax-input-data-types { + display: flex; +} +.ajax-inspector .input-wrapper .ajax-input-data-types > div { + padding: 5px; + background-color: white; + min-width: 30px; + text-align: center; + cursor: pointer; + border-bottom: 1px solid #ddd; +} +.ajax-inspector .input-wrapper .ajax-input-data-types > div:first-child { + border-right: 1px solid #ddd; +} +.ajax-inspector .input-wrapper .ajax-input-data-types .active { + background-color: #555; + color: white; + font-weight: 500; +} .ajax-inspector .response-wrapper { max-width: 50%; flex-grow: 1; @@ -95,10 +115,11 @@ display: block; } .ajax-global-settings-content p { - margin: 0!important; + margin: 0 !important; } .ajax-global-settings-content .save-global-settings { margin-top: 10px; + float: right; } .ajax-actions { display: flex; @@ -144,3 +165,15 @@ button:visited { .updating-info .dashicons-update { animation: rotation 2s infinite linear; } +.input-info-table { + width: 100%; +} +.input-info-table tr td { + white-space: pre-line; + vertical-align: top; + padding: 3px 5px; +} +.input-info-table tr:first-child td { + background-color: #555; + color: #fff; +} diff --git a/assets/admin/css/style.less b/assets/admin/css/style.less index cf942ef..81db4e8 100644 --- a/assets/admin/css/style.less +++ b/assets/admin/css/style.less @@ -11,21 +11,21 @@ padding-left: 5px; padding-top: 10px; - .display-flex{ + .display-flex { display: flex; } - .align-items-center{ + .align-items-center { align-items: center; } - .gap-5{ + .gap-5 { gap: 5px; } - .gap-10{ + .gap-10 { gap: 10px; } - .gap-15{ + .gap-15 { gap: 15px; } @@ -36,7 +36,8 @@ textarea { font-family: "FiraCode" !important; - border-color: #ddd; + border-color: #fff; + border-radius: 0; padding: 10px; background: #f9f9f9; } @@ -46,7 +47,7 @@ align-items: center; margin-bottom: 10px; justify-content: space-between; - h1{ + h1 { margin-right: 10px; } } @@ -95,6 +96,27 @@ width: 50%; min-width: 50%; margin-right: 25px; + + .ajax-input-data-types { + display: flex; + > div { + padding: 5px; + background-color: white; + min-width: 30px; + text-align: center; + cursor: pointer; + border-bottom: 1px solid #ddd; + + &:first-child { + border-right: 1px solid #ddd; + } + } + .active { + background-color: #555; + color: white; + font-weight: 500; + } + } } .response-wrapper { max-width: 50%; @@ -115,13 +137,13 @@ } } - -.ajax-global-settings-content{ - p{ - margin: 0!important; +.ajax-global-settings-content { + p { + margin: 0 !important; } - .save-global-settings{ + .save-global-settings { margin-top: 10px; + float: right; } } @@ -171,10 +193,27 @@ button { } } - -.updating-info{ +.updating-info { color: green; - .dashicons-update{ + .dashicons-update { animation: rotation 2s infinite linear; } -} \ No newline at end of file +} + +.input-info-table { + width: 100%; + tr td { + white-space: pre-line; + vertical-align: top; + padding: 3px 5px; + } + + tr { + &:first-child { + td { + background-color: #555; + color: #fff; + } + } + } +} diff --git a/assets/admin/src/angular-app/app.js b/assets/admin/src/angular-app/app.js index 258d09c..34bd081 100644 --- a/assets/admin/src/angular-app/app.js +++ b/assets/admin/src/angular-app/app.js @@ -1,29 +1,76 @@ +const { compareVersion, textToJSON, isValidJSON, toFormData } = require("./utils"); + let myApp = angular.module('ajaxApp', []) myApp.controller('AppCtrl', function ($scope, $http) { + const LS_KEY_NAME = 'wp_ajax'; + const localData = getLocalData(); + + function getLocalData(key) { + let data = JSON.parse(localStorage.getItem(LS_KEY_NAME) || '{}') + if (key) { + return data[key] + } + return data; + } + + function saveLocalData(key, value) { + if (!key) return; + + let oldData = getLocalData(); + oldData[key] = value; + localStorage.setItem(LS_KEY_NAME, JSON.stringify(oldData)) + } + + $scope.sending = false; $scope.savedList = [] $scope.model = {} + $scope.inputTypes = ['Text', 'JSON'] + $scope.inputTypes = [] + $scope.activeInputType = 'Text'; + $scope.contentTypes = [ + 'application/json', + 'application/x-www-form-urlencoded; charset=UTF-8' + ] function initModel() { $scope.model = { id: null, + contentType: 'application/x-www-form-urlencoded; charset=UTF-8', action: '', title: '', payload: '' } } + $scope.globalSettings = { + preRequestScript: getLocalData('globalSettings')?.preRequestScript ?? "WPAjax.body.add( 'foo', 'bar' )" + } + + $scope.setActiveInputType = function (type) { + $scope.activeInputType = type + } + + $scope.saveGlobalSettings = function (settings) { + saveLocalData('globalSettings', settings) + tb_remove() + } + + $scope.openGlobalSettings = function () { + let url = '#TB_inline?width=600&height=250&inlineId=ajax-global-settings'; + tb_show('Global Settings', url, false); + } + initModel() let $ = jQuery - let savedData = localStorage.getItem('wp_ajax_simulator'); let ajaxUrl = $('input.ajax_url').val() let editor = $('#input') let output = $('#output') - if (savedData) { - $scope.model.payload = savedData + if (localData.payload) { + $scope.model.payload = localData.payload } else { $scope.model.payload = 'action:generate-password' } @@ -34,29 +81,29 @@ myApp.controller('AppCtrl', function ($scope, $http) { } }); - function textToJSON(text) { - const jsonObject = {}; - const lines = text.split('\n'); - - lines.forEach(line => { - const [key, value] = line.split(':').map(item => item.trim()); - if (key) { - jsonObject[key] = isNaN(value) ? value : Number(value); - } - }); - - return jsonObject; - } - let jsonViewerConfig = { collapsed: false, rootCollapsable: false, bigNumbers: false } + let jsonData = {} + const WPAjax = { + body: { + add: function (key, value) { + jsonData[key] = value + } + } + + } + $('#ajax').click(function () { let input = editor.val() - let jsonData = textToJSON(input) + if (isValidJSON(input)) { + jsonData = JSON.parse(input); + } else { + jsonData = textToJSON(input) + } if (input && jsonData) { try { @@ -65,11 +112,23 @@ myApp.controller('AppCtrl', function ($scope, $http) { return; } - localStorage.setItem('wp_ajax_simulator', input) + saveLocalData('payload', input) + + let preRequestScript = getLocalData('globalSettings')?.preRequestScript ?? false + if (preRequestScript) { + try { + eval(preRequestScript) + } catch (error) { + console.log(error) + } + } + + // console.log(jsonData) $.ajax({ type: 'POST', url: ajaxUrl, + contentType: $scope.model.contentType, data: jsonData, beforeSend: function () { $scope.sending = true @@ -109,14 +168,6 @@ myApp.controller('AppCtrl', function ($scope, $http) { } }) - function toFormData(obj) { - let formData = new FormData(); - for (let [key, val] of Object.entries(obj)) { - formData.append(key, val); - } - return formData; - } - let config = { transformRequest: angular.identity, headers: { @@ -139,7 +190,7 @@ myApp.controller('AppCtrl', function ($scope, $http) { $scope.saving = false; $scope.save = function (model) { - let jsonPayload = textToJSON(model.payload) + let jsonPayload = isValidJSON(model.payload) ? JSON.parse(model.payload) : textToJSON(model.payload) if (!jsonPayload.action) { alert('action key is required') return; @@ -163,6 +214,9 @@ myApp.controller('AppCtrl', function ($scope, $http) { initModel() } else { $scope.model = row; + if (!$scope.model.contentType) { + $scope.model.contentType = 'application/x-www-form-urlencoded; charset=UTF-8' + } } } @@ -178,39 +232,10 @@ myApp.controller('AppCtrl', function ($scope, $http) { }) } - $scope.globalSettings = { - preRequestScript: "_ajax.addParam('foo','bar')" - } - - $scope.openGlobalSettings = function () { - let url = '#TB_inline?width=600&height=200&inlineId=ajax-global-settings'; - tb_show('Global Settings', url, false); - } /** * Update plugin */ - function compareVersion(v1, comparator, v2) { - "use strict"; - var comparator = comparator == '=' ? '==' : comparator; - if (['==', '===', '<', '<=', '>', '>=', '!=', '!=='].indexOf(comparator) == -1) { - throw new Error('Invalid comparator. ' + comparator); - } - var v1parts = v1.split('.'), v2parts = v2.split('.'); - var maxLen = Math.max(v1parts.length, v2parts.length); - var part1, part2; - var cmp = 0; - for (var i = 0; i < maxLen && !cmp; i++) { - part1 = parseInt(v1parts[i], 10) || 0; - part2 = parseInt(v2parts[i], 10) || 0; - if (part1 < part2) - cmp = 1; - if (part1 > part2) - cmp = -1; - } - return eval('0' + comparator + cmp); - } - $scope.pluginInfo = { currentVersion: _ajax.version, newVersion: null, diff --git a/assets/admin/src/angular-app/utils.js b/assets/admin/src/angular-app/utils.js new file mode 100644 index 0000000..f033c88 --- /dev/null +++ b/assets/admin/src/angular-app/utils.js @@ -0,0 +1,51 @@ +exports.compareVersion = function (v1, comparator, v2) { + "use strict"; + var comparator = comparator == '=' ? '==' : comparator; + if (['==', '===', '<', '<=', '>', '>=', '!=', '!=='].indexOf(comparator) == -1) { + throw new Error('Invalid comparator. ' + comparator); + } + var v1parts = v1.split('.'), v2parts = v2.split('.'); + var maxLen = Math.max(v1parts.length, v2parts.length); + var part1, part2; + var cmp = 0; + for (var i = 0; i < maxLen && !cmp; i++) { + part1 = parseInt(v1parts[i], 10) || 0; + part2 = parseInt(v2parts[i], 10) || 0; + if (part1 < part2) + cmp = 1; + if (part1 > part2) + cmp = -1; + } + return eval('0' + comparator + cmp); +} + +exports.textToJSON = function (text) { + const jsonObject = {}; + const lines = text.split('\n'); + + lines.forEach(line => { + const [key, value] = line.split(':').map(item => item.trim()); + if (key) { + jsonObject[key] = isNaN(value) ? value : Number(value); + } + }); + + return jsonObject; +} + +exports.isValidJSON = function(str) { + try { + JSON.parse(str); + return true; + } catch (e) { + return false; + } +} + +exports.toFormData = function(obj) { + let formData = new FormData(); + for (let [key, val] of Object.entries(obj)) { + formData.append(key, val); + } + return formData; +} \ No newline at end of file diff --git a/readme.md b/readme.md index 1b5ed44..391a89d 100644 --- a/readme.md +++ b/readme.md @@ -3,7 +3,7 @@ # WP Ajax WordPress plugin to test WordPress Ajax APIs -[DOWNLOAD LATEST VERSION (v1.0.5)](https://github.com/haruncpi/wp-ajax/releases/download/v1.0.5/ajax-1.0.5.zip) +[DOWNLOAD LATEST VERSION (v1.0.5)](https://github.com/haruncpi/wp-ajax/releases/download/v1.0.6/ajax-1.0.6.zip) ![](assets/images/wp-ajax.png) \ No newline at end of file diff --git a/src/Updater/plugin.json b/src/Updater/plugin.json index abf3aba..b9187eb 100644 --- a/src/Updater/plugin.json +++ b/src/Updater/plugin.json @@ -1,14 +1,14 @@ { "name" : "Ajax", "slug" : "ajax", - "version" : "1.0.5", - "download_url" : "https://github.com/haruncpi/wp-ajax/releases/download/v1.0.5/ajax-1.0.5.zip", + "version" : "1.0.6", + "download_url" : "https://github.com/haruncpi/wp-ajax/releases/download/v1.0.6/ajax-1.0.6.zip", "author" : "Harun", "author_profile" : "https://github.com/haruncpi", "requires" : "5.0", "tested" : "6.6", "requires_php" : "7.4", - "last_updated" : "2024-08-17 00:00:00", + "last_updated" : "2024-08-25 00:00:00", "sections" : { "description" : "This simple plugin does nothing, only gets updates from a custom server", "installation" : "Click the activate button and that's it.", diff --git a/src/Views/index-angular.php b/src/Views/index-angular.php index 7550ac0..22427bd 100644 --- a/src/Views/index-angular.php +++ b/src/Views/index-angular.php @@ -18,9 +18,9 @@ @@ -42,21 +42,29 @@
@@ -66,8 +74,11 @@
- - Params + + Inputs +
Selected: {{model.title}} @@ -77,7 +88,15 @@
- +
+
+
{{t}}
+
+
+