From 5b74ee6ff87b1d66e6e50d73e9ca2cc6d725f547 Mon Sep 17 00:00:00 2001 From: Dukagjin Surdulli Date: Fri, 31 Jan 2020 12:39:53 +0100 Subject: [PATCH 01/10] Fix problem where existing tags would not be added to order list --- .../css/cloudinary.css | 318 +++++++++++++- .../js/block-editor.js | 388 +++++++++++++++++- .../js/block-editor.js.map | 2 +- .../js/cloudinary.js | 183 ++++++++- .../js/src/components/terms_order.js | 9 +- 5 files changed, 894 insertions(+), 6 deletions(-) diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css index 7df57b89b..263568e5f 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css @@ -1 +1,317 @@ -@font-face{font-family:cloudinary;src:url(../css/fonts/cloudinary.eot);src:url(../css/fonts/cloudinary.eot#iefix) format("embedded-opentype"),url(../css/fonts/cloudinary.ttf) format("truetype"),url(../css/fonts/cloudinary.woff) format("woff"),url(../css/cloudinary.svg#cloudinary) format("svg");font-weight:400;font-style:normal}.dashicons-cloudinary{speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dashicons-cloudinary:before{font-family:cloudinary!important;content:"\e900"}.dashicons-cloudinary.success{color:#558b2f}.dashicons-cloudinary.error{color:#dd2c00}.dashicons-cloudinary.error:before{content:"\e901"}.dashicons-cloudinary.warning:before{content:"\e902"}.dashicons-cloudinary.warning{color:#fd9d2c}.column-cld_status{width:5.5em}.column-cld_status .dashicons-cloudinary{display:inline-block}.column-cld_status .dashicons-cloudinary:before{font-size:1.8rem}.form-field .error-notice,.form-table .error-notice{display:none;color:#dd2c00}.form-field input.cld-field:invalid,.form-table input.cld-field:invalid{border-color:#dd2c00}.form-field input.cld-field:invalid+.error-notice,.form-table input.cld-field:invalid+.error-notice{display:inline-block}.cloudinary-welcome{background-image:url(../css/logo.svg);background-repeat:no-repeat;background-size:153px;background-position:top 12px right 20px}.settings-image{max-width:100%;padding-top:5px}.settings-tabs>li{display:inline-block}.settings-tabs>li a{padding:.6em}.settings-tabs>li a.active{background-color:#fff}.settings-tab-section{padding:20px 0 0;max-width:1030px;position:relative}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard{display:flex;align-items:flex-start;align-content:flex-start;margin-top:40px}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description{width:55%;margin:0 auto 0 0}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content{width:35%;margin:0 auto}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons{color:#9ea3a8}.settings-tab-section.cloudinary-welcome .settings-tab-section-card{margin-top:0}.settings-tab-section-fields .field-heading th{display:block;width:auto;color:#23282d;font-size:1.1em;margin:1em 0}.settings-tab-section-fields .field-heading td{display:none;visibility:hidden}.settings-tab-section-fields .regular-textarea{width:100%;height:60px}.settings-tab-section-fields .dashicons{text-decoration:none;vertical-align:middle}.settings-tab-section-fields a .dashicons{color:#5f5f5f}.settings-tab-section-fields-dashboard-error{font-size:1.2em;color:#5f5f5f}.settings-tab-section-fields-dashboard-error .dashicons{color:#ac0000}.settings-tab-section-fields-dashboard-error .button{font-size:1.1em;height:40px;line-height:40px;padding-right:40px;padding-left:40px}.settings-tab-section-fields-dashboard-success{font-size:1.2em;color:#23282d}.settings-tab-section-fields-dashboard-success.expanded{padding-top:40px}.settings-tab-section-fields-dashboard-success .dashicons{color:#4fb651}.settings-tab-section-fields-dashboard-success .button{font-size:1.1em;height:40px;line-height:40px;padding-right:40px;padding-left:40px}.settings-tab-section-fields-dashboard-success .description{color:#5f5f5f;font-weight:400;margin-top:12px}.settings-tab-section-card{box-sizing:border-box;border:1px solid #e5e5e5;background-color:#fff;box-shadow:0 1px 1px 0 rgba(0,0,0,.07);padding:20px 23px;margin-top:12px}.settings-tab-section-card .dashicons{font-size:1.4em}.settings-tab-section-card h2{font-size:1.8em;font-weight:400;margin-top:0}.settings-tab-section-card.pull-right{width:450px;padding:12px;float:right;position:relative;z-index:10}.settings-tab-section-card.pull-right img.settings-image{box-shadow:0 2px 4px 0 rgba(0,0,0,.5);border:1px solid #979797;margin-top:12px}.settings-tab-section-card.pull-right h3,.settings-tab-section-card.pull-right h4{margin-top:0}.settings-tab-section .field-row-cloudinary_url,.settings-tab-section .field-row-signup{display:block}.settings-tab-section .field-row-cloudinary_url td,.settings-tab-section .field-row-cloudinary_url th,.settings-tab-section .field-row-signup td,.settings-tab-section .field-row-signup th{display:block;width:auto;padding:10px 0 0}.settings-tab-section .field-row-cloudinary_url td .sign-up,.settings-tab-section .field-row-cloudinary_url th .sign-up,.settings-tab-section .field-row-signup td .sign-up,.settings-tab-section .field-row-signup th .sign-up{vertical-align:baseline}.settings-tab-section.connect .form-table{display:inline-block;width:auto;max-width:580px}.settings-valid{color:#558b2f;font-size:30px}.settings-valid-field{border-color:#558b2f!important}.settings-invalid-field{border-color:#dd2c00!important}.sync .spinner{display:inline-block;visibility:visible;float:none;margin:0 5px 0 0}.sync-media,.sync-media-progress{display:none}.sync-media-progress-outer{height:20px;margin:20px 0 10px;width:500px;background-color:#e5e5e5;position:relative}.sync-media-progress-outer .progress-bar{width:0;height:20px;background-color:#558b2f;transition:width .25s}.sync-media-progress-notice{color:#dd2c00}.sync-media-resource{width:100px;display:inline-block}.sync-media-error{color:#dd2c00}.sync-count{font-weight:700}.sync-details{margin-top:10px}.sync .button.start-sync,.sync .button.stop-sync{display:none;padding:0 16px}.sync .button.start-sync .dashicons,.sync .button.stop-sync .dashicons{line-height:2.2em}.sync .progress-text{padding:12px 4px 12px 12px;display:inline-block;font-weight:700}.sync .completed{max-width:300px;display:none}.cloudinary-widget{height:100%}.cloudinary-widget-wrapper{height:100%;overflow:hidden;background-image:url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48c3R5bGU+QGtleWZyYW1lcyBjb2xvcnN7MCUsdG97c3Ryb2tlOiMwMDc4ZmZ9NTAle3N0cm9rZTojMGUyZjVhfX1Aa2V5ZnJhbWVzIGRhc2h7MCUsdG97c3Ryb2tlLWRhc2hvZmZzZXQ6NTYwfTUwJXtzdHJva2UtZGFzaG9mZnNldDowfX1ALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzezAlLHRve3N0cm9rZTojMDA3OGZmfTUwJXtzdHJva2U6IzBlMmY1YX19QC13ZWJraXQta2V5ZnJhbWVzIGRhc2h7MCUsdG97c3Ryb2tlLWRhc2hvZmZzZXQ6NTYwfTUwJXtzdHJva2UtZGFzaG9mZnNldDowfX08L3N0eWxlPjxwYXRoIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3R5bGU9InRyYW5zZm9ybS1vcmlnaW46Y2VudGVyOy13ZWJraXQtYW5pbWF0aW9uOmRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsY29sb3JzIDhzIGVhc2UtaW4tb3V0IGluZmluaXRlO2FuaW1hdGlvbjpkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZSIgc3Ryb2tlLWRhc2hhcnJheT0iMjgwIi8+PC9zdmc+");background-repeat:no-repeat;background-position:50%;background-size:150px}.attachment-actions .button.edit-attachment,.attachment-info .edit-attachment{display:none}.global-transformations-preview{position:relative;max-width:600px}.global-transformations-spinner{display:none}.global-transformations-button.button-primary{display:none;position:absolute;z-index:100}.global-transformations-url{margin-bottom:5px;margin-top:5px}.global-transformations-url-transformation{max-width:100px;overflow:hidden;text-overflow:ellipsis;color:#51a3ff}.global-transformations-url-file{color:#f2d864}.global-transformations-url-link{display:block;padding:16px;background-color:#262c35;text-decoration:none;color:#fff;border-radius:6px;overflow:hidden;text-overflow:ellipsis}.global-transformations-url-link:hover{color:#888;text-decoration:underline}.cld-tax-order-list-item{border:1px solid #efefef;padding:4px;margin:0 0 -1px;background-color:#fff}.cld-tax-order-list-item.no-items{color:#888;text-align:center;display:none}.cld-tax-order-list-item.no-items:last-child{display:block}.cld-tax-order-list-item.ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.cld-tax-order-list-item-placeholder{background-color:#efefef;height:45px;margin:0}.cld-tax-order-list-item-handle{cursor:grab;margin-right:4px;color:#999}.cld-tax-order-list-type{width:45%;display:inline-block;margin-right:8px}.cld-tax-order-list-type input{margin-right:4px!important}.cloudinary-media-library{position:relative;margin-left:-20px}@media screen and (max-width:782px){.cloudinary-media-library{margin-left:-10px}} \ No newline at end of file +@font-face { + font-family: 'cloudinary'; + src: url(../css/fonts/cloudinary.eot); + src: url(../css/fonts/cloudinary.eot#iefix) format("embedded-opentype"), url(../css/fonts/cloudinary.ttf) format("truetype"), url(../css/fonts/cloudinary.woff) format("woff"), url(../css/cloudinary.svg#cloudinary) format("svg"); + font-weight: normal; + font-style: normal; } + +.dashicons-cloudinary { + /* use !important to prevent issues with browser extensions that change fonts */ + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } + .dashicons-cloudinary:before { + font-family: 'cloudinary' !important; + content: '\e900'; } + .dashicons-cloudinary.success { + color: #558b2f; } + .dashicons-cloudinary.error { + color: #dd2c00; } + .dashicons-cloudinary.error:before { + content: '\e901'; } + .dashicons-cloudinary.warning { + color: #fd9d2c; } + .dashicons-cloudinary.warning:before { + content: '\e902'; } + .dashicons-cloudinary.warning { + color: #fd9d2c; } + .dashicons-cloudinary.warning { + color: #fd9d2c; } + +.column-cld_status { + width: 5.5em; } + .column-cld_status .dashicons-cloudinary { + display: inline-block; } + .column-cld_status .dashicons-cloudinary:before { + font-size: 1.8rem; } + +.form-field .error-notice, .form-table .error-notice { + display: none; + color: #dd2c00; } + +.form-field input.cld-field:invalid, .form-table input.cld-field:invalid { + border-color: #dd2c00; } + .form-field input.cld-field:invalid + .error-notice, .form-table input.cld-field:invalid + .error-notice { + display: inline-block; } + +.cloudinary-welcome { + background-image: url(../css/logo.svg); + background-repeat: no-repeat; + background-size: 153px; + background-position: top 12px right 20px; } + +.settings-image { + max-width: 100%; + padding-top: 5px; } + +.settings-tabs > li { + display: inline-block; } + .settings-tabs > li a { + padding: .6em; } + .settings-tabs > li a.active { + background-color: #ffffff; } + +.settings-tab-section { + padding: 20px 0 0 0; + max-width: 1030px; + position: relative; } + .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard { + display: flex; + align-items: flex-start; + align-content: flex-start; + margin-top: 40px; } + .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description { + width: 55%; + margin: 0 auto 0 0; } + .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content { + width: 35%; + margin: 0 auto; } + .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons { + color: #9EA3A8; } + .settings-tab-section.cloudinary-welcome .settings-tab-section-card { + margin-top: 0; } + .settings-tab-section-fields .field-heading th { + display: block; + width: auto; + color: #23282d; + font-size: 1.1em; + margin: 1em 0; } + .settings-tab-section-fields .field-heading td { + display: none; + visibility: hidden; } + .settings-tab-section-fields .regular-textarea { + width: 100%; + height: 60px; } + .settings-tab-section-fields .dashicons { + text-decoration: none; + vertical-align: middle; } + .settings-tab-section-fields a .dashicons { + color: #5F5F5F; } + .settings-tab-section-fields-dashboard-error { + font-size: 1.2em; + color: #5F5F5F; } + .settings-tab-section-fields-dashboard-error .dashicons { + color: #AC0000; } + .settings-tab-section-fields-dashboard-error .button { + font-size: 1.1em; + height: 40px; + line-height: 40px; + padding-right: 40px; + padding-left: 40px; } + .settings-tab-section-fields-dashboard-success { + font-size: 1.2em; + color: #23282d; } + .settings-tab-section-fields-dashboard-success.expanded { + padding-top: 40px; } + .settings-tab-section-fields-dashboard-success .dashicons { + color: #4FB651; } + .settings-tab-section-fields-dashboard-success .button { + font-size: 1.1em; + height: 40px; + line-height: 40px; + padding-right: 40px; + padding-left: 40px; } + .settings-tab-section-fields-dashboard-success .description { + color: #5F5F5F; + font-weight: normal; + margin-top: 12px; } + .settings-tab-section-card { + box-sizing: border-box; + border: 1px solid #E5E5E5; + background-color: #FFFFFF; + box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.07); + padding: 20px 23px; + margin-top: 12px; } + .settings-tab-section-card .dashicons { + font-size: 1.4em; } + .settings-tab-section-card h2 { + font-size: 1.8em; + font-weight: normal; + margin-top: 0; } + .settings-tab-section-card.pull-right { + width: 450px; + padding: 12px; + float: right; + position: relative; + z-index: 10; } + .settings-tab-section-card.pull-right img.settings-image { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5); + border: 1px solid #979797; + margin-top: 12px; } + .settings-tab-section-card.pull-right h4, .settings-tab-section-card.pull-right h3 { + margin-top: 0; } + .settings-tab-section .field-row-cloudinary_url, .settings-tab-section .field-row-signup { + display: block; } + .settings-tab-section .field-row-cloudinary_url td, .settings-tab-section .field-row-cloudinary_url th, .settings-tab-section .field-row-signup td, .settings-tab-section .field-row-signup th { + display: block; + width: auto; + padding: 10px 0 0; } + .settings-tab-section .field-row-cloudinary_url td .sign-up, .settings-tab-section .field-row-cloudinary_url th .sign-up, .settings-tab-section .field-row-signup td .sign-up, .settings-tab-section .field-row-signup th .sign-up { + vertical-align: baseline; } + .settings-tab-section.connect .form-table { + display: inline-block; + width: auto; + max-width: 580px; } + +.settings-valid { + color: #558b2f; + font-size: 30px; } + .settings-valid-field { + border-color: #558b2f !important; } + +.settings-invalid-field { + border-color: #dd2c00 !important; } + +.sync .spinner { + display: inline-block; + visibility: visible; + float: none; + margin: 0 5px 0 0; } + +.sync-media { + display: none; } + .sync-media-progress { + display: none; } + .sync-media-progress-outer { + height: 20px; + margin: 20px 0 10px; + width: 500px; + background-color: #e5e5e5; + position: relative; } + .sync-media-progress-outer .progress-bar { + width: 0; + height: 20px; + background-color: #558b2f; + transition: width 250ms; } + .sync-media-progress-notice { + color: #dd2c00; } + .sync-media-resource { + width: 100px; + display: inline-block; } + .sync-media-error { + color: #dd2c00; } + +.sync-count { + font-weight: bold; } + +.sync-details { + margin-top: 10px; } + +.sync .button.stop-sync, .sync .button.start-sync { + display: none; + padding: 0 16px; } + .sync .button.stop-sync .dashicons, .sync .button.start-sync .dashicons { + line-height: 2.2em; } + +.sync .progress-text { + padding: 12px 4px 12px 12px; + display: inline-block; + font-weight: bold; } + +.sync .completed { + max-width: 300px; + display: none; } + +.cloudinary-widget { + height: 100%; } + .cloudinary-widget-wrapper { + height: 100%; + overflow: hidden; + background-image: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K"); + background-repeat: no-repeat; + background-position: center; + background-size: 150px; } + +.attachment-info .edit-attachment { + display: none; } + +.attachment-actions .button.edit-attachment { + display: none; } + +.global-transformations-preview { + position: relative; + max-width: 600px; } + +.global-transformations-spinner { + display: none; } + +.global-transformations-button.button-primary { + display: none; + position: absolute; + z-index: 100; } + +.global-transformations-url { + margin-bottom: 5px; + margin-top: 5px; } + .global-transformations-url-transformation { + max-width: 100px; + overflow: hidden; + text-overflow: ellipsis; + color: #51A3FF; } + .global-transformations-url-file { + color: #f2d864; } + .global-transformations-url-link { + display: block; + padding: 16px; + background-color: #262c35; + text-decoration: none; + color: #fff; + border-radius: 6px; + overflow: hidden; + text-overflow: ellipsis; } + .global-transformations-url-link:hover { + color: #888888; + text-decoration: underline; } + +.cld-tax-order-list-item { + border: 1px solid #efefef; + padding: 4px; + margin: 0 0 -1px; + background-color: #ffffff; } + .cld-tax-order-list-item.no-items { + color: #888; + text-align: center; + display: none; } + .cld-tax-order-list-item.no-items:last-child { + display: block; } + .cld-tax-order-list-item.ui-sortable-helper { + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); } + .cld-tax-order-list-item-placeholder { + background-color: #efefef; + height: 45px; + margin: 0; } + .cld-tax-order-list-item-handle { + cursor: grab; + margin-right: 4px; + color: #999; } + +.cld-tax-order-list-type { + width: 45%; + display: inline-block; + margin-right: 8px; } + .cld-tax-order-list-type input { + margin-right: 4px !important; } + +.cloudinary-media-library { + position: relative; + margin-left: -20px; } + @media screen and (max-width: 782px) { + .cloudinary-media-library { + margin-left: -10px; } } + diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js index 482503df0..c35381dc8 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js @@ -1 +1,387 @@ -!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=6)}([function(e,t){!function(){e.exports=this.wp.element}()},function(e,t){!function(){e.exports=this.wp.i18n}()},function(e,t){!function(){e.exports=this.wp.components}()},function(e,t,r){var n=r(5);e.exports=function(e){for(var t=1;t {\n\tconst { attributes: { overwrite_transformations, transformations }, setAttributes } = props;\n\t\n\tif ( ! transformations ) {\n\t\treturn null;\n \t}\n \n\treturn (\n\t\t\n\t\t\t {\n\t\t\t\t\tsetAttributes( { overwrite_transformations: value } );\n\t\t\t\t}}\n\t\t\t/>\n\t\t\n\t);\n};\n\nlet ImageInspectorControls = ( props ) => {\n\tconst { setAttributes, media } = props;\n\tconst { InspectorControls } = wp.editor;\n\t\n\tconsole.log(media);\n\n\tif ( media && media.transformations ) {\n\t\tsetAttributes( { transformations: true } );\n\t}\n\n\treturn (\n\t\t\n\t\t\t\n\t\t\n\t);\n};\n\nImageInspectorControls = withSelect( ( select, ownProps ) => ( {\n ...ownProps,\n media: ownProps.attributes.id ? select( 'core' ).getMedia( ownProps.attributes.id ) : null\n} ))( ImageInspectorControls );\n\nconst cldFilterBlocksEdit = ( BlockEdit ) => {\n\treturn ( props ) => {\n\t\tconst { name } = props;\n\t\tlet inspectorControls = null;\n\n\t\tif ( 'core/image' === name || 'core/video' === name ) {\n\t\t\tinspectorControls = ;\n\t\t}\n\t\t\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{inspectorControls}\n\t\t\t\t\n\t\t\t\n\t\t);\n\t}\n};\n\nwp.hooks.addFilter( 'editor.BlockEdit', 'cloudinary/filterEdit', cldFilterBlocksEdit, 20 );\n\nconst cldfilterBlocksSave = ( element, blockType, attributes ) => {\n\tif ( 'core/image' === blockType.name && attributes.overwrite_transformations ) {\n\t\tlet children = cloneElement( element.props.children );\n\t\tlet classname = children.props.children[ 0 ].props.className ? children.props.children[ 0 ].props.className : '';\n\t\tlet child = cloneElement( children.props.children[ 0 ], { className: classname + ' cld-overwrite' } );\n\t\tlet neChildren = cloneElement( children, { children: [ child, false ] } );\n\t\treturn cloneElement( element, { children: neChildren } );\n\t}\n\n\tif ( 'core/video' === blockType.name && attributes.overwrite_transformations ) {\n\t\tlet children = cloneElement( element.props.children[ 0 ], { className: ' cld-overwrite' } );\n\t\treturn cloneElement( element, { children } );\n\t}\n\n\treturn element;\n};\n\nwp.hooks.addFilter( 'blocks.getSaveElement', 'cloudinary/filterSave', cldfilterBlocksSave );\n","function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? Object(arguments[i]) : {};\n var ownKeys = Object.keys(source);\n\n if (typeof Object.getOwnPropertySymbols === 'function') {\n ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n }));\n }\n\n ownKeys.forEach(function (key) {\n defineProperty(target, key, source[key]);\n });\n }\n\n return target;\n}\n\nmodule.exports = _objectSpread;","(function() { module.exports = this[\"wp\"][\"components\"]; }());","(function() { module.exports = this[\"wp\"][\"element\"]; }());","(function() { module.exports = this[\"wp\"][\"i18n\"]; }());"],"sourceRoot":""} \ No newline at end of file +{"version":3,"sources":["webpack:///webpack/bootstrap","webpack:///./js/src/blocks.js","webpack:///./js/src/components/video.js","webpack:///./node_modules/@babel/runtime/helpers/defineProperty.js","webpack:///./node_modules/@babel/runtime/helpers/objectSpread.js","webpack:///external {\"this\":[\"wp\",\"components\"]}","webpack:///external {\"this\":[\"wp\",\"data\"]}","webpack:///external {\"this\":[\"wp\",\"element\"]}","webpack:///external {\"this\":[\"wp\",\"i18n\"]}"],"names":["$","window","jQuery","cloudinaryBlocks","Video","_init","CLD_VIDEO_PLAYER","wp","hooks","addFilter","settings","name","video_autoplay_mode","attributes","autoplay","default","video_loop","loop","video_controls","controls","cldAddToggle","overwrite_transformations","type","transformations","TransformationsToggle","props","setAttributes","__","value","ImageInspectorControls","media","InspectorControls","editor","withSelect","select","ownProps","id","getMedia","cldFilterBlocksEdit","BlockEdit","shouldDisplayInspector","cldfilterBlocksSave","element","blockType","children","cloneElement","classname","className","child","neChildren"],"mappings":";QAAA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;;QAEA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;;;QAGA;QACA;;QAEA;QACA;;QAEA;QACA;QACA;QACA,0CAA0C,gCAAgC;QAC1E;QACA;;QAEA;QACA;QACA;QACA,wDAAwD,kBAAkB;QAC1E;QACA,iDAAiD,cAAc;QAC/D;;QAEA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA,yCAAyC,iCAAiC;QAC1E,gHAAgH,mBAAmB,EAAE;QACrI;QACA;;QAEA;QACA;QACA;QACA,2BAA2B,0BAA0B,EAAE;QACvD,iCAAiC,eAAe;QAChD;QACA;QACA;;QAEA;QACA,sDAAsD,+DAA+D;;QAErH;QACA;;;QAGA;QACA;;;;;;;;;;;;;AClFA;AAAA;AAAA;AAAA;;AACA;;;AAIA;CAIA;;AACA,IAAMA,CAAC,GAAGC,MAAM,CAACD,CAAP,GAAWC,MAAM,CAACC,MAA5B,C,CAEA;;AACO,IAAMC,gBAAgB,GAAG;AAC/BC,OAAK,EAALA,yDAAKA;AAD0B,CAAzB,C;;;;;;;;;;;;;;;;;;;;;;;;;;ACbP;AAEA;AACA;AACA;AACA;AAEA,IAAMA,KAAK,GAAG;AACbC,OAAK,EAAE,iBAAW;AACjB,QAAK,OAAOC,gBAAP,KAA4B,WAAjC,EAA+C;AAC9C;AACA,KAHgB,CAKjB;;;AACAC,MAAE,CAACC,KAAH,CAASC,SAAT,CACC,0BADD,EAEC,wBAFD,EAGC,UAAUC,QAAV,EAAoBC,IAApB,EAA2B;AAC1B,UAAKA,IAAI,KAAK,YAAd,EAA6B;AAC5B,YAAK,UAAUL,gBAAgB,CAACM,mBAAhC,EAAsD;AACrDF,kBAAQ,CAACG,UAAT,CAAoBC,QAApB,CAA6BC,OAA7B,GAAuC,IAAvC;AACA;;AAED,YAAK,SAAST,gBAAgB,CAACU,UAA/B,EAA4C;AAC3CN,kBAAQ,CAACG,UAAT,CAAoBI,IAApB,CAAyBF,OAAzB,GAAmC,IAAnC;AACA;;AAED,YAAK,UAAUT,gBAAgB,CAACY,cAAhC,EAAiD;AAChDR,kBAAQ,CAACG,UAAT,CAAoBM,QAApB,CAA6BJ,OAA7B,GAAuC,KAAvC;AACA;AACD;;AACD,aAAOL,QAAP;AACA,KAlBF;AAoBA;AA3BY,CAAd;AA8BeN,oEAAf,E,CAEA;;AACAA,KAAK,CAACC,KAAN;;AAEA,IAAIe,YAAY,GAAG,SAAfA,YAAe,CAAUV,QAAV,EAAoBC,IAApB,EAA2B;AAE7C,MAAK,iBAAiBA,IAAjB,IAAyB,iBAAiBA,IAA/C,EAAsD;AACrD,QAAK,CAACD,QAAQ,CAACG,UAAf,EAA4B;AAC3BH,cAAQ,CAACG,UAAT,GAAsB,EAAtB;AACA;;AAEDH,YAAQ,CAACG,UAAT,CAAoBQ,yBAApB,GAAgD;AAC/CC,UAAI,EAAE;AADyC,KAAhD;AAIAZ,YAAQ,CAACG,UAAT,CAAoBU,eAApB,GAAsC;AACrCD,UAAI,EAAE;AAD+B,KAAtC;AAIA;;AAED,SAAOZ,QAAP;AACA,CAlBD;;AAoBAH,EAAE,CAACC,KAAH,CAASC,SAAT,CAAoB,0BAApB,EAAgD,0BAAhD,EAA4EW,YAA5E;AAEA;;;;;;;;AAOA,IAAMI,qBAAqB,GAAG,SAAxBA,qBAAwB,CAAEC,KAAF,EAAa;AAAA,0BACwCA,KADxC,CACnCZ,UADmC;AAAA,MACtBQ,yBADsB,qBACtBA,yBADsB;AAAA,MACKE,eADL,qBACKA,eADL;AAAA,MACuBG,aADvB,GACwCD,KADxC,CACuBC,aADvB;;AAG1C,MAAK,CAAEH,eAAP,EAAyB;AACxB,WAAO,IAAP;AACC;;AAEF,SACC,yEAAC,+DAAD;AAAW,SAAK,EAAEI,0DAAE,CAAE,iBAAF,EAAqB,YAArB;AAApB,KACC,yEAAC,mEAAD;AACC,SAAK,EAAEA,0DAAE,CAAE,2BAAF,EAA+B,YAA/B,CADV;AAEC,WAAO,EAAEN,yBAFV;AAGC,YAAQ,EAAE,kBAAEO,KAAF,EAAa;AACtBF,mBAAa,CAAE;AAACL,iCAAyB,EAAEO;AAA5B,OAAF,CAAb;AACA;AALF,IADD,CADD;AAWA,CAlBD;;AAoBA,IAAIC,sBAAsB,GAAG,gCAAEJ,KAAF,EAAa;AAAA,MAClCC,aADkC,GACVD,KADU,CAClCC,aADkC;AAAA,MACnBI,KADmB,GACVL,KADU,CACnBK,KADmB;AAAA,MAElCC,iBAFkC,GAEbxB,EAAE,CAACyB,MAFU,CAElCD,iBAFkC;;AAIzC,MAAKD,KAAK,IAAIA,KAAK,CAACP,eAApB,EAAsC;AACrCG,iBAAa,CAAE;AAACH,qBAAe,EAAE;AAAlB,KAAF,CAAb;AACA;;AAED,SACC,yEAAC,iBAAD,QACC,yEAAC,qBAAD,EAA2BE,KAA3B,CADD,CADD;AAKA,CAbD;;AAeAI,sBAAsB,GAAGI,kEAAU,CAAE,UAAEC,MAAF,EAAUC,QAAV;AAAA,wFACjCA,QADiC;AAEpCL,SAAK,EAAEK,QAAQ,CAACtB,UAAT,CAAoBuB,EAApB,GAAyBF,MAAM,CAAE,MAAF,CAAN,CAAiBG,QAAjB,CAA2BF,QAAQ,CAACtB,UAAT,CAAoBuB,EAA/C,CAAzB,GAA+E;AAFlD;AAAA,CAAF,CAAV,CAGnBP,sBAHmB,CAAzB;;AAKA,IAAMS,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAEC,SAAF,EAAiB;AAC5C,SAAO,UAAEd,KAAF,EAAa;AAAA,QACZd,IADY,GACJc,KADI,CACZd,IADY;AAEnB,QAAM6B,sBAAsB,GAAG,iBAAiB7B,IAAjB,IAAyB,iBAAiBA,IAAzE;AAEA,WACC,4IACE6B,sBAAsB,GAAG,yEAAC,sBAAD,EAA4Bf,KAA5B,CAAH,GAA2C,IADnE,EAEC,yEAAC,SAAD,EAAeA,KAAf,CAFD,CADD;AAMA,GAVD;AAWA,CAZD;;AAcAlB,EAAE,CAACC,KAAH,CAASC,SAAT,CAAoB,kBAApB,EAAwC,uBAAxC,EAAiE6B,mBAAjE,EAAsF,EAAtF;;AAEA,IAAMG,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAEC,OAAF,EAAWC,SAAX,EAAsB9B,UAAtB,EAAsC;AACjE,MAAK,iBAAiB8B,SAAS,CAAChC,IAA3B,IAAmCE,UAAU,CAACQ,yBAAnD,EAA+E;AAC9E,QAAIuB,QAAQ,GAAGC,uEAAY,CAAEH,OAAO,CAACjB,KAAR,CAAcmB,QAAhB,CAA3B;AACA,QAAIE,SAAS,GAAGF,QAAQ,CAACnB,KAAT,CAAemB,QAAf,CAAyB,CAAzB,EAA6BnB,KAA7B,CAAmCsB,SAAnC,GAA+CH,QAAQ,CAACnB,KAAT,CAAemB,QAAf,CAAyB,CAAzB,EAA6BnB,KAA7B,CAAmCsB,SAAlF,GAA8F,EAA9G;AACA,QAAIC,KAAK,GAAGH,uEAAY,CAAED,QAAQ,CAACnB,KAAT,CAAemB,QAAf,CAAyB,CAAzB,CAAF,EAAgC;AAACG,eAAS,EAAED,SAAS,GAAG;AAAxB,KAAhC,CAAxB;AACA,QAAIG,UAAU,GAAGJ,uEAAY,CAAED,QAAF,EAAY;AAACA,cAAQ,EAAE,CAAEI,KAAF,EAAS,KAAT;AAAX,KAAZ,CAA7B;AACA,WAAOH,uEAAY,CAAEH,OAAF,EAAW;AAACE,cAAQ,EAAEK;AAAX,KAAX,CAAnB;AACA;;AAED,MAAK,iBAAiBN,SAAS,CAAChC,IAA3B,IAAmCE,UAAU,CAACQ,yBAAnD,EAA+E;AAC9E,QAAIuB,SAAQ,GAAGC,uEAAY,CAAEH,OAAO,CAACjB,KAAR,CAAcmB,QAAd,CAAwB,CAAxB,CAAF,EAA+B;AAACG,eAAS,EAAE;AAAZ,KAA/B,CAA3B;;AACA,WAAOF,uEAAY,CAAEH,OAAF,EAAW;AAACE,cAAQ,EAARA;AAAD,KAAX,CAAnB;AACA;;AAED,SAAOF,OAAP;AACA,CAfD;;AAiBAnC,EAAE,CAACC,KAAH,CAASC,SAAT,CAAoB,uBAApB,EAA6C,uBAA7C,EAAsEgC,mBAAtE,E;;;;;;;;;;;AChJA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL,GAAG;AACH;AACA;;AAEA;AACA;;AAEA,iC;;;;;;;;;;;ACfA,qBAAqB,mBAAO,CAAC,iFAAkB;;AAE/C;AACA,iBAAiB,sBAAsB;AACvC;AACA;;AAEA;AACA;AACA;AACA,OAAO;AACP;;AAEA;AACA;AACA,KAAK;AACL;;AAEA;AACA;;AAEA,+B;;;;;;;;;;;ACrBA,aAAa,2CAA2C,EAAE,I;;;;;;;;;;;ACA1D,aAAa,qCAAqC,EAAE,I;;;;;;;;;;;ACApD,aAAa,wCAAwC,EAAE,I;;;;;;;;;;;ACAvD,aAAa,qCAAqC,EAAE,I","file":"block-editor.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"./js/src/blocks.js\");\n","/* global window */\n/**\n * Main JS.\n */\n\n// Components\nimport Video from './components/video';\n\n\n// jQuery, because reasons.\nconst $ = window.$ = window.jQuery;\n\n// Global Constants\nexport const cloudinaryBlocks = {\n\tVideo\n};\n\n","/* global window wp */\n\nimport { __ } from '@wordpress/i18n';\nimport { withSelect } from '@wordpress/data';\nimport { cloneElement } from '@wordpress/element';\nimport { ToggleControl, PanelBody } from '@wordpress/components';\n\nconst Video = {\n\t_init: function() {\n\t\tif ( typeof CLD_VIDEO_PLAYER === 'undefined' ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Gutenberg Video Settings\n\t\twp.hooks.addFilter(\n\t\t\t'blocks.registerBlockType',\n\t\t\t'Cloudinary/Media/Video',\n\t\t\tfunction( settings, name ) {\n\t\t\t\tif ( name === 'core/video' ) {\n\t\t\t\t\tif ( 'off' !== CLD_VIDEO_PLAYER.video_autoplay_mode ) {\n\t\t\t\t\t\tsettings.attributes.autoplay.default = true;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( 'on' === CLD_VIDEO_PLAYER.video_loop ) {\n\t\t\t\t\t\tsettings.attributes.loop.default = true;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( 'off' === CLD_VIDEO_PLAYER.video_controls ) {\n\t\t\t\t\t\tsettings.attributes.controls.default = false;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn settings;\n\t\t\t}\n\t\t);\n\t},\n};\n\nexport default Video;\n\n// Init.\nVideo._init();\n\nlet cldAddToggle = function( settings, name ) {\n\n\tif ( 'core/image' === name || 'core/video' === name ) {\n\t\tif ( !settings.attributes ) {\n\t\t\tsettings.attributes = {};\n\t\t}\n\n\t\tsettings.attributes.overwrite_transformations = {\n\t\t\ttype: 'boolean',\n\t\t};\n\n\t\tsettings.attributes.transformations = {\n\t\t\ttype: 'boolean',\n\t\t};\n\n\t}\n\n\treturn settings;\n};\n\nwp.hooks.addFilter( 'blocks.registerBlockType', 'cloudinary/addAttributes', cldAddToggle );\n\n/**\n * Get AMP Lightbox toggle control.\n *\n * @param {Object} props Props.\n *\n * @return {Component} Element.\n */\nconst TransformationsToggle = ( props ) => {\n\tconst {attributes: {overwrite_transformations, transformations}, setAttributes} = props;\n\t\n\tif ( ! transformations ) {\n\t\treturn null;\n }\n \n\treturn (\n\t\t\n\t\t\t {\n\t\t\t\t\tsetAttributes( {overwrite_transformations: value} );\n\t\t\t\t}}\n\t\t\t/>\n\t\t\n\t);\n};\n\nlet ImageInspectorControls = ( props ) => {\n\tconst {setAttributes, media} = props;\n\tconst {InspectorControls} = wp.editor;\n\t\n\tif ( media && media.transformations ) {\n\t\tsetAttributes( {transformations: true} );\n\t}\n\n\treturn (\n\t\t\n\t\t\t\n\t\t\n\t);\n};\n\nImageInspectorControls = withSelect( ( select, ownProps ) => ( {\n\t...ownProps,\n\tmedia: ownProps.attributes.id ? select( 'core' ).getMedia( ownProps.attributes.id ) : null\n} ))( ImageInspectorControls );\n\nconst cldFilterBlocksEdit = ( BlockEdit ) => {\n\treturn ( props ) => {\n\t\tconst {name} = props;\n\t\tconst shouldDisplayInspector = 'core/image' === name || 'core/video' === name;\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{shouldDisplayInspector ? : null}\n\t\t\t\t\n\t\t\t\n\t\t);\n\t}\n};\n\nwp.hooks.addFilter( 'editor.BlockEdit', 'cloudinary/filterEdit', cldFilterBlocksEdit, 20 );\n\nconst cldfilterBlocksSave = ( element, blockType, attributes ) => {\n\tif ( 'core/image' === blockType.name && attributes.overwrite_transformations ) {\n\t\tlet children = cloneElement( element.props.children );\n\t\tlet classname = children.props.children[ 0 ].props.className ? children.props.children[ 0 ].props.className : '';\n\t\tlet child = cloneElement( children.props.children[ 0 ], {className: classname + ' cld-overwrite'} );\n\t\tlet neChildren = cloneElement( children, {children: [ child, false ]} );\n\t\treturn cloneElement( element, {children: neChildren} );\n\t}\n\n\tif ( 'core/video' === blockType.name && attributes.overwrite_transformations ) {\n\t\tlet children = cloneElement( element.props.children[ 0 ], {className: ' cld-overwrite'} );\n\t\treturn cloneElement( element, {children} );\n\t}\n\n\treturn element;\n};\n\nwp.hooks.addFilter( 'blocks.getSaveElement', 'cloudinary/filterSave', cldfilterBlocksSave );\n","function _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? Object(arguments[i]) : {};\n var ownKeys = Object.keys(source);\n\n if (typeof Object.getOwnPropertySymbols === 'function') {\n ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n }));\n }\n\n ownKeys.forEach(function (key) {\n defineProperty(target, key, source[key]);\n });\n }\n\n return target;\n}\n\nmodule.exports = _objectSpread;","(function() { module.exports = this[\"wp\"][\"components\"]; }());","(function() { module.exports = this[\"wp\"][\"data\"]; }());","(function() { module.exports = this[\"wp\"][\"element\"]; }());","(function() { module.exports = this[\"wp\"][\"i18n\"]; }());"],"sourceRoot":""} \ No newline at end of file diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js index 16122372d..112fc2ac8 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js @@ -1 +1,182 @@ -!function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(n,s,function(t){return e[t]}.bind(null,s));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=3)}([function(e,t){window,jQuery,jQuery(document).ready((function(e){e(document).on("tabs.init",(function(){var t=e(".settings-tab-trigger"),i=e(".settings-tab-section");e(this).on("click",".settings-tab-trigger",(function(n){var s=e(this),a=e(s.attr("href"));n.preventDefault(),t.removeClass("active"),i.removeClass("active"),s.addClass("active"),a.addClass("active"),e(document).trigger("settings.tabbed",s)})),e(".cld-field").not('[data-condition="false"]').each((function(){const t=e(this),i=t.data("condition");for(let n in i){const s=i[n],a=e("#field-"+n),o=t.closest("tr");a.on("change init",(function(){this.value===s||this.checked?o.show():o.hide()})),a.trigger("init")}})),e("#field-cloudinary_url").on("input change",(function(){let t=e(this),i=t.val();new RegExp(/^(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g).test(i)?(t.addClass("settings-valid-field"),t.removeClass("settings-invalid-field")):(t.removeClass("settings-valid-field"),t.addClass("settings-invalid-field"))})).trigger("change")})),e(".render-trigger[data-event]").each((function(){var t=e(this),i=t.data("event");t.trigger(i,this)}))}))},function(e,t){if(wp.media&&window.CLDN){wp.media.events.on("editor:image-edit",(function(e){e.metadata.cldoverwrite=null,e.image.className.split(" ").indexOf("cld-overwrite")>=0&&(e.metadata.cldoverwrite="true")})),wp.media.events.on("editor:image-update",(function(e){let t=e.image.className.split(" ");e.metadata.cldoverwrite&&-1===t.indexOf("cld-overwrite")?t.push("cld-overwrite"):!e.metadata.cldoverwrite&&t.indexOf("cld-overwrite")>=0&&delete t[t.indexOf("cld-overwrite")],e.image.className=t.join(" ")}));let e=null,t=wp.media.string.props;wp.media.string.props=function(i,n){return i.cldoverwrite&&(i.classes=["cld-overwrite"],e=!0),t(i,n)},wp.media.post=function(t,i){if("send-attachment-to-editor"===t){let t=wp.media.editor.get().state().get("selection").get(i.attachment);t.attributes.transformations&&(i.attachment.transformations=t.attributes.transformations),(i.html.indexOf("cld-overwrite")>-1||!0===e)&&(i.attachment.cldoverwrite=!0,e=null)}return wp.ajax.post(t,i)};wp.media.controller.Library;let i=wp.media.view.MediaFrame.Select,n=wp.media.view.MediaFrame.Post,s=wp.media.view.MediaFrame.ImageDetails,a=wp.media.view.MediaFrame.VideoDetails,o=wp.media.View.extend({tagName:"div",className:"cloudinary-widget",template:wp.template("cloudinary-dam"),active:!1,toolbar:null,frame:null,ready:function(){let e=this.controller,t=this.model.get("selection"),i=this.model.get("library"),n=wp.media.model.Attachment;if(CLDN.mloptions.multiple=e.options.multiple,this.cid!==this.active){if(CLDN.mloptions.inline_container="#cloudinary-dam-"+e.cid,1===t.length){var s=n.get(t.models[0].id);void 0!==s.attributes.public_id&&(CLDN.mloptions.asset={resource_id:s.attributes.public_id})}else CLDN.mloptions.asset=null;window.ml=cloudinary.openMediaLibrary(CLDN.mloptions,{insertHandler:function(s){for(let a=0;a=100&&void 0!==e.started?(this.submitButton.style.display=this.hide,this.stopButton.style.display=this.show):e.pending>0?(this.submitButton.style.display=this.show,this.stopButton.style.display=this.hide):e.processing>0?this.stopButton.style.display=this.show:this.stopButton.style.display=this.hide,e.percent<100?(this.barSyncCount.innerText=e.total,this.progressCount.innerText=e.done,this.progress.style.display=this.show):(this.completed.style.display=this.show,this.progress.style.display=this.hide)},_start:function(e){e.preventDefault(),a.stopButton.style.display=a.show,a.submitButton.style.display=a.hide,a.pushAttachments()},_reset:function(e){a.submitButton.style.display=a.hide,a.getStatus()},_init:function(e){"undefined"!=typeof cloudinaryApi&&((document.attachEvent?"complete"===document.readyState:"loading"!==document.readyState)?e():document.addEventListener("DOMContentLoaded",e))}};var o=a;a._init((function(){a._reset(),a.submitButton.addEventListener("click",a._start),a.stopButton.addEventListener("click",a.stopSync)}));var r=i(1),l=i.n(r);const d={sample:{image:document.getElementById("transformation-sample-image"),video:document.getElementById("transformation-sample-video")},preview:{image:document.getElementById("sample-image"),video:document.getElementById("sample-video")},fields:document.getElementsByClassName("cld-field"),button:{image:document.getElementById("refresh-image-preview"),video:document.getElementById("refresh-video-preview")},spinner:{image:document.getElementById("image-loader"),video:document.getElementById("video-loader")},activeItem:null,elements:{image:[],video:[]},_placeItem:function(e){null!==e&&(e.style.display="block",e.style.visibility="visible",e.style.position="absolute",e.style.top=e.parentElement.clientHeight/2-e.clientHeight/2+"px",e.style.left=e.parentElement.clientWidth/2-e.clientWidth/2+"px")},_setLoading:function(e){this.button[e].style.display="block",this._placeItem(this.button[e]),this.preview[e].style.opacity="0.1"},_build:function(e){this.sample[e].innerHTML="",this.elements[e]=[];for(let t of this.fields){if(e!==t.dataset.context)continue;let i=t.value.trim();if(i.length){if("select-one"===t.type){if("none"===i)continue;i=t.dataset.meta+"_"+i}else{let e=t.dataset.context;i=this._transformations(i,e,!0)}i&&this.elements[e].push(i)}}let t="";this.elements[e].length&&(t="/"+this.elements[e].join(",").replace(/ /g,"%20")),this.sample[e].textContent=t,this.sample[e].parentElement.href="https://res.cloudinary.com/demo/"+this.sample[e].parentElement.innerText.trim().replace("../","").replace(/ /g,"%20")},_clearLoading:function(e){this.spinner[e].style.visibility="hidden",this.activeItem=null,this.preview[e].style.opacity=1},_refresh:function(e,t){e&&e.preventDefault();let i=this,n=CLD_GLOBAL_TRANSFORMATIONS[t].preview_url+i.elements[t].join(",")+CLD_GLOBAL_TRANSFORMATIONS[t].file;if(this.button[t].style.display="none",this._placeItem(this.spinner[t]),"image"===t){let e=new Image;e.onload=function(){i.preview[t].src=this.src,i._clearLoading(t),e.remove()},e.onerror=function(){alert(CLD_GLOBAL_TRANSFORMATIONS[t].error),i._clearLoading(t)},e.src=n}else{let e=i._transformations(i.elements[t].join(","),t);samplePlayer.source({publicId:"dog",transformation:e}),i._clearLoading(t)}},_transformations:function(e,t,i=!1){let n=CLD_GLOBAL_TRANSFORMATIONS[t].valid_types,s=null,a=e.split("/"),o=[];for(let e=0;e"),n=jQuery(""),s=jQuery("");return i.addClass("cld-tax-order-list-item").attr("data-item",e),n.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(e),s.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),i.append(s).append(t).append(n),i},_pushItem:function(e,t){let i=this._createItem(e,t);this.tags.append(i)},_sortable:function(){jQuery(".cld-tax-order-list").sortable({connectWith:".cld-tax-order",axis:"y",handle:".cld-tax-order-list-item-handle",placeholder:"cld-tax-order-list-item-placeholder",forcePlaceholderSize:!0,helper:"clone"})}};var p=u;if(void 0!==window.CLDN&&u._init(),wp.data&&wp.data.select("core/editor")){let e={};wp.data.subscribe((function(){let t=wp.data.select("core").getTaxonomies();if(t)for(let i in t){let n=wp.data.select("core/editor").getEditedPostAttribute(t[i].rest_base);e[t[i].slug]=n}}));let t=wp.element.createElement,i=function(i){class n extends i{makeItem(e){let t=this.makeElement(e);jQuery("#cld-tax-items").append(t)}findOrCreateTerm(e){let t=this;return(e=super.findOrCreateTerm(e)).then(e=>t.makeItem(e)),e}onChange(t){super.onChange(t);let i=this.pickItem(t);if(i)if(e[this.props.slug].indexOf(i.id)>=0)this.makeItem(i);else{let e=jQuery('[data-item="'+i.id+'"]');e.length&&e.remove()}}pickItem(e){if("object"==typeof e){if(e.target)for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===parseInt(e.target.value))return this.state.availableTerms[t]}else if("number"==typeof e){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===e)return this.state.availableTerms[t]}else{let t;if(e.length>this.state.selectedTerms.length)for(let i in e)-1===this.state.selectedTerms.indexOf(e[i])&&(t=e[i]);else for(let i in this.state.selectedTerms)-1===e.indexOf(this.state.selectedTerms[i])&&(t=this.state.selectedTerms[i]);for(let e in this.state.availableTerms)if(this.state.availableTerms[e].name===t)return this.state.availableTerms[e]}}makeElement(e){let t=jQuery("
  • "),i=jQuery(""),n=jQuery("");return t.addClass("cld-tax-order-list-item").attr("data-item",e.id),i.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(e.id),n.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),t.append(n).append(e.name).append(i),t}}return function(e){return t(n,e)}};wp.hooks.addFilter("editor.PostTaxonomyType","cld",i)}const m={wpWrap:document.getElementById("wpwrap"),wpContent:document.getElementById("wpbody-content"),libraryWrap:document.getElementById("cloudinary-embed"),_init:function(){let e=this;"undefined"!=typeof CLD_ML&&(cloudinary.openMediaLibrary(CLD_ML.mloptions,{insertHandler:function(e){alert("Import is not yet implemented.")}}),window.addEventListener("resize",(function(t){e._resize()})),e._resize())},_resize:function(){let e=getComputedStyle(this.wpContent);this.libraryWrap.style.height=this.wpWrap.offsetHeight-parseInt(e.getPropertyValue("padding-bottom"))+"px"}};var h=m;m._init();i(2);i.d(t,"cloudinary",(function(){return f}));window.$=window.jQuery;const f={settings:s.a,sync:o,widget:l.a,Global_Transformations:c,Terms_Order:p,Media_Library:h}}]); \ No newline at end of file +/******/ (function(modules) { // webpackBootstrap +/******/ // The module cache +/******/ var installedModules = {}; +/******/ +/******/ // The require function +/******/ function __webpack_require__(moduleId) { +/******/ +/******/ // Check if module is in cache +/******/ if(installedModules[moduleId]) { +/******/ return installedModules[moduleId].exports; +/******/ } +/******/ // Create a new module (and put it into the cache) +/******/ var module = installedModules[moduleId] = { +/******/ i: moduleId, +/******/ l: false, +/******/ exports: {} +/******/ }; +/******/ +/******/ // Execute the module function +/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); +/******/ +/******/ // Flag the module as loaded +/******/ module.l = true; +/******/ +/******/ // Return the exports of the module +/******/ return module.exports; +/******/ } +/******/ +/******/ +/******/ // expose the modules object (__webpack_modules__) +/******/ __webpack_require__.m = modules; +/******/ +/******/ // expose the module cache +/******/ __webpack_require__.c = installedModules; +/******/ +/******/ // define getter function for harmony exports +/******/ __webpack_require__.d = function(exports, name, getter) { +/******/ if(!__webpack_require__.o(exports, name)) { +/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); +/******/ } +/******/ }; +/******/ +/******/ // define __esModule on exports +/******/ __webpack_require__.r = function(exports) { +/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { +/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); +/******/ } +/******/ Object.defineProperty(exports, '__esModule', { value: true }); +/******/ }; +/******/ +/******/ // create a fake namespace object +/******/ // mode & 1: value is a module id, require it +/******/ // mode & 2: merge all properties of value into the ns +/******/ // mode & 4: return value when already ns object +/******/ // mode & 8|1: behave like require +/******/ __webpack_require__.t = function(value, mode) { +/******/ if(mode & 1) value = __webpack_require__(value); +/******/ if(mode & 8) return value; +/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; +/******/ var ns = Object.create(null); +/******/ __webpack_require__.r(ns); +/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); +/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); +/******/ return ns; +/******/ }; +/******/ +/******/ // getDefaultExport function for compatibility with non-harmony modules +/******/ __webpack_require__.n = function(module) { +/******/ var getter = module && module.__esModule ? +/******/ function getDefault() { return module['default']; } : +/******/ function getModuleExports() { return module; }; +/******/ __webpack_require__.d(getter, 'a', getter); +/******/ return getter; +/******/ }; +/******/ +/******/ // Object.prototype.hasOwnProperty.call +/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; +/******/ +/******/ // __webpack_public_path__ +/******/ __webpack_require__.p = ""; +/******/ +/******/ +/******/ // Load entry module and return exports +/******/ return __webpack_require__(__webpack_require__.s = "./js/src/main.js"); +/******/ }) +/************************************************************************/ +/******/ ({ + +/***/ "./css/src/main.scss": +/*!***************************!*\ + !*** ./css/src/main.scss ***! + \***************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +eval("// extracted by mini-css-extract-plugin\n\n//# sourceURL=webpack:///./css/src/main.scss?"); + +/***/ }), + +/***/ "./js/src/components/global-transformations.js": +/*!*****************************************************!*\ + !*** ./js/src/components/global-transformations.js ***! + \*****************************************************/ +/*! exports provided: default */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\nconst Global_Transformations = {\n\tsample: {\n\t\timage: document.getElementById( 'transformation-sample-image' ),\n\t\tvideo: document.getElementById( 'transformation-sample-video' ),\n\t},\n\tpreview: {\n\t\timage: document.getElementById( 'sample-image' ),\n\t\tvideo: document.getElementById( 'sample-video' ),\n\t},\n\tfields: document.getElementsByClassName( 'cld-field' ),\n\tbutton: {\n\t\timage: document.getElementById( 'refresh-image-preview' ),\n\t\tvideo: document.getElementById( 'refresh-video-preview' ),\n\t},\n\tspinner: {\n\t\timage : document.getElementById( 'image-loader' ),\n\t\tvideo : document.getElementById( 'video-loader' ),\n\t},\n\tactiveItem: null,\n\telements: {\n\t\timage: [],\n\t\tvideo: [],\n\t},\n\t_placeItem: function( item ) {\n\t\tif ( null !== item ) {\n\t\t\titem.style.display = 'block';\n\t\t\titem.style.visibility = 'visible';\n\t\t\titem.style.position = 'absolute';\n\t\t\titem.style.top = (item.parentElement.clientHeight / 2) - (item.clientHeight / 2) + 'px';\n\t\t\titem.style.left = (item.parentElement.clientWidth / 2) - (item.clientWidth / 2) + 'px';\n\t\t}\n\t},\n\t_setLoading: function( type ) {\n\t\tthis.button[ type ].style.display = 'block';\n\t\tthis._placeItem( this.button[ type ] );\n\t\tthis.preview[ type ].style.opacity = '0.1';\n\n\t\t},\n\t_build: function( type ) {\n\t\tthis.sample[ type ].innerHTML = '';\n\t\tthis.elements[ type ] = [];\n\t\tfor (let item of this.fields) {\n\t\t\tif( type !== item.dataset.context ){\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\tlet value = item.value.trim();\n\t\t\tif ( value.length ) {\n\n\t\t\t\tif ( 'select-one' === item.type ) {\n\t\t\t\t\tif ( 'none' === value ) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tvalue = item.dataset.meta + '_' + value;\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet type = item.dataset.context;\n\t\t\t\t\tvalue = this._transformations( value, type, true );\n\t\t\t\t}\n\t\t\t\t// Apply value if valid.\n\t\t\t\tif( value ) {\n\t\t\t\t\tthis.elements[ type ].push( value );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tlet transformations = '';\n\t\tif ( this.elements[ type ].length ) {\n\t\t\ttransformations = '/' + this.elements[ type ].join( ',' ).replace( / /g, '%20' );\n\t\t}\n\t\tthis.sample[ type ].textContent = transformations;\n\t\tthis.sample[ type ].parentElement.href = 'https://res.cloudinary.com/demo/' + this.sample[ type ].parentElement.innerText.trim().replace('../', '').replace( / /g, '%20' );\n\t},\n\t_clearLoading: function( type ) {\n\t\tthis.spinner[ type ].style.visibility = 'hidden';\n\t\tthis.activeItem = null;\n\t\tthis.preview[ type ].style.opacity = 1;\n\t},\n\t_refresh: function( e, type ) {\n\t\tif( e ) {\n\t\t\te.preventDefault();\n\t\t}\n\t\tlet self = this;\n\t\tlet new_src = CLD_GLOBAL_TRANSFORMATIONS[ type ].preview_url + self.elements[ type ].join( ',' ) + CLD_GLOBAL_TRANSFORMATIONS[ type ].file;\n\t\tthis.button[ type ].style.display = 'none';\n\t\tthis._placeItem( this.spinner[ type ] );\n\t\tif ( type === 'image' ) {\n\t\t\tlet newImg = new Image;\n\t\t\tnewImg.onload = function() {\n\t\t\t\tself.preview[ type ].src = this.src;\n\t\t\t\tself._clearLoading( type );\n\t\t\t\tnewImg.remove();\n\t\t\t};\n\t\t\tnewImg.onerror = function() {\n\t\t\t\talert( CLD_GLOBAL_TRANSFORMATIONS[type].error );\n\t\t\t\tself._clearLoading( type );\n\t\t\t};\n\t\t\tnewImg.src = new_src;\n\t\t}else{\n\t\t\tlet transformations = self._transformations( self.elements[ type ].join( ',' ), type );\n\t\t\tsamplePlayer.source( { publicId: 'dog', transformation: transformations } );\n\t\t\tself._clearLoading( type );\n\t\t}\n\t},\n\t_transformations : function( input, type, string = false ){\n\t\tlet set = CLD_GLOBAL_TRANSFORMATIONS[ type ].valid_types;\n\t\tlet value = null;\n\t\tlet elements = input.split( '/' );\n\t\tlet valid_elements = [];\n\t\tfor (let i = 0; i < elements.length; i++) {\n\t\t\tlet parts = elements[ i ].split(',');\n\t\t\tlet valid_parts;\n\t\t\tif( true === string ) {\n\t\t\t\tvalid_parts = [];\n\t\t\t}else{\n\t\t\t\tvalid_parts = {};\n\t\t\t}\n\t\t\tfor (let p = 0; p < parts.length; p++) {\n\t\t\t\tlet key_val = parts[ p ].trim().split('_');\n\t\t\t\tif( key_val.length <= 1 || typeof set[ key_val[0] ] === 'undefined' ){\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tlet option = key_val.shift();\n\t\t\t\tlet instruct = key_val.join( '_' );\n\t\t\t\tif( true === string ) {\n\t\t\t\t\tif( 'f' === option || 'q' === option ){\n\t\t\t\t\t\tfor( let t in this.elements[ type ] ){\n\t\t\t\t\t\t\tif( option + '_' === this.elements[ type ][ t ].substr(0,2 ) ){\n\t\t\t\t\t\t\t\tthis.elements[ type ].splice(t,1);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tvalid_parts.push( parts[ p ] );\n\t\t\t\t}else{\n\t\t\t\t\tvalid_parts[ set[ option ] ] = instruct.trim();\n\t\t\t\t}\n\t\t\t}\n\t\t\tlet length = 0;\n\t\t\tif( true === string ) {\n\t\t\t\tlength = valid_parts.length;\n\t\t\t}else{\n\t\t\t\tlength = Object.keys( valid_parts ).length;\n\t\t\t}\n\t\t\tif ( length ) {\n\t\t\t\tif( true === string ) {\n\t\t\t\t\tvalid_parts = valid_parts.join( ',' );\n\t\t\t\t}\n\t\t\t\tvalid_elements.push( valid_parts );\n\t\t\t}\n\t\t}\n\n\t\tif ( valid_elements.length ) {\n\t\t\tif( true === string ) {\n\t\t\t\tvalue = valid_elements.join( '/' ).trim();\n\t\t\t}else{\n\t\t\t\tvalue = valid_elements;\n\t\t\t}\n\t\t}\n\n\t\treturn value;\n\t},\n\t_reset: function() {\n\t\tfor (let item of this.fields) {\n\t\t\titem.value = null;\n\t\t}\n\t\tfor( let type in this.button ) {\n\t\t\tthis._build( type );\n\t\t\tthis._refresh( null, type );\n\t\t}\n\t},\n\t_input: function( input ){\n\t\tif( typeof input.dataset.context !== 'undefined' && input.dataset.context.length ) {\n\t\t\tlet type = input.dataset.context;\n\t\t\tthis._setLoading( type );\n\t\t\tthis._build( type );\n\t\t}\n\t},\n\t_init: function() {\n\n\t\tif ( typeof CLD_GLOBAL_TRANSFORMATIONS !== 'undefined' ) {\n\t\t\tlet self = this;\n\n\t\t\tdocument.addEventListener( 'DOMContentLoaded', function( ev ) {\n\t\t\t\tfor( let type in self.button ) {\n\t\t\t\t\tif( self.button[ type ] ) {\n\t\t\t\t\t\tself.button[ type ].addEventListener( 'click', function( e ) {\n\t\t\t\t\t\t\tself._refresh( e, type );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tfor (let item of self.fields) {\n\t\t\t\t\titem.addEventListener( 'input', function(){\n\t\t\t\t\t\tself._input( this );\n\t\t\t\t\t} );\n\t\t\t\t\titem.addEventListener( 'change', function() {\n\t\t\t\t\t\tself._input( this );\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t\t// Init.\n\t\t\t\tfor( let type in CLD_GLOBAL_TRANSFORMATIONS ) {\n\t\t\t\t\tself._build( type );\n\t\t\t\t\tself._refresh( null, type );\n\t\t\t\t}\n\t\t\t} );\n\t\t\t// listen to AJAX add-tag complete\n\t\t\tjQuery(document).ajaxComplete(function(event, xhr, settings) {\n\n\t\t\t\t// bail early if is other ajax call\n\t\t\t\tif( settings.data.indexOf('action=add-tag') === -1 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// bail early if response contains error\n\t\t\t\tif( xhr.responseText.indexOf('wp_error') !== -1 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tself._reset();\n\t\t\t});\n\t\t}\n\t},\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Global_Transformations);\n\n// Init.\nGlobal_Transformations._init();\n\n\n//# sourceURL=webpack:///./js/src/components/global-transformations.js?"); + +/***/ }), + +/***/ "./js/src/components/media-library.js": +/*!********************************************!*\ + !*** ./js/src/components/media-library.js ***! + \********************************************/ +/*! exports provided: default */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\nconst Media_Library = {\n\twpWrap: document.getElementById( 'wpwrap' ),\n\twpContent: document.getElementById( 'wpbody-content' ),\n\tlibraryWrap: document.getElementById( 'cloudinary-embed' ),\n\t_init: function() {\n\t\tlet self = this;\n\t\tif ( typeof CLD_ML !== 'undefined' ) {\n\n\t\t\tcloudinary.openMediaLibrary( CLD_ML.mloptions, {\n\t\t\t\t\tinsertHandler: function( data ) {\n\t\t\t\t\t\t// @todo: Determin what to do here.\n\t\t\t\t\t\talert( 'Import is not yet implemented.' );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t);\n\n\t\t\twindow.addEventListener( 'resize', function( ev ) {\n\t\t\t\tself._resize();\n\t\t\t} );\n\n\t\t\tself._resize();\n\t\t}\n\t},\n\t_resize: function() {\n\t\tlet style = getComputedStyle( this.wpContent );\n\t\tthis.libraryWrap.style.height = (this.wpWrap.offsetHeight - parseInt( style.getPropertyValue( 'padding-bottom' ) )) + 'px';\n\t},\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Media_Library);\n\n// Init.\nMedia_Library._init();\n\n\n//# sourceURL=webpack:///./js/src/components/media-library.js?"); + +/***/ }), + +/***/ "./js/src/components/settings-page.js": +/*!********************************************!*\ + !*** ./js/src/components/settings-page.js ***! + \********************************************/ +/*! no static exports found */ +/***/ (function(module, exports) { + +eval("(function() {\n\n\tjQuery( document ).ready( function( $ ) {\n\n\t\t// Initilize instance events\n\t\t$( document ).on( 'tabs.init', function() {\n\n\t\t\tvar tabs = $( '.settings-tab-trigger' ),\n\t\t\t sections = $( '.settings-tab-section' );\n\n\t\t\t// Create instance bindings\n\t\t\t$( this ).on( 'click', '.settings-tab-trigger', function( e ) {\n\t\t\t\tvar clicked = $( this ),\n\t\t\t\t target = $( clicked.attr( 'href' ) );\n\n\t\t\t\t// Trigger an instance action.\n\t\t\t\te.preventDefault();\n\n\t\t\t\ttabs.removeClass( 'active' );\n\t\t\t\tsections.removeClass( 'active' );\n\n\t\t\t\tclicked.addClass( 'active' );\n\t\t\t\ttarget.addClass( 'active' );\n\n\t\t\t\t// Trigger the tabbed event.\n\t\t\t\t$( document ).trigger( 'settings.tabbed', clicked );\n\n\t\t\t} );\n\n\t\t\t// Bind conditions.\n\t\t\t$( '.cld-field' ).not( '[data-condition=\"false\"]' ).each( function() {\n\t\t\t\tconst field = $(this);\n\t\t\t\tconst condition = field.data('condition');\n\t\t\t\tfor (let f in condition) {\n\t\t\t\t\tconst value = condition[ f ];\n\t\t\t\t\tconst target = $( '#field-' + f );\n\t\t\t\t\tconst wrapper = field.closest('tr');\n\t\t\t\t\ttarget.on('change init', function(){\n\t\t\t\t\t\tif( this.value === value || this.checked ){\n\t\t\t\t\t\t\twrapper.show();\n\t\t\t\t\t\t}else{\n\t\t\t\t\t\t\twrapper.hide();\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\ttarget.trigger('init');\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\t$('#field-cloudinary_url').on('input change', function(){\n\t\t\t\tlet field = $(this),\n\t\t\t\t\tvalue = field.val();\n\n\t\t\t\tlet reg = new RegExp(/^(cloudinary:\\/\\/){1}(\\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g );\n\t\t\t\tif( reg.test( value ) ){\n\t\t\t\t\tfield.addClass( 'settings-valid-field' );\n\t\t\t\t\tfield.removeClass( 'settings-invalid-field' );\n\t\t\t\t}else{\n\t\t\t\t\tfield.removeClass( 'settings-valid-field' );\n\t\t\t\t\tfield.addClass( 'settings-invalid-field' );\n\t\t\t\t}\n\t\t\t}).trigger('change' );\n\n\n\t\t} );\n\n\t\t// On Ready, find all render trigger elements and fire their events.\n\t\t$( '.render-trigger[data-event]' ).each( function() {\n\t\t\tvar trigger = $( this ),\n\t\t\t event = trigger.data( 'event' );\n\t\t\ttrigger.trigger( event, this );\n\t\t} );\n\t} );\n\n})( window, jQuery );\n\n\n//# sourceURL=webpack:///./js/src/components/settings-page.js?"); + +/***/ }), + +/***/ "./js/src/components/sync.js": +/*!***********************************!*\ + !*** ./js/src/components/sync.js ***! + \***********************************/ +/*! exports provided: default */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\nconst Sync = {\n\tprogress: document.getElementById( 'progress-wrapper' ),\n\tsubmitButton: document.getElementById( 'submit' ),\n\tstopButton: document.getElementById( 'stop-sync' ),\n\tprogressCount: document.getElementById( 'sync-progress' ),\n\tbarSyncCount: document.getElementById( 'sync-total' ),\n\tcompleted: document.getElementById( 'completed-notice' ),\n\tshow: 'inline-block',\n\thide: 'none',\n\tgetStatus: function getStatus() {\n\t\tvar self = this,\n\t\t\tresourceType = [],\n\t\t\turl = cloudinaryApi.restUrl + 'cloudinary/v1/attachments',\n\t\t\tparams;\n\n\t\twp.ajax.send( {\n\t\t\turl: url,\n\t\t\ttype: 'GET',\n\t\t\tbeforeSend: function( request ) {\n\t\t\t\trequest.setRequestHeader( 'X-WP-Nonce', cloudinaryApi.nonce );\n\t\t\t},\n\t\t} ).done( function( data ) {\n\t\t\tif ( data.done < data.total ) {\n\t\t\t\tsetTimeout( Sync.getStatus, 2000 );\n\t\t\t}\n\t\t\tSync._updateUI( data );\n\t\t} );\n\t},\n\tstopSync: function stopSync() {\n\t\tvar self = this,\n\t\t\turl = cloudinaryApi.restUrl + 'cloudinary/v1/sync';\n\n\t\twp.ajax.send( {\n\t\t\turl: url,\n\t\t\tdata: {\n\t\t\t\tstop: true,\n\t\t\t},\n\t\t\tbeforeSend: function( request ) {\n\t\t\t\trequest.setRequestHeader( 'X-WP-Nonce', cloudinaryApi.nonce );\n\t\t\t},\n\t\t} ).done( function( data ) {\n\t\t\tSync._updateUI( data );\n\t\t} );\n\t},\n\tpushAttachments: function pushAttachments() {\n\t\tvar self = this,\n\t\t\turl = cloudinaryApi.restUrl + 'cloudinary/v1/sync';\n\n\t\twp.ajax.send( {\n\t\t\turl: url,\n\t\t\tbeforeSend: function( request ) {\n\t\t\t\trequest.setRequestHeader( 'X-WP-Nonce', cloudinaryApi.nonce );\n\t\t\t},\n\t\t} );\n\t},\n\t_updateUI: function _updateUI( data ) {\n\t\tif ( data.percent < 100 && typeof data.started !== 'undefined' ) {\n\t\t\tthis.submitButton.style.display = this.hide;\n\t\t\tthis.stopButton.style.display = this.show;\n\t\t}\n\t\telse if ( data.percent >= 100 && typeof data.started !== 'undefined' ) {\n\t\t\tthis.submitButton.style.display = this.hide;\n\t\t\tthis.stopButton.style.display = this.show;\n\t\t}\n\t\telse if ( data.pending > 0 ) {\n\t\t\tthis.submitButton.style.display = this.show;\n\t\t\tthis.stopButton.style.display = this.hide;\n\t\t}\n\t\telse if ( data.processing > 0 ) {\n\t\t\tthis.stopButton.style.display = this.show;\n\t\t}\n\t\telse {\n\t\t\tthis.stopButton.style.display = this.hide;\n\t\t}\n\n\t\tif ( data.percent < 100 ) {\n\t\t\tthis.barSyncCount.innerText = data.total;\n\t\t\tthis.progressCount.innerText = data.done;\n\t\t\tthis.progress.style.display = this.show;\n\t\t}\n\t\telse {\n\t\t\tthis.completed.style.display = this.show;\n\t\t\tthis.progress.style.display = this.hide;\n\t\t}\n\t},\n\t_start: function _start( e ) {\n\t\te.preventDefault();\n\t\tSync.stopButton.style.display = Sync.show;\n\t\tSync.submitButton.style.display = Sync.hide;\n\t\tSync.pushAttachments();\n\t},\n\t_reset: function _reset( e ) {\n\t\tSync.submitButton.style.display = Sync.hide;\n\t\tSync.getStatus();\n\t},\n\t_init: function( fn ) {\n\n\t\tif ( typeof cloudinaryApi !== 'undefined' ) {\n\t\t\tif ( document.attachEvent ? document.readyState === 'complete' : document.readyState !== 'loading' ) {\n\t\t\t\tfn();\n\t\t\t}\n\t\t\telse {\n\t\t\t\tdocument.addEventListener( 'DOMContentLoaded', fn );\n\t\t\t}\n\t\t}\n\t},\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Sync);\n\n// Init.\nSync._init( function() {\n\tSync._reset();\n\tSync.submitButton.addEventListener( 'click', Sync._start );\n\tSync.stopButton.addEventListener( 'click', Sync.stopSync );\n} );\n\n\n//# sourceURL=webpack:///./js/src/components/sync.js?"); + +/***/ }), + +/***/ "./js/src/components/terms_order.js": +/*!******************************************!*\ + !*** ./js/src/components/terms_order.js ***! + \******************************************/ +/*! exports provided: default */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet order_set = {};\n\twp.data.subscribe( function() {\n\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torder_set[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\n\t} );\n\n\tlet el = wp.element.createElement;\n\n\tlet CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass customHandler extends OriginalComponent {\n\n\t\t\tmakeItem( item ) {\n\t\t\t\tlet row = this.makeElement( item );\n\t\t\t\tlet box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\tlet self = this;\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => self.makeItem( item ) );\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tlet item = this.pickItem( event );\n\t\t\t\tconsole.log(item)\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tlet element = jQuery( '[data-item=\"' + item.id + '\"]' );\n\t\t\t\t\t\tif ( element.length ) {\n\t\t\t\t\t\t\telement.remove();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t}\n\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', item.id );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn function( props ) {\n\n\t\t\treturn el(\n\t\t\t\tcustomHandler,\n\t\t\t\tprops\n\t\t\t);\n\t\t};\n\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); + +/***/ }), + +/***/ "./js/src/components/widget.js": +/*!*************************************!*\ + !*** ./js/src/components/widget.js ***! + \*************************************/ +/*! no static exports found */ +/***/ (function(module, exports) { + +eval("/* global window wp Backbone */\nif ( wp.media && window.CLDN ) {\n\n\twp.media.events.on( 'editor:image-edit', function( props ){\n\t\tprops.metadata.cldoverwrite = null;\n\t\tlet classes = props.image.className.split( ' ' );\n\t\tif( classes.indexOf('cld-overwrite' ) >= 0 ){\n\t\t\tprops.metadata.cldoverwrite = 'true';\n\t\t}\n\t} );\n\twp.media.events.on( 'editor:image-update', function( props ){\n\t\tlet classes = props.image.className.split( ' ' );\n\t\tif( props.metadata.cldoverwrite && classes.indexOf('cld-overwrite' ) === -1 ) {\n\t\t\tclasses.push( 'cld-overwrite' );\n\t\t} else if( ! props.metadata.cldoverwrite && classes.indexOf('cld-overwrite' ) >= 0 ) {\n\t\t\tdelete classes[ classes.indexOf('cld-overwrite' ) ];\n\t\t}\n\n\t\tprops.image.className = classes.join( ' ' );\n\t} );\n\n\t// Intercept props and inject cld-overwrite class.\n\tlet currentOverwrite = null;\n\tlet imageProps = wp.media.string.props;\n\twp.media.string.props = function( props, asset ){\n\t\tif( props.cldoverwrite ){\n\t\t\tprops.classes = [ 'cld-overwrite' ];\n\t\t\tcurrentOverwrite = true;\n\t\t}\n\t\tlet newProps = imageProps( props, asset );\n\t\treturn newProps;\n\t}\n\t// Intercept ajax post, and send the cld-overwrite flag, and transformations.\n\twp.media.post = function( action, data ) {\n\n\t\tif ( 'send-attachment-to-editor' === action ) {\n\t\t\tlet state = wp.media.editor.get().state();\n\t\t\tlet attach = state.get( 'selection' ).get( data.attachment );\n\t\t\tif ( attach.attributes.transformations ) {\n\t\t\t\tdata.attachment.transformations = attach.attributes.transformations;\n\t\t\t}\n\t\t\tif( data.html.indexOf('cld-overwrite') > -1 || true === currentOverwrite ){\n\t\t\t\tdata.attachment.cldoverwrite = true;\n\t\t\t\tcurrentOverwrite = null;\n\t\t\t}\n\n\t\t}\n\t\t// Return the original.\n\t\treturn wp.ajax.post( action, data );\n\t};\n\n\tlet Library = wp.media.controller.Library;\n\tlet MediaFrame = wp.media.view.MediaFrame.Select;\n\tlet MediaFramePost = wp.media.view.MediaFrame.Post;\n\tlet MediaFrameImageDetails = wp.media.view.MediaFrame.ImageDetails;\n\tlet MediaFrameVideoDetails = wp.media.view.MediaFrame.VideoDetails;\n\tlet Cloudinary = wp.media.View.extend( {\n\t\ttagName: 'div',\n\t\tclassName: 'cloudinary-widget',\n\t\ttemplate: wp.template( 'cloudinary-dam' ),\n\t\tactive: false,\n\t\ttoolbar: null,\n\t\tframe: null,\n\t\tready: function() {\n\t\t\tlet controller = this.controller;\n\t\t\tlet selection = this.model.get( 'selection' );\n\t\t\tlet library = this.model.get( 'library' );\n\t\t\tlet attachment = wp.media.model.Attachment;\n\t\t\t// Set widget to same as model.\n\t\t\tCLDN.mloptions.multiple = controller.options.multiple;\n\t\t\tif ( this.cid !== this.active ) {\n\t\t\t\tCLDN.mloptions.inline_container = '#cloudinary-dam-' + controller.cid;\n\t\t\t\tif ( 1 === selection.length ) {\n\t\t\t\t\tvar att = attachment.get( selection.models[ 0 ].id );\n\t\t\t\t\tif ( typeof att.attributes.public_id !== 'undefined' ) {\n\t\t\t\t\t\tCLDN.mloptions.asset = {resource_id: att.attributes.public_id };\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tCLDN.mloptions.asset = null;\n\t\t\t\t}\n\t\t\t\twindow.ml = cloudinary.openMediaLibrary( CLDN.mloptions, {\n\t\t\t\t\t\tinsertHandler: function( data ) {\n\t\t\t\t\t\t\tfor (let i = 0; i < data.assets.length; i++) {\n\t\t\t\t\t\t\t\tlet temp = data.assets[ i ];\n\t\t\t\t\t\t\t\twp.media.post( 'cloudinary-down-sync', {\n\t\t\t\t\t\t\t\t\tnonce: CLDN.nonce,\n\t\t\t\t\t\t\t\t\tasset: temp,\n\t\t\t\t\t\t\t\t} ).done( function( asset ) {\n\t\t\t\t\t\t\t\t\tlet update_asset = function( asset, attach ){\n\t\t\t\t\t\t\t\t\t\tasset.uploading = false;\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.remove( attach );\n\t\t\t\t\t\t\t\t\t\tif ( wp.Uploader.queue.length === 0 ) {\n\t\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.reset();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( typeof asset.fetch !== 'undefined' ) {\n\n\t\t\t\t\t\t\t\t\t\tlet attach = attachment.get( asset.attachment_id );\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\tlibrary.add( attach );\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.add( attach );\n\t\t\t\t\t\t\t\t\t\twp.ajax.send( {\n\t\t\t\t\t\t\t\t\t\t\turl: asset.fetch,\n\t\t\t\t\t\t\t\t\t\t\tbeforeSend: function( request ) {\n\t\t\t\t\t\t\t\t\t\t\t\trequest.setRequestHeader( 'X-WP-Nonce', CLDN.nonce );\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\t\tsrc: asset.url,\n\t\t\t\t\t\t\t\t\t\t\t\tfilename: asset.filename,\n\t\t\t\t\t\t\t\t\t\t\t\tattachment_id: asset.attachment_id,\n\t\t\t\t\t\t\t\t\t\t\t\ttransformations: asset.transformations\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} ).done( function( asset ) {\n\t\t\t\t\t\t\t\t\t\t\tlet attach = attachment.get( asset.id );\n\t\t\t\t\t\t\t\t\t\t\tupdate_asset( asset, attach );\n\t\t\t\t\t\t\t\t\t\t} ).fail( function( data ) {\n\t\t\t\t\t\t\t\t\t\t\tupdate_asset( asset, attach );\n\t\t\t\t\t\t\t\t\t\t\tlibrary.remove( attach );\n\t\t\t\t\t\t\t\t\t\t\tselection.remove( attach );\n\n\t\t\t\t\t\t\t\t\t\t\tif( typeof data === 'string' ) {\n\t\t\t\t\t\t\t\t\t\t\t\talert( data );\n\t\t\t\t\t\t\t\t\t\t\t}else{\n\t\t\t\t\t\t\t\t\t\t\t\tif( data.status === 500 ){\n\t\t\t\t\t\t\t\t\t\t\t\t\talert('HTTP error.');\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\telse {\n\n\t\t\t\t\t\t\t\t\t\tlet attach = attachment.get( asset.id );\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\tselection.add( attach );\n\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( wp.Uploader.queue.length === 0 ) {\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.reset();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tcontroller.content.mode( 'browse' );\n\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t\tdocument.querySelectorAll( '.dam-cloudinary' )[ 0 ]\n\t\t\t\t);\n\t\t\t}\n\t\t\tthis.active = this.cid;\n\t\t\treturn this;\n\t\t},\n\t} );\n\tlet extend_type = function( type ) {\n\t\tlet obj = {\n\n\t\t\t/**\n\t\t\t * Bind region mode event callbacks.\n\t\t\t *\n\t\t\t * @see media.controller.Region.render\n\t\t\t */\n\t\t\tbindHandlers: function() {\n\t\t\t\ttype.prototype.bindHandlers.apply( this, arguments );\n\t\t\t\tthis.on( 'content:render:cloudinary', this.cloudinaryContent, this );\n\n\t\t\t},\n\n\t\t\t/**\n\t\t\t * Render callback for the router region in the `browse` mode.\n\t\t\t *\n\t\t\t * @param {wp.media.view.Router} routerView\n\t\t\t */\n\t\t\tbrowseRouter: function( routerView ) {\n\n\t\t\t\ttype.prototype.browseRouter.apply( this, arguments );\n\t\t\t\tlet state_id = this.state().get( 'id' );\n\t\t\t\trouterView.set( {\n\t\t\t\t\tcloudinary: {\n\t\t\t\t\t\ttext: 'Cloudinary',\n\t\t\t\t\t\tpriority: 60\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t/**\n\t\t\t * Render callback for the content region in the `upload` mode.\n\t\t\t */\n\t\t\tcloudinaryContent: function( contentRegion ) {\n\t\t\t\tlet state = this.state();\n\t\t\t\tlet view = new Cloudinary( {\n\t\t\t\t\tcontroller: this,\n\t\t\t\t\tmodel: state,\n\t\t\t\t} ).render();\n\t\t\t\tthis.content.set( view );\n\t\t\t},\n\t\t};\n\n\t\treturn obj;\n\t};\n\t// Extending the current media library frames to add a new tab to each area.\n\twp.media.view.MediaFrame.Select = MediaFrame.extend( extend_type( MediaFrame ) );\n\twp.media.view.MediaFrame.Post = MediaFramePost.extend( extend_type( MediaFramePost ) );\n\twp.media.view.MediaFrame.ImageDetails = MediaFrameImageDetails.extend( extend_type( MediaFrameImageDetails ) );\n\twp.media.view.MediaFrame.VideoDetails = MediaFrameVideoDetails.extend( extend_type( MediaFrameVideoDetails ) );\n\n}\n\n\n//# sourceURL=webpack:///./js/src/components/widget.js?"); + +/***/ }), + +/***/ "./js/src/main.js": +/*!************************!*\ + !*** ./js/src/main.js ***! + \************************/ +/*! exports provided: cloudinary */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"cloudinary\", function() { return cloudinary; });\n/* harmony import */ var _components_settings_page__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/settings-page */ \"./js/src/components/settings-page.js\");\n/* harmony import */ var _components_settings_page__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_components_settings_page__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _components_sync__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/sync */ \"./js/src/components/sync.js\");\n/* harmony import */ var _components_widget__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/widget */ \"./js/src/components/widget.js\");\n/* harmony import */ var _components_widget__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_components_widget__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _components_global_transformations__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/global-transformations */ \"./js/src/components/global-transformations.js\");\n/* harmony import */ var _components_terms_order__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/terms_order */ \"./js/src/components/terms_order.js\");\n/* harmony import */ var _components_media_library__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/media-library */ \"./js/src/components/media-library.js\");\n/* harmony import */ var _css_src_main_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../css/src/main.scss */ \"./css/src/main.scss\");\n/* harmony import */ var _css_src_main_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_css_src_main_scss__WEBPACK_IMPORTED_MODULE_6__);\n/* global window */\n/**\n * Main JS.\n */\n\n// Components\n\n\n\n\n\n\n\n\n\n// jQuery, because reasons.\nconst $ = window.$ = window.jQuery;\n\n// Global Constants\nconst cloudinary = {\n\tsettings: (_components_settings_page__WEBPACK_IMPORTED_MODULE_0___default()),\n\tsync: _components_sync__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n\twidget: (_components_widget__WEBPACK_IMPORTED_MODULE_2___default()),\n\tGlobal_Transformations: _components_global_transformations__WEBPACK_IMPORTED_MODULE_3__[\"default\"],\n\tTerms_Order: _components_terms_order__WEBPACK_IMPORTED_MODULE_4__[\"default\"],\n\tMedia_Library: _components_media_library__WEBPACK_IMPORTED_MODULE_5__[\"default\"],\n};\n\n\n\n//# sourceURL=webpack:///./js/src/main.js?"); + +/***/ }) + +/******/ }); \ No newline at end of file diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js index 582eaf25f..0317ed2e1 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js @@ -164,11 +164,11 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { onChange( event ) { super.onChange( event ); let item = this.pickItem( event ); + console.log(item) if ( item ) { if ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) { this.makeItem( item ); - } - else { + } else { let element = jQuery( '[data-item="' + item.id + '"]' ); if ( element.length ) { element.remove(); @@ -185,6 +185,11 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { return this.state.availableTerms[ p ]; } } + // Tags that are already registered need to be selected separately + // as its expected that they return back with an "id" property. + } else if ( Array.isArray( event ) ) { + const existingTag = event[ event.length - 1 ]; + return this.state.availableTerms.find( ( item ) => item.name === existingTag ); } } else if ( typeof event === 'number' ) { From dae89de2bb54e16b49717cd57bd98ac292266dc4 Mon Sep 17 00:00:00 2001 From: Dukagjin Surdulli Date: Fri, 31 Jan 2020 13:15:45 +0100 Subject: [PATCH 02/10] Reformat code; Prevent existing tax item from being added twice --- .../js/cloudinary.js | 2 +- .../js/src/components/terms_order.js | 26 ++++++++++--------- 2 files changed, 15 insertions(+), 13 deletions(-) diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js index 112fc2ac8..56c7d0503 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js @@ -152,7 +152,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet order_set = {};\n\twp.data.subscribe( function() {\n\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torder_set[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\n\t} );\n\n\tlet el = wp.element.createElement;\n\n\tlet CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass customHandler extends OriginalComponent {\n\n\t\t\tmakeItem( item ) {\n\t\t\t\tlet row = this.makeElement( item );\n\t\t\t\tlet box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\tlet self = this;\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => self.makeItem( item ) );\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tlet item = this.pickItem( event );\n\t\t\t\tconsole.log(item)\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tlet element = jQuery( '[data-item=\"' + item.id + '\"]' );\n\t\t\t\t\t\tif ( element.length ) {\n\t\t\t\t\t\t\telement.remove();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t}\n\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', item.id );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn function( props ) {\n\n\t\t\treturn el(\n\t\t\t\tcustomHandler,\n\t\t\t\tprops\n\t\t\t);\n\t\t};\n\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet order_set = {};\n\twp.data.subscribe( function() {\n\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torder_set[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\n\t} );\n\n\tlet el = wp.element.createElement;\n\n\tlet CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) )\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\tif ( \n\t\t\t\t\t$.inArray( item.id, this.currentItems ) || \n\t\t\t\t\t$.inArray( `${this.props.slug}:${item.name}`, this.currentItems ) \n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet row = this.makeElement( item );\n\t\t\t\tlet box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\tlet self = this;\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => self.makeItem( item ) );\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tlet item = this.pickItem( event );\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tlet element = jQuery( '[data-item=\"' + item.id + '\"]' );\n\t\t\t\t\t\tif ( element.length ) {\n\t\t\t\t\t\t\telement.remove();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', item.id );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); /***/ }), diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js index 0317ed2e1..1389893a2 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js @@ -146,9 +146,20 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { let CustomizeTaxonomySelector = function( OriginalComponent ) { - class customHandler extends OriginalComponent { + class CustomHandler extends OriginalComponent { + constructor(props) { + super(props) + this.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ) + } makeItem( item ) { + if ( + $.inArray( item.id, this.currentItems ) || + $.inArray( `${this.props.slug}:${item.name}`, this.currentItems ) + ) { + return; + } + let row = this.makeElement( item ); let box = jQuery( '#cld-tax-items' ); box.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append @@ -164,7 +175,6 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { onChange( event ) { super.onChange( event ); let item = this.pickItem( event ); - console.log(item) if ( item ) { if ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) { this.makeItem( item ); @@ -224,9 +234,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { return this.state.availableTerms[ p ]; } } - } - } makeElement( item ) { @@ -239,18 +247,12 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' ); li.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append + return li; } } - return function( props ) { - - return el( - customHandler, - props - ); - }; - + return ( props ) => el( CustomHandler, props ); }; wp.hooks.addFilter( From d42b7d8753d90ae02847362cf9b74b54cb523d75 Mon Sep 17 00:00:00 2001 From: Dukagjin Surdulli Date: Fri, 31 Jan 2020 14:20:52 +0100 Subject: [PATCH 03/10] Restructure list item ids for consistency; Takes format of "tax:id" --- .../js/cloudinary.js | 2 +- .../js/src/components/terms_order.js | 55 +++++++++++-------- .../media/class-global-transformations.php | 8 +-- 3 files changed, 36 insertions(+), 29 deletions(-) diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js index 56c7d0503..5c01d4a91 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js @@ -152,7 +152,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet order_set = {};\n\twp.data.subscribe( function() {\n\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torder_set[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\n\t} );\n\n\tlet el = wp.element.createElement;\n\n\tlet CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) )\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\tif ( \n\t\t\t\t\t$.inArray( item.id, this.currentItems ) || \n\t\t\t\t\t$.inArray( `${this.props.slug}:${item.name}`, this.currentItems ) \n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tlet row = this.makeElement( item );\n\t\t\t\tlet box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\tlet self = this;\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => self.makeItem( item ) );\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tlet item = this.pickItem( event );\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tlet element = jQuery( '[data-item=\"' + item.id + '\"]' );\n\t\t\t\t\t\tif ( element.length ) {\n\t\t\t\t\t\t\telement.remove();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', item.id );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ).get()\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the order box\n\t\t\t\tif ( $.inArray( this.getId(item), this.currentItems ) !== -1 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( '[data-item=\"' + this.getId(item) + '\"]' );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\t\t\t\tconsole.log(item)\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); /***/ }), diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js index 1389893a2..66484c1e2 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js @@ -128,61 +128,66 @@ if ( typeof window.CLDN !== 'undefined' ) { // Gutenberg. if ( wp.data && wp.data.select( 'core/editor' ) ) { - let order_set = {}; + let orderSet = {}; wp.data.subscribe( function() { - let taxonomies = wp.data.select( 'core' ).getTaxonomies(); if ( taxonomies ) { for (let t in taxonomies) { let set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base ); - order_set[ taxonomies[ t ].slug ] = set; + orderSet[ taxonomies[ t ].slug ] = set; } } - } ); - let el = wp.element.createElement; - - let CustomizeTaxonomySelector = function( OriginalComponent ) { + const el = wp.element.createElement; + const CustomizeTaxonomySelector = function( OriginalComponent ) { class CustomHandler extends OriginalComponent { constructor(props) { super(props) - this.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ) + this.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ).get() } makeItem( item ) { - if ( - $.inArray( item.id, this.currentItems ) || - $.inArray( `${this.props.slug}:${item.name}`, this.currentItems ) - ) { + // Prevent duplicates in the order box + if ( $.inArray( this.getId(item), this.currentItems ) !== -1 ) { return; } - let row = this.makeElement( item ); - let box = jQuery( '#cld-tax-items' ); + const row = this.makeElement( item ); + const box = jQuery( '#cld-tax-items' ); box.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append } + removeItem( item ) { + const elementWithId = jQuery( '[data-item="' + this.getId(item) + '"]' ); + + if ( elementWithId.length ) { + elementWithId.remove(); + + this.currentItems = this.currentItems.filter( ( taxIdentifier ) => { + return taxIdentifier !== this.getId(item) + } ); + } + } + findOrCreateTerm( termName ) { - let self = this; termName = super.findOrCreateTerm( termName ); - termName.then( ( item ) => self.makeItem( item ) ); + termName.then( ( item ) => this.makeItem( item ) ); + return termName; } onChange( event ) { super.onChange( event ); - let item = this.pickItem( event ); + const item = this.pickItem( event ); + console.log(item) if ( item ) { - if ( order_set[ this.props.slug ].indexOf( item.id ) >= 0 ) { + if ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) { this.makeItem( item ); } else { - let element = jQuery( '[data-item="' + item.id + '"]' ); - if ( element.length ) { - element.remove(); - } + this.removeItem( item ); } } } @@ -237,12 +242,16 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { } } + getId(item) { + return `${this.props.slug}:${item.id}` + } + makeElement( item ) { let li = jQuery( '
  • ' ), input = jQuery( '' ), icon = jQuery( '' ); - li.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', item.id ); + li.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) ); input.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id ); icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' ); diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php index 086554d0b..8b7a1ed8e 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php @@ -318,11 +318,12 @@ function ( $item ) { } else { $term = get_term( $item ); } + // Return if term is valid. if ( $term instanceof \WP_Term ) { return array( 'term' => $term, - 'value' => $item, + 'value' => $term->taxonomy . ':' . $item, ); } @@ -339,11 +340,8 @@ function ( $item ) { if ( ! empty( $current_terms ) ) { $terms = array_map( function ( $term ) { + $value = $term->taxonomy . ':' . $term->term_id; - $value = $term->term_id; - if ( false === is_taxonomy_hierarchical( $term->taxonomy ) ) { - $value = $term->taxonomy . ':' . $term->name; - } $item = array( 'term' => $term, 'value' => $value, From 78593750a8d40949b26b18e5d6dd15083cadd9b6 Mon Sep 17 00:00:00 2001 From: Dukagjin Surdulli Date: Fri, 31 Jan 2020 18:08:25 +0100 Subject: [PATCH 04/10] Change structure of keys consistenly in pre-render; Apply changes to CE --- .../js/cloudinary.js | 2 +- .../js/src/components/terms_order.js | 86 ++++++++++++------- .../media/class-global-transformations.php | 43 ++++++---- 3 files changed, 79 insertions(+), 52 deletions(-) diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js index 5c01d4a91..d563e065d 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js @@ -152,7 +152,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\n\t\t// Check that we found the tax-items.\n\t\tif ( !this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tvar taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = $( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? $( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tfor (var i in list) {\n\t\t\t\t\t\tvar tag = taxonomy + ':' + list[ i ];\n\t\t\t\t\t\tif ( !jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = $( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ],\n\t\t\t\t\tremove_sortable = jQuery( '[data-item=\"' + taxonomy + ':' + remove_tag + '\"]' );\n\n\t\t\t\tremove_sortable.remove();\n\t\t\t\tthis.processTags( el );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\n\t\t\t\tself._pushItem( id, text );\n\t\t\t}\n\t\t\telse {\n\t\t\t\tself.tags.find( '[data-item=\"' + id + '\"]' ).remove();\n\t\t\t}\n\n\t\t} );\n\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ).get()\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the order box\n\t\t\t\tif ( $.inArray( this.getId(item), this.currentItems ) !== -1 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( '[data-item=\"' + this.getId(item) + '\"]' );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\t\t\t\tconsole.log(item)\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = jQuery( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: remove_tag } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
  • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' ).map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()\n\t\t\t}\n\n\t\t\tcomponentDidUpdate() {\n\t\t\t\tconsole.log(this.state.availableTerms);\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tconsole.log(item)\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\tconst term = this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\n\t\t\t\t\t\treturn !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
  • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?"); /***/ }), diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js index 66484c1e2..9e02b6731 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js @@ -1,19 +1,24 @@ /* global window wp wpAjax */ +function getTaxonomy( el ) { + return el.closest(jQuery('.hndle.ui-sortable-handle')) +} + const Terms_Order = { template: '', tags: jQuery( '#cld-tax-items' ), tagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',', _init: function() { - // Check that we found the tax-items. - if ( !this.tags.length ) { + if ( ! this.tags.length ) { return; } + // Init sortables. this._sortable(); let self = this; + // Setup ajax overrides. if ( typeof wpAjax !== 'undefined' ) { wpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse; @@ -33,42 +38,54 @@ const Terms_Order = { if ( typeof window.tagBox !== 'undefined' ) { window.tagBox.processflushTags = window.tagBox.flushTags; window.tagBox.flushTags = function( el, a, f ) { - if ( typeof f === 'undefined' ) { - var taxonomy = el.prop( 'id' ), + let taxonomy = el.prop( 'id' ), text, list, - newtag = $( 'input.newtag', el ); + newtag = jQuery( 'input.newtag', el ); a = a || false; - text = a ? $( a ).text() : newtag.val(); + text = a ? jQuery( a ).text() : newtag.val(); list = window.tagBox.clean( text ).split( self.tagDelimiter ); - for (var i in list) { - var tag = taxonomy + ':' + list[ i ]; - if ( !jQuery( '[data-item="' + tag + '"]' ).length ) { - self._pushItem( tag, list[ i ] ); - } - } + new wp.api.collections.Tags() + .fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } ) + .done( tags => { + for (let i in list) { + let tag = taxonomy + ':' + ( tags[0].id + 1 ); + if ( ! jQuery( '[data-item="' + tag + '"]' ).length ) { + self._pushItem( tag, list[ i ] ); + } + } + } ); } + return this.processflushTags( el, a, f ); }; window.tagBox.processTags = window.tagBox.parseTags; - window.tagBox.parseTags = function( el ) { + window.tagBox.parseTags = function( el ) { let id = el.id, num = id.split( '-check-num-' )[ 1 ], taxonomy = id.split( '-check-num-' )[ 0 ], - taxbox = $( el ).closest( '.tagsdiv' ), + taxbox = jQuery( el ).closest( '.tagsdiv' ), thetags = taxbox.find( '.the-tags' ), current_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ), - remove_tag = current_tags[ num ], - remove_sortable = jQuery( '[data-item="' + taxonomy + ':' + remove_tag + '"]' ); + remove_tag = current_tags[ num ]; + + new wp.api.collections.Tags() + .fetch( { data: { slug: remove_tag } } ) + .done( ( tag ) => { + if ( tag.length ) { + jQuery( '[data-item="' + taxonomy + ':' + tag[0].id + '"]' ).remove(); + } else { + jQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove(); + } - remove_sortable.remove(); - this.processTags( el ); + this.processTags( el ); + } ); }; } @@ -79,15 +96,11 @@ const Terms_Order = { checked = clicked.is( ':checked' ); if ( true === checked ) { - - self._pushItem( id, text ); - } - else { - self.tags.find( '[data-item="' + id + '"]' ).remove(); + self._pushItem( `category:${id}`, text ); + } else { + self.tags.find( `[data-item="category:${id}"]` ).remove(); } - } ); - }, _createItem: function( id, name ) { let li = jQuery( '
  • ' ), @@ -99,6 +112,7 @@ const Terms_Order = { icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' ); li.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append + return li; }, _pushItem: function( id, text ) { @@ -106,8 +120,8 @@ const Terms_Order = { this.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append }, _sortable: function() { - let items = jQuery( '.cld-tax-order-list' ); + items.sortable( { connectWith: '.cld-tax-order', axis: 'y', @@ -146,12 +160,16 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { class CustomHandler extends OriginalComponent { constructor(props) { super(props) - this.currentItems = $('.cld-tax-order-list-item').map( ( _, taxonomy ) => $( taxonomy ).data( 'item' ) ).get() + this.currentItems = jQuery( '.cld-tax-order-list-item' ).map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get() + } + + componentDidUpdate() { + console.log(this.state.availableTerms); } makeItem( item ) { - // Prevent duplicates in the order box - if ( $.inArray( this.getId(item), this.currentItems ) !== -1 ) { + // Prevent duplicates in the tax order box + if (this.currentItems.includes( this.getId( item ) ) ) { return; } @@ -161,7 +179,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { } removeItem( item ) { - const elementWithId = jQuery( '[data-item="' + this.getId(item) + '"]' ); + const elementWithId = jQuery( `[data-item="${this.getId(item)}"]` ); if ( elementWithId.length ) { elementWithId.remove(); @@ -182,7 +200,9 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { onChange( event ) { super.onChange( event ); const item = this.pickItem( event ); + console.log(item) + if ( item ) { if ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) { this.makeItem( item ); @@ -204,7 +224,9 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { // as its expected that they return back with an "id" property. } else if ( Array.isArray( event ) ) { const existingTag = event[ event.length - 1 ]; - return this.state.availableTerms.find( ( item ) => item.name === existingTag ); + const term = this.state.availableTerms.find( ( item ) => item.name === existingTag ); + + return !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term } } else if ( typeof event === 'number' ) { @@ -252,7 +274,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) { icon = jQuery( '' ); li.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) ); - input.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( item.id ); + input.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) ); icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' ); li.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php index 8b7a1ed8e..adad656aa 100644 --- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php +++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php @@ -67,13 +67,15 @@ function ( $field ) { return ! empty( $field['contextual'] ); } ); - $video_fields = array_filter( + + $video_fields = array_filter( $settings['pages']['global_transformation']['tabs']['global_video_transformations']['fields'], function ( $field ) { return ! empty( $field['contextual'] ); } ); - $this->fields = array_merge( $image_fields, $video_fields ); + + $this->fields = array_merge( $image_fields, $video_fields ); $this->setup_hooks(); } @@ -306,24 +308,24 @@ public function get_terms( $post_id ) { if ( ! empty( $items ) ) { $items = array_map( function ( $item ) { - if ( ! is_numeric( $item ) ) { - // Get the id. - if ( false !== strpos( $item, ':' ) ) { - $parts = explode( ':', $item ); - $term = get_term_by( 'slug', $parts[1], $parts[0] ); - } else { - // Something went wrong, and value was not an int and didn't contain a tax:slug string. - return null; - } + // Get the id. + if ( false !== strpos( $item, ':' ) ) { + $parts = explode( ':', $item ); + $term = get_term_by( 'id', $parts[1], $parts[0] ); + + if ( ! $term ) { + $term = get_term_by( 'term_taxonomy_id', $parts[1], $parts[0] ); + } } else { - $term = get_term( $item ); + // Something went wrong, and value was not an int and didn't contain a tax:slug string. + return null; } // Return if term is valid. if ( $term instanceof \WP_Term ) { return array( 'term' => $term, - 'value' => $term->taxonomy . ':' . $item, + 'value' => $item, ); } @@ -331,9 +333,7 @@ function ( $item ) { }, $items ); - $terms = array_filter( - $items - ); + $terms = array_filter($items); } else { $taxonomies = get_object_taxonomies( get_post_type( $post_id ) ); $current_terms = wp_get_object_terms( $post_id, $taxonomies ); @@ -384,12 +384,13 @@ public function make_term_sort_item( $id, $name ) { * @return string */ private function init_taxonomy_manager( $post ) { + wp_enqueue_script( 'wp-api' ); + $out = array(); $out[] = '
    '; $out[] = '
      '; $out[] = '
    • ' . esc_html__( 'No terms added', 'cloudinary' ) . '
      • '; $terms = $this->get_terms( $post->ID ); - // Process Terms. if ( ! empty( $terms ) ) { foreach ( (array) $terms as $item ) { $out[] = $this->make_term_sort_item( $item['value'], $item['term']->name ); @@ -410,7 +411,7 @@ private function init_taxonomy_manager( $post ) { * @param int $post_id The post ID. */ public function save_taxonomy_ordering( $post_id ) { - $args = array( + $args = array( 'cld_tax_order' => array( 'filter' => FILTER_SANITIZE_STRING, 'flags' => FILTER_REQUIRE_ARRAY, @@ -419,7 +420,11 @@ public function save_taxonomy_ordering( $post_id ) { 'filter' => FILTER_SANITIZE_STRING, ), ); + $taxonomy_order = filter_input_array( INPUT_POST, $args ); + + // echo '
      ';
+		// var_dump($taxonomy_order);exit;
 		if ( ! empty( $taxonomy_order['cld_tax_order'] ) ) {
 			update_post_meta( $post_id, self::META_ORDER_KEY . '_terms', $taxonomy_order['cld_tax_order'] );
 		} else {
@@ -450,6 +455,6 @@ function ( $taxonomy ) use ( $global ) {
 
 		// Add ordering metaboxes.
 		add_action( 'add_meta_boxes', array( $this, 'taxonomy_ordering' ), 10, 2 );
-		add_action( 'save_post', array( $this, 'save_taxonomy_ordering' ), 10, 4 );
+		add_action( 'save_post', array( $this, 'save_taxonomy_ordering' ), 10, 1 );
 	}
 }

From 72c3a8342864a3321850d7b43c0168988652d4a1 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Fri, 31 Jan 2020 20:14:21 +0100
Subject: [PATCH 05/10] Wrap up the logic to put/remove tags from the order box

---
 .../js/cloudinary.js                          |  2 +-
 .../js/src/components/terms_order.js          | 34 ++++++++++---------
 2 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
index d563e065d..0bc3039f7 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
@@ -152,7 +152,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = jQuery( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: remove_tag } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
    • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tlet set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' ).map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()\n\t\t\t}\n\n\t\t\tcomponentDidUpdate() {\n\t\t\t\tconsole.log(this.state.availableTerms);\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tconsole.log(item)\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\tconst existingTag = event[ event.length - 1 ];\n\t\t\t\t\t\tconst term = this.state.availableTerms.find( ( item ) => item.name === existingTag );\n\n\t\t\t\t\t\treturn !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\telse {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
    • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = jQuery( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: remove_tag } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
    • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()\n\n\t\t\t\tthis.currentFlatItems = null\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0]; // Adding tag\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst term = this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\n\t\t\t\t\t\treturn !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
    • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
 
 /***/ }),
 
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
index 9e02b6731..a4cf3e543 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
@@ -148,7 +148,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 
 		if ( taxonomies ) {
 			for (let t in taxonomies) {
-				let set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );
+				const set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );
 				orderSet[ taxonomies[ t ].slug ] = set;
 			}
 		}
@@ -160,11 +160,11 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 		class CustomHandler extends OriginalComponent {
 			constructor(props) {
 				super(props)
-				this.currentItems = jQuery( '.cld-tax-order-list-item' ).map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()
-			}
 
-			componentDidUpdate() {
-				console.log(this.state.availableTerms);
+				this.currentItems = jQuery( '.cld-tax-order-list-item' )
+					.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()
+
+				this.currentFlatItems = null
 			}
 
 			makeItem( item ) {
@@ -201,10 +201,8 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 				super.onChange( event );
 				const item = this.pickItem( event );
 
-				console.log(item)
-
 				if ( item ) {
-					if ( orderSet[ this.props.slug ].indexOf( item.id ) >= 0 ) {
+					if ( orderSet[ this.props.slug ].includes( item.id ) ) {
 						this.makeItem( item );
 					} else {
 						this.removeItem( item );
@@ -223,20 +221,25 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 					// Tags that are already registered need to be selected separately
 					// as its expected that they return back with an "id" property.
 					} else if ( Array.isArray( event ) ) {
-						const existingTag = event[ event.length - 1 ];
-						const term = this.state.availableTerms.find( ( item ) => item.name === existingTag );
+						// Figure out the diff between the current state and the event and determine which tag is getting removed
+						let enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];
+
+						if ( typeof enteredTag === 'undefined' ) {
+							// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item
+							enteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0]; // Adding tag
+						}
+
+						const term = this.state.availableTerms.find( ( item ) => item.name === enteredTag );
 
 						return !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term
 					}
-				}
-				else if ( typeof event === 'number' ) {
+				} else if ( typeof event === 'number' ) {
 					for (let p in this.state.availableTerms) {
 						if ( this.state.availableTerms[ p ].id === event ) {
 							return this.state.availableTerms[ p ];
 						}
 					}
-				}
-				else {
+				} else {
 					let text;
 					// add or remove.
 					if ( event.length > this.state.selectedTerms.length ) {
@@ -246,8 +249,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 								text = event[ o ];
 							}
 						}
-					}
-					else {
+					} else {
 						// removed.
 						for (let o in this.state.selectedTerms) {
 							if ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {

From ea0dc087473ee63c85464b4bd13cb27ab3485547 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Fri, 31 Jan 2020 20:33:49 +0100
Subject: [PATCH 06/10] General code reformat

---
 .../js/cloudinary.js                          |   4 +-
 .../js/src/components/terms_order.js          | 105 +++++++++---------
 2 files changed, 55 insertions(+), 54 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
index 0bc3039f7..07ee74ced 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
@@ -148,11 +148,11 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon
 /*!******************************************!*\
   !*** ./js/src/components/terms_order.js ***!
   \******************************************/
-/*! exports provided: default */
+/*! exports provided: Terms_Order */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tlet self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settings_response, element ) {\n\t\t\t\tlet new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );\n\t\t\t\tif ( !new_response.errors && new_response.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + new_response.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tlet data = jQuery( new_response.responses[ 0 ].data ),\n\t\t\t\t\t\t\ttext = data.find( 'label' ).last().text().trim();\n\t\t\t\t\t\tself._pushItem( new_response.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn new_response;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet taxonomy = el.prop( 'id' ),\n\t\t\t\t\t\ttext,\n\t\t\t\t\t\tlist,\n\t\t\t\t\t\tnewtag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newtag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tlet id = el.id,\n\t\t\t\t\tnum = id.split( '-check-num-' )[ 1 ],\n\t\t\t\t\ttaxonomy = id.split( '-check-num-' )[ 0 ],\n\t\t\t\t\ttaxbox = jQuery( el ).closest( '.tagsdiv' ),\n\t\t\t\t\tthetags = taxbox.find( '.the-tags' ),\n\t\t\t\t\tcurrent_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),\n\t\t\t\t\tremove_tag = current_tags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: remove_tag } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tlet clicked = jQuery( this ),\n\t\t\t\ttext = clicked.parent().text().trim(),\n\t\t\t\tid = clicked.val(),\n\t\t\t\tchecked = clicked.is( ':checked' );\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tlet li = jQuery( '
    • ' ),\n\t\t\tinput = jQuery( '' ),\n\t\t\ticon = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tlet items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Terms_Order);\n\n// Init.\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tlet orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = function( OriginalComponent ) {\n\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()\n\n\t\t\t\tthis.currentFlatItems = null\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item)\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0]; // Adding tag\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst term = this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\n\t\t\t\t\t\treturn !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tlet li = jQuery( '
    • ' ),\n\t\t\t\t\tinput = jQuery( '' ),\n\t\t\t\t\ticon = jQuery( '' );\n\n\t\t\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );\n\t\t\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Terms_Order\", function() { return Terms_Order; });\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tconst self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settingsResponse, element ) {\n\t\t\t\tlet newResponse = wpAjax.procesParseAjaxResponse( response, settingsResponse, element );\n\t\t\t\tif ( !newResponse.errors && newResponse.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + newResponse.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tconst data = jQuery( newResponse.responses[ 0 ].data );\n\t\t\t\t\t\tconst text = data.find( 'label' ).last().text().trim();\n\n\t\t\t\t\t\tself._pushItem( newResponse.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn newResponse;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet text, list;\n\t\t\t\t\tconst taxonomy = el.prop( 'id' );\n\t\t\t\t\tconst\tnewTag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newTag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tconst id = el.id;\n\t\t\t\tconst num = id.split( '-check-num-' )[ 1 ];\n\t\t\t\tconst taxonomy = id.split( '-check-num-' )[ 0 ];\n\t\t\t\tconst taxBox = jQuery( el ).closest( '.tagsdiv' );\n\t\t\t\tconst tagsTextarea = taxBox.find( '.the-tags' );\n\t\t\t\tconst currentTags = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter );\n\t\t\t\tconst tagToRemove = currentTags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: tagToRemove } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tconst clickedItem = jQuery( this );\n\t\t\tconst id = clickedItem.val();\n\t\t\tconst checked = clickedItem.is( ':checked' );\n\t\t\tconst text = clickedItem.parent().text().trim();\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tconst li = jQuery( '
    • ' );\n\t\tconst icon = jQuery( '' );\n\t\tconst input = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tconst items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tconst orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = ( OriginalComponent ) => {\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get();\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item);\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0];\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tconst li = jQuery( '
    • ' );\n\t\t\t\tconst\ticon = jQuery( '' );\n\t\t\t\tconst\tinput = jQuery( '' );\n\n\t\t\t\tli\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item' )\n\t\t\t\t\t.attr( 'data-item', this.getId(item) );\n\n\t\t\t\tinput\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item-input' )\n\t\t\t\t\t.attr( 'type', 'hidden' )\n\t\t\t\t\t.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\t\t\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
 
 /***/ }),
 
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
index a4cf3e543..eb2bcdd1d 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
@@ -4,7 +4,7 @@ function getTaxonomy( el ) {
 	return el.closest(jQuery('.hndle.ui-sortable-handle'))
 }
 
-const Terms_Order = {
+export const Terms_Order = {
 	template: '',
 	tags: jQuery( '#cld-tax-items' ),
 	tagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',
@@ -17,21 +17,23 @@ const Terms_Order = {
 		// Init sortables.
 		this._sortable();
 
-		let self = this;
+		const self = this;
 
 		// Setup ajax overrides.
 		if ( typeof wpAjax !== 'undefined' ) {
 			wpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;
-			wpAjax.parseAjaxResponse = function( response, settings_response, element ) {
-				let new_response = wpAjax.procesParseAjaxResponse( response, settings_response, element );
-				if ( !new_response.errors && new_response.responses[ 0 ] ) {
-					if ( jQuery( '[data-taxonomy="' + new_response.responses[ 0 ].what + '"]' ).length ) {
-						let data = jQuery( new_response.responses[ 0 ].data ),
-							text = data.find( 'label' ).last().text().trim();
-						self._pushItem( new_response.responses[ 0 ].what, text );
+			wpAjax.parseAjaxResponse = function( response, settingsResponse, element ) {
+				let newResponse = wpAjax.procesParseAjaxResponse( response, settingsResponse, element );
+				if ( !newResponse.errors && newResponse.responses[ 0 ] ) {
+					if ( jQuery( '[data-taxonomy="' + newResponse.responses[ 0 ].what + '"]' ).length ) {
+						const data = jQuery( newResponse.responses[ 0 ].data );
+						const text = data.find( 'label' ).last().text().trim();
+
+						self._pushItem( newResponse.responses[ 0 ].what, text );
 					}
 				}
-				return new_response;
+
+				return newResponse;
 			};
 		}
 
@@ -39,14 +41,13 @@ const Terms_Order = {
 			window.tagBox.processflushTags = window.tagBox.flushTags;
 			window.tagBox.flushTags = function( el, a, f ) {
 				if ( typeof f === 'undefined' ) {
-					let taxonomy = el.prop( 'id' ),
-						text,
-						list,
-						newtag = jQuery( 'input.newtag', el );
+					let text, list;
+					const taxonomy = el.prop( 'id' );
+					const	newTag = jQuery( 'input.newtag', el );
 
 					a = a || false;
 
-					text = a ? jQuery( a ).text() : newtag.val();
+					text = a ? jQuery( a ).text() : newTag.val();
 					list = window.tagBox.clean( text ).split( self.tagDelimiter );
 
 					new wp.api.collections.Tags()
@@ -67,21 +68,21 @@ const Terms_Order = {
 			window.tagBox.processTags = window.tagBox.parseTags;
 
 			window.tagBox.parseTags = function( el ) {
-				let id = el.id,
-					num = id.split( '-check-num-' )[ 1 ],
-					taxonomy = id.split( '-check-num-' )[ 0 ],
-					taxbox = jQuery( el ).closest( '.tagsdiv' ),
-					thetags = taxbox.find( '.the-tags' ),
-					current_tags = window.tagBox.clean( thetags.val() ).split( self.tagDelimiter ),
-					remove_tag = current_tags[ num ];
+				const id = el.id;
+				const num = id.split( '-check-num-' )[ 1 ];
+				const taxonomy = id.split( '-check-num-' )[ 0 ];
+				const taxBox = jQuery( el ).closest( '.tagsdiv' );
+				const tagsTextarea = taxBox.find( '.the-tags' );
+				const currentTags = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter );
+				const tagToRemove = currentTags[ num ];
 
 				new wp.api.collections.Tags()
-					.fetch( { data: { slug: remove_tag } } )
+					.fetch( { data: { slug: tagToRemove } } )
 					.done( ( tag ) => {
 						if ( tag.length ) {
 							jQuery( '[data-item="' + taxonomy + ':' + tag[0].id + '"]' ).remove();
 						} else {
-							jQuery( `.cld-tax-order-list-item:contains(${remove_tag})` ).remove();
+							jQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();
 						}
 
 						this.processTags( el );
@@ -90,10 +91,10 @@ const Terms_Order = {
 		}
 
 		jQuery( 'body' ).on( 'change', '.selectit input', function() {
-			let clicked = jQuery( this ),
-				text = clicked.parent().text().trim(),
-				id = clicked.val(),
-				checked = clicked.is( ':checked' );
+			const clickedItem = jQuery( this );
+			const id = clickedItem.val();
+			const checked = clickedItem.is( ':checked' );
+			const text = clickedItem.parent().text().trim();
 
 			if ( true === checked ) {
 				self._pushItem( `category:${id}`, text );
@@ -103,9 +104,9 @@ const Terms_Order = {
 		} );
 	},
 	_createItem: function( id, name ) {
-		let li = jQuery( '
    • ' ),
-			input = jQuery( '' ),
-			icon = jQuery( '' );
+		const li = jQuery( '
    • ' );
+		const icon = jQuery( '' );
+		const input = jQuery( '' );
 
 		li.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );
 		input.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );
@@ -120,7 +121,7 @@ const Terms_Order = {
 		this.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append
 	},
 	_sortable: function() {
-		let items = jQuery( '.cld-tax-order-list' );
+		const items = jQuery( '.cld-tax-order-list' );
 
 		items.sortable( {
 			connectWith: '.cld-tax-order',
@@ -133,16 +134,13 @@ const Terms_Order = {
 	}
 };
 
-export default Terms_Order;
-
-// Init.
 if ( typeof window.CLDN !== 'undefined' ) {
 	Terms_Order._init();
 }
 
 // Gutenberg.
 if ( wp.data && wp.data.select( 'core/editor' ) ) {
-	let orderSet = {};
+	const orderSet = {};
 	wp.data.subscribe( function() {
 		let taxonomies = wp.data.select( 'core' ).getTaxonomies();
 
@@ -155,16 +153,13 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 	} );
 
 	const el = wp.element.createElement;
-	const CustomizeTaxonomySelector = function( OriginalComponent ) {
-
+	const CustomizeTaxonomySelector = ( OriginalComponent ) => {
 		class CustomHandler extends OriginalComponent {
 			constructor(props) {
 				super(props)
 
 				this.currentItems = jQuery( '.cld-tax-order-list-item' )
-					.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get()
-
-				this.currentFlatItems = null
+					.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get();
 			}
 
 			makeItem( item ) {
@@ -185,7 +180,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 					elementWithId.remove();
 
 					this.currentItems = this.currentItems.filter( ( taxIdentifier ) => {
-						return taxIdentifier !== this.getId(item)
+						return taxIdentifier !== this.getId(item);
 					} );
 				}
 			}
@@ -226,12 +221,10 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 
 						if ( typeof enteredTag === 'undefined' ) {
 							// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item
-							enteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0]; // Adding tag
+							enteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0];
 						}
 
-						const term = this.state.availableTerms.find( ( item ) => item.name === enteredTag );
-
-						return !term && this.state.availableTerms.length === 1 ? this.state.availableTerms[0] : term
+						return this.state.availableTerms.find( ( item ) => item.name === enteredTag );
 					}
 				} else if ( typeof event === 'number' ) {
 					for (let p in this.state.availableTerms) {
@@ -241,6 +234,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 					}
 				} else {
 					let text;
+
 					// add or remove.
 					if ( event.length > this.state.selectedTerms.length ) {
 						// Added.
@@ -271,12 +265,19 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 			}
 
 			makeElement( item ) {
-				let li = jQuery( '
    • ' ),
-					input = jQuery( '' ),
-					icon = jQuery( '' );
-
-				li.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', this.getId(item) );
-				input.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );
+				const li = jQuery( '
    • ' );
+				const	icon = jQuery( '' );
+				const	input = jQuery( '' );
+
+				li
+					.addClass( 'cld-tax-order-list-item' )
+					.attr( 'data-item', this.getId(item) );
+
+				input
+					.addClass( 'cld-tax-order-list-item-input' )
+					.attr( 'type', 'hidden' )
+					.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );
+					
 				icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );
 
 				li.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append

From 2acf0913036f4144dfda737426d0895746a6d373 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Fri, 31 Jan 2020 21:02:25 +0100
Subject: [PATCH 07/10] Handle adding and removing non-database tags in CE

---
 .../js/cloudinary.js                          |  2 +-
 .../js/src/components/terms_order.js          | 30 ++++++++-----------
 2 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
index 07ee74ced..93ac13346 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
@@ -152,7 +152,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* global window wp */\n\ncon
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Terms_Order\", function() { return Terms_Order; });\n/* global window wp wpAjax */\n\nfunction getTaxonomy( el ) {\n\treturn el.closest(jQuery('.hndle.ui-sortable-handle'))\n}\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Init sortables.\n\t\tthis._sortable();\n\n\t\tconst self = this;\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settingsResponse, element ) {\n\t\t\t\tlet newResponse = wpAjax.procesParseAjaxResponse( response, settingsResponse, element );\n\t\t\t\tif ( !newResponse.errors && newResponse.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + newResponse.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tconst data = jQuery( newResponse.responses[ 0 ].data );\n\t\t\t\t\t\tconst text = data.find( 'label' ).last().text().trim();\n\n\t\t\t\t\t\tself._pushItem( newResponse.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn newResponse;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet text, list;\n\t\t\t\t\tconst taxonomy = el.prop( 'id' );\n\t\t\t\t\tconst\tnewTag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newTag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tfor (let i in list) {\n\t\t\t\t\t\t\t\tlet tag = taxonomy + ':' + ( tags[0].id + 1 );\n\t\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\t\tself._pushItem( tag, list[ i ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tconst id = el.id;\n\t\t\t\tconst num = id.split( '-check-num-' )[ 1 ];\n\t\t\t\tconst taxonomy = id.split( '-check-num-' )[ 0 ];\n\t\t\t\tconst taxBox = jQuery( el ).closest( '.tagsdiv' );\n\t\t\t\tconst tagsTextarea = taxBox.find( '.the-tags' );\n\t\t\t\tconst currentTags = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter );\n\t\t\t\tconst tagToRemove = currentTags[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: tagToRemove } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tif ( tag.length ) {\n\t\t\t\t\t\t\tjQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ).remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tconst clickedItem = jQuery( this );\n\t\t\tconst id = clickedItem.val();\n\t\t\tconst checked = clickedItem.is( ':checked' );\n\t\t\tconst text = clickedItem.parent().text().trim();\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tconst li = jQuery( '
    • ' );\n\t\tconst icon = jQuery( '' );\n\t\tconst input = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tconst items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tconst orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = ( OriginalComponent ) => {\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get();\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item);\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0];\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tconst li = jQuery( '
    • ' );\n\t\t\t\tconst\ticon = jQuery( '' );\n\t\t\t\tconst\tinput = jQuery( '' );\n\n\t\t\t\tli\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item' )\n\t\t\t\t\t.attr( 'data-item', this.getId(item) );\n\n\t\t\t\tinput\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item-input' )\n\t\t\t\t\t.attr( 'type', 'hidden' )\n\t\t\t\t\t.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\t\t\t\t\t\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Terms_Order\", function() { return Terms_Order; });\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\tstartId: null,\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst self = this;\n\t\tthis._sortable();\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settingsResponse, element ) {\n\t\t\t\tlet newResponse = wpAjax.procesParseAjaxResponse( response, settingsResponse, element );\n\t\t\t\tif ( !newResponse.errors && newResponse.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + newResponse.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tconst data = jQuery( newResponse.responses[ 0 ].data );\n\t\t\t\t\t\tconst text = data.find( 'label' ).last().text().trim();\n\n\t\t\t\t\t\tself._pushItem( newResponse.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn newResponse;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet text, list;\n\t\t\t\t\tconst taxonomy = el.prop( 'id' );\n\t\t\t\t\tconst\tnewTag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newTag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tself.startId = self.startId === null ? tags[0].id + 1 : ++self.startId;\n\t\t\t\t\t\t\tconst tag = taxonomy + ':' + self.startId;\n\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\tself._pushItem( tag, list[ list.length - 1 ] );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tconst id = el.id;\n\t\t\t\tconst num = id.split( '-check-num-' )[ 1 ];\n\t\t\t\tconst taxonomy = id.split( '-check-num-' )[ 0 ];\n\t\t\t\tconst taxBox = jQuery( el ).closest( '.tagsdiv' );\n\t\t\t\tconst tagsTextarea = taxBox.find( '.the-tags' );\n\t\t\t\tconst tagToRemove = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter )[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: tagToRemove } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tconst tagFromDatabase = tag.length ? jQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ) : false;\n\n\t\t\t\t\t\tif ( tagFromDatabase.length ) {\n\t\t\t\t\t\t\ttagFromDatabase.remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();\n\t\t\t\t\t\t\t--self.startId;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tconst clickedItem = jQuery( this );\n\t\t\tconst id = clickedItem.val();\n\t\t\tconst checked = clickedItem.is( ':checked' );\n\t\t\tconst text = clickedItem.parent().text().trim();\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tconst li = jQuery( '
    • ' );\n\t\tconst icon = jQuery( '' );\n\t\tconst input = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tconst items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tconst orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = ( OriginalComponent ) => {\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get();\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item);\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0];\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tconst li = jQuery( '
    • ' );\n\t\t\t\tconst\ticon = jQuery( '' );\n\t\t\t\tconst\tinput = jQuery( '' );\n\n\t\t\t\tli\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item' )\n\t\t\t\t\t.attr( 'data-item', this.getId(item) );\n\n\t\t\t\tinput\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item-input' )\n\t\t\t\t\t.attr( 'type', 'hidden' )\n\t\t\t\t\t.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
 
 /***/ }),
 
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
index eb2bcdd1d..51cf5dcb7 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
@@ -1,23 +1,18 @@
 /* global window wp wpAjax */
 
-function getTaxonomy( el ) {
-	return el.closest(jQuery('.hndle.ui-sortable-handle'))
-}
-
 export const Terms_Order = {
 	template: '',
 	tags: jQuery( '#cld-tax-items' ),
 	tagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',
+	startId: null,
 	_init: function() {
 		// Check that we found the tax-items.
 		if ( ! this.tags.length ) {
 			return;
 		}
 
-		// Init sortables.
-		this._sortable();
-
 		const self = this;
+		this._sortable();
 
 		// Setup ajax overrides.
 		if ( typeof wpAjax !== 'undefined' ) {
@@ -53,11 +48,10 @@ export const Terms_Order = {
 					new wp.api.collections.Tags()
 						.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )
 						.done( tags => {
-							for (let i in list) {
-								let tag = taxonomy + ':' + ( tags[0].id + 1 );
-								if ( ! jQuery( '[data-item="' + tag + '"]' ).length ) {
-									self._pushItem( tag, list[ i ] );
-								}
+							self.startId = self.startId === null ? tags[0].id + 1 : ++self.startId;
+							const tag = taxonomy + ':' + self.startId;
+							if ( ! jQuery( '[data-item="' + tag + '"]' ).length ) {
+								self._pushItem( tag, list[ list.length - 1 ] );
 							}
 						} );
 				}
@@ -73,16 +67,18 @@ export const Terms_Order = {
 				const taxonomy = id.split( '-check-num-' )[ 0 ];
 				const taxBox = jQuery( el ).closest( '.tagsdiv' );
 				const tagsTextarea = taxBox.find( '.the-tags' );
-				const currentTags = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter );
-				const tagToRemove = currentTags[ num ];
+				const tagToRemove = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter )[ num ];
 
 				new wp.api.collections.Tags()
 					.fetch( { data: { slug: tagToRemove } } )
 					.done( ( tag ) => {
-						if ( tag.length ) {
-							jQuery( '[data-item="' + taxonomy + ':' + tag[0].id + '"]' ).remove();
+						const tagFromDatabase = tag.length ? jQuery( '[data-item="' + taxonomy + ':' + tag[0].id + '"]' ) : false;
+
+						if ( tagFromDatabase.length ) {
+							tagFromDatabase.remove();
 						} else {
 							jQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();
+							--self.startId;
 						}
 
 						this.processTags( el );
@@ -277,7 +273,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 					.addClass( 'cld-tax-order-list-item-input' )
 					.attr( 'type', 'hidden' )
 					.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );
-					
+
 				icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );
 
 				li.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append

From ae4e62a5d8412437a953022fa4a2228551547157 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Fri, 31 Jan 2020 21:14:17 +0100
Subject: [PATCH 08/10] Build assets for production and remove debug code

---
 .../css/cloudinary.css                        | 318 +-------------
 .../js/block-editor.js                        | 388 +-----------------
 .../js/cloudinary.js                          | 183 +--------
 .../media/class-global-transformations.php    |   4 +-
 4 files changed, 4 insertions(+), 889 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css
index 263568e5f..7df57b89b 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/css/cloudinary.css
@@ -1,317 +1 @@
-@font-face {
-  font-family: 'cloudinary';
-  src: url(../css/fonts/cloudinary.eot);
-  src: url(../css/fonts/cloudinary.eot#iefix) format("embedded-opentype"), url(../css/fonts/cloudinary.ttf) format("truetype"), url(../css/fonts/cloudinary.woff) format("woff"), url(../css/cloudinary.svg#cloudinary) format("svg");
-  font-weight: normal;
-  font-style: normal; }
-
-.dashicons-cloudinary {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  speak: none;
-  font-style: normal;
-  font-weight: normal;
-  font-variant: normal;
-  text-transform: none;
-  line-height: 1;
-  /* Better Font Rendering =========== */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale; }
-  .dashicons-cloudinary:before {
-    font-family: 'cloudinary' !important;
-    content: '\e900'; }
-  .dashicons-cloudinary.success {
-    color: #558b2f; }
-  .dashicons-cloudinary.error {
-    color: #dd2c00; }
-    .dashicons-cloudinary.error:before {
-      content: '\e901'; }
-  .dashicons-cloudinary.warning {
-    color: #fd9d2c; }
-    .dashicons-cloudinary.warning:before {
-      content: '\e902'; }
-  .dashicons-cloudinary.warning {
-    color: #fd9d2c; }
-  .dashicons-cloudinary.warning {
-    color: #fd9d2c; }
-
-.column-cld_status {
-  width: 5.5em; }
-  .column-cld_status .dashicons-cloudinary {
-    display: inline-block; }
-    .column-cld_status .dashicons-cloudinary:before {
-      font-size: 1.8rem; }
-
-.form-field .error-notice, .form-table .error-notice {
-  display: none;
-  color: #dd2c00; }
-
-.form-field input.cld-field:invalid, .form-table input.cld-field:invalid {
-  border-color: #dd2c00; }
-  .form-field input.cld-field:invalid + .error-notice, .form-table input.cld-field:invalid + .error-notice {
-    display: inline-block; }
-
-.cloudinary-welcome {
-  background-image: url(../css/logo.svg);
-  background-repeat: no-repeat;
-  background-size: 153px;
-  background-position: top 12px right 20px; }
-
-.settings-image {
-  max-width: 100%;
-  padding-top: 5px; }
-
-.settings-tabs > li {
-  display: inline-block; }
-  .settings-tabs > li a {
-    padding: .6em; }
-    .settings-tabs > li a.active {
-      background-color: #ffffff; }
-
-.settings-tab-section {
-  padding: 20px 0 0 0;
-  max-width: 1030px;
-  position: relative; }
-  .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard {
-    display: flex;
-    align-items: flex-start;
-    align-content: flex-start;
-    margin-top: 40px; }
-    .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description {
-      width: 55%;
-      margin: 0 auto 0 0; }
-    .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content {
-      width: 35%;
-      margin: 0 auto; }
-      .settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons {
-        color: #9EA3A8; }
-  .settings-tab-section.cloudinary-welcome .settings-tab-section-card {
-    margin-top: 0; }
-  .settings-tab-section-fields .field-heading th {
-    display: block;
-    width: auto;
-    color: #23282d;
-    font-size: 1.1em;
-    margin: 1em 0; }
-  .settings-tab-section-fields .field-heading td {
-    display: none;
-    visibility: hidden; }
-  .settings-tab-section-fields .regular-textarea {
-    width: 100%;
-    height: 60px; }
-  .settings-tab-section-fields .dashicons {
-    text-decoration: none;
-    vertical-align: middle; }
-  .settings-tab-section-fields a .dashicons {
-    color: #5F5F5F; }
-  .settings-tab-section-fields-dashboard-error {
-    font-size: 1.2em;
-    color: #5F5F5F; }
-    .settings-tab-section-fields-dashboard-error .dashicons {
-      color: #AC0000; }
-    .settings-tab-section-fields-dashboard-error .button {
-      font-size: 1.1em;
-      height: 40px;
-      line-height: 40px;
-      padding-right: 40px;
-      padding-left: 40px; }
-  .settings-tab-section-fields-dashboard-success {
-    font-size: 1.2em;
-    color: #23282d; }
-    .settings-tab-section-fields-dashboard-success.expanded {
-      padding-top: 40px; }
-    .settings-tab-section-fields-dashboard-success .dashicons {
-      color: #4FB651; }
-    .settings-tab-section-fields-dashboard-success .button {
-      font-size: 1.1em;
-      height: 40px;
-      line-height: 40px;
-      padding-right: 40px;
-      padding-left: 40px; }
-    .settings-tab-section-fields-dashboard-success .description {
-      color: #5F5F5F;
-      font-weight: normal;
-      margin-top: 12px; }
-  .settings-tab-section-card {
-    box-sizing: border-box;
-    border: 1px solid #E5E5E5;
-    background-color: #FFFFFF;
-    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.07);
-    padding: 20px 23px;
-    margin-top: 12px; }
-    .settings-tab-section-card .dashicons {
-      font-size: 1.4em; }
-    .settings-tab-section-card h2 {
-      font-size: 1.8em;
-      font-weight: normal;
-      margin-top: 0; }
-    .settings-tab-section-card.pull-right {
-      width: 450px;
-      padding: 12px;
-      float: right;
-      position: relative;
-      z-index: 10; }
-      .settings-tab-section-card.pull-right img.settings-image {
-        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
-        border: 1px solid #979797;
-        margin-top: 12px; }
-      .settings-tab-section-card.pull-right h4, .settings-tab-section-card.pull-right h3 {
-        margin-top: 0; }
-  .settings-tab-section .field-row-cloudinary_url, .settings-tab-section .field-row-signup {
-    display: block; }
-    .settings-tab-section .field-row-cloudinary_url td, .settings-tab-section .field-row-cloudinary_url th, .settings-tab-section .field-row-signup td, .settings-tab-section .field-row-signup th {
-      display: block;
-      width: auto;
-      padding: 10px 0 0; }
-      .settings-tab-section .field-row-cloudinary_url td .sign-up, .settings-tab-section .field-row-cloudinary_url th .sign-up, .settings-tab-section .field-row-signup td .sign-up, .settings-tab-section .field-row-signup th .sign-up {
-        vertical-align: baseline; }
-  .settings-tab-section.connect .form-table {
-    display: inline-block;
-    width: auto;
-    max-width: 580px; }
-
-.settings-valid {
-  color: #558b2f;
-  font-size: 30px; }
-  .settings-valid-field {
-    border-color: #558b2f !important; }
-
-.settings-invalid-field {
-  border-color: #dd2c00 !important; }
-
-.sync .spinner {
-  display: inline-block;
-  visibility: visible;
-  float: none;
-  margin: 0 5px 0 0; }
-
-.sync-media {
-  display: none; }
-  .sync-media-progress {
-    display: none; }
-    .sync-media-progress-outer {
-      height: 20px;
-      margin: 20px 0 10px;
-      width: 500px;
-      background-color: #e5e5e5;
-      position: relative; }
-      .sync-media-progress-outer .progress-bar {
-        width: 0;
-        height: 20px;
-        background-color: #558b2f;
-        transition: width 250ms; }
-    .sync-media-progress-notice {
-      color: #dd2c00; }
-  .sync-media-resource {
-    width: 100px;
-    display: inline-block; }
-  .sync-media-error {
-    color: #dd2c00; }
-
-.sync-count {
-  font-weight: bold; }
-
-.sync-details {
-  margin-top: 10px; }
-
-.sync .button.stop-sync, .sync .button.start-sync {
-  display: none;
-  padding: 0 16px; }
-  .sync .button.stop-sync .dashicons, .sync .button.start-sync .dashicons {
-    line-height: 2.2em; }
-
-.sync .progress-text {
-  padding: 12px 4px 12px 12px;
-  display: inline-block;
-  font-weight: bold; }
-
-.sync .completed {
-  max-width: 300px;
-  display: none; }
-
-.cloudinary-widget {
-  height: 100%; }
-  .cloudinary-widget-wrapper {
-    height: 100%;
-    overflow: hidden;
-    background-image: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K");
-    background-repeat: no-repeat;
-    background-position: center;
-    background-size: 150px; }
-
-.attachment-info .edit-attachment {
-  display: none; }
-
-.attachment-actions .button.edit-attachment {
-  display: none; }
-
-.global-transformations-preview {
-  position: relative;
-  max-width: 600px; }
-
-.global-transformations-spinner {
-  display: none; }
-
-.global-transformations-button.button-primary {
-  display: none;
-  position: absolute;
-  z-index: 100; }
-
-.global-transformations-url {
-  margin-bottom: 5px;
-  margin-top: 5px; }
-  .global-transformations-url-transformation {
-    max-width: 100px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    color: #51A3FF; }
-  .global-transformations-url-file {
-    color: #f2d864; }
-  .global-transformations-url-link {
-    display: block;
-    padding: 16px;
-    background-color: #262c35;
-    text-decoration: none;
-    color: #fff;
-    border-radius: 6px;
-    overflow: hidden;
-    text-overflow: ellipsis; }
-    .global-transformations-url-link:hover {
-      color: #888888;
-      text-decoration: underline; }
-
-.cld-tax-order-list-item {
-  border: 1px solid #efefef;
-  padding: 4px;
-  margin: 0 0 -1px;
-  background-color: #ffffff; }
-  .cld-tax-order-list-item.no-items {
-    color: #888;
-    text-align: center;
-    display: none; }
-    .cld-tax-order-list-item.no-items:last-child {
-      display: block; }
-  .cld-tax-order-list-item.ui-sortable-helper {
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }
-  .cld-tax-order-list-item-placeholder {
-    background-color: #efefef;
-    height: 45px;
-    margin: 0; }
-  .cld-tax-order-list-item-handle {
-    cursor: grab;
-    margin-right: 4px;
-    color: #999; }
-
-.cld-tax-order-list-type {
-  width: 45%;
-  display: inline-block;
-  margin-right: 8px; }
-  .cld-tax-order-list-type input {
-    margin-right: 4px !important; }
-
-.cloudinary-media-library {
-  position: relative;
-  margin-left: -20px; }
-  @media screen and (max-width: 782px) {
-    .cloudinary-media-library {
-      margin-left: -10px; } }
-
+@font-face{font-family:cloudinary;src:url(../css/fonts/cloudinary.eot);src:url(../css/fonts/cloudinary.eot#iefix) format("embedded-opentype"),url(../css/fonts/cloudinary.ttf) format("truetype"),url(../css/fonts/cloudinary.woff) format("woff"),url(../css/cloudinary.svg#cloudinary) format("svg");font-weight:400;font-style:normal}.dashicons-cloudinary{speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dashicons-cloudinary:before{font-family:cloudinary!important;content:"\e900"}.dashicons-cloudinary.success{color:#558b2f}.dashicons-cloudinary.error{color:#dd2c00}.dashicons-cloudinary.error:before{content:"\e901"}.dashicons-cloudinary.warning:before{content:"\e902"}.dashicons-cloudinary.warning{color:#fd9d2c}.column-cld_status{width:5.5em}.column-cld_status .dashicons-cloudinary{display:inline-block}.column-cld_status .dashicons-cloudinary:before{font-size:1.8rem}.form-field .error-notice,.form-table .error-notice{display:none;color:#dd2c00}.form-field input.cld-field:invalid,.form-table input.cld-field:invalid{border-color:#dd2c00}.form-field input.cld-field:invalid+.error-notice,.form-table input.cld-field:invalid+.error-notice{display:inline-block}.cloudinary-welcome{background-image:url(../css/logo.svg);background-repeat:no-repeat;background-size:153px;background-position:top 12px right 20px}.settings-image{max-width:100%;padding-top:5px}.settings-tabs>li{display:inline-block}.settings-tabs>li a{padding:.6em}.settings-tabs>li a.active{background-color:#fff}.settings-tab-section{padding:20px 0 0;max-width:1030px;position:relative}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard{display:flex;align-items:flex-start;align-content:flex-start;margin-top:40px}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description{width:55%;margin:0 auto 0 0}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content{width:35%;margin:0 auto}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons{color:#9ea3a8}.settings-tab-section.cloudinary-welcome .settings-tab-section-card{margin-top:0}.settings-tab-section-fields .field-heading th{display:block;width:auto;color:#23282d;font-size:1.1em;margin:1em 0}.settings-tab-section-fields .field-heading td{display:none;visibility:hidden}.settings-tab-section-fields .regular-textarea{width:100%;height:60px}.settings-tab-section-fields .dashicons{text-decoration:none;vertical-align:middle}.settings-tab-section-fields a .dashicons{color:#5f5f5f}.settings-tab-section-fields-dashboard-error{font-size:1.2em;color:#5f5f5f}.settings-tab-section-fields-dashboard-error .dashicons{color:#ac0000}.settings-tab-section-fields-dashboard-error .button{font-size:1.1em;height:40px;line-height:40px;padding-right:40px;padding-left:40px}.settings-tab-section-fields-dashboard-success{font-size:1.2em;color:#23282d}.settings-tab-section-fields-dashboard-success.expanded{padding-top:40px}.settings-tab-section-fields-dashboard-success .dashicons{color:#4fb651}.settings-tab-section-fields-dashboard-success .button{font-size:1.1em;height:40px;line-height:40px;padding-right:40px;padding-left:40px}.settings-tab-section-fields-dashboard-success .description{color:#5f5f5f;font-weight:400;margin-top:12px}.settings-tab-section-card{box-sizing:border-box;border:1px solid #e5e5e5;background-color:#fff;box-shadow:0 1px 1px 0 rgba(0,0,0,.07);padding:20px 23px;margin-top:12px}.settings-tab-section-card .dashicons{font-size:1.4em}.settings-tab-section-card h2{font-size:1.8em;font-weight:400;margin-top:0}.settings-tab-section-card.pull-right{width:450px;padding:12px;float:right;position:relative;z-index:10}.settings-tab-section-card.pull-right img.settings-image{box-shadow:0 2px 4px 0 rgba(0,0,0,.5);border:1px solid #979797;margin-top:12px}.settings-tab-section-card.pull-right h3,.settings-tab-section-card.pull-right h4{margin-top:0}.settings-tab-section .field-row-cloudinary_url,.settings-tab-section .field-row-signup{display:block}.settings-tab-section .field-row-cloudinary_url td,.settings-tab-section .field-row-cloudinary_url th,.settings-tab-section .field-row-signup td,.settings-tab-section .field-row-signup th{display:block;width:auto;padding:10px 0 0}.settings-tab-section .field-row-cloudinary_url td .sign-up,.settings-tab-section .field-row-cloudinary_url th .sign-up,.settings-tab-section .field-row-signup td .sign-up,.settings-tab-section .field-row-signup th .sign-up{vertical-align:baseline}.settings-tab-section.connect .form-table{display:inline-block;width:auto;max-width:580px}.settings-valid{color:#558b2f;font-size:30px}.settings-valid-field{border-color:#558b2f!important}.settings-invalid-field{border-color:#dd2c00!important}.sync .spinner{display:inline-block;visibility:visible;float:none;margin:0 5px 0 0}.sync-media,.sync-media-progress{display:none}.sync-media-progress-outer{height:20px;margin:20px 0 10px;width:500px;background-color:#e5e5e5;position:relative}.sync-media-progress-outer .progress-bar{width:0;height:20px;background-color:#558b2f;transition:width .25s}.sync-media-progress-notice{color:#dd2c00}.sync-media-resource{width:100px;display:inline-block}.sync-media-error{color:#dd2c00}.sync-count{font-weight:700}.sync-details{margin-top:10px}.sync .button.start-sync,.sync .button.stop-sync{display:none;padding:0 16px}.sync .button.start-sync .dashicons,.sync .button.stop-sync .dashicons{line-height:2.2em}.sync .progress-text{padding:12px 4px 12px 12px;display:inline-block;font-weight:700}.sync .completed{max-width:300px;display:none}.cloudinary-widget{height:100%}.cloudinary-widget-wrapper{height:100%;overflow:hidden;background-image:url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48c3R5bGU+QGtleWZyYW1lcyBjb2xvcnN7MCUsdG97c3Ryb2tlOiMwMDc4ZmZ9NTAle3N0cm9rZTojMGUyZjVhfX1Aa2V5ZnJhbWVzIGRhc2h7MCUsdG97c3Ryb2tlLWRhc2hvZmZzZXQ6NTYwfTUwJXtzdHJva2UtZGFzaG9mZnNldDowfX1ALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzezAlLHRve3N0cm9rZTojMDA3OGZmfTUwJXtzdHJva2U6IzBlMmY1YX19QC13ZWJraXQta2V5ZnJhbWVzIGRhc2h7MCUsdG97c3Ryb2tlLWRhc2hvZmZzZXQ6NTYwfTUwJXtzdHJva2UtZGFzaG9mZnNldDowfX08L3N0eWxlPjxwYXRoIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3R5bGU9InRyYW5zZm9ybS1vcmlnaW46Y2VudGVyOy13ZWJraXQtYW5pbWF0aW9uOmRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsY29sb3JzIDhzIGVhc2UtaW4tb3V0IGluZmluaXRlO2FuaW1hdGlvbjpkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZSIgc3Ryb2tlLWRhc2hhcnJheT0iMjgwIi8+PC9zdmc+");background-repeat:no-repeat;background-position:50%;background-size:150px}.attachment-actions .button.edit-attachment,.attachment-info .edit-attachment{display:none}.global-transformations-preview{position:relative;max-width:600px}.global-transformations-spinner{display:none}.global-transformations-button.button-primary{display:none;position:absolute;z-index:100}.global-transformations-url{margin-bottom:5px;margin-top:5px}.global-transformations-url-transformation{max-width:100px;overflow:hidden;text-overflow:ellipsis;color:#51a3ff}.global-transformations-url-file{color:#f2d864}.global-transformations-url-link{display:block;padding:16px;background-color:#262c35;text-decoration:none;color:#fff;border-radius:6px;overflow:hidden;text-overflow:ellipsis}.global-transformations-url-link:hover{color:#888;text-decoration:underline}.cld-tax-order-list-item{border:1px solid #efefef;padding:4px;margin:0 0 -1px;background-color:#fff}.cld-tax-order-list-item.no-items{color:#888;text-align:center;display:none}.cld-tax-order-list-item.no-items:last-child{display:block}.cld-tax-order-list-item.ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.cld-tax-order-list-item-placeholder{background-color:#efefef;height:45px;margin:0}.cld-tax-order-list-item-handle{cursor:grab;margin-right:4px;color:#999}.cld-tax-order-list-type{width:45%;display:inline-block;margin-right:8px}.cld-tax-order-list-type input{margin-right:4px!important}.cloudinary-media-library{position:relative;margin-left:-20px}@media screen and (max-width:782px){.cloudinary-media-library{margin-left:-10px}}
\ No newline at end of file
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js
index c35381dc8..482503df0 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/block-editor.js
@@ -1,387 +1 @@
-/******/ (function(modules) { // webpackBootstrap
-/******/ 	// The module cache
-/******/ 	var installedModules = {};
-/******/
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/
-/******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId]) {
-/******/ 			return installedModules[moduleId].exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = installedModules[moduleId] = {
-/******/ 			i: moduleId,
-/******/ 			l: false,
-/******/ 			exports: {}
-/******/ 		};
-/******/
-/******/ 		// Execute the module function
-/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ 		// Flag the module as loaded
-/******/ 		module.l = true;
-/******/
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/
-/******/
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = modules;
-/******/
-/******/ 	// expose the module cache
-/******/ 	__webpack_require__.c = installedModules;
-/******/
-/******/ 	// define getter function for harmony exports
-/******/ 	__webpack_require__.d = function(exports, name, getter) {
-/******/ 		if(!__webpack_require__.o(exports, name)) {
-/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
-/******/ 		}
-/******/ 	};
-/******/
-/******/ 	// define __esModule on exports
-/******/ 	__webpack_require__.r = function(exports) {
-/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 		}
-/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 	};
-/******/
-/******/ 	// create a fake namespace object
-/******/ 	// mode & 1: value is a module id, require it
-/******/ 	// mode & 2: merge all properties of value into the ns
-/******/ 	// mode & 4: return value when already ns object
-/******/ 	// mode & 8|1: behave like require
-/******/ 	__webpack_require__.t = function(value, mode) {
-/******/ 		if(mode & 1) value = __webpack_require__(value);
-/******/ 		if(mode & 8) return value;
-/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
-/******/ 		var ns = Object.create(null);
-/******/ 		__webpack_require__.r(ns);
-/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
-/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
-/******/ 		return ns;
-/******/ 	};
-/******/
-/******/ 	// getDefaultExport function for compatibility with non-harmony modules
-/******/ 	__webpack_require__.n = function(module) {
-/******/ 		var getter = module && module.__esModule ?
-/******/ 			function getDefault() { return module['default']; } :
-/******/ 			function getModuleExports() { return module; };
-/******/ 		__webpack_require__.d(getter, 'a', getter);
-/******/ 		return getter;
-/******/ 	};
-/******/
-/******/ 	// Object.prototype.hasOwnProperty.call
-/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ 	// __webpack_public_path__
-/******/ 	__webpack_require__.p = "";
-/******/
-/******/
-/******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = "./js/src/blocks.js");
-/******/ })
-/************************************************************************/
-/******/ ({
-
-/***/ "./js/src/blocks.js":
-/*!**************************!*\
-  !*** ./js/src/blocks.js ***!
-  \**************************/
-/*! exports provided: cloudinaryBlocks */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "cloudinaryBlocks", function() { return cloudinaryBlocks; });
-/* harmony import */ var _components_video__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/video */ "./js/src/components/video.js");
-/* global window */
-
-/**
- * Main JS.
- */
-// Components
- // jQuery, because reasons.
-
-var $ = window.$ = window.jQuery; // Global Constants
-
-var cloudinaryBlocks = {
-  Video: _components_video__WEBPACK_IMPORTED_MODULE_0__["default"]
-};
-
-/***/ }),
-
-/***/ "./js/src/components/video.js":
-/*!************************************!*\
-  !*** ./js/src/components/video.js ***!
-  \************************************/
-/*! exports provided: default */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _babel_runtime_helpers_objectSpread__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/objectSpread */ "./node_modules/@babel/runtime/helpers/objectSpread.js");
-/* harmony import */ var _babel_runtime_helpers_objectSpread__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_babel_runtime_helpers_objectSpread__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
-/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
-/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
-/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
-/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
-
-
-
-/* global window wp */
-
-
-
-
-var Video = {
-  _init: function _init() {
-    if (typeof CLD_VIDEO_PLAYER === 'undefined') {
-      return;
-    } // Gutenberg Video Settings
-
-
-    wp.hooks.addFilter('blocks.registerBlockType', 'Cloudinary/Media/Video', function (settings, name) {
-      if (name === 'core/video') {
-        if ('off' !== CLD_VIDEO_PLAYER.video_autoplay_mode) {
-          settings.attributes.autoplay.default = true;
-        }
-
-        if ('on' === CLD_VIDEO_PLAYER.video_loop) {
-          settings.attributes.loop.default = true;
-        }
-
-        if ('off' === CLD_VIDEO_PLAYER.video_controls) {
-          settings.attributes.controls.default = false;
-        }
-      }
-
-      return settings;
-    });
-  }
-};
-/* harmony default export */ __webpack_exports__["default"] = (Video); // Init.
-
-Video._init();
-
-var cldAddToggle = function cldAddToggle(settings, name) {
-  if ('core/image' === name || 'core/video' === name) {
-    if (!settings.attributes) {
-      settings.attributes = {};
-    }
-
-    settings.attributes.overwrite_transformations = {
-      type: 'boolean'
-    };
-    settings.attributes.transformations = {
-      type: 'boolean'
-    };
-  }
-
-  return settings;
-};
-
-wp.hooks.addFilter('blocks.registerBlockType', 'cloudinary/addAttributes', cldAddToggle);
-/**
- * Get AMP Lightbox toggle control.
- *
- * @param {Object} props Props.
- *
- * @return {Component} Element.
- */
-
-var TransformationsToggle = function TransformationsToggle(props) {
-  var _props$attributes = props.attributes,
-      overwrite_transformations = _props$attributes.overwrite_transformations,
-      transformations = _props$attributes.transformations,
-      setAttributes = props.setAttributes;
-
-  if (!transformations) {
-    return null;
-  }
-
-  return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["PanelBody"], {
-    title: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__["__"])('Transformations', 'cloudinary')
-  }, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__["ToggleControl"], {
-    label: Object(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__["__"])('Overwrite Transformations', 'cloudinary'),
-    checked: overwrite_transformations,
-    onChange: function onChange(value) {
-      setAttributes({
-        overwrite_transformations: value
-      });
-    }
-  }));
-};
-
-var ImageInspectorControls = function ImageInspectorControls(props) {
-  var setAttributes = props.setAttributes,
-      media = props.media;
-  var InspectorControls = wp.editor.InspectorControls;
-
-  if (media && media.transformations) {
-    setAttributes({
-      transformations: true
-    });
-  }
-
-  return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(InspectorControls, null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(TransformationsToggle, props));
-};
-
-ImageInspectorControls = Object(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__["withSelect"])(function (select, ownProps) {
-  return _babel_runtime_helpers_objectSpread__WEBPACK_IMPORTED_MODULE_0___default()({}, ownProps, {
-    media: ownProps.attributes.id ? select('core').getMedia(ownProps.attributes.id) : null
-  });
-})(ImageInspectorControls);
-
-var cldFilterBlocksEdit = function cldFilterBlocksEdit(BlockEdit) {
-  return function (props) {
-    var name = props.name;
-    var shouldDisplayInspector = 'core/image' === name || 'core/video' === name;
-    return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, shouldDisplayInspector ? Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(ImageInspectorControls, props) : null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["createElement"])(BlockEdit, props));
-  };
-};
-
-wp.hooks.addFilter('editor.BlockEdit', 'cloudinary/filterEdit', cldFilterBlocksEdit, 20);
-
-var cldfilterBlocksSave = function cldfilterBlocksSave(element, blockType, attributes) {
-  if ('core/image' === blockType.name && attributes.overwrite_transformations) {
-    var children = Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(element.props.children);
-    var classname = children.props.children[0].props.className ? children.props.children[0].props.className : '';
-    var child = Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(children.props.children[0], {
-      className: classname + ' cld-overwrite'
-    });
-    var neChildren = Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(children, {
-      children: [child, false]
-    });
-    return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(element, {
-      children: neChildren
-    });
-  }
-
-  if ('core/video' === blockType.name && attributes.overwrite_transformations) {
-    var _children = Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(element.props.children[0], {
-      className: ' cld-overwrite'
-    });
-
-    return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__["cloneElement"])(element, {
-      children: _children
-    });
-  }
-
-  return element;
-};
-
-wp.hooks.addFilter('blocks.getSaveElement', 'cloudinary/filterSave', cldfilterBlocksSave);
-
-/***/ }),
-
-/***/ "./node_modules/@babel/runtime/helpers/defineProperty.js":
-/*!***************************************************************!*\
-  !*** ./node_modules/@babel/runtime/helpers/defineProperty.js ***!
-  \***************************************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-function _defineProperty(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-
-  return obj;
-}
-
-module.exports = _defineProperty;
-
-/***/ }),
-
-/***/ "./node_modules/@babel/runtime/helpers/objectSpread.js":
-/*!*************************************************************!*\
-  !*** ./node_modules/@babel/runtime/helpers/objectSpread.js ***!
-  \*************************************************************/
-/*! no static exports found */
-/***/ (function(module, exports, __webpack_require__) {
-
-var defineProperty = __webpack_require__(/*! ./defineProperty */ "./node_modules/@babel/runtime/helpers/defineProperty.js");
-
-function _objectSpread(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? Object(arguments[i]) : {};
-    var ownKeys = Object.keys(source);
-
-    if (typeof Object.getOwnPropertySymbols === 'function') {
-      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-      }));
-    }
-
-    ownKeys.forEach(function (key) {
-      defineProperty(target, key, source[key]);
-    });
-  }
-
-  return target;
-}
-
-module.exports = _objectSpread;
-
-/***/ }),
-
-/***/ "@wordpress/components":
-/*!*********************************************!*\
-  !*** external {"this":["wp","components"]} ***!
-  \*********************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-(function() { module.exports = this["wp"]["components"]; }());
-
-/***/ }),
-
-/***/ "@wordpress/data":
-/*!***************************************!*\
-  !*** external {"this":["wp","data"]} ***!
-  \***************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-(function() { module.exports = this["wp"]["data"]; }());
-
-/***/ }),
-
-/***/ "@wordpress/element":
-/*!******************************************!*\
-  !*** external {"this":["wp","element"]} ***!
-  \******************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-(function() { module.exports = this["wp"]["element"]; }());
-
-/***/ }),
-
-/***/ "@wordpress/i18n":
-/*!***************************************!*\
-  !*** external {"this":["wp","i18n"]} ***!
-  \***************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-(function() { module.exports = this["wp"]["i18n"]; }());
-
-/***/ })
-
-/******/ });
-//# sourceMappingURL=block-editor.js.map
\ No newline at end of file
+!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=6)}([function(e,t){!function(){e.exports=this.wp.element}()},function(e,t){!function(){e.exports=this.wp.i18n}()},function(e,t){!function(){e.exports=this.wp.components}()},function(e,t,r){var n=r(5);e.exports=function(e){for(var t=1;t= 100 && typeof data.started !== 'undefined' ) {\n\t\t\tthis.submitButton.style.display = this.hide;\n\t\t\tthis.stopButton.style.display = this.show;\n\t\t}\n\t\telse if ( data.pending > 0 ) {\n\t\t\tthis.submitButton.style.display = this.show;\n\t\t\tthis.stopButton.style.display = this.hide;\n\t\t}\n\t\telse if ( data.processing > 0 ) {\n\t\t\tthis.stopButton.style.display = this.show;\n\t\t}\n\t\telse {\n\t\t\tthis.stopButton.style.display = this.hide;\n\t\t}\n\n\t\tif ( data.percent < 100 ) {\n\t\t\tthis.barSyncCount.innerText = data.total;\n\t\t\tthis.progressCount.innerText = data.done;\n\t\t\tthis.progress.style.display = this.show;\n\t\t}\n\t\telse {\n\t\t\tthis.completed.style.display = this.show;\n\t\t\tthis.progress.style.display = this.hide;\n\t\t}\n\t},\n\t_start: function _start( e ) {\n\t\te.preventDefault();\n\t\tSync.stopButton.style.display = Sync.show;\n\t\tSync.submitButton.style.display = Sync.hide;\n\t\tSync.pushAttachments();\n\t},\n\t_reset: function _reset( e ) {\n\t\tSync.submitButton.style.display = Sync.hide;\n\t\tSync.getStatus();\n\t},\n\t_init: function( fn ) {\n\n\t\tif ( typeof cloudinaryApi !== 'undefined' ) {\n\t\t\tif ( document.attachEvent ? document.readyState === 'complete' : document.readyState !== 'loading' ) {\n\t\t\t\tfn();\n\t\t\t}\n\t\t\telse {\n\t\t\t\tdocument.addEventListener( 'DOMContentLoaded', fn );\n\t\t\t}\n\t\t}\n\t},\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Sync);\n\n// Init.\nSync._init( function() {\n\tSync._reset();\n\tSync.submitButton.addEventListener( 'click', Sync._start );\n\tSync.stopButton.addEventListener( 'click', Sync.stopSync );\n} );\n\n\n//# sourceURL=webpack:///./js/src/components/sync.js?");
-
-/***/ }),
-
-/***/ "./js/src/components/terms_order.js":
-/*!******************************************!*\
-  !*** ./js/src/components/terms_order.js ***!
-  \******************************************/
-/*! exports provided: Terms_Order */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Terms_Order\", function() { return Terms_Order; });\n/* global window wp wpAjax */\n\nconst Terms_Order = {\n\ttemplate: '',\n\ttags: jQuery( '#cld-tax-items' ),\n\ttagDelimiter: (window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter) || ',',\n\tstartId: null,\n\t_init: function() {\n\t\t// Check that we found the tax-items.\n\t\tif ( ! this.tags.length ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst self = this;\n\t\tthis._sortable();\n\n\t\t// Setup ajax overrides.\n\t\tif ( typeof wpAjax !== 'undefined' ) {\n\t\t\twpAjax.procesParseAjaxResponse = wpAjax.parseAjaxResponse;\n\t\t\twpAjax.parseAjaxResponse = function( response, settingsResponse, element ) {\n\t\t\t\tlet newResponse = wpAjax.procesParseAjaxResponse( response, settingsResponse, element );\n\t\t\t\tif ( !newResponse.errors && newResponse.responses[ 0 ] ) {\n\t\t\t\t\tif ( jQuery( '[data-taxonomy=\"' + newResponse.responses[ 0 ].what + '\"]' ).length ) {\n\t\t\t\t\t\tconst data = jQuery( newResponse.responses[ 0 ].data );\n\t\t\t\t\t\tconst text = data.find( 'label' ).last().text().trim();\n\n\t\t\t\t\t\tself._pushItem( newResponse.responses[ 0 ].what, text );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn newResponse;\n\t\t\t};\n\t\t}\n\n\t\tif ( typeof window.tagBox !== 'undefined' ) {\n\t\t\twindow.tagBox.processflushTags = window.tagBox.flushTags;\n\t\t\twindow.tagBox.flushTags = function( el, a, f ) {\n\t\t\t\tif ( typeof f === 'undefined' ) {\n\t\t\t\t\tlet text, list;\n\t\t\t\t\tconst taxonomy = el.prop( 'id' );\n\t\t\t\t\tconst\tnewTag = jQuery( 'input.newtag', el );\n\n\t\t\t\t\ta = a || false;\n\n\t\t\t\t\ttext = a ? jQuery( a ).text() : newTag.val();\n\t\t\t\t\tlist = window.tagBox.clean( text ).split( self.tagDelimiter );\n\n\t\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t\t.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )\n\t\t\t\t\t\t.done( tags => {\n\t\t\t\t\t\t\tself.startId = self.startId === null ? tags[0].id + 1 : ++self.startId;\n\t\t\t\t\t\t\tconst tag = taxonomy + ':' + self.startId;\n\t\t\t\t\t\t\tif ( ! jQuery( '[data-item=\"' + tag + '\"]' ).length ) {\n\t\t\t\t\t\t\t\tself._pushItem( tag, list[ list.length - 1 ] );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\treturn this.processflushTags( el, a, f );\n\t\t\t};\n\n\t\t\twindow.tagBox.processTags = window.tagBox.parseTags;\n\n\t\t\twindow.tagBox.parseTags = function( el ) {\n\t\t\t\tconst id = el.id;\n\t\t\t\tconst num = id.split( '-check-num-' )[ 1 ];\n\t\t\t\tconst taxonomy = id.split( '-check-num-' )[ 0 ];\n\t\t\t\tconst taxBox = jQuery( el ).closest( '.tagsdiv' );\n\t\t\t\tconst tagsTextarea = taxBox.find( '.the-tags' );\n\t\t\t\tconst tagToRemove = window.tagBox.clean( tagsTextarea.val() ).split( self.tagDelimiter )[ num ];\n\n\t\t\t\tnew wp.api.collections.Tags()\n\t\t\t\t\t.fetch( { data: { slug: tagToRemove } } )\n\t\t\t\t\t.done( ( tag ) => {\n\t\t\t\t\t\tconst tagFromDatabase = tag.length ? jQuery( '[data-item=\"' + taxonomy + ':' + tag[0].id + '\"]' ) : false;\n\n\t\t\t\t\t\tif ( tagFromDatabase.length ) {\n\t\t\t\t\t\t\ttagFromDatabase.remove();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tjQuery( `.cld-tax-order-list-item:contains(${tagToRemove})` ).remove();\n\t\t\t\t\t\t\t--self.startId;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.processTags( el );\n\t\t\t\t\t} );\n\t\t\t};\n\t\t}\n\n\t\tjQuery( 'body' ).on( 'change', '.selectit input', function() {\n\t\t\tconst clickedItem = jQuery( this );\n\t\t\tconst id = clickedItem.val();\n\t\t\tconst checked = clickedItem.is( ':checked' );\n\t\t\tconst text = clickedItem.parent().text().trim();\n\n\t\t\tif ( true === checked ) {\n\t\t\t\tself._pushItem( `category:${id}`, text );\n\t\t\t} else {\n\t\t\t\tself.tags.find( `[data-item=\"category:${id}\"]` ).remove();\n\t\t\t}\n\t\t} );\n\t},\n\t_createItem: function( id, name ) {\n\t\tconst li = jQuery( '
    • ' );\n\t\tconst icon = jQuery( '' );\n\t\tconst input = jQuery( '' );\n\n\t\tli.addClass( 'cld-tax-order-list-item' ).attr( 'data-item', id );\n\t\tinput.addClass( 'cld-tax-order-list-item-input' ).attr( 'type', 'hidden' ).attr( 'name', 'cld_tax_order[]' ).val( id );\n\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\tli.append( icon ).append( name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\n\t\treturn li;\n\t},\n\t_pushItem: function( id, text ) {\n\t\tlet item = this._createItem( id, text );\n\t\tthis.tags.append( item ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t},\n\t_sortable: function() {\n\t\tconst items = jQuery( '.cld-tax-order-list' );\n\n\t\titems.sortable( {\n\t\t\tconnectWith: '.cld-tax-order',\n\t\t\taxis: 'y',\n\t\t\thandle: '.cld-tax-order-list-item-handle',\n\t\t\tplaceholder: 'cld-tax-order-list-item-placeholder',\n\t\t\tforcePlaceholderSize: true,\n\t\t\thelper: 'clone',\n\t\t} );\n\t}\n};\n\nif ( typeof window.CLDN !== 'undefined' ) {\n\tTerms_Order._init();\n}\n\n// Gutenberg.\nif ( wp.data && wp.data.select( 'core/editor' ) ) {\n\tconst orderSet = {};\n\twp.data.subscribe( function() {\n\t\tlet taxonomies = wp.data.select( 'core' ).getTaxonomies();\n\n\t\tif ( taxonomies ) {\n\t\t\tfor (let t in taxonomies) {\n\t\t\t\tconst set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );\n\t\t\t\torderSet[ taxonomies[ t ].slug ] = set;\n\t\t\t}\n\t\t}\n\t} );\n\n\tconst el = wp.element.createElement;\n\tconst CustomizeTaxonomySelector = ( OriginalComponent ) => {\n\t\tclass CustomHandler extends OriginalComponent {\n\t\t\tconstructor(props) {\n\t\t\t\tsuper(props)\n\n\t\t\t\tthis.currentItems = jQuery( '.cld-tax-order-list-item' )\n\t\t\t\t\t.map( ( _, taxonomy ) => jQuery( taxonomy ).data( 'item' ) ).get();\n\t\t\t}\n\n\t\t\tmakeItem( item ) {\n\t\t\t\t// Prevent duplicates in the tax order box\n\t\t\t\tif (this.currentItems.includes( this.getId( item ) ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst row = this.makeElement( item );\n\t\t\t\tconst box = jQuery( '#cld-tax-items' );\n\t\t\t\tbox.append( row ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\t\t\t}\n\n\t\t\tremoveItem( item ) {\n\t\t\t\tconst elementWithId = jQuery( `[data-item=\"${this.getId(item)}\"]` );\n\n\t\t\t\tif ( elementWithId.length ) {\n\t\t\t\t\telementWithId.remove();\n\n\t\t\t\t\tthis.currentItems = this.currentItems.filter( ( taxIdentifier ) => {\n\t\t\t\t\t\treturn taxIdentifier !== this.getId(item);\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfindOrCreateTerm( termName ) {\n\t\t\t\ttermName = super.findOrCreateTerm( termName );\n\t\t\t\ttermName.then( ( item ) => this.makeItem( item ) );\n\n\t\t\t\treturn termName;\n\t\t\t}\n\n\t\t\tonChange( event ) {\n\t\t\t\tsuper.onChange( event );\n\t\t\t\tconst item = this.pickItem( event );\n\n\t\t\t\tif ( item ) {\n\t\t\t\t\tif ( orderSet[ this.props.slug ].includes( item.id ) ) {\n\t\t\t\t\t\tthis.makeItem( item );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.removeItem( item );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tpickItem( event ) {\n\t\t\t\tif ( typeof event === 'object' ) {\n\t\t\t\t\tif ( event.target ) {\n\t\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === parseInt( event.target.value ) ) {\n\t\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t// Tags that are already registered need to be selected separately\n\t\t\t\t\t// as its expected that they return back with an \"id\" property.\n\t\t\t\t\t} else if ( Array.isArray( event ) ) {\n\t\t\t\t\t\t// Figure out the diff between the current state and the event and determine which tag is getting removed\n\t\t\t\t\t\tlet enteredTag = this.state.selectedTerms.filter( flatItem => !event.includes( flatItem ) )[0];\n\n\t\t\t\t\t\tif ( typeof enteredTag === 'undefined' ) {\n\t\t\t\t\t\t\t// If the above returns undefined, then we presume the user is adding, so reverse the logic to figure out the new item\n\t\t\t\t\t\t\tenteredTag = event.filter( flatItem => !this.state.selectedTerms.includes( flatItem ) )[0];\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn this.state.availableTerms.find( ( item ) => item.name === enteredTag );\n\t\t\t\t\t}\n\t\t\t\t} else if ( typeof event === 'number' ) {\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].id === event ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tlet text;\n\n\t\t\t\t\t// add or remove.\n\t\t\t\t\tif ( event.length > this.state.selectedTerms.length ) {\n\t\t\t\t\t\t// Added.\n\t\t\t\t\t\tfor (let o in event) {\n\t\t\t\t\t\t\tif ( this.state.selectedTerms.indexOf( event[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = event[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// removed.\n\t\t\t\t\t\tfor (let o in this.state.selectedTerms) {\n\t\t\t\t\t\t\tif ( event.indexOf( this.state.selectedTerms[ o ] ) === -1 ) {\n\t\t\t\t\t\t\t\ttext = this.state.selectedTerms[ o ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tfor (let p in this.state.availableTerms) {\n\t\t\t\t\t\tif ( this.state.availableTerms[ p ].name === text ) {\n\t\t\t\t\t\t\treturn this.state.availableTerms[ p ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tgetId(item) {\n\t\t\t\treturn `${this.props.slug}:${item.id}`\n\t\t\t}\n\n\t\t\tmakeElement( item ) {\n\t\t\t\tconst li = jQuery( '
    • ' );\n\t\t\t\tconst\ticon = jQuery( '' );\n\t\t\t\tconst\tinput = jQuery( '' );\n\n\t\t\t\tli\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item' )\n\t\t\t\t\t.attr( 'data-item', this.getId(item) );\n\n\t\t\t\tinput\n\t\t\t\t\t.addClass( 'cld-tax-order-list-item-input' )\n\t\t\t\t\t.attr( 'type', 'hidden' )\n\t\t\t\t\t.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );\n\n\t\t\t\ticon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );\n\n\t\t\t\tli.append( icon ).append( item.name ).append( input ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.append\n\n\t\t\t\treturn li;\n\t\t\t}\n\t\t}\n\n\t\treturn ( props ) => el( CustomHandler, props );\n\t};\n\n\twp.hooks.addFilter(\n\t\t'editor.PostTaxonomyType',\n\t\t'cld',\n\t\tCustomizeTaxonomySelector\n\t);\n}\n\n\n//# sourceURL=webpack:///./js/src/components/terms_order.js?");
-
-/***/ }),
-
-/***/ "./js/src/components/widget.js":
-/*!*************************************!*\
-  !*** ./js/src/components/widget.js ***!
-  \*************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-eval("/* global window wp Backbone */\nif ( wp.media && window.CLDN ) {\n\n\twp.media.events.on( 'editor:image-edit', function( props ){\n\t\tprops.metadata.cldoverwrite = null;\n\t\tlet classes = props.image.className.split( ' ' );\n\t\tif( classes.indexOf('cld-overwrite' ) >= 0 ){\n\t\t\tprops.metadata.cldoverwrite = 'true';\n\t\t}\n\t} );\n\twp.media.events.on( 'editor:image-update', function( props ){\n\t\tlet classes = props.image.className.split( ' ' );\n\t\tif( props.metadata.cldoverwrite && classes.indexOf('cld-overwrite' ) === -1 ) {\n\t\t\tclasses.push( 'cld-overwrite' );\n\t\t} else if( ! props.metadata.cldoverwrite && classes.indexOf('cld-overwrite' ) >= 0 ) {\n\t\t\tdelete classes[ classes.indexOf('cld-overwrite' ) ];\n\t\t}\n\n\t\tprops.image.className = classes.join( ' ' );\n\t} );\n\n\t// Intercept props and inject cld-overwrite class.\n\tlet currentOverwrite = null;\n\tlet imageProps = wp.media.string.props;\n\twp.media.string.props = function( props, asset ){\n\t\tif( props.cldoverwrite ){\n\t\t\tprops.classes = [ 'cld-overwrite' ];\n\t\t\tcurrentOverwrite = true;\n\t\t}\n\t\tlet newProps = imageProps( props, asset );\n\t\treturn newProps;\n\t}\n\t// Intercept ajax post, and send the cld-overwrite flag, and transformations.\n\twp.media.post = function( action, data ) {\n\n\t\tif ( 'send-attachment-to-editor' === action ) {\n\t\t\tlet state  = wp.media.editor.get().state();\n\t\t\tlet attach = state.get( 'selection' ).get( data.attachment );\n\t\t\tif ( attach.attributes.transformations ) {\n\t\t\t\tdata.attachment.transformations = attach.attributes.transformations;\n\t\t\t}\n\t\t\tif( data.html.indexOf('cld-overwrite') > -1 || true === currentOverwrite ){\n\t\t\t\tdata.attachment.cldoverwrite = true;\n\t\t\t\tcurrentOverwrite = null;\n\t\t\t}\n\n\t\t}\n\t\t// Return the original.\n\t\treturn wp.ajax.post( action, data );\n\t};\n\n\tlet Library                           = wp.media.controller.Library;\n\tlet MediaFrame                        = wp.media.view.MediaFrame.Select;\n\tlet MediaFramePost                    = wp.media.view.MediaFrame.Post;\n\tlet MediaFrameImageDetails            = wp.media.view.MediaFrame.ImageDetails;\n\tlet MediaFrameVideoDetails            = wp.media.view.MediaFrame.VideoDetails;\n\tlet Cloudinary                        = wp.media.View.extend( {\n\t\ttagName: 'div',\n\t\tclassName: 'cloudinary-widget',\n\t\ttemplate: wp.template( 'cloudinary-dam' ),\n\t\tactive: false,\n\t\ttoolbar: null,\n\t\tframe: null,\n\t\tready: function() {\n\t\t\tlet controller          = this.controller;\n\t\t\tlet selection           = this.model.get( 'selection' );\n\t\t\tlet library             = this.model.get( 'library' );\n\t\t\tlet attachment          = wp.media.model.Attachment;\n\t\t\t// Set widget to same as model.\n\t\t\tCLDN.mloptions.multiple = controller.options.multiple;\n\t\t\tif ( this.cid !== this.active ) {\n\t\t\t\tCLDN.mloptions.inline_container = '#cloudinary-dam-' + controller.cid;\n\t\t\t\tif ( 1 === selection.length ) {\n\t\t\t\t\tvar att = attachment.get( selection.models[ 0 ].id );\n\t\t\t\t\tif ( typeof att.attributes.public_id !== 'undefined' ) {\n\t\t\t\t\t\tCLDN.mloptions.asset = {resource_id: att.attributes.public_id };\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tCLDN.mloptions.asset = null;\n\t\t\t\t}\n\t\t\t\twindow.ml = cloudinary.openMediaLibrary( CLDN.mloptions, {\n\t\t\t\t\t\tinsertHandler: function( data ) {\n\t\t\t\t\t\t\tfor (let i = 0; i < data.assets.length; i++) {\n\t\t\t\t\t\t\t\tlet temp = data.assets[ i ];\n\t\t\t\t\t\t\t\twp.media.post( 'cloudinary-down-sync', {\n\t\t\t\t\t\t\t\t\tnonce: CLDN.nonce,\n\t\t\t\t\t\t\t\t\tasset: temp,\n\t\t\t\t\t\t\t\t} ).done( function( asset ) {\n\t\t\t\t\t\t\t\t\tlet update_asset = function( asset, attach ){\n\t\t\t\t\t\t\t\t\t\tasset.uploading = false;\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.remove( attach );\n\t\t\t\t\t\t\t\t\t\tif ( wp.Uploader.queue.length === 0 ) {\n\t\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.reset();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( typeof asset.fetch !== 'undefined' ) {\n\n\t\t\t\t\t\t\t\t\t\tlet attach = attachment.get( asset.attachment_id );\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\tlibrary.add( attach );\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.add( attach );\n\t\t\t\t\t\t\t\t\t\twp.ajax.send( {\n\t\t\t\t\t\t\t\t\t\t\turl: asset.fetch,\n\t\t\t\t\t\t\t\t\t\t\tbeforeSend: function( request ) {\n\t\t\t\t\t\t\t\t\t\t\t\trequest.setRequestHeader( 'X-WP-Nonce', CLDN.nonce );\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\t\tsrc: asset.url,\n\t\t\t\t\t\t\t\t\t\t\t\tfilename: asset.filename,\n\t\t\t\t\t\t\t\t\t\t\t\tattachment_id: asset.attachment_id,\n\t\t\t\t\t\t\t\t\t\t\t\ttransformations: asset.transformations\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} ).done( function( asset ) {\n\t\t\t\t\t\t\t\t\t\t\tlet attach      = attachment.get( asset.id );\n\t\t\t\t\t\t\t\t\t\t\tupdate_asset( asset, attach );\n\t\t\t\t\t\t\t\t\t\t} ).fail( function( data ) {\n\t\t\t\t\t\t\t\t\t\t\tupdate_asset( asset, attach );\n\t\t\t\t\t\t\t\t\t\t\tlibrary.remove( attach );\n\t\t\t\t\t\t\t\t\t\t\tselection.remove( attach );\n\n\t\t\t\t\t\t\t\t\t\t\tif( typeof data === 'string' ) {\n\t\t\t\t\t\t\t\t\t\t\t\talert( data );\n\t\t\t\t\t\t\t\t\t\t\t}else{\n\t\t\t\t\t\t\t\t\t\t\t\tif( data.status === 500 ){\n\t\t\t\t\t\t\t\t\t\t\t\t\talert('HTTP error.');\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\telse {\n\n\t\t\t\t\t\t\t\t\t\tlet attach = attachment.get( asset.id );\n\t\t\t\t\t\t\t\t\t\tattach.set( asset );\n\t\t\t\t\t\t\t\t\t\tselection.add( attach );\n\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( wp.Uploader.queue.length === 0 ) {\n\t\t\t\t\t\t\t\t\t\twp.Uploader.queue.reset();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tcontroller.content.mode( 'browse' );\n\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t\tdocument.querySelectorAll( '.dam-cloudinary' )[ 0 ]\n\t\t\t\t);\n\t\t\t}\n\t\t\tthis.active = this.cid;\n\t\t\treturn this;\n\t\t},\n\t} );\n\tlet extend_type                       = function( type ) {\n\t\tlet obj = {\n\n\t\t\t/**\n\t\t\t * Bind region mode event callbacks.\n\t\t\t *\n\t\t\t * @see media.controller.Region.render\n\t\t\t */\n\t\t\tbindHandlers: function() {\n\t\t\t\ttype.prototype.bindHandlers.apply( this, arguments );\n\t\t\t\tthis.on( 'content:render:cloudinary', this.cloudinaryContent, this );\n\n\t\t\t},\n\n\t\t\t/**\n\t\t\t * Render callback for the router region in the `browse` mode.\n\t\t\t *\n\t\t\t * @param {wp.media.view.Router} routerView\n\t\t\t */\n\t\t\tbrowseRouter: function( routerView ) {\n\n\t\t\t\ttype.prototype.browseRouter.apply( this, arguments );\n\t\t\t\tlet state_id = this.state().get( 'id' );\n\t\t\t\trouterView.set( {\n\t\t\t\t\tcloudinary: {\n\t\t\t\t\t\ttext: 'Cloudinary',\n\t\t\t\t\t\tpriority: 60\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t/**\n\t\t\t * Render callback for the content region in the `upload` mode.\n\t\t\t */\n\t\t\tcloudinaryContent: function( contentRegion ) {\n\t\t\t\tlet state = this.state();\n\t\t\t\tlet view  = new Cloudinary( {\n\t\t\t\t\tcontroller: this,\n\t\t\t\t\tmodel: state,\n\t\t\t\t} ).render();\n\t\t\t\tthis.content.set( view );\n\t\t\t},\n\t\t};\n\n\t\treturn obj;\n\t};\n\t// Extending the current media library frames to add a new tab to each area.\n\twp.media.view.MediaFrame.Select       = MediaFrame.extend( extend_type( MediaFrame ) );\n\twp.media.view.MediaFrame.Post         = MediaFramePost.extend( extend_type( MediaFramePost ) );\n\twp.media.view.MediaFrame.ImageDetails = MediaFrameImageDetails.extend( extend_type( MediaFrameImageDetails ) );\n\twp.media.view.MediaFrame.VideoDetails = MediaFrameVideoDetails.extend( extend_type( MediaFrameVideoDetails ) );\n\n}\n\n\n//# sourceURL=webpack:///./js/src/components/widget.js?");
-
-/***/ }),
-
-/***/ "./js/src/main.js":
-/*!************************!*\
-  !*** ./js/src/main.js ***!
-  \************************/
-/*! exports provided: cloudinary */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"cloudinary\", function() { return cloudinary; });\n/* harmony import */ var _components_settings_page__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/settings-page */ \"./js/src/components/settings-page.js\");\n/* harmony import */ var _components_settings_page__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_components_settings_page__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _components_sync__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/sync */ \"./js/src/components/sync.js\");\n/* harmony import */ var _components_widget__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/widget */ \"./js/src/components/widget.js\");\n/* harmony import */ var _components_widget__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_components_widget__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _components_global_transformations__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/global-transformations */ \"./js/src/components/global-transformations.js\");\n/* harmony import */ var _components_terms_order__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/terms_order */ \"./js/src/components/terms_order.js\");\n/* harmony import */ var _components_media_library__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/media-library */ \"./js/src/components/media-library.js\");\n/* harmony import */ var _css_src_main_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../css/src/main.scss */ \"./css/src/main.scss\");\n/* harmony import */ var _css_src_main_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_css_src_main_scss__WEBPACK_IMPORTED_MODULE_6__);\n/* global window */\n/**\n * Main JS.\n */\n\n// Components\n\n\n\n\n\n\n\n\n\n// jQuery, because reasons.\nconst $ = window.$ = window.jQuery;\n\n// Global Constants\nconst cloudinary = {\n\tsettings: (_components_settings_page__WEBPACK_IMPORTED_MODULE_0___default()),\n\tsync: _components_sync__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n\twidget: (_components_widget__WEBPACK_IMPORTED_MODULE_2___default()),\n\tGlobal_Transformations: _components_global_transformations__WEBPACK_IMPORTED_MODULE_3__[\"default\"],\n\tTerms_Order: _components_terms_order__WEBPACK_IMPORTED_MODULE_4__[\"default\"],\n\tMedia_Library: _components_media_library__WEBPACK_IMPORTED_MODULE_5__[\"default\"],\n};\n\n\n\n//# sourceURL=webpack:///./js/src/main.js?");
-
-/***/ })
-
-/******/ });
\ No newline at end of file
+!function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(n,s,function(t){return e[t]}.bind(null,s));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=3)}([function(e,t){window,jQuery,jQuery(document).ready((function(e){e(document).on("tabs.init",(function(){var t=e(".settings-tab-trigger"),i=e(".settings-tab-section");e(this).on("click",".settings-tab-trigger",(function(n){var s=e(this),a=e(s.attr("href"));n.preventDefault(),t.removeClass("active"),i.removeClass("active"),s.addClass("active"),a.addClass("active"),e(document).trigger("settings.tabbed",s)})),e(".cld-field").not('[data-condition="false"]').each((function(){const t=e(this),i=t.data("condition");for(let n in i){const s=i[n],a=e("#field-"+n),o=t.closest("tr");a.on("change init",(function(){this.value===s||this.checked?o.show():o.hide()})),a.trigger("init")}})),e("#field-cloudinary_url").on("input change",(function(){let t=e(this),i=t.val();new RegExp(/^(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g).test(i)?(t.addClass("settings-valid-field"),t.removeClass("settings-invalid-field")):(t.removeClass("settings-valid-field"),t.addClass("settings-invalid-field"))})).trigger("change")})),e(".render-trigger[data-event]").each((function(){var t=e(this),i=t.data("event");t.trigger(i,this)}))}))},function(e,t){if(wp.media&&window.CLDN){wp.media.events.on("editor:image-edit",(function(e){e.metadata.cldoverwrite=null,e.image.className.split(" ").indexOf("cld-overwrite")>=0&&(e.metadata.cldoverwrite="true")})),wp.media.events.on("editor:image-update",(function(e){let t=e.image.className.split(" ");e.metadata.cldoverwrite&&-1===t.indexOf("cld-overwrite")?t.push("cld-overwrite"):!e.metadata.cldoverwrite&&t.indexOf("cld-overwrite")>=0&&delete t[t.indexOf("cld-overwrite")],e.image.className=t.join(" ")}));let e=null,t=wp.media.string.props;wp.media.string.props=function(i,n){return i.cldoverwrite&&(i.classes=["cld-overwrite"],e=!0),t(i,n)},wp.media.post=function(t,i){if("send-attachment-to-editor"===t){let t=wp.media.editor.get().state().get("selection").get(i.attachment);t.attributes.transformations&&(i.attachment.transformations=t.attributes.transformations),(i.html.indexOf("cld-overwrite")>-1||!0===e)&&(i.attachment.cldoverwrite=!0,e=null)}return wp.ajax.post(t,i)};wp.media.controller.Library;let i=wp.media.view.MediaFrame.Select,n=wp.media.view.MediaFrame.Post,s=wp.media.view.MediaFrame.ImageDetails,a=wp.media.view.MediaFrame.VideoDetails,o=wp.media.View.extend({tagName:"div",className:"cloudinary-widget",template:wp.template("cloudinary-dam"),active:!1,toolbar:null,frame:null,ready:function(){let e=this.controller,t=this.model.get("selection"),i=this.model.get("library"),n=wp.media.model.Attachment;if(CLDN.mloptions.multiple=e.options.multiple,this.cid!==this.active){if(CLDN.mloptions.inline_container="#cloudinary-dam-"+e.cid,1===t.length){var s=n.get(t.models[0].id);void 0!==s.attributes.public_id&&(CLDN.mloptions.asset={resource_id:s.attributes.public_id})}else CLDN.mloptions.asset=null;window.ml=cloudinary.openMediaLibrary(CLDN.mloptions,{insertHandler:function(s){for(let a=0;a=100&&void 0!==e.started?(this.submitButton.style.display=this.hide,this.stopButton.style.display=this.show):e.pending>0?(this.submitButton.style.display=this.show,this.stopButton.style.display=this.hide):e.processing>0?this.stopButton.style.display=this.show:this.stopButton.style.display=this.hide,e.percent<100?(this.barSyncCount.innerText=e.total,this.progressCount.innerText=e.done,this.progress.style.display=this.show):(this.completed.style.display=this.show,this.progress.style.display=this.hide)},_start:function(e){e.preventDefault(),a.stopButton.style.display=a.show,a.submitButton.style.display=a.hide,a.pushAttachments()},_reset:function(e){a.submitButton.style.display=a.hide,a.getStatus()},_init:function(e){"undefined"!=typeof cloudinaryApi&&((document.attachEvent?"complete"===document.readyState:"loading"!==document.readyState)?e():document.addEventListener("DOMContentLoaded",e))}};var o=a;a._init((function(){a._reset(),a.submitButton.addEventListener("click",a._start),a.stopButton.addEventListener("click",a.stopSync)}));var r=i(1),l=i.n(r);const d={sample:{image:document.getElementById("transformation-sample-image"),video:document.getElementById("transformation-sample-video")},preview:{image:document.getElementById("sample-image"),video:document.getElementById("sample-video")},fields:document.getElementsByClassName("cld-field"),button:{image:document.getElementById("refresh-image-preview"),video:document.getElementById("refresh-video-preview")},spinner:{image:document.getElementById("image-loader"),video:document.getElementById("video-loader")},activeItem:null,elements:{image:[],video:[]},_placeItem:function(e){null!==e&&(e.style.display="block",e.style.visibility="visible",e.style.position="absolute",e.style.top=e.parentElement.clientHeight/2-e.clientHeight/2+"px",e.style.left=e.parentElement.clientWidth/2-e.clientWidth/2+"px")},_setLoading:function(e){this.button[e].style.display="block",this._placeItem(this.button[e]),this.preview[e].style.opacity="0.1"},_build:function(e){this.sample[e].innerHTML="",this.elements[e]=[];for(let t of this.fields){if(e!==t.dataset.context)continue;let i=t.value.trim();if(i.length){if("select-one"===t.type){if("none"===i)continue;i=t.dataset.meta+"_"+i}else{let e=t.dataset.context;i=this._transformations(i,e,!0)}i&&this.elements[e].push(i)}}let t="";this.elements[e].length&&(t="/"+this.elements[e].join(",").replace(/ /g,"%20")),this.sample[e].textContent=t,this.sample[e].parentElement.href="https://res.cloudinary.com/demo/"+this.sample[e].parentElement.innerText.trim().replace("../","").replace(/ /g,"%20")},_clearLoading:function(e){this.spinner[e].style.visibility="hidden",this.activeItem=null,this.preview[e].style.opacity=1},_refresh:function(e,t){e&&e.preventDefault();let i=this,n=CLD_GLOBAL_TRANSFORMATIONS[t].preview_url+i.elements[t].join(",")+CLD_GLOBAL_TRANSFORMATIONS[t].file;if(this.button[t].style.display="none",this._placeItem(this.spinner[t]),"image"===t){let e=new Image;e.onload=function(){i.preview[t].src=this.src,i._clearLoading(t),e.remove()},e.onerror=function(){alert(CLD_GLOBAL_TRANSFORMATIONS[t].error),i._clearLoading(t)},e.src=n}else{let e=i._transformations(i.elements[t].join(","),t);samplePlayer.source({publicId:"dog",transformation:e}),i._clearLoading(t)}},_transformations:function(e,t,i=!1){let n=CLD_GLOBAL_TRANSFORMATIONS[t].valid_types,s=null,a=e.split("/"),o=[];for(let e=0;e{e.startId=null===e.startId?t[0].id+1:++e.startId;const i=a+":"+e.startId;jQuery('[data-item="'+i+'"]').length||e._pushItem(i,s[s.length-1])})}return this.processflushTags(t,i,n)},window.tagBox.processTags=window.tagBox.parseTags,window.tagBox.parseTags=function(t){const i=t.id,n=i.split("-check-num-")[1],s=i.split("-check-num-")[0],a=jQuery(t).closest(".tagsdiv").find(".the-tags"),o=window.tagBox.clean(a.val()).split(e.tagDelimiter)[n];(new wp.api.collections.Tags).fetch({data:{slug:o}}).done(i=>{const n=!!i.length&&jQuery('[data-item="'+s+":"+i[0].id+'"]');n.length?n.remove():(jQuery(`.cld-tax-order-list-item:contains(${o})`).remove(),--e.startId),this.processTags(t)})}),jQuery("body").on("change",".selectit input",(function(){const t=jQuery(this),i=t.val(),n=t.is(":checked"),s=t.parent().text().trim();!0===n?e._pushItem(`category:${i}`,s):e.tags.find(`[data-item="category:${i}"]`).remove()}))},_createItem:function(e,t){const i=jQuery("
    • "),n=jQuery(""),s=jQuery("");return i.addClass("cld-tax-order-list-item").attr("data-item",e),s.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(e),n.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),i.append(n).append(t).append(s),i},_pushItem:function(e,t){let i=this._createItem(e,t);this.tags.append(i)},_sortable:function(){jQuery(".cld-tax-order-list").sortable({connectWith:".cld-tax-order",axis:"y",handle:".cld-tax-order-list-item-handle",placeholder:"cld-tax-order-list-item-placeholder",forcePlaceholderSize:!0,helper:"clone"})}};if(void 0!==window.CLDN&&u._init(),wp.data&&wp.data.select("core/editor")){const e={};wp.data.subscribe((function(){let t=wp.data.select("core").getTaxonomies();if(t)for(let i in t){const n=wp.data.select("core/editor").getEditedPostAttribute(t[i].rest_base);e[t[i].slug]=n}}));const t=wp.element.createElement,i=i=>{class n extends i{constructor(e){super(e),this.currentItems=jQuery(".cld-tax-order-list-item").map((e,t)=>jQuery(t).data("item")).get()}makeItem(e){if(this.currentItems.includes(this.getId(e)))return;const t=this.makeElement(e);jQuery("#cld-tax-items").append(t)}removeItem(e){const t=jQuery(`[data-item="${this.getId(e)}"]`);t.length&&(t.remove(),this.currentItems=this.currentItems.filter(t=>t!==this.getId(e)))}findOrCreateTerm(e){return(e=super.findOrCreateTerm(e)).then(e=>this.makeItem(e)),e}onChange(t){super.onChange(t);const i=this.pickItem(t);i&&(e[this.props.slug].includes(i.id)?this.makeItem(i):this.removeItem(i))}pickItem(e){if("object"==typeof e){if(e.target){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===parseInt(e.target.value))return this.state.availableTerms[t]}else if(Array.isArray(e)){let t=this.state.selectedTerms.filter(t=>!e.includes(t))[0];return void 0===t&&(t=e.filter(e=>!this.state.selectedTerms.includes(e))[0]),this.state.availableTerms.find(e=>e.name===t)}}else if("number"==typeof e){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===e)return this.state.availableTerms[t]}else{let t;if(e.length>this.state.selectedTerms.length)for(let i in e)-1===this.state.selectedTerms.indexOf(e[i])&&(t=e[i]);else for(let i in this.state.selectedTerms)-1===e.indexOf(this.state.selectedTerms[i])&&(t=this.state.selectedTerms[i]);for(let e in this.state.availableTerms)if(this.state.availableTerms[e].name===t)return this.state.availableTerms[e]}}getId(e){return`${this.props.slug}:${e.id}`}makeElement(e){const t=jQuery("
    • "),i=jQuery(""),n=jQuery("");return t.addClass("cld-tax-order-list-item").attr("data-item",this.getId(e)),n.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(this.getId(e)),i.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),t.append(i).append(e.name).append(n),t}}return e=>t(n,e)};wp.hooks.addFilter("editor.PostTaxonomyType","cld",i)}const p={wpWrap:document.getElementById("wpwrap"),wpContent:document.getElementById("wpbody-content"),libraryWrap:document.getElementById("cloudinary-embed"),_init:function(){let e=this;"undefined"!=typeof CLD_ML&&(cloudinary.openMediaLibrary(CLD_ML.mloptions,{insertHandler:function(e){alert("Import is not yet implemented.")}}),window.addEventListener("resize",(function(t){e._resize()})),e._resize())},_resize:function(){let e=getComputedStyle(this.wpContent);this.libraryWrap.style.height=this.wpWrap.offsetHeight-parseInt(e.getPropertyValue("padding-bottom"))+"px"}};var m=p;p._init();i(2);i.d(t,"cloudinary",(function(){return h}));window.$=window.jQuery;const h={settings:s.a,sync:o,widget:l.a,Global_Transformations:c,Terms_Order:void 0,Media_Library:m}}]);
\ No newline at end of file
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
index adad656aa..b2c82e9f7 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
@@ -422,9 +422,7 @@ public function save_taxonomy_ordering( $post_id ) {
 		);
 
 		$taxonomy_order = filter_input_array( INPUT_POST, $args );
-
-		// echo '
      ';
-		// var_dump($taxonomy_order);exit;
+		
 		if ( ! empty( $taxonomy_order['cld_tax_order'] ) ) {
 			update_post_meta( $post_id, self::META_ORDER_KEY . '_terms', $taxonomy_order['cld_tax_order'] );
 		} else {

From 403c2e0312ba5db423449f79af263856a39fb8f9 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Fri, 31 Jan 2020 21:18:30 +0100
Subject: [PATCH 09/10] Adhere to coding standards

---
 .../js/src/components/terms_order.js               | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
index 51cf5dcb7..2d6921991 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
@@ -141,7 +141,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 		let taxonomies = wp.data.select( 'core' ).getTaxonomies();
 
 		if ( taxonomies ) {
-			for (let t in taxonomies) {
+			for ( let t in taxonomies ) {
 				const set = wp.data.select( 'core/editor' ).getEditedPostAttribute( taxonomies[ t ].rest_base );
 				orderSet[ taxonomies[ t ].slug ] = set;
 			}
@@ -151,7 +151,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 	const el = wp.element.createElement;
 	const CustomizeTaxonomySelector = ( OriginalComponent ) => {
 		class CustomHandler extends OriginalComponent {
-			constructor(props) {
+			constructor( props ) {
 				super(props)
 
 				this.currentItems = jQuery( '.cld-tax-order-list-item' )
@@ -170,13 +170,13 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 			}
 
 			removeItem( item ) {
-				const elementWithId = jQuery( `[data-item="${this.getId(item)}"]` );
+				const elementWithId = jQuery( `[data-item="${this.getId( item )}"]` );
 
 				if ( elementWithId.length ) {
 					elementWithId.remove();
 
 					this.currentItems = this.currentItems.filter( ( taxIdentifier ) => {
-						return taxIdentifier !== this.getId(item);
+						return taxIdentifier !== this.getId( item );
 					} );
 				}
 			}
@@ -256,7 +256,7 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 				}
 			}
 
-			getId(item) {
+			getId( item ) {
 				return `${this.props.slug}:${item.id}`
 			}
 
@@ -267,12 +267,12 @@ if ( wp.data && wp.data.select( 'core/editor' ) ) {
 
 				li
 					.addClass( 'cld-tax-order-list-item' )
-					.attr( 'data-item', this.getId(item) );
+					.attr( 'data-item', this.getId( item ) );
 
 				input
 					.addClass( 'cld-tax-order-list-item-input' )
 					.attr( 'type', 'hidden' )
-					.attr( 'name', 'cld_tax_order[]' ).val( this.getId(item) );
+					.attr( 'name', 'cld_tax_order[]' ).val( this.getId( item ) );
 
 				icon.addClass( 'dashicons dashicons-menu cld-tax-order-list-item-handle' );
 

From 1bd0bd97b07c144ed718e7b9d2c787cb1098a0b4 Mon Sep 17 00:00:00 2001
From: Dukagjin Surdulli 
Date: Tue, 4 Feb 2020 12:17:31 +0100
Subject: [PATCH 10/10] Implement minor improvements

---
 .../js/cloudinary.js                                          | 2 +-
 .../js/src/components/terms_order.js                          | 4 +++-
 .../php/media/class-global-transformations.php                | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
index c87797351..b23ec088c 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/cloudinary.js
@@ -1 +1 @@
-!function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(n,s,function(t){return e[t]}.bind(null,s));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=3)}([function(e,t){window,jQuery,jQuery(document).ready((function(e){e(document).on("tabs.init",(function(){var t=e(".settings-tab-trigger"),i=e(".settings-tab-section");e(this).on("click",".settings-tab-trigger",(function(n){var s=e(this),a=e(s.attr("href"));n.preventDefault(),t.removeClass("active"),i.removeClass("active"),s.addClass("active"),a.addClass("active"),e(document).trigger("settings.tabbed",s)})),e(".cld-field").not('[data-condition="false"]').each((function(){const t=e(this),i=t.data("condition");for(let n in i){const s=i[n],a=e("#field-"+n),o=t.closest("tr");a.on("change init",(function(){this.value===s||this.checked?o.show():o.hide()})),a.trigger("init")}})),e("#field-cloudinary_url").on("input change",(function(){let t=e(this),i=t.val();new RegExp(/^(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g).test(i)?(t.addClass("settings-valid-field"),t.removeClass("settings-invalid-field")):(t.removeClass("settings-valid-field"),t.addClass("settings-invalid-field"))})).trigger("change")})),e(".render-trigger[data-event]").each((function(){var t=e(this),i=t.data("event");t.trigger(i,this)}))}))},function(e,t){if(wp.media&&window.CLDN){wp.media.events.on("editor:image-edit",(function(e){e.metadata.cldoverwrite=null,e.image.className.split(" ").indexOf("cld-overwrite")>=0&&(e.metadata.cldoverwrite="true")})),wp.media.events.on("editor:image-update",(function(e){let t=e.image.className.split(" ");e.metadata.cldoverwrite&&-1===t.indexOf("cld-overwrite")?t.push("cld-overwrite"):!e.metadata.cldoverwrite&&t.indexOf("cld-overwrite")>=0&&delete t[t.indexOf("cld-overwrite")],e.image.className=t.join(" ")}));let e=null,t=wp.media.string.props;wp.media.string.props=function(i,n){return i.cldoverwrite&&(i.classes=["cld-overwrite"],e=!0),t(i,n)},wp.media.post=function(t,i){if("send-attachment-to-editor"===t){let t=wp.media.editor.get().state().get("selection").get(i.attachment);t.attributes.transformations&&(i.attachment.transformations=t.attributes.transformations),(i.html.indexOf("cld-overwrite")>-1||!0===e)&&(i.attachment.cldoverwrite=!0,e=null)}return wp.ajax.post(t,i)};wp.media.controller.Library;let i=wp.media.view.MediaFrame.Select,n=wp.media.view.MediaFrame.Post,s=wp.media.view.MediaFrame.ImageDetails,a=wp.media.view.MediaFrame.VideoDetails,o=wp.media.View.extend({tagName:"div",className:"cloudinary-widget",template:wp.template("cloudinary-dam"),active:!1,toolbar:null,frame:null,ready:function(){let e=this.controller,t=this.model.get("selection"),i=this.model.get("library"),n=wp.media.model.Attachment;if(CLDN.mloptions.multiple=e.options.multiple,this.cid!==this.active){if(CLDN.mloptions.inline_container="#cloudinary-dam-"+e.cid,1===t.length){var s=n.get(t.models[0].id);void 0!==s.attributes.public_id&&(CLDN.mloptions.asset={resource_id:s.attributes.public_id})}else CLDN.mloptions.asset=null;window.ml=cloudinary.openMediaLibrary(CLDN.mloptions,{insertHandler:function(s){for(let a=0;a=100&&void 0!==e.started?(this.submitButton.style.display=this.hide,this.stopButton.style.display=this.show):e.pending>0?(this.submitButton.style.display=this.show,this.stopButton.style.display=this.hide):e.processing>0?this.stopButton.style.display=this.show:this.stopButton.style.display=this.hide,e.percent<100?(this.barSyncCount.innerText=e.total,this.progressCount.innerText=e.done,this.progress.style.display=this.show):(this.completed.style.display=this.show,this.progress.style.display=this.hide)},_start:function(e){e.preventDefault(),a.stopButton.style.display=a.show,a.submitButton.style.display=a.hide,a.pushAttachments()},_reset:function(e){a.submitButton.style.display=a.hide,a.getStatus()},_init:function(e){"undefined"!=typeof cloudinaryApi&&((document.attachEvent?"complete"===document.readyState:"loading"!==document.readyState)?e():document.addEventListener("DOMContentLoaded",e))}};var o=a;a._init((function(){a._reset(),a.submitButton.addEventListener("click",a._start),a.stopButton.addEventListener("click",a.stopSync)}));var r=i(1),l=i.n(r);const d={sample:{image:document.getElementById("transformation-sample-image"),video:document.getElementById("transformation-sample-video")},preview:{image:document.getElementById("sample-image"),video:document.getElementById("sample-video")},fields:document.getElementsByClassName("cld-field"),button:{image:document.getElementById("refresh-image-preview"),video:document.getElementById("refresh-video-preview")},spinner:{image:document.getElementById("image-loader"),video:document.getElementById("video-loader")},activeItem:null,elements:{image:[],video:[]},_placeItem:function(e){null!==e&&(e.style.display="block",e.style.visibility="visible",e.style.position="absolute",e.style.top=e.parentElement.clientHeight/2-e.clientHeight/2+"px",e.style.left=e.parentElement.clientWidth/2-e.clientWidth/2+"px")},_setLoading:function(e){this.button[e].style.display="block",this._placeItem(this.button[e]),this.preview[e].style.opacity="0.1"},_build:function(e){this.sample[e].innerHTML="",this.elements[e]=[];for(let t of this.fields){if(e!==t.dataset.context)continue;let i=t.value.trim();if(i.length){if("select-one"===t.type){if("none"===i)continue;i=t.dataset.meta+"_"+i}else{let e=t.dataset.context;i=this._transformations(i,e,!0)}i&&this.elements[e].push(i)}}let t="";this.elements[e].length&&(t="/"+this.elements[e].join(",").replace(/ /g,"%20")),this.sample[e].textContent=t,this.sample[e].parentElement.href="https://res.cloudinary.com/demo/"+this.sample[e].parentElement.innerText.trim().replace("../","").replace(/ /g,"%20")},_clearLoading:function(e){this.spinner[e].style.visibility="hidden",this.activeItem=null,this.preview[e].style.opacity=1},_refresh:function(e,t){e&&e.preventDefault();let i=this,n=CLD_GLOBAL_TRANSFORMATIONS[t].preview_url+i.elements[t].join(",")+CLD_GLOBAL_TRANSFORMATIONS[t].file;if(this.button[t].style.display="none",this._placeItem(this.spinner[t]),"image"===t){let e=new Image;e.onload=function(){i.preview[t].src=this.src,i._clearLoading(t),e.remove()},e.onerror=function(){alert(CLD_GLOBAL_TRANSFORMATIONS[t].error),i._clearLoading(t)},e.src=n}else{let e=i._transformations(i.elements[t].join(","),t);samplePlayer.source({publicId:"dog",transformation:e}),i._clearLoading(t)}},_transformations:function(e,t,i=!1){let n=CLD_GLOBAL_TRANSFORMATIONS[t].valid_types,s=null,a=e.split("/"),o=[];for(let e=0;e{e.startId=null===e.startId?t[0].id+1:++e.startId;const i=a+":"+e.startId;jQuery('[data-item="'+i+'"]').length||e._pushItem(i,s[s.length-1])})}return this.processflushTags(t,i,n)},window.tagBox.processTags=window.tagBox.parseTags,window.tagBox.parseTags=function(t){const i=t.id,n=i.split("-check-num-")[1],s=i.split("-check-num-")[0],a=jQuery(t).closest(".tagsdiv").find(".the-tags"),o=window.tagBox.clean(a.val()).split(e.tagDelimiter)[n];(new wp.api.collections.Tags).fetch({data:{slug:o}}).done(i=>{const n=!!i.length&&jQuery('[data-item="'+s+":"+i[0].id+'"]');n.length?n.remove():(jQuery(`.cld-tax-order-list-item:contains(${o})`).remove(),--e.startId),this.processTags(t)})}),jQuery("body").on("change",".selectit input",(function(){const t=jQuery(this),i=t.val(),n=t.is(":checked"),s=t.parent().text().trim();!0===n?e._pushItem(`category:${i}`,s):e.tags.find(`[data-item="category:${i}"]`).remove()}))},_createItem:function(e,t){const i=jQuery("
    • "),n=jQuery(""),s=jQuery("");return i.addClass("cld-tax-order-list-item").attr("data-item",e),s.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(e),n.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),i.append(n).append(t).append(s),i},_pushItem:function(e,t){let i=this._createItem(e,t);this.tags.append(i)},_sortable:function(){jQuery(".cld-tax-order-list").sortable({connectWith:".cld-tax-order",axis:"y",handle:".cld-tax-order-list-item-handle",placeholder:"cld-tax-order-list-item-placeholder",forcePlaceholderSize:!0,helper:"clone"})}};if(void 0!==window.CLDN&&u._init(),wp.data&&wp.data.select("core/editor")){const e={};wp.data.subscribe((function(){let t=wp.data.select("core").getTaxonomies();if(t)for(let i in t){const n=wp.data.select("core/editor").getEditedPostAttribute(t[i].rest_base);e[t[i].slug]=n}}));const t=wp.element.createElement,i=i=>{class n extends i{constructor(e){super(e),this.currentItems=jQuery(".cld-tax-order-list-item").map((e,t)=>jQuery(t).data("item")).get()}makeItem(e){if(this.currentItems.includes(this.getId(e)))return;const t=this.makeElement(e);jQuery("#cld-tax-items").append(t)}removeItem(e){const t=jQuery(`[data-item="${this.getId(e)}"]`);t.length&&(t.remove(),this.currentItems=this.currentItems.filter(t=>t!==this.getId(e)))}findOrCreateTerm(e){return(e=super.findOrCreateTerm(e)).then(e=>this.makeItem(e)),e}onChange(t){super.onChange(t);const i=this.pickItem(t);i&&(e[this.props.slug].includes(i.id)?this.makeItem(i):this.removeItem(i))}pickItem(e){if("object"==typeof e){if(e.target){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===parseInt(e.target.value))return this.state.availableTerms[t]}else if(Array.isArray(e)){let t=this.state.selectedTerms.filter(t=>!e.includes(t))[0];return void 0===t&&(t=e.filter(e=>!this.state.selectedTerms.includes(e))[0]),this.state.availableTerms.find(e=>e.name===t)}}else if("number"==typeof e){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===e)return this.state.availableTerms[t]}else{let t;if(e.length>this.state.selectedTerms.length)for(let i in e)-1===this.state.selectedTerms.indexOf(e[i])&&(t=e[i]);else for(let i in this.state.selectedTerms)-1===e.indexOf(this.state.selectedTerms[i])&&(t=this.state.selectedTerms[i]);for(let e in this.state.availableTerms)if(this.state.availableTerms[e].name===t)return this.state.availableTerms[e]}}getId(e){return`${this.props.slug}:${e.id}`}makeElement(e){const t=jQuery("
    • "),i=jQuery(""),n=jQuery("");return t.addClass("cld-tax-order-list-item").attr("data-item",this.getId(e)),n.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(this.getId(e)),i.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),t.append(i).append(e.name).append(n),t}}return e=>t(n,e)};wp.hooks.addFilter("editor.PostTaxonomyType","cld",i)}const p={wpWrap:document.getElementById("wpwrap"),wpContent:document.getElementById("wpbody-content"),libraryWrap:document.getElementById("cloudinary-embed"),_init:function(){let e=this;"undefined"!=typeof CLD_ML&&(cloudinary.openMediaLibrary(CLD_ML.mloptions,{insertHandler:function(e){alert("Import is not yet implemented.")}}),window.addEventListener("resize",(function(t){e._resize()})),e._resize())},_resize:function(){let e=getComputedStyle(this.wpContent);this.libraryWrap.style.height=this.wpWrap.offsetHeight-parseInt(e.getPropertyValue("padding-bottom"))+"px"}};var m=p;p._init();i(2);i.d(t,"cloudinary",(function(){return h}));window.$=window.jQuery;const h={settings:s.a,sync:o,widget:l.a,Global_Transformations:c,Terms_Order:void 0,Media_Library:m}}]);
\ No newline at end of file
+!function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var s in e)i.d(n,s,function(t){return e[t]}.bind(null,s));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=3)}([function(e,t){window,jQuery,jQuery(document).ready((function(e){e(document).on("tabs.init",(function(){var t=e(".settings-tab-trigger"),i=e(".settings-tab-section");e(this).on("click",".settings-tab-trigger",(function(n){var s=e(this),a=e(s.attr("href"));n.preventDefault(),t.removeClass("active"),i.removeClass("active"),s.addClass("active"),a.addClass("active"),e(document).trigger("settings.tabbed",s)})),e(".cld-field").not('[data-condition="false"]').each((function(){const t=e(this),i=t.data("condition");for(let n in i){const s=i[n],a=e("#field-"+n),o=t.closest("tr");a.on("change init",(function(){this.value===s||this.checked?o.show():o.hide()})),a.trigger("init")}})),e("#field-cloudinary_url").on("input change",(function(){let t=e(this),i=t.val();new RegExp(/^(cloudinary:\/\/){1}(\d)*[:]{1}[^:@]*[@]{1}[^@]*$/g).test(i)?(t.addClass("settings-valid-field"),t.removeClass("settings-invalid-field")):(t.removeClass("settings-valid-field"),t.addClass("settings-invalid-field"))})).trigger("change")})),e(".render-trigger[data-event]").each((function(){var t=e(this),i=t.data("event");t.trigger(i,this)}))}))},function(e,t){if(wp.media&&window.CLDN){wp.media.events.on("editor:image-edit",(function(e){e.metadata.cldoverwrite=null,e.image.className.split(" ").indexOf("cld-overwrite")>=0&&(e.metadata.cldoverwrite="true")})),wp.media.events.on("editor:image-update",(function(e){let t=e.image.className.split(" ");e.metadata.cldoverwrite&&-1===t.indexOf("cld-overwrite")?t.push("cld-overwrite"):!e.metadata.cldoverwrite&&t.indexOf("cld-overwrite")>=0&&delete t[t.indexOf("cld-overwrite")],e.image.className=t.join(" ")}));let e=null,t=wp.media.string.props;wp.media.string.props=function(i,n){return i.cldoverwrite&&(i.classes=["cld-overwrite"],e=!0),t(i,n)},wp.media.post=function(t,i){if("send-attachment-to-editor"===t){let t=wp.media.editor.get().state().get("selection").get(i.attachment);t.attributes.transformations&&(i.attachment.transformations=t.attributes.transformations),(i.html.indexOf("cld-overwrite")>-1||!0===e)&&(i.attachment.cldoverwrite=!0,e=null)}return wp.ajax.post(t,i)};wp.media.controller.Library;let i=wp.media.view.MediaFrame.Select,n=wp.media.view.MediaFrame.Post,s=wp.media.view.MediaFrame.ImageDetails,a=wp.media.view.MediaFrame.VideoDetails,o=wp.media.View.extend({tagName:"div",className:"cloudinary-widget",template:wp.template("cloudinary-dam"),active:!1,toolbar:null,frame:null,ready:function(){let e=this.controller,t=this.model.get("selection"),i=this.model.get("library"),n=wp.media.model.Attachment;if(CLDN.mloptions.multiple=e.options.multiple,this.cid!==this.active){if(CLDN.mloptions.inline_container="#cloudinary-dam-"+e.cid,1===t.length){var s=n.get(t.models[0].id);void 0!==s.attributes.public_id&&(CLDN.mloptions.asset={resource_id:s.attributes.public_id})}else CLDN.mloptions.asset=null;window.ml=cloudinary.openMediaLibrary(CLDN.mloptions,{insertHandler:function(s){for(let a=0;a=100&&void 0!==e.started?(this.submitButton.style.display=this.hide,this.stopButton.style.display=this.show):e.pending>0?(this.submitButton.style.display=this.show,this.stopButton.style.display=this.hide):e.processing>0?this.stopButton.style.display=this.show:this.stopButton.style.display=this.hide,e.percent<100?(this.barSyncCount.innerText=e.total,this.progressCount.innerText=e.done,this.progress.style.display=this.show):(this.completed.style.display=this.show,this.progress.style.display=this.hide)},_start:function(e){e.preventDefault(),a.stopButton.style.display=a.show,a.submitButton.style.display=a.hide,a.pushAttachments()},_reset:function(e){a.submitButton.style.display=a.hide,a.getStatus()},_init:function(e){"undefined"!=typeof cloudinaryApi&&((document.attachEvent?"complete"===document.readyState:"loading"!==document.readyState)?e():document.addEventListener("DOMContentLoaded",e))}};var o=a;a._init((function(){a._reset(),a.submitButton.addEventListener("click",a._start),a.stopButton.addEventListener("click",a.stopSync)}));var r=i(1),l=i.n(r);const d={sample:{image:document.getElementById("transformation-sample-image"),video:document.getElementById("transformation-sample-video")},preview:{image:document.getElementById("sample-image"),video:document.getElementById("sample-video")},fields:document.getElementsByClassName("cld-field"),button:{image:document.getElementById("refresh-image-preview"),video:document.getElementById("refresh-video-preview")},spinner:{image:document.getElementById("image-loader"),video:document.getElementById("video-loader")},activeItem:null,elements:{image:[],video:[]},_placeItem:function(e){null!==e&&(e.style.display="block",e.style.visibility="visible",e.style.position="absolute",e.style.top=e.parentElement.clientHeight/2-e.clientHeight/2+"px",e.style.left=e.parentElement.clientWidth/2-e.clientWidth/2+"px")},_setLoading:function(e){this.button[e].style.display="block",this._placeItem(this.button[e]),this.preview[e].style.opacity="0.1"},_build:function(e){this.sample[e].innerHTML="",this.elements[e]=[];for(let t of this.fields){if(e!==t.dataset.context)continue;let i=t.value.trim();if(i.length){if("select-one"===t.type){if("none"===i)continue;i=t.dataset.meta+"_"+i}else{let e=t.dataset.context;i=this._transformations(i,e,!0)}i&&this.elements[e].push(i)}}let t="";this.elements[e].length&&(t="/"+this.elements[e].join(",").replace(/ /g,"%20")),this.sample[e].textContent=t,this.sample[e].parentElement.href="https://res.cloudinary.com/demo/"+this.sample[e].parentElement.innerText.trim().replace("../","").replace(/ /g,"%20")},_clearLoading:function(e){this.spinner[e].style.visibility="hidden",this.activeItem=null,this.preview[e].style.opacity=1},_refresh:function(e,t){e&&e.preventDefault();let i=this,n=CLD_GLOBAL_TRANSFORMATIONS[t].preview_url+i.elements[t].join(",")+CLD_GLOBAL_TRANSFORMATIONS[t].file;if(this.button[t].style.display="none",this._placeItem(this.spinner[t]),"image"===t){let e=new Image;e.onload=function(){i.preview[t].src=this.src,i._clearLoading(t),e.remove()},e.onerror=function(){alert(CLD_GLOBAL_TRANSFORMATIONS[t].error),i._clearLoading(t)},e.src=n}else{let e=i._transformations(i.elements[t].join(","),t);samplePlayer.source({publicId:"dog",transformation:e}),i._clearLoading(t)}},_transformations:function(e,t,i=!1){let n=CLD_GLOBAL_TRANSFORMATIONS[t].valid_types,s=null,a=e.split("/"),o=[];for(let e=0;e{const i=t.length?t[0].id+1:1;e.startId=null===e.startId?i:++e.startId;const n=a+":"+e.startId;jQuery('[data-item="'+n+'"]').length||e._pushItem(n,s[s.length-1])})}return this.processflushTags(t,i,n)},window.tagBox.processTags=window.tagBox.parseTags,window.tagBox.parseTags=function(t){const i=t.id,n=i.split("-check-num-")[1],s=i.split("-check-num-")[0],a=jQuery(t).closest(".tagsdiv").find(".the-tags"),o=window.tagBox.clean(a.val()).split(e.tagDelimiter)[n];(new wp.api.collections.Tags).fetch({data:{slug:o}}).done(i=>{const n=!!i.length&&jQuery('[data-item="'+s+":"+i[0].id+'"]');n.length?n.remove():(jQuery(`.cld-tax-order-list-item:contains(${o})`).remove(),--e.startId),this.processTags(t)})}),jQuery("body").on("change",".selectit input",(function(){const t=jQuery(this),i=t.val(),n=t.is(":checked"),s=t.parent().text().trim();!0===n?e._pushItem(`category:${i}`,s):e.tags.find(`[data-item="category:${i}"]`).remove()}))},_createItem:function(e,t){const i=jQuery("
    • "),n=jQuery(""),s=jQuery("");return i.addClass("cld-tax-order-list-item").attr("data-item",e),s.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(e),n.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),i.append(n).append(t).append(s),i},_pushItem:function(e,t){let i=this._createItem(e,t);this.tags.append(i)},_sortable:function(){jQuery(".cld-tax-order-list").sortable({connectWith:".cld-tax-order",axis:"y",handle:".cld-tax-order-list-item-handle",placeholder:"cld-tax-order-list-item-placeholder",forcePlaceholderSize:!0,helper:"clone"})}};if(void 0!==window.CLDN&&u._init(),wp.data&&wp.data.select("core/editor")){const e={};wp.data.subscribe((function(){let t=wp.data.select("core").getTaxonomies();if(t)for(let i in t){const n=wp.data.select("core/editor").getEditedPostAttribute(t[i].rest_base);e[t[i].slug]=n}}));const t=wp.element.createElement,i=i=>{class n extends i{constructor(e){super(e),this.currentItems=jQuery(".cld-tax-order-list-item").map((e,t)=>jQuery(t).data("item")).get()}makeItem(e){if(this.currentItems.includes(this.getId(e)))return;const t=this.makeElement(e);jQuery("#cld-tax-items").append(t)}removeItem(e){const t=jQuery(`[data-item="${this.getId(e)}"]`);t.length&&(t.remove(),this.currentItems=this.currentItems.filter(t=>t!==this.getId(e)))}findOrCreateTerm(e){return(e=super.findOrCreateTerm(e)).then(e=>this.makeItem(e)),e}onChange(t){super.onChange(t);const i=this.pickItem(t);i&&(e[this.props.slug].includes(i.id)?this.makeItem(i):this.removeItem(i))}pickItem(e){if("object"==typeof e){if(e.target){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===parseInt(e.target.value))return this.state.availableTerms[t]}else if(Array.isArray(e)){let t=this.state.selectedTerms.filter(t=>!e.includes(t))[0];return void 0===t&&(t=e.filter(e=>!this.state.selectedTerms.includes(e))[0]),this.state.availableTerms.find(e=>e.name===t)}}else if("number"==typeof e){for(let t in this.state.availableTerms)if(this.state.availableTerms[t].id===e)return this.state.availableTerms[t]}else{let t;if(e.length>this.state.selectedTerms.length)for(let i in e)-1===this.state.selectedTerms.indexOf(e[i])&&(t=e[i]);else for(let i in this.state.selectedTerms)-1===e.indexOf(this.state.selectedTerms[i])&&(t=this.state.selectedTerms[i]);for(let e in this.state.availableTerms)if(this.state.availableTerms[e].name===t)return this.state.availableTerms[e]}}getId(e){return`${this.props.slug}:${e.id}`}makeElement(e){const t=jQuery("
    • "),i=jQuery(""),n=jQuery("");return t.addClass("cld-tax-order-list-item").attr("data-item",this.getId(e)),n.addClass("cld-tax-order-list-item-input").attr("type","hidden").attr("name","cld_tax_order[]").val(this.getId(e)),i.addClass("dashicons dashicons-menu cld-tax-order-list-item-handle"),t.append(i).append(e.name).append(n),t}}return e=>t(n,e)};wp.hooks.addFilter("editor.PostTaxonomyType","cld",i)}const p={wpWrap:document.getElementById("wpwrap"),wpContent:document.getElementById("wpbody-content"),libraryWrap:document.getElementById("cloudinary-embed"),_init:function(){let e=this;"undefined"!=typeof CLD_ML&&(cloudinary.openMediaLibrary(CLD_ML.mloptions,{insertHandler:function(e){alert("Import is not yet implemented.")}}),window.addEventListener("resize",(function(t){e._resize()})),e._resize())},_resize:function(){let e=getComputedStyle(this.wpContent);this.libraryWrap.style.height=this.wpWrap.offsetHeight-parseInt(e.getPropertyValue("padding-bottom"))+"px"}};var m=p;p._init();i(2);i.d(t,"cloudinary",(function(){return h}));window.$=window.jQuery;const h={settings:s.a,sync:o,widget:l.a,Global_Transformations:c,Terms_Order:void 0,Media_Library:m}}]);
\ No newline at end of file
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
index 2d6921991..cef9ea6a8 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/js/src/components/terms_order.js
@@ -48,8 +48,10 @@ export const Terms_Order = {
 					new wp.api.collections.Tags()
 						.fetch( { data: { orderby: 'id', order: 'desc', per_page: 1 } } )
 						.done( tags => {
-							self.startId = self.startId === null ? tags[0].id + 1 : ++self.startId;
+							const nextTagId = tags.length ? tags[0].id + 1 : 1
+							self.startId = self.startId === null ? nextTagId : ++self.startId;
 							const tag = taxonomy + ':' + self.startId;
+
 							if ( ! jQuery( '[data-item="' + tag + '"]' ).length ) {
 								self._pushItem( tag, list[ list.length - 1 ] );
 							}
diff --git a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
index b2c82e9f7..dbf0c5df1 100644
--- a/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
+++ b/cloudinary-image-management-and-manipulation-in-the-cloud-cdn/php/media/class-global-transformations.php
@@ -333,7 +333,7 @@ function ( $item ) {
 				},
 				$items
 			);
-			$terms = array_filter($items);
+			$terms = array_filter( $items );
 		} else {
 			$taxonomies    = get_object_taxonomies( get_post_type( $post_id ) );
 			$current_terms = wp_get_object_terms( $post_id, $taxonomies );