Merge pull request #3 from michelegiorgi/development

release v1.1
michelegiorgi · Dec 28, 2020 · 1a1b70d · 1a1b70d
2 parents be8de4b + 82bc39c
commit 1a1b70d
Show file tree

Hide file tree

Showing 15 changed files with 139 additions and 101 deletions.
diff --git a/LICENSE.txt b/LICENSE.txt
@@ -1,4 +1,4 @@
-Copyright (C) 2018-2020, Michele Giorgi
+Copyright (C) 2018-2021, Michele Giorgi
 
                     GNU GENERAL PUBLIC LICENSE
                        Version 3, 29 June 2007

diff --git a/assets/scripts/public/core/embed.js b/assets/scripts/public/core/embed.js
@@ -1,4 +1,5 @@
 import { el } from './helpers'
+import hooks from './hooks'
 
 export default {
   init() {
@@ -28,14 +29,15 @@ export default {
       }
       $(el('sidebar', true, '[data-sidebar='+formid+']')).addClass(el('sidebar', false, '--open'))
       let iframe = $(el('sidebar', true, '[data-sidebar='+formid+'] iframe'))[0];
-      iframe.contentWindow.dispatchEvent(new CustomEvent('fo', { detail: 'open_sidebar' }))
+      hooks.event('SidebarOpened', {}, iframe.contentWindow)
     })
   },
   closeSidebar() {
     $(el('sidebar')).click(function(e){
       e.stopPropagation();
       e.preventDefault();
       $(this).removeClass(el('sidebar', false, '--open'))
+      hooks.event('SidebarClosed')
     })
   },
-}
+}
diff --git a/assets/scripts/public/core/hints.js b/assets/scripts/public/core/hints.js
@@ -16,7 +16,7 @@ export default {
   },
   show($field) {
     const type = $field.attr("data-type")
-    const label = $field.find(el("label", true, ":first")).text()
+    const label = $field.find(el("label", true)).first().text()
     const hints = this.getHints(type, label)
     $(el("nav_hints")).html(hints)
   },
@@ -69,4 +69,4 @@ export default {
     });
     return htmlHints
   },
-}
+}
diff --git a/assets/scripts/public/core/hooks.js b/assets/scripts/public/core/hooks.js
@@ -0,0 +1,16 @@
+import { el, uid } from './helpers'
+
+export default {
+  init() {
+    //
+  },
+  event(name, options = {}, target = window) {
+    options['form'] = window.formality.uid;
+    const event = new CustomEvent('fo' + name, {
+      view: window,
+      bubbles: true,
+      detail: options
+    })
+    target.dispatchEvent(event)
+  }
+}
diff --git a/assets/scripts/public/core/nav.js b/assets/scripts/public/core/nav.js
@@ -20,7 +20,7 @@ export default {
         $(el("button", "uid", "--prev")).toggle(false)
         $(el("submit", "uid")).toggle(false)
         $steps.each(function(){
-          const head_html = $(this).find(el("section_header")) ? $(this).find(el("section_header")).html() : ''; 
+          const head_html = $(this).find(el("section_header")) ? $(this).find(el("section_header")).html() : '';
           const $required = $(this).find(el("field_required"))
           //build legend
           let legend = ""
@@ -48,7 +48,7 @@ export default {
             const fieldid = $(this).find(":input").attr("id")
             $(this).attr("id", id)
             if($(this).hasClass(el("field", false))) {
-              label = $(this).find(el("label", true, ":first")).text()
+              label = $(this).find(el("label", true)).first().text()
               liststring = liststring + '<li data-name="'+fieldid+'"><a href="#' + id + '">' + label + '</a></li>'
             } else if($(this).hasClass(el("section_header", false))) {
               label = $(this).find("h4").text()
@@ -94,7 +94,7 @@ export default {
         anim(index)
         $steps.removeClass(el("section", false, "--active")).eq(index).addClass(el("section", false, "--active"))
         $nav.removeClass(el("nav_section", false, "--active")).eq(index).addClass(el("nav_section", false, "--active"))
-        setTimeout(function() { 
+        setTimeout(function() {
           let $selector = $(el("section", "uid", "--active") + " " + el("field"))
           $selector = currentstep > index ? $selector.last() : $selector.first();
           $selector.find(":input").focus();
@@ -123,7 +123,7 @@ export default {
       uid($(this))
       const name = $(this).attr("data-name")
       $(el("section", "uid") + " " + el("field") + " :input[name="+name+"]").focus()
-    })    
+    })
   },
   conversational() {
     let emergence_container = document.querySelector('.formality__main');
@@ -157,7 +157,7 @@ export default {
         }
       },
     });
-    
+
     $(el("button", "uid", "--mininext")).click(function(e){
       let $element = $(el("field_focus")).find(":input")
       uiux.move($element, "next", e)
@@ -170,11 +170,11 @@ export default {
       //e.preventDefault()
       const fieldid = $(this).attr("href")
       let $element = $(fieldid).find(":input")
-      if($(this).parent().hasClass(el("nav_anchor", false))) {        
+      if($(this).parent().hasClass(el("nav_anchor", false))) {
         uiux.move($(fieldid), "first", e)
       } else {
         uiux.move($element, false, e)
       }
     })
   },
-};
+};
diff --git a/assets/scripts/public/core/submit.js b/assets/scripts/public/core/submit.js
@@ -1,4 +1,5 @@
 import { el, uid } from './helpers'
+import hooks from './hooks'
 
 /* eslint-disable no-unused-vars */
 
@@ -11,6 +12,7 @@ export default {
         e.preventDefault()
         uid($(this))
         submit.token()
+        hooks.event('FormSubmit')
       })
     })
   },
