Merge pull request #21 from tutorcruncher/examples

An event callback example

Author: tomhamiltonstubber

_examples/basic_enquiry_form.jinja

@@ -0,0 +1,29 @@
+---
+layout: socket_example
+title: Basic enquiry form example
+permalink: /examples/basic-enquiry-form/
+description: The simplest implementation of an enquiry form with Socket on a site.
+---
+{% highlight html %}
+<div id="socket-enquiry"></div>
+
+<!-- If you haven't called it before -->
+<script src="{{ site.socket_url }}"></script>
+
+<!-- Then -->
+<script>
+  socket('{{ site.socket_key }}', {
+    mode: 'enquiry',
+    element: '#socket-enquiry'
+  });
+</script>
+{% endhighlight %}
+
+<div id="socket-enquiry"></div>
+
+<script>
+  socket('{{ site.socket_key }}', {
+    mode: 'enquiry',
+    element: '#socket-enquiry'
+  });
+</script>

_examples/basic_tutors_list.html

@@ -2,7 +2,7 @@
 layout: socket_example
 title: Basic tutors list example
 permalink: /examples/basic-tutors-list/
-description: The simplest implementation of Socket on a site.
+description: The simplest implementation of listing tutors with Socket on a site.
 ---
 {% highlight html %}
 <div id="socket"></div>

_examples/custom_event_callback.html

@@ -0,0 +1,39 @@
+---
+layout: socket_example
+title: Custom event callback enquiry form example
+permalink: /examples/basic-enquiry-form/
+description: Showing an example of the event callback being used with Socket
+---
+{% highlight html %}
+<div id="socket-enquiry"></div>
+
+<!-- If you haven't called it before -->
+<script src="{{ site.socket_url }}"></script>
+
+<!-- Then -->
+<script>
+  socket('{{ site.socket_key }}', {
+    mode: 'enquiry',
+    element: '#socket-enquiry',
+    event_callback: function (name) {
+      if (name === 'enquiry_submitted') {
+        window.ga('send', 'event', 'enquiry', 'enquiry-submitted', 'New York Branch')
+      }
+    }
+  });
+</script>
+{% endhighlight %}
+
+<div id="socket-enquiry"></div>
+
+<script>
+  socket('{{ site.socket_key }}', {
+    mode: 'enquiry',
+    element: '#socket-enquiry',
+    event_callback: function (name) {
+      if (name === 'enquiry_submitted') {
+        window.ga('send', 'event', 'enquiry', 'enquiry-submitted', 'New York Branch')
+      }
+    }
+  });
+</script>