Validate wish URL on Add/Edit

src/api/wishes.php

@@ -67,6 +67,24 @@ switch ($_SERVER['REQUEST_METHOD']) {
                 $wish_id     = $_POST['wish_id'];
                 $wishlist_id = $_POST['wishlist_id'];
 
+                /** Update wish information */
+                if (!empty($wish_url)) {
+                    $cache = new Cache\Embed($wish_url);
+                    $info  = $cache->get(true);
+
+                    if (empty($wish_title)) {
+                        $wish_title = $info->title;
+                    }
+
+                    if (empty($wish_description)) {
+                        $wish_description = $info->description;
+                    }
+
+                    $response = array(
+                        'info' => $info,
+                    );
+                }
+
                 $database
                 ->query(
                     'REPLACE INTO `wishes`

src/assets/js/wishlists.js

@@ -325,11 +325,13 @@ $(function () {
      * Edit Wish
      */
     $(document).on('click', '.wish-edit', function (event) {
+        validateURL = true;
+
         /** Form */
-        var form = $('.form.wishlist-wish-edit');
+        var formEdit = $('.form.wishlist-wish-edit');
-        form.addClass('loading');
+        formEdit.addClass('loading');
-        form.trigger('reset');
+        formEdit.trigger('reset');
-        form.find('.dropdown').dropdown('restore defaults');
+        formEdit.find('.dropdown').dropdown('restore defaults');
 
         /** Get Wish */
         var wishID = $(this).attr('data-id');
@@ -355,10 +357,10 @@ $(function () {
         })
         .catch(handleFetchCatch)
         .finally(function() {
-            form.removeClass('loading');
+            formEdit.removeClass('loading');
         });
 
-        /** Modal */
+        /** Save wish */
         var modalWishlistWishEdit = $('.ui.modal.wishlist-wish-edit');
 
         modalWishlistWishEdit.find('[name="wishlist_id"]').val($('.ui.dropdown.wishlists').dropdown('get value'));
@@ -366,25 +368,7 @@ $(function () {
         .modal({
             autoShow  : true,
             onApprove : function (buttonSave) {
-                buttonSave.addClass('loading');
+                validateWishURL(formEdit, buttonSave, modalWishlistWishEdit, validateURL);
-
-                var formData = new URLSearchParams(new FormData(form[0]));
-
-                fetch('/src/api/wishes.php', {
-                    method : 'POST',
-                    body   : formData
-                })
-                .then(handleFetchError)
-                .then(handleFetchResponse)
-                .then(function(response) {
-                    $('body').toast({ message: text.toast_wish_update });
-
-                    wishlistsRefresh();
-
-                    modalWishlistWishEdit.modal('hide');
-                    buttonSave.removeClass('loading');
-                })
-                .catch(handleFetchCatch);
 
                 return false;
             }
@@ -458,9 +442,11 @@ $(function () {
      * Add wish
      */
     $(document).on('click', '.button.wishlist-wish-add', function () {
-        var form = $('.form.wishlist-wish-add');
+        validateURL = true;
-        form.trigger('reset');
+
-        form.find('.dropdown').dropdown('restore defaults');
+        var formAdd = $('.form.wishlist-wish-add');
+        formAdd.trigger('reset');
+        formAdd.find('.dropdown').dropdown('restore defaults');
 
         var modalWishlistWishAdd = $('.ui.modal.wishlist-wish-add');
         modalWishlistWishAdd.find('[name="wishlist_id"]').val($('.ui.dropdown.wishlists').dropdown('get value'));
@@ -468,25 +454,7 @@ $(function () {
         .modal({
             autoShow  : true,
             onApprove : function (buttonAdd) {
-                buttonAdd.addClass('loading');
+                validateWishURL(formAdd, buttonAdd, modalWishlistWishAdd);
-
-                var formData = new URLSearchParams(new FormData(form[0]));
-
-                fetch('/src/api/wishes.php', {
-                    method : 'POST',
-                    body   : formData
-                })
-                .then(handleFetchError)
-                .then(handleFetchResponse)
-                .then(function(response) {
-                    $('body').toast({ message: text.toast_wish_add });
-
-                    wishlistsRefresh();
-
-                    modalWishlistWishAdd.modal('hide');
-                    buttonAdd.removeClass('loading');
-                })
-                .catch(handleFetchCatch);
 
                 return false;
             }
@@ -538,4 +506,130 @@ $(function () {
         });
     });
 
+    var validateURL = true;
+
+    function validateWishURL(formAddOrEdit, buttonAddOrSave, modalAddOrEdit) {
+        /**
+         * Validate URL
+         */
+        var inputURL       = modalAddOrEdit.find('[name="wish_url"]');
+        var wishURLCurrent = inputURL.val();
+
+        formAddOrEdit.addClass('loading');
+        buttonAddOrSave.addClass('disabled');
+
+        if (wishURLCurrent) {
+            fetch('/src/api/wishes.php?wish_url=' + wishURLCurrent, {
+                method: 'GET'
+            })
+            .then(handleFetchError)
+            .then(handleFetchResponse)
+            .then(function(response) {
+                var wishInfoProposed = response.info;
+
+                var modalValidate = $('.modal.validate');
+
+                /** Prodiver name */
+                if (wishInfoProposed.providerName) {
+                    modalValidate.find('.providerName').text(wishInfoProposed.providerName);
+                } else {
+                    modalValidate.find('.provider').remove();
+                }
+
+                /** URL */
+                if (wishURLCurrent !== wishInfoProposed.url && validateURL) {
+                    modalValidate.find('input.current').val(wishURLCurrent);
+                    modalValidate.find('input.proposed').val(wishInfoProposed.url);
+                    modalValidate
+                    .modal({
+                        autoShow      : true,
+                        allowMultiple : true,
+                        onApprove     : function (buttonUpdate) {
+                            inputURL.val(modalValidate.find('input.proposed').val());
+
+                            var formData = new URLSearchParams({
+                                'wish_url_current'  : modalValidate.find('input.current').val(),
+                                'wish_url_proposed' : modalValidate.find('input.proposed').val()
+                            });
+
+                            buttonUpdate.addClass('loading');
+
+                            fetch('/src/api/wishes.php', {
+                                method : 'PUT',
+                                body   : formData
+                            })
+                            .then(handleFetchError)
+                            .then(handleFetchResponse)
+                            .then(function(response) {
+                                buttonUpdate.removeClass('loading');
+                                modalValidate.modal('hide');
+                            });
+                        },
+                        onDeny        : function() {
+                            validateURL = false;
+                        },
+                        onHide        : function() {
+                            formAddOrEdit.removeClass('loading');
+                            buttonAddOrSave.removeClass('disabled');
+                        }
+                    });
+                } else {
+                    /** Save form edit fields */
+                    /** This code block is a duplicate, please refactor */
+                    var formData = new URLSearchParams(new FormData(formAddOrEdit[0]));
+
+                    fetch('/src/api/wishes.php', {
+                        method : 'POST',
+                        body   : formData
+                    })
+                    .then(handleFetchError)
+                    .then(handleFetchResponse)
+                    .then(function(response) {
+                        console.log(response);
+
+                        $('body').toast({ message: text.toast_wish_update });
+
+                        wishlistsRefresh();
+
+                        modalAddOrEdit.modal('hide');
+                    })
+                    .catch(handleFetchCatch)
+                    .finally(function() {
+                        formAddOrEdit.removeClass('loading');
+                        buttonAddOrSave.removeClass('disabled');
+                    });
+                    /** */
+                }
+            })
+            .catch(handleFetchCatch);
+        } else {
+            /** Save form edit fields */
+            /** This code block is a duplicate, please refactor */
+            var formData = new URLSearchParams(new FormData(formAddOrEdit[0]));
+
+            fetch('/src/api/wishes.php', {
+                method : 'POST',
+                body   : formData
+            })
+            .then(handleFetchError)
+            .then(handleFetchResponse)
+            .then(function(response) {
+                console.log(response);
+
+                $('body').toast({ message: text.toast_wish_update });
+
+                wishlistsRefresh();
+
+                modalAddOrEdit.modal('hide');
+            })
+            .catch(handleFetchCatch)
+            .finally(function() {
+                formAddOrEdit.removeClass('loading');
+                buttonAddOrSave.removeClass('disabled');
+            });
+            /** */
+        }
+    }
+
+
 });

src/pages/wishlists.php

@@ -215,6 +215,39 @@ $page->navigation();
     </div>
 </div>
 
+<!-- Wish: Validate -->
+<div class="ui small modal validate">
+    <div class="header">
+        <?= __('URL mismatch') ?>
+    </div>
+    <div class="content">
+        <div class="description">
+            <p><?= __('The URL you have entered does not seem quite right. Would you like to update it with the one I found?') ?></p>
+            <p class="provider"><?= sprintf(__('According to %s, this is the canonical (correct) URL.'), '<strong class="providerName">Unknown</strong>') ?></p>
+
+            <div class="ui form urls">
+                <div class="field">
+                    <label><?= __('Current') ?></label>
+                    <input class="ui input current disabled" type="url" readonly />
+                </div>
+
+                <div class="field">
+                    <label><?= __('Proposed') ?></label>
+                    <input class="ui input proposed" type="url" />
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="actions">
+        <div class="ui primary approve button" title="<?= __('Yes, update') ?>">
+            <?= __('Yes, update') ?>
+        </div>
+        <div class="ui deny button" title="<?= __('No, leave it') ?>">
+            <?= __('No, leave it') ?>
+        </div>
+    </div>
+</div>
+
 <?php
 $page->footer();
 $page->bodyEnd();