@@ -67,8 +69,11 @@ export default {
       success: function(data){
         submit.result(data)
       },
-      error: function(){
-        const data = { status: 400 }
+      error: function(error){
+        const data = {
+          status: 400,
+          error: ('responseText' in error) ? error.responseText : error
+        }
         submit.result(data)
       },
     })
@@ -83,15 +88,17 @@ export default {
       remove = "result_error";
       $(el("button", "uid", "--prev")).hide()
       $(el("form", "uid")).addClass("formality--sended")
+      hooks.event('FormSuccess', { data: data})
     } else {
       add = "result_error";
       remove = "result_success";
       $(el("form", "uid")).addClass("formality--error")
+      hooks.event('FormError', { data: data})
     }
     $(el(add, "uid")).addClass(el(add, false, "--active"))
     $(el(remove, "uid")).removeClass(el(remove, false, "--active"))
     $('html, body').stop().animate({ scrollTop: $(el("actions", "uid")).offset().top }, 300)
   },
 }
 
-/* eslint-enable no-unused-vars */
+/* eslint-enable no-unused-vars */
diff --git a/assets/scripts/public/core/uiux.js b/assets/scripts/public/core/uiux.js
@@ -1,5 +1,6 @@
 import { el, isMobile, focusFirst } from './helpers'
 import hints from './hints'
+import hooks from './hooks'
 
 export default {
   init() {
@@ -9,26 +10,25 @@ export default {
     this.keyboard()
   },
   focus() {
-    //toggle focus class on input wrap 
+    //toggle focus class on input wrap
     $(el("field", true, " :input")).on("focus", function() {
       const $parentEl = $(this).closest(el("field"))
       $parentEl.addClass(el("field_focus", false))
       hints.show($parentEl)
+      hooks.event('FieldFocus', { el: $parentEl[0] })
     }).on("blur", function() {
       $(el("field_focus")).removeClass(el("field_focus", false))
       hints.clear()
     })
     //autofocus first input
-    if ( window.location !== window.parent.location ) {
-      window.addEventListener('fo', function(e) { 
-        if(e.detail == "open_sidebar") { focusFirst(600) }
-      }, false)
+    if(window.location !== window.parent.location) {
+      window.addEventListener('foSidebarOpened', function(e) { focusFirst(600) }, false)
     } else {
       if($('body').hasClass('single-formality_form')) { focusFirst(1000) }
-    }   
+    }
     //click outside form
     $(document).mouseup(function (e) {
-      if (!$(el("form")).is(e.target) && $(el("form")).has(e.target).length === 0) {
+      if(!$(el("form")).is(e.target) && $(el("form")).has(e.target).length === 0) {
         $(el("field_focus")).removeClass(el("field_focus", false))
         hints.clear()
       }
@@ -43,25 +43,19 @@ export default {
   },
   filled() {
     //toggle filled class to input wrap
-    $(el("field", true, " :input")).on("change", function() { fillToggle(this) })
-    function fillToggle(field) {
-      let val = $(field).val()
-      if($(field).is(":checkbox")){
-        val = $(field).is(":checked");
-      }
-      const name = $(field).attr("name")
-      if(val) {
-        $(field).closest(el("field")).addClass(el("field_filled", false))
-        $(el("nav_list", true, ' li[data-name="'+name+'"]')).addClass("active")
-      } else {
-        $(field).closest(el("field")).removeClass(el("field_filled", false))
-        $(el("nav_list", true, ' li[data-name="'+name+'"]')).removeClass("active")
-      }
-    }   
+    $(el("field", true, " :input")).on("change", function() {
+      const $field = $(this)
+      const $parentEl = $field.closest(el("field"))
+      const val = $field.is(":checkbox") ? $field.is(":checked") :  $field.val()
+      const name = $field.attr("name")
+      $parentEl.toggleClass(el("field_filled", false), val)
+      $(el("nav_list", true, ' li[data-name="'+name+'"]')).toggleClass("active", val)
+      hooks.event('FieldFill', { el: $parentEl[0] })
+    })
   },
   keyboard() {
     //previous field focus
-    const uiux = this 
+    const uiux = this
     $(el("field", true, " :input")).on("keydown", function(e) {
       const $this = $(this)
       const validprev = (!$this.val()) || $this.is(':checkbox') || $this.is(':radio') ? true : false
@@ -117,7 +111,7 @@ export default {
           $main.stop().animate({ scrollTop: (($main.scrollTop() + $element.position().top) - offset) }, 300)
         }
       } else {
-        $element.find(":input" + (direction=="prev" ? ":last" : ":first")).focus()
+        $element.find(":input").eq(direction=="prev" ? -1 : 0).focus()
       }
       e.preventDefault()
     } else {
@@ -132,10 +126,10 @@ export default {
           $(el("button", "uid", "--next")).click()
         } else {
           $(el("form", "uid")).submit()
-        }       
+        }
       } else {
         //
       }
     }
   },
-}
+}
diff --git a/assets/scripts/public/init.js b/assets/scripts/public/init.js
@@ -7,6 +7,7 @@ import submit from './core/submit'
 import conditional from './core/conditional'
 import embed from './core/embed'
 import hints from './core/hints'
+import hooks from './core/hooks'
 
 //fields functions
 import select from './fields/select'
@@ -21,17 +22,17 @@ export default function() {
   loader.init()
   uiux.init()
   submit.init()
-  nav.init()  
+  nav.init()
   validate.init()
   conditional.init()
   embed.init()
   hints.init()
-  
+
   select.init()
   switch1.init()
   textarea.init()
   number.init()
   rating.init()
   multiple.init()
   media.init()
-}
+}
diff --git a/formality.php b/formality.php
@@ -6,13 +6,13 @@
  * @link              https://formality.dev
  * @since             1.0
  * @package           Formality
- * @copyright         Copyright (C) 2018-2020, Michele Giorgi
+ * @copyright         Copyright (C) 2018-2021, Michele Giorgi
  *
  * @wordpress-plugin
  * Plugin Name:       Formality
  * Plugin URI:        https://formality.dev
  * Description:       Forms made simple (and cute). Designless, multistep, conversational, secure, all-in-one WordPress forms plugin.
- * Version:           1.0.7
+ * Version:           1.1
  * Author:            Michele Giorgi
  * Author URI:        https://giorgi.io
  * License:           GPLv3
@@ -51,7 +51,7 @@
 /**
  * Currently plugin version.
  */
-define( 'FORMALITY_VERSION', '1.0.7' );
+define( 'FORMALITY_VERSION', '1.1' );
 
 /**
  * The code that runs during plugin activation.

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "Formality",
-  "version": "1.0.6",
+  "version": "1.1.0",
   "author": "Michele Giorgi <hi@giorgi.io>",
   "homepage": "https://giorgi.io",
   "private": true,