WordPress.org
Get WordPress

Plugin Directory

Changeset 2494716


Ignore:
Timestamp:
03/13/2021 10:04:11 AM (5 years ago)
Author:
h71
Message:

version-1.3.0

Location:
super-reactions
Files:
62 added
12 edited

Legend:

Unmodified
Added
Removed

  • super-reactions/trunk/admin/assets/dist/css/srea-admin.css

    r2461152 r2494716  
    2121  flex-basis: 50%;
    2222  background-color: #ffffff;
    23   box-shadow: 1px 1px 5px 2px #cccccc;
     23  border: 1px solid #cccccc;
    2424  padding: 10px;
    2525  align-items: center;
    … …  
    3636  display: grid;
    3737  grid-template-columns: 200px auto;
     38  border: 1px solid #cccccc;
     39  border-top: none;
    3840}
    3941
    … …  
    5052
    5153.srea-admin-main .srea-tabs .srea-tab.active {
    52   background-color: #d5edff;
     54  background-color: #e5eeff;
    5355  font-weight: bold;
    5456}
    … …  
    6264  display: flex;
    6365  align-items: center;
    64 }
    65 
    66 .srea-admin-main .srea-views .srea-template-selector label {
    67   margin-right: 5px;
     66  margin: 15px 0;
     67}
     68
     69.srea-admin-main .srea-views .srea-template-selector .srea-setting-label {
     70  width: 30px;
     71  margin-right: 25px;
     72}
     73
     74.srea-admin-main .srea-views .srea-template-selector .srea-action-buttons {
     75  display: flex;
     76  flex-direction: column;
     77  justify-content: space-between;
     78  align-items: center;
     79  height: 60px;
     80  width: 100px;
     81}
     82
     83.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn {
     84  display: flex;
     85  align-items: center;
     86  justify-content: center;
     87  width: 60px;
     88  height: 25px;
     89  border: 1px solid #cccccc;
     90  border-radius: 2px;
     91}
     92
     93.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn:enabled {
     94  cursor: pointer;
     95}
     96
     97.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn.srea-remover:enabled {
     98  color: #e24a4a;
     99}
     100
     101.srea-admin-main .srea-views .srea-template-selector .preview-wrapper {
     102  display: flex;
     103  justify-content: center;
     104  align-items: center;
     105  width: 450px;
     106  min-height: 90px;
    68107}
    69108
    … …  
    76115  min-height: 130px;
    77116  height: 100%;
     117  position: relative;
     118}
     119
     120.srea-admin-main .srea-view.active .srea-loader,
     121.srea-admin-main .srea-view.active .srea-result-badge {
     122  position: absolute;
     123  top: 0;
     124  right: 0;
    78125}
    79126
    … …  
    98145  color: #ffffff;
    99146  font-weight: 500;
     147}
     148
     149#srea-settings-modal {
     150  position: fixed;
     151  width: 100%;
     152  max-width: 700px;
     153  margin: 0 auto;
     154  background-color: #efefef;
     155  padding: 10px 30px 30px;
     156  border: 1px solid #ccc;
     157  z-index: 9990;
     158  display: none;
     159}
     160
     161#srea-settings-modal.visible {
     162  display: block;
     163}
     164
     165#srea-settings-modal .srea-modal-inner {
     166  display: flex;
     167  flex-wrap: wrap;
     168  justify-content: flex-start;
     169  max-height: 400px;
     170  overflow-y: scroll;
     171}
     172
     173#srea-settings-modal .srea-setting-preview {
     174  cursor: pointer;
     175  background-color: #f8f8f8;
     176}
     177
     178#srea-settings-modal .srea-setting-preview:hover {
     179  border-color: blue;
     180}
     181
     182#srea-settings-modal .srea-setting-preview.selected {
     183  background-color: #e5eeff;
     184  border-color: blue;
     185}
     186
     187.srea-setting-preview {
     188  display: flex;
     189  flex-shrink: 0;
     190  height: 40px;
     191  justify-content: center;
     192  align-items: center;
     193  margin: 10px;
     194}
     195
     196.srea-modal-header {
     197  display: flex;
     198  justify-content: space-between;
     199  align-items: center;
     200}
     201
     202#srea-modal-title {
     203  margin-left: 10px;
     204}
     205
     206.srea-selected-template-preview {
     207  pointer-events: none;
    100208}
    101209
    … …  
    113221  border-top: 3px solid rgba(66, 66, 66, 0.5);
    114222  border-radius: 50%;
    115   width: 16px;
    116   height: 16px;
    117   margin: 3px;
     223  width: 18px;
     224  height: 18px;
     225  margin: 5px;
    118226  animation: spin 1s linear infinite;
    119227}
    120228
    121 .srea-badge-success {
    122   background-color: #3c932c;
     229.srea-result-badge {
    123230  color: #ffffff;
    124231  padding: 6px;
    … …  
    126233  line-height: 10px;
    127234  font-size: 13px;
    128   margin: 0 5px;
    129 }
     235}
     236
     237.srea-result-badge.srea-badge-success {
     238  background-color: #3c932c;
     239}
     240
     241.srea-result-badge.srea-badge-error {
     242  background-color: #932c2c;
     243}
     244
     245.srea-modal-close-btn {
     246  cursor: pointer;
     247  position: relative;
     248  display: block;
     249  width: 30px;
     250  height: 30px;
     251  border: 2px solid #747474;
     252  left: 30px;
     253  bottom: 20px;
     254}
     255
     256.srea-modal-close-btn::before {
     257  content: '';
     258  position: absolute;
     259  top: 13px;
     260  height: 2px;
     261  width: 30px;
     262  background-color: #747474;
     263  transform: rotate(45deg);
     264}
     265
     266.srea-modal-close-btn::after {
     267  content: '';
     268  position: absolute;
     269  top: 13px;
     270  height: 2px;
     271  width: 30px;
     272  background-color: #747474;
     273  transform: rotate(-45deg);
     274}
     275
     276.srea-template {
     277  display: flex;
     278}
     279
     280.srea-template .srea-reaction-item {
     281  display: flex;
     282  margin-right: 10px;
     283  align-items: center;
     284  height: 28px;
     285}
     286
     287.srea-template .srea-button {
     288  cursor: pointer;
     289}
     290
     291.srea-template .srea-template-count {
     292  width: 23px;
     293  text-align: center;
     294  font-size: medium;
     295}
     296
     297.srea-template .srea-button {
     298  outline: none;
     299  border: none;
     300  background: none;
     301}
     302
     303.srea-template .srea-button:focus, .srea-template .srea-button:active, .srea-template .srea-button:hover {
     304  outline: none;
     305  border: none;
     306  background: none;
     307}

  • super-reactions/trunk/admin/assets/dist/css/srea-admin.min.css

    r2461152 r2494716  
    1 #wpcontent{padding-left:0;padding-right:0}.srea-admin-wrapper{display:block;margin:0 auto;max-width:900px;height:100%;background-color:#fff}.srea-admin-wrapper input,.srea-admin-wrapper select{border-radius:0}.srea-admin-header{display:flex;flex-basis:50%;background-color:#fff;box-shadow:1px 1px 5px 2px #ccc;padding:10px;align-items:center}.srea-admin-header .srea-admin-title{text-align:center;flex:1 0 auto;justify-self:center}.srea-admin-main{padding:20px;display:grid;grid-template-columns:200px auto}.srea-admin-main .srea-tabs{border-top:1px solid #ccc;cursor:pointer}.srea-admin-main .srea-tabs .srea-tab{padding:20px;border-bottom:1px solid #ccc;border-left:1px solid #ccc}.srea-admin-main .srea-tabs .srea-tab.active{background-color:#d5edff;font-weight:700}.srea-admin-main .srea-views{border:1px solid #ccc;padding-left:40px}.srea-admin-main .srea-views .srea-template-selector{display:flex;align-items:center}.srea-admin-main .srea-views .srea-template-selector label{margin-right:5px}.srea-admin-main .srea-view.active{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-evenly;flex-wrap:wrap;min-height:130px;height:100%}.srea-admin-main .srea-view:not(.active){display:none}.srea-admin-footer{display:flex;justify-content:flex-end;padding:20px}.srea-button{display:block;padding:10px;border:none}.srea-button.srea-button-primary{background-color:#4a91e2;color:#fff;font-weight:500}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.srea-loader{border:3px solid rgba(200,200,200,.7);border-top:3px solid rgba(66,66,66,.5);border-radius:50%;width:16px;height:16px;margin:3px;animation:spin 1s linear infinite}.srea-badge-success{background-color:#3c932c;color:#fff;padding:6px;text-align:center;line-height:10px;font-size:13px;margin:0 5px}
     1#wpcontent{padding-left:0;padding-right:0}.srea-admin-wrapper{display:block;margin:0 auto;max-width:900px;height:100%;background-color:#fff}.srea-admin-wrapper input,.srea-admin-wrapper select{border-radius:0}.srea-admin-header{display:flex;flex-basis:50%;background-color:#fff;border:1px solid #ccc;padding:10px;align-items:center}.srea-admin-header .srea-admin-title{text-align:center;flex:1 0 auto;justify-self:center}.srea-admin-main{padding:20px;display:grid;grid-template-columns:200px auto;border:1px solid #ccc;border-top:none}.srea-admin-main .srea-tabs{border-top:1px solid #ccc;cursor:pointer}.srea-admin-main .srea-tabs .srea-tab{padding:20px;border-bottom:1px solid #ccc;border-left:1px solid #ccc}.srea-admin-main .srea-tabs .srea-tab.active{background-color:#e5eeff;font-weight:700}.srea-admin-main .srea-views{border:1px solid #ccc;padding-left:40px}.srea-admin-main .srea-views .srea-template-selector{display:flex;align-items:center;margin:15px 0}.srea-admin-main .srea-views .srea-template-selector .srea-setting-label{width:30px;margin-right:25px}.srea-admin-main .srea-views .srea-template-selector .srea-action-buttons{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:60px;width:100px}.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn{display:flex;align-items:center;justify-content:center;width:60px;height:25px;border:1px solid #ccc;border-radius:2px}.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn:enabled{cursor:pointer}.srea-admin-main .srea-views .srea-template-selector .srea-template-selector-btn.srea-remover:enabled{color:#e24a4a}.srea-admin-main .srea-views .srea-template-selector .preview-wrapper{display:flex;justify-content:center;align-items:center;width:450px;min-height:90px}.srea-admin-main .srea-view.active{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-evenly;flex-wrap:wrap;min-height:130px;height:100%;position:relative}.srea-admin-main .srea-view.active .srea-loader,.srea-admin-main .srea-view.active .srea-result-badge{position:absolute;top:0;right:0}.srea-admin-main .srea-view:not(.active){display:none}.srea-admin-footer{display:flex;justify-content:flex-end;padding:20px}.srea-button{display:block;padding:10px;border:none}.srea-button.srea-button-primary{background-color:#4a91e2;color:#fff;font-weight:500}#srea-settings-modal{position:fixed;width:100%;max-width:700px;margin:0 auto;background-color:#efefef;padding:10px 30px 30px;border:1px solid #ccc;z-index:9990;display:none}#srea-settings-modal.visible{display:block}#srea-settings-modal .srea-modal-inner{display:flex;flex-wrap:wrap;justify-content:flex-start;max-height:400px;overflow-y:scroll}#srea-settings-modal .srea-setting-preview{cursor:pointer;background-color:#f8f8f8}#srea-settings-modal .srea-setting-preview:hover{border-color:#00f}#srea-settings-modal .srea-setting-preview.selected{background-color:#e5eeff;border-color:#00f}.srea-setting-preview{display:flex;flex-shrink:0;height:40px;justify-content:center;align-items:center;margin:10px}.srea-modal-header{display:flex;justify-content:space-between;align-items:center}#srea-modal-title{margin-left:10px}.srea-selected-template-preview{pointer-events:none}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.srea-loader{border:3px solid rgba(200,200,200,.7);border-top:3px solid rgba(66,66,66,.5);border-radius:50%;width:18px;height:18px;margin:5px;animation:spin 1s linear infinite}.srea-result-badge{color:#fff;padding:6px;text-align:center;line-height:10px;font-size:13px}.srea-result-badge.srea-badge-success{background-color:#3c932c}.srea-result-badge.srea-badge-error{background-color:#932c2c}.srea-modal-close-btn{cursor:pointer;position:relative;display:block;width:30px;height:30px;border:2px solid #747474;left:30px;bottom:20px}.srea-modal-close-btn::before{content:'';position:absolute;top:13px;height:2px;width:30px;background-color:#747474;transform:rotate(45deg)}.srea-modal-close-btn::after{content:'';position:absolute;top:13px;height:2px;width:30px;background-color:#747474;transform:rotate(-45deg)}.srea-template{display:flex}.srea-template .srea-reaction-item{display:flex;margin-right:10px;align-items:center;height:28px}.srea-template .srea-button{cursor:pointer}.srea-template .srea-template-count{width:23px;text-align:center;font-size:medium}.srea-template .srea-button{outline:0;border:none;background:0 0}.srea-template .srea-button:active,.srea-template .srea-button:focus,.srea-template .srea-button:hover{outline:0;border:none;background:0 0}

  • super-reactions/trunk/admin/assets/dist/js/srea-admin.js

    r2461152 r2494716  
    11"use strict";
    22
    3 document.addEventListener("DOMContentLoaded", function (event) {
     3function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
     4
     5function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
     6
     7function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
     8
     9document.addEventListener('DOMContentLoaded', function (event) {
    410  var nonce = document.getElementById('_wpnonce');
    5   var $selects = document.querySelectorAll('select');
    611  var $tabs = document.querySelectorAll('.srea-tab');
    712  $tabs.forEach(function (element) {
    … …  
    2025  }
    2126
    22   $selects.forEach(function (element) {
    23     element.addEventListener('change', sreaSaveSettings);
    24   });
    25 
    26   function sreaSaveSettings(e) {
    27     var spinner = showLoader();
    28     e.target.insertAdjacentElement('afterend', spinner);
    29     var formData = new FormData();
    30     formData.append('action', 'srea_save_settings');
    31     formData.append('nonce', nonce.value);
    32     formData.append('option', e.target.name);
    33     formData.append('value', e.target.value);
    34     fetch(ajaxurl, {
    35       method: 'POST',
    36       body: formData
    37     }).then(function (response) {
    38       return response.json();
    39     }).then(function (res) {
    40       e.target.parentNode.removeChild(spinner);
    41       var badge = showResults(res.success, res.data.results);
    42       e.target.insertAdjacentElement('afterend', badge);
    43       setTimeout(function () {
    44         e.target.parentNode.removeChild(badge);
    45       }, 500);
    46     });
    47   }
    48 
    4927  function showLoader() {
    5028    var loader = document.createElement('div');
    … …  
    5533  function showResults(status, text) {
    5634    var badge = document.createElement('div');
    57     badge.className = status ? 'srea-badge-success' : 'srea-badge-error';
     35    badge.className = status ? 'srea-result-badge srea-badge-success' : 'srea-result-badge srea-badge-error';
    5836    badge.textContent = text;
    5937    return badge;
    6038  }
     39
     40  var sreaModal = /*#__PURE__*/function () {
     41    function sreaModal() {
     42      var _this = this;
     43
     44      _classCallCheck(this, sreaModal);
     45
     46      this.modal = document.querySelector('#srea-settings-modal');
     47      this.selectingOption = '';
     48      this.modalFor = '';
     49      var $settingInitiators = document.querySelectorAll('[data-srea-option]');
     50      $settingInitiators.forEach(function (element) {
     51        element.addEventListener('click', _this.open.bind(_this));
     52      });
     53      var $removers = document.querySelectorAll('.srea-remover');
     54      $removers.forEach(function (element) {
     55        element.addEventListener('click', _this.remove.bind(_this));
     56      });
     57      var $previews = this.modal.querySelectorAll('.srea-setting-preview');
     58      $previews.forEach(function (element) {
     59        element.addEventListener('click', _this.select.bind(_this));
     60      });
     61      var $closeBtn = document.querySelector('#srea-modal-close-btn');
     62      $closeBtn.addEventListener('click', this.close.bind(this));
     63    }
     64
     65    _createClass(sreaModal, [{
     66      key: "open",
     67      value: function open(e) {
     68        var optionName = e.currentTarget.dataset.sreaOption;
     69        this.selectingOption = optionName;
     70        this.modalFor = e.currentTarget;
     71        this.addTitle(optionName);
     72        this.modal.classList.add('visible');
     73        this.calculatePosition();
     74        window.addEventListener('resize', this.calculatePosition);
     75      }
     76    }, {
     77      key: "capitalize",
     78      value: function capitalize(str) {
     79        return str.charAt(0).toUpperCase() + str.slice(1);
     80      }
     81    }, {
     82      key: "addTitle",
     83      value: function addTitle(slug) {
     84        var $title = document.getElementById('srea-modal-title-option-name');
     85        $title.insertAdjacentText('beforeend', this.capitalize(slug));
     86      }
     87    }, {
     88      key: "close",
     89      value: function close() {
     90        this.modal.classList.remove('visible');
     91        var $title = document.getElementById('srea-modal-title-option-name');
     92        this.empty($title);
     93        this.selectingOption = null;
     94        this.modalFor = null;
     95      }
     96    }, {
     97      key: "calculatePosition",
     98      value: function calculatePosition() {
     99        var vw = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
     100        var vh = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
     101        this.modal.style.left = "".concat((vw + document.getElementById('adminmenuwrap').offsetWidth - this.modal.offsetWidth) / 2, "px");
     102        this.modal.style.top = "".concat((vh - this.modal.offsetHeight) / 2, "px");
     103      }
     104    }, {
     105      key: "select",
     106      value: function select(event) {
     107        var $selectedPreview = event.currentTarget.cloneNode(true);
     108        var $previewWrapper = this.modalFor.closest('.srea-template-selector').querySelector('.srea-selected-template-preview');
     109        this.empty($previewWrapper);
     110        $previewWrapper.insertAdjacentElement('beforeend', $selectedPreview);
     111        this.modalFor.innerText = 'Change';
     112        this.enableBtn(this.modalFor.parentNode.querySelector('.srea-remover'));
     113        this.saveSettings(event);
     114      }
     115    }, {
     116      key: "saveSettings",
     117      value: function saveSettings(event) {
     118        var spinner = showLoader();
     119        var view = document.querySelector('.srea-view.active');
     120        view.insertAdjacentElement('afterBegin', spinner);
     121        var formData = new FormData();
     122        formData.append('action', 'srea_save_settings');
     123        formData.append('nonce', nonce.value);
     124        formData.append('option', this.selectingOption);
     125        formData.append('value', event.currentTarget.dataset.slug);
     126        this.close();
     127        fetch(ajaxurl, {
     128          method: 'POST',
     129          body: formData
     130        }).then(function (response) {
     131          return response.json();
     132        }).then(function (res) {
     133          view.removeChild(spinner);
     134          var badge = showResults(res.success, res.data.results);
     135          view.insertAdjacentElement('afterBegin', badge);
     136          setTimeout(function () {
     137            view.removeChild(badge);
     138          }, 500);
     139        });
     140      }
     141    }, {
     142      key: "remove",
     143      value: function remove(event) {
     144        var $previewWrapper = event.currentTarget.closest('.srea-template-selector').querySelector('.srea-selected-template-preview');
     145        this.empty($previewWrapper);
     146        this.disableBtn(event.currentTarget);
     147        var spinner = showLoader();
     148        var view = document.querySelector('.srea-view.active');
     149        view.insertAdjacentElement('afterBegin', spinner);
     150        var formData = new FormData();
     151        formData.append('action', 'srea_save_settings');
     152        formData.append('nonce', nonce.value);
     153        formData.append('option', event.currentTarget.dataset.sreaOption);
     154        formData.append('value', '');
     155        this.close();
     156        fetch(ajaxurl, {
     157          method: 'POST',
     158          body: formData
     159        }).then(function (response) {
     160          return response.json();
     161        }).then(function (res) {
     162          view.removeChild(spinner);
     163          var badge = showResults(res.success, res.data.results);
     164          view.insertAdjacentElement('afterBegin', badge);
     165          setTimeout(function () {
     166            view.removeChild(badge);
     167          }, 500);
     168        });
     169      }
     170    }, {
     171      key: "disableBtn",
     172      value: function disableBtn(btn) {
     173        btn.setAttribute('disabled', 'disabled');
     174      }
     175    }, {
     176      key: "enableBtn",
     177      value: function enableBtn(btn) {
     178        btn.removeAttribute('disabled');
     179      }
     180    }, {
     181      key: "empty",
     182      value: function empty(ele) {
     183        ele.innerHTML = null;
     184      }
     185    }]);
     186
     187    return sreaModal;
     188  }();
     189
     190  new sreaModal();
    61191});

  • super-reactions/trunk/admin/assets/dist/js/srea-admin.min.js

    r2461152 r2494716  
    1 "use strict";document.addEventListener("DOMContentLoaded",function(e){var a=document.getElementById("_wpnonce"),t=document.querySelectorAll("select");function n(e){var t;document.querySelector(".srea-tab.active").classList.remove("active"),e.currentTarget.classList.add("active"),t=e.currentTarget.dataset.view,document.querySelector(".srea-view.active").classList.remove("active"),document.querySelector("#".concat(t)).classList.add("active")}function r(c){var e,o=((e=document.createElement("div")).className="srea-loader",e);c.target.insertAdjacentElement("afterend",o);var t=new FormData;t.append("action","srea_save_settings"),t.append("nonce",a.value),t.append("option",c.target.name),t.append("value",c.target.value),fetch(ajaxurl,{method:"POST",body:t}).then(function(e){return e.json()}).then(function(e){c.target.parentNode.removeChild(o);var t,a,n,r=(t=e.success,a=e.data.results,(n=document.createElement("div")).className=t?"srea-badge-success":"srea-badge-error",n.textContent=a,n);c.target.insertAdjacentElement("afterend",r),setTimeout(function(){c.target.parentNode.removeChild(r)},500)})}document.querySelectorAll(".srea-tab").forEach(function(e){e.addEventListener("click",n)}),t.forEach(function(e){e.addEventListener("change",r)})});
     1"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function _createClass(e,t,n){return t&&_defineProperties(e.prototype,t),n&&_defineProperties(e,n),e}document.addEventListener("DOMContentLoaded",function(e){var i=document.getElementById("_wpnonce");function t(e){var t;document.querySelector(".srea-tab.active").classList.remove("active"),e.currentTarget.classList.add("active"),t=e.currentTarget.dataset.view,document.querySelector(".srea-view.active").classList.remove("active"),document.querySelector("#".concat(t)).classList.add("active")}function o(){var e=document.createElement("div");return e.className="srea-loader",e}function s(e,t){var n=document.createElement("div");return n.className=e?"srea-result-badge srea-badge-success":"srea-result-badge srea-badge-error",n.textContent=t,n}document.querySelectorAll(".srea-tab").forEach(function(e){e.addEventListener("click",t)}),new(function(){function e(){var t=this;_classCallCheck(this,e),this.modal=document.querySelector("#srea-settings-modal"),this.selectingOption="",this.modalFor="",document.querySelectorAll("[data-srea-option]").forEach(function(e){e.addEventListener("click",t.open.bind(t))}),document.querySelectorAll(".srea-remover").forEach(function(e){e.addEventListener("click",t.remove.bind(t))}),this.modal.querySelectorAll(".srea-setting-preview").forEach(function(e){e.addEventListener("click",t.select.bind(t))}),document.querySelector("#srea-modal-close-btn").addEventListener("click",this.close.bind(this))}return _createClass(e,[{key:"open",value:function(e){var t=e.currentTarget.dataset.sreaOption;this.selectingOption=t,this.modalFor=e.currentTarget,this.addTitle(t),this.modal.classList.add("visible"),this.calculatePosition(),window.addEventListener("resize",this.calculatePosition)}},{key:"capitalize",value:function(e){return e.charAt(0).toUpperCase()+e.slice(1)}},{key:"addTitle",value:function(e){document.getElementById("srea-modal-title-option-name").insertAdjacentText("beforeend",this.capitalize(e))}},{key:"close",value:function(){this.modal.classList.remove("visible");var e=document.getElementById("srea-modal-title-option-name");this.empty(e),this.selectingOption=null,this.modalFor=null}},{key:"calculatePosition",value:function(){var e=Math.max(document.documentElement.clientWidth||0,window.innerWidth||0),t=Math.max(document.documentElement.clientHeight||0,window.innerHeight||0);this.modal.style.left="".concat((e+document.getElementById("adminmenuwrap").offsetWidth-this.modal.offsetWidth)/2,"px"),this.modal.style.top="".concat((t-this.modal.offsetHeight)/2,"px")}},{key:"select",value:function(e){var t=e.currentTarget.cloneNode(!0),n=this.modalFor.closest(".srea-template-selector").querySelector(".srea-selected-template-preview");this.empty(n),n.insertAdjacentElement("beforeend",t),this.modalFor.innerText="Change",this.enableBtn(this.modalFor.parentNode.querySelector(".srea-remover")),this.saveSettings(e)}},{key:"saveSettings",value:function(e){var n=o(),a=document.querySelector(".srea-view.active");a.insertAdjacentElement("afterBegin",n);var t=new FormData;t.append("action","srea_save_settings"),t.append("nonce",i.value),t.append("option",this.selectingOption),t.append("value",e.currentTarget.dataset.slug),this.close(),fetch(ajaxurl,{method:"POST",body:t}).then(function(e){return e.json()}).then(function(e){a.removeChild(n);var t=s(e.success,e.data.results);a.insertAdjacentElement("afterBegin",t),setTimeout(function(){a.removeChild(t)},500)})}},{key:"remove",value:function(e){var t=e.currentTarget.closest(".srea-template-selector").querySelector(".srea-selected-template-preview");this.empty(t),this.disableBtn(e.currentTarget);var n=o(),a=document.querySelector(".srea-view.active");a.insertAdjacentElement("afterBegin",n);var r=new FormData;r.append("action","srea_save_settings"),r.append("nonce",i.value),r.append("option",e.currentTarget.dataset.sreaOption),r.append("value",""),this.close(),fetch(ajaxurl,{method:"POST",body:r}).then(function(e){return e.json()}).then(function(e){a.removeChild(n);var t=s(e.success,e.data.results);a.insertAdjacentElement("afterBegin",t),setTimeout(function(){a.removeChild(t)},500)})}},{key:"disableBtn",value:function(e){e.setAttribute("disabled","disabled")}},{key:"enableBtn",value:function(e){e.removeAttribute("disabled")}},{key:"empty",value:function(e){e.innerHTML=null}}]),e}())});

  • super-reactions/trunk/admin/class-settings-view.php

    r2461152 r2494716  
    22
    33namespace SREA\Admin;
     4
     5use SREA\Includes\SREA_Reactions;
    46
    57class Settings_View {
    … …  
    4244        </div>
    4345        <?php
     46        $this->modal();
    4447    }
    4548
    … …  
    103106    private function custom_post_types() {
    104107        $args = array(
    105             'public'   => true,
    106             '_builtin' => false,
     108            'public'              => true,
     109            'publicly_queryable'  => true,
     110            'exclude_from_search' => true,
     111            'show_ui'             => true,
     112            'show_in_nav_menus'   => true,
     113            '_builtin'            => false,
    107114        );
    108115
    109         $this->cpts = array_diff( get_post_types( $args ), array( 'product' ) );
     116        $cpts       = array_diff( get_post_types( $args ), array( 'product' ) );
     117        $this->cpts = apply_filters( 'srea_custom_post_types', $cpts );
    110118    }
    111119
    112120    private function render_setting_row( $post_type ) {
    113         $reactions = srea_reactions();
     121        $selected = srea_get_active_template_slug( $post_type );
    114122        ?>
    115123            <div class="srea-template-selector">
    116                 <label for="srea-template-selector-<?php echo esc_attr( $post_type ); ?>"><?php echo ucfirst( $post_type ) . ':'; ?></label>
    117                 <select name="<?php echo esc_attr( $post_type ); ?>" id="srea-template-selector-<?php echo esc_attr( $post_type ); ?>">
    118                     <option value="0"><?php esc_html_e( 'Disable', 'super-reactions' ); ?></option>
    119                     <?php foreach ( $reactions as $slug => $reaction ) : ?>
    120                         <?php $selected = srea_get_active_template_slug( $post_type ) === $slug ? 'selected' : ''; ?>
    121                         <option value="<?php echo esc_attr( $slug ); ?>" <?php echo esc_attr( $selected ); ?> ><?php echo esc_html( $reaction['name'] ); ?></option>
    122                     <?php endforeach; ?>
    123                 </select>
     124                <span class="srea-setting-label">
     125                    <?php echo ucfirst( $post_type ) . ':'; ?>
     126                </span>
     127                <div class="srea-action-buttons">
     128                    <button class="srea-template-selector-btn" data-srea-option="<?php echo esc_attr( $post_type ); ?>">
     129                        <?php $selected ? esc_html_e( 'Change', 'super-reactions' ) : esc_html_e( 'Select', 'super-reactions' ); ?>
     130                    </button>
     131                    <button
     132                    class="srea-template-selector-btn srea-remover"
     133                    data-srea-option="<?php echo esc_attr( $post_type ); ?>"
     134                    <?php echo ! $selected ? esc_attr( 'disabled', 'super-reactions' ) : '';  ?>>
     135                        <?php esc_html_e( 'Remove', 'super-reactions' ); ?>
     136                    </button>
     137                </div>
     138                <div class="preview-wrapper">
     139                    <div class="srea-selected-template-preview">
     140                        <?php
     141                        if ( $selected ) {
     142                            $this->generate_single_preview( $selected );
     143                        } else {
     144                            esc_html_e( 'Disabled', 'growmatik' );
     145                        }
     146                        ?>
     147                    </div>
     148                </div>
    124149            </div>
    125150        <?php
    … …  
    148173    }
    149174
     175    private function modal() {
     176        ?>
     177            <div id="srea-settings-modal">
     178                <div class="srea-modal-header">
     179                    <h2 id="srea-modal-title">
     180                        <span><?php esc_html_e( 'Select reaction template for', 'super-reactions' ); ?></span>
     181                        <span id="srea-modal-title-option-name"></span>
     182                    </h2>
     183                    <div id="srea-modal-close-btn" class="srea-modal-close-btn"></div>
     184                </div>
     185                <div class="srea-modal-inner">
     186                    <?php $this->settings_preview(); ?>
     187                </div>
     188            </div>
     189        <?php
     190    }
     191
     192    private function settings_preview() {
     193        $reactions = ( new SREA_Reactions() )->get_all();
     194        foreach ( $reactions as $slug => $config ) {
     195            $this->generate_single_preview( $slug );
     196            $this->generate_single_preview( $slug );
     197        }
     198    }
     199
     200    private function generate_single_preview( $slug ) {
     201        ?>
     202        <div class="srea-setting-preview" data-slug="<?php echo esc_attr( $slug ); ?>">
     203            <?php echo srea_get_template( $slug ); ?>
     204        </div>
     205        <?php
     206    }
     207
    150208}

  • super-reactions/trunk/constants.php

    r2461152 r2494716  
    66define( 'SREA_URL', plugin_dir_url( __FILE__ ) );
    77
    8 define( 'SREA_VERSION', '1.2.0' );
     8define( 'SREA_VERSION', '1.3.0' );
    99define( 'SREA_SLUG', 'super_reactions' );
    1010

  • super-reactions/trunk/front/assets/dist/css/srea-front.css

    r2452813 r2494716  
    77  margin: 5px;
    88  animation: spin 1s linear infinite;
     9}
     10
     11.srea-result-badge {
     12  color: #ffffff;
     13  padding: 6px;
     14  text-align: center;
     15  line-height: 10px;
     16  font-size: 13px;
     17}
     18
     19.srea-result-badge.srea-badge-success {
     20  background-color: #3c932c;
     21}
     22
     23.srea-result-badge.srea-badge-error {
     24  background-color: #932c2c;
     25}
     26
     27.srea-modal-close-btn {
     28  cursor: pointer;
     29  position: relative;
     30  display: block;
     31  width: 30px;
     32  height: 30px;
     33  border: 2px solid #747474;
     34  left: 30px;
     35  bottom: 20px;
     36}
     37
     38.srea-modal-close-btn::before {
     39  content: '';
     40  position: absolute;
     41  top: 13px;
     42  height: 2px;
     43  width: 30px;
     44  background-color: #747474;
     45  transform: rotate(45deg);
     46}
     47
     48.srea-modal-close-btn::after {
     49  content: '';
     50  position: absolute;
     51  top: 13px;
     52  height: 2px;
     53  width: 30px;
     54  background-color: #747474;
     55  transform: rotate(-45deg);
    956}
    1057

  • super-reactions/trunk/front/assets/dist/css/srea-front.min.css

    r2452813 r2494716  
    1 .srea-loader{border:3px solid rgba(200,200,200,.7);border-top:3px solid rgba(66,66,66,.5);border-radius:50%;width:18px;height:18px;margin:5px;animation:spin 1s linear infinite}.srea-template{display:flex}.srea-template .srea-reaction-item{display:flex;margin-right:10px;align-items:center;height:28px}.srea-template .srea-button{cursor:pointer}.srea-template .srea-template-count{width:23px;text-align:center;font-size:medium}.srea-template .srea-button{outline:0;border:none;background:0 0}.srea-template .srea-button:active,.srea-template .srea-button:focus,.srea-template .srea-button:hover{outline:0;border:none;background:0 0}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
     1.srea-loader{border:3px solid rgba(200,200,200,.7);border-top:3px solid rgba(66,66,66,.5);border-radius:50%;width:18px;height:18px;margin:5px;animation:spin 1s linear infinite}.srea-result-badge{color:#fff;padding:6px;text-align:center;line-height:10px;font-size:13px}.srea-result-badge.srea-badge-success{background-color:#3c932c}.srea-result-badge.srea-badge-error{background-color:#932c2c}.srea-modal-close-btn{cursor:pointer;position:relative;display:block;width:30px;height:30px;border:2px solid #747474;left:30px;bottom:20px}.srea-modal-close-btn::before{content:'';position:absolute;top:13px;height:2px;width:30px;background-color:#747474;transform:rotate(45deg)}.srea-modal-close-btn::after{content:'';position:absolute;top:13px;height:2px;width:30px;background-color:#747474;transform:rotate(-45deg)}.srea-template{display:flex}.srea-template .srea-reaction-item{display:flex;margin-right:10px;align-items:center;height:28px}.srea-template .srea-button{cursor:pointer}.srea-template .srea-template-count{width:23px;text-align:center;font-size:medium}.srea-template .srea-button{outline:0;border:none;background:0 0}.srea-template .srea-button:active,.srea-template .srea-button:focus,.srea-template .srea-button:hover{outline:0;border:none;background:0 0}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}

  • super-reactions/trunk/includes/templates.php

    r2461152 r2494716  
    22
    33function srea_get_template( string $reaction_slug ) {
    4     if ( ! $reaction_slug ) {
     4    if ( ! $reaction_slug || 'disabled' === $reaction_slug ) {
    55        return false;
    66    }

  • super-reactions/trunk/languages/super-reactions.pot

    r2461152 r2494716  
    2424msgstr ""
    2525
    26 #: admin/class-init.php:35, admin/class-settings-view.php:26
     26#: admin/class-init.php:35, admin/class-settings-view.php:28
    2727msgid "Super Reactions"
    2828msgstr ""
    … …  
    3232msgstr ""
    3333
    34 #: admin/class-settings-view.php:118
    35 msgid "Disable"
     34#: admin/class-settings-view.php:129
     35msgid "Change"
     36msgstr ""
     37
     38#: admin/class-settings-view.php:129
     39msgid "Select"
     40msgstr ""
     41
     42#: admin/class-settings-view.php:135
     43msgid "Remove"
     44msgstr ""
     45
     46#: admin/class-settings-view.php:180
     47msgid "Select reaction template for"
    3648msgstr ""
    3749

  • super-reactions/trunk/readme.txt

    r2461152 r2494716  
    66Tested up to: 5.6
    77Requires PHP: 7.0
    8 Stable tag: 1.2.0
     8Stable tag: 1.3.0
    99License: GPLv3
    1010License URI: http://www.gnu.org/licenses/gpl-3.0.html
    … …  
    2323== Changelog ==
    2424
     25= 1.3.0 =
     26* New admin panel
     27* General improvements and bug fix
     28
    2529= 1.2.0 =
    2630* New admin panel

  • super-reactions/trunk/super-reactions.php

    r2461152 r2494716  
    44 * Plugin Name: Super Reactions
    55 * Description: Get meaningful reactions from users.
    6  * Version:     1.2.0
     6 * Version:     1.3.0
    77 * Author:      Super Reactions Team
    88 * Text Domain: super-reactions
Note: See TracChangeset for help on using the changeset viewer.