Add management option

Wordpress option setting for the url to use.
The schedule is working with the select days.
The directions are working.

diff --git a/defines.php b/defines.php
index 097f533..2d24c94 100644 (file)
--- a/defines.php
+++ b/defines.php
@@ -11,6 +11,9 @@ define('GLM_MEMBERS_APIS_PLUGIN_NAME', 'GLM Members Database API');
 define('GLM_MEMBERS_APIS_PLUGIN_SHORT_NAME', 'Apis');
 define('GLM_MEMBERS_APIS_PLUGIN_SLUG', 'glm-member-db-apis');
 
+// Defines for different API's
+define( 'GLM_MEMBERS_APIS_STARLINE_OPTION_NAME', 'glm_member_db_apis_starline_url' );
+
 // Database table prefixes - change if using add-on tables
 global $wpdb;
 define('GLM_MEMBERS_APIS_PLUGIN_DB_PREFIX', $wpdb->prefix.'glm_membersApis_');

diff --git a/js/front.js b/js/front.js
new file mode 100644 (file)
index 0000000..dc40786
--- /dev/null
+++ b/js/front.js
@@ -0,0 +1,454 @@
+jQuery(document).ready(function($){
+    initGoogleMap();
+
+    function initGoogleMap()
+    {
+        if ($("#google-map-link1").length > 0) {
+            var gmapLink1 = document.getElementById("google-map-link1");
+            gmapLink1.onclick = function(){
+                createGoogleForm(1);
+                return false;
+            }
+        }
+        if ($("#google-map-link2").length > 0) {
+            var gmapLink2 = document.getElementById("google-map-link2");
+            gmapLink2.onclick = function(){
+                createGoogleForm(2);
+                return false;
+            }
+        }
+        if ($("#google-map-link3").length > 0) {
+            var gmapLink3 = document.getElementById("google-map-link3");
+            gmapLink3.onclick = function(){
+                createGoogleForm(3);
+                return false;
+            }
+        }
+        if ($("#google-map-link4").length > 0) {
+            var gmapLink4 = document.getElementById("google-map-link4");
+            gmapLink4.onclick = function(){
+                createGoogleForm(4);
+                return false;
+            }
+        }
+        var body = document.getElementById("google-div");
+        body.style.display = 'none';
+        return true;
+    }
+
+    function mySubmit(event)
+    {
+        var gid = document.getElementById('toHide').value;
+        var fromAddress = document.getElementById('drive-from-address' + gid);
+        var url = 'maps.google.com/maps?';
+        var myTo = document.getElementById('toaddress');
+        if (typeof event == "undefined")
+        {
+            event = window.event;
+        }
+
+        var target = getEventTarget(event);
+
+        while (target.nodeName.toLowerCase() != "input")
+        {
+            target = target.parentNode;
+        }
+
+        var value = target.getAttribute("value");
+
+        var dialog = target;
+
+        while (dialog.className != "customDialog")
+        {
+            dialog = dialog.parentNode;
+        }
+
+        var resultFrom = myTo.value.replace(/[\f\n\r\t\v]|,/,'+');
+        var goUrl = url + 'daddr='  + fromAddress.value + '&saddr=' + resultFrom + '&om=1';
+        var external = window.open('http://' + goUrl);
+        closeDialog(dialog,gid);
+        return true;
+    }
+
+    function createGoogleForm( gid )
+    {
+        try
+        {
+            var body = document.getElementById("google-div");
+            body.innerHTML = '';
+            body.style.display = '';
+
+            var dialog = document.createElement("div");
+            dialog.className = "customDialog";
+            dialog.style.visibility = "hidden";
+            dialog.style.position = "relative";
+
+            var dialogTitle = document.createElement("h2");
+            var hTitle = 'Get Driving Directions to ';
+            switch( gid ) {
+            case 1:
+                hTitle += 'Main Dock - St. Ignace';
+                break;
+            case 2:
+                hTitle += 'Railroad Dock - St. Ignace';
+                break;
+            case 3:
+                hTitle += 'Mackinaw City Dock';
+                break;
+            case 4:
+                hTitle += 'Winter Dock - St. Ignace';
+                break;
+            }
+            dialogTitle.appendChild(document.createTextNode(hTitle));
+            dialog.appendChild(dialogTitle);
+
+            var dialogInput2 = document.createElement("input");
+            dialogInput2.setAttribute("id", "toaddress");
+            dialogInput2.setAttribute("type", "text");
+            dialogInput2.setAttribute("size", "40");
+            dialogInput2.setAttribute("value", "Your Address City,State Zip");
+            attachEventListener(dialogInput2, "change", mySubmit, false);
+            attachEventListener(dialogInput2, "click", checkLink, false);
+            dialog.appendChild(dialogInput2);
+
+            var hiddenInput = document.createElement("input");
+            hiddenInput.setAttribute("id", "toHide");
+            hiddenInput.setAttribute("type", "hidden");
+            hiddenInput.setAttribute("value", gid);
+            dialog.appendChild(hiddenInput);
+
+            var dialogButton = document.createElement("input");
+            dialogButton.setAttribute("type", "button");
+            dialogButton.setAttribute("value", "Get Directions");
+            attachEventListener(dialogButton, "click", mySubmit, false);
+            dialog.appendChild(dialogButton);
+
+            body.appendChild(dialog);
+
+            var scrollingPosition = getScrollingPosition();
+            var viewportSize = getViewportSize();
+
+            dialog.style.left = 0;//scrollingPosition[0] + parseInt(viewportSize[0] / 2) - parseInt(dialog.offsetWidth / 2) + "px";
+            dialog.style.top = 0;//scrollingPosition[1] + parseInt(viewportSize[1] / 2) - parseInt(dialog.offsetHeight / 2) + "px";
+            dialog.style.visibility = "visible";
+            if ($("#google-map-link1").length > 0) {
+                var gmapLink = document.getElementById("google-map-link1");
+                parent1 = gmapLink.parentNode;
+            }
+            if ($("#google-map-link2").length > 0) {
+                var gmapLink2 = document.getElementById("google-map-link2");
+                parent2 = gmapLink2.parentNode;
+            }
+            if ($("#google-map-link3").length > 0) {
+                var gmapLink3 = document.getElementById("google-map-link3");
+                parent3 = gmapLink3.parentNode;
+            }
+            if ($("#google-map-link4").length > 0) {
+                var gmapLink4 = document.getElementById("google-map-link4");
+                parent4 = gmapLink4.parentNode;
+            }
+            switch( gid ) {
+            case 1:
+                if ($("#google-map-link1").length > 0) {
+                    parent1.style.backgroundColor = '#71B9DE';
+                }
+                if ($("#google-map-link2").length > 0) {
+                    parent2.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link3").length > 0) {
+                    parent3.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link4").length > 0) {
+                    parent4.style.backgroundColor = '#D1E4EE';
+                }
+                break;
+            case 2:
+                if ($("#google-map-link1").length > 0) {
+                    parent1.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link2").length > 0) {
+                    parent2.style.backgroundColor = '#71B9DE';
+                }
+                if ($("#google-map-link3").length > 0) {
+                    parent3.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link4").length > 0) {
+                    parent4.style.backgroundColor = '#D1E4EE';
+                }
+                break;
+            case 3:
+                if ($("#google-map-link1").length > 0) {
+                    parent1.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link2").length > 0) {
+                    parent2.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link3").length > 0) {
+                    parent3.style.backgroundColor = '#71B9DE';
+                }
+                if ($("#google-map-link4").length > 0) {
+                    parent4.style.backgroundColor = '#D1E4EE';
+                }
+                break;
+            case 4:
+                if ($("#google-map-link1").length > 0) {
+                    parent1.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link2").length > 0) {
+                    parent2.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link3").length > 0) {
+                    parent3.style.backgroundColor = '#D1E4EE';
+                }
+                if ($("#google-map-link4").length > 0) {
+                    parent4.style.backgroundColor = '#71B9DE';
+                }
+                break;
+            }
+
+            dialogButton.focus();
+        }
+        catch(err)
+        {
+            for (var i in err)
+            {
+                //console.log(i + ':' + err[i]);
+                //alert(i + ': ' + err[i]);
+            }
+            return true;
+        }
+
+        return false;
+    }
+    function myEnter(event)
+    {
+        if (typeof event == "undefined")
+        {
+            event = window.event;
+        }
+        alert(event.value);
+    }
+    function checkLink()
+    {
+        var toAddress = document.getElementById('toaddress');
+        if( toAddress.value == 'Your Address City,State Zip')
+        {
+            toAddress.value = '';
+        }
+        return false;
+    }
+    function makePopup(url, width, height, overflow)
+    {
+      if (width > 640) { width = 640; }
+      if (height > 480) { height = 480; }
+
+      if (overflow == '' || !/^(scroll|resize|both)$/.test(overflow))
+      {
+        overflow = 'both';
+      }
+
+      var win = window.open(url, '',
+          'width=' + width + ',height=' + height
+          + ',scrollbars=' + (/^(scroll|both)$/.test(overflow) ? 'yes' : 'no')
+          + ',resizable=' + (/^(resize|both)$/.test(overflow) ? 'yes' : 'no')
+          + ',status=yes,toolbar=yes,menubar=yes,location=yes'
+      );
+
+      return win;
+    }
+    function closeDialog(dialog,gid)
+    {
+        dialog.parentNode.removeChild(dialog);
+
+        if ($("#google-map-link1").length > 0) {
+            var gmapLink1 = document.getElementById("google-map-link1");
+            gmapLink1.onclick = function(){
+                createGoogleForm(1);
+                return false;
+            }
+        }
+        if ($("#google-map-link2").length > 0) {
+            var gmapLink2 = document.getElementById("google-map-link2");
+            gmapLink2.onclick = function(){
+                createGoogleForm(2);
+                return false;
+            }
+        }
+        if ($("#google-map-link3").length > 0) {
+            var gmapLink3 = document.getElementById("google-map-link3");
+            gmapLink3.onclick = function(){
+                createGoogleForm(3);
+                return false;
+            }
+        }
+        if ($("#google-map-link4").length > 0) {
+            var gmapLink4 = document.getElementById("google-map-link4");
+            gmapLink4.onclick = function(){
+                createGoogleForm(4);
+                return false;
+            }
+        }
+        var body = document.getElementById("google-div");
+        body.style.display = 'none';
+        return true;
+    }
+
+
+    function addLoadListener(fn)
+    {
+        if (typeof window.addEventListener != 'undefined')
+        {
+            window.addEventListener('load', fn, false);
+        }
+        else if (typeof document.addEventListener != 'undefined')
+        {
+            document.addEventListener('load', fn, false);
+        }
+        else if (typeof window.attachEvent != 'undefined')
+        {
+            window.attachEvent('onload', fn);
+        }
+        else
+        {
+            var oldfn = window.onload;
+            if (typeof window.onload != 'function')
+            {
+                window.onload = fn;
+            }
+            else
+            {
+                window.onload = function()
+                {
+                    oldfn();
+                    fn();
+                };
+            }
+        }
+    }
+    function attachEventListener(target, eventType, functionRef, capture)
+    {
+        if (typeof target.addEventListener != "undefined")
+        {
+            target.addEventListener(eventType, functionRef, capture);
+        }
+        else if (typeof target.attachEvent != "undefined")
+        {
+            target.attachEvent("on" + eventType, functionRef);
+        }
+        else
+        {
+            eventType = "on" + eventType;
+
+            if (typeof target[eventType] == "function")
+            {
+                var oldListener = target[eventType];
+
+                target[eventType] = function()
+                {
+                    oldListener();
+
+                    return functionRef();
+                }
+            }
+            else
+            {
+                target[eventType] = functionRef;
+            }
+        }
+
+        return true;
+    }
+
+    function getEventTarget(event)
+    {
+        var targetElement = null;
+
+        if (typeof event.target != "undefined")
+        {
+            targetElement = event.target;
+        }
+        else
+        {
+            targetElement = event.srcElement;
+        }
+
+        while (targetElement.nodeType == 3 && targetElement.parentNode != null)
+        {
+            targetElement = targetElement.parentNode;
+        }
+
+        return targetElement;
+    }
+
+    function getScrollingPosition()
+    {
+        //array for X and Y scroll position
+        var position = [0, 0];
+
+        //if the window.pageYOffset property is supported
+        if (typeof window.pageYOffset != 'undefined')
+        {
+            //store position values
+            position = [
+                window.pageXOffset,
+                window.pageYOffset
+                    ];
+        }
+
+        //if the documentElement.scrollTop property is supported
+        //and the value is greater than zero
+        if (typeof document.documentElement.scrollTop != 'undefined'
+                && document.documentElement.scrollTop > 0)
+        {
+            //store position values
+            position = [
+                document.documentElement.scrollLeft,
+                document.documentElement.scrollTop
+                    ];
+        }
+
+        //if the body.scrollTop property is supported
+        else if(typeof document.body.scrollTop != 'undefined')
+        {
+            //store position values
+            position = [
+                document.body.scrollLeft,
+                document.body.scrollTop
+                    ];
+        }
+
+        //return the array
+        return position;
+    }
+
+    function getViewportSize()
+    {
+        var size = [0,0];
+
+        if (typeof window.innerWidth != 'undefined')
+        {
+            size = [
+                window.innerWidth,
+                window.innerHeight
+                    ];
+        }
+        else if (typeof document.documentElement != 'undefined'
+                && typeof document.documentElement.clientWidth != 'undefined'
+                && document.documentElement.clientWidth != 0)
+        {
+            size = [
+                document.documentElement.clientWidth,
+                document.documentElement.clientHeight
+                    ];
+        }
+        else
+        {
+            size = [
+                document.getElementsByTagName('body')[0].clientWidth,
+                document.getElementsByTagName('body')[0].clientHeight
+                    ];
+        }
+
+        return size;
+    }
+});

diff --git a/models/admin/ajax/schedule.php b/models/admin/ajax/schedule.php
index 41b27a1..5d1b59f 100644 (file)
--- a/models/admin/ajax/schedule.php
+++ b/models/admin/ajax/schedule.php
@@ -13,7 +13,6 @@
  * @version  0.1
  */
 
-require_once GLM_MEMBERS_EVENTS_PLUGIN_PATH . '/models/front/events/list.php';
 /**
  * Steve Note...
  *
@@ -85,7 +84,8 @@ class GlmMembersAdmin_ajax_schedule
     public function modelAction($actionData = false)
     {
         if ( isset( $_REQUEST['schedule_id'] ) && preg_match( '/sel([0-9]*)/', $_REQUEST['schedule_id'] ) ) {
-            $curl = curl_init( 'http://localhost:8080/www.mackinacferry.com/schedule-' . $_REQUEST['schedule_id'] . '.js' );
+            $url = get_option( GLM_MEMBERS_APIS_STARLINE_OPTION_NAME ) . 'schedule-' . $_REQUEST['schedule_id'] . '.js';
+            $curl = curl_init( $url );
             curl_setopt( $curl, CURLOPT_RETURNTRANSFER, true );
             $content = curl_exec( $curl );
             curl_close( $curl );

diff --git a/models/admin/management/apis.php b/models/admin/management/apis.php
new file mode 100644 (file)
index 0000000..92ffd20
--- /dev/null
+++ b/models/admin/management/apis.php
@@ -0,0 +1,168 @@
+<?php
+/**
+ * Gaslight Media Members Database
+ * GLM Members DB - Events Add-on - Management Events Tab
+ *
+ * PHP version 5.5
+ *
+ * @category glmWordPressPlugin
+ * @package  glmMembersDatabase
+ * @author     Chuck Scott <cscott@gaslightmedia.com>
+ * @license  http://www.gaslightmedia.com Gaslightmedia
+ * @release  apis.php,v 1.0 2014/10/31 19:31:47 cscott Exp $
+ * @link     http://dev.gaslightmedia.com/
+ */
+
+/**
+ * GlmMembersAdmin_management_apis
+ *
+ * PHP version 5
+ *
+ * @category Model
+ * @package GLM Member DB
+ * @author    Chuck Scott <cscott@gaslightmedia.com>
+ * @license http://www.gaslightmedia.com Gaslightmedia
+ *            @release SVN: $Id: packaging.php,v 1.0 2011/01/25 19:31:47 cscott
+ *            Exp $
+ */
+class GlmMembersAdmin_management_apis
+{
+
+    /**
+     * WordPress Database Object
+     *
+     * @var $wpdb
+     * @access public
+     */
+    public $wpdb;
+    /**
+     * settings used for apis
+     *
+     * @var mixed
+     * @access public
+     */
+    public $settings = array();
+
+    /**
+     * Constructor
+     *
+     * This contractor performs the work for this model. This model returns
+     * an array containing the following.
+     *
+     * 'status'
+     *
+     * True if successful and false if there was a fatal failure.
+     *
+     * 'view'
+     *
+     * A suggested view name that the controller should use instead of the
+     * default view for this model or false to indicate that the default view
+     * should be used.
+     *
+     * 'data'
+     *
+     * Data that the model is returning for use in merging with the view to
+     * produce output.
+     *
+     * @wpdb object WordPress database object
+     *
+     * @return array Array containing status, suggested view, and any data
+     */
+    public function __construct ($wpdb, $config)
+    {
+        // Save WordPress Database object
+        $this->wpdb = $wpdb;
+
+        // Save plugin configuration object
+        $this->config = $config;
+    }
+
+    /**
+     * modelAction
+     *
+     * @param bool $actionData
+     * @access public
+     * @return void
+     */
+    public function modelAction($actionData = false)
+    {
+
+        $option                = false;
+        $settings_updated      = false;
+        $settings_update_error = false;
+        $api_settings          = false;
+        $option2               = false;
+        $starlineOptionName    = GLM_MEMBERS_APIS_STARLINE_OPTION_NAME;
+
+        if (isset($_REQUEST['option'])) {
+            $option = $_REQUEST['option'];
+        }
+
+        switch ($option) {
+        case 'settings':
+        default:
+            // Make sure option is set if default
+            $option = 'settings';
+
+            // Determine if current user can edit configurations
+            if ( !current_user_can( 'glm_members_management' ) ) {
+                return array(
+                    'status'           => false,
+                    'menuItemRedirect' => 'error',
+                    'modelRedirect'    => 'index',
+                    'view'             => 'admin/error/index.html',
+                    'data'             => array(
+                        'reason' => 'User does not have rights to make configuration changes.'
+                    )
+                );
+            }
+
+            // Check for submission option
+            $option2 = '';
+            if ( isset( $_REQUEST['option2'] ) ) {
+                $option2 = $_REQUEST['option2'];
+            }
+
+            switch($option2) {
+            // Update the settings and redisplay the form
+            case 'submit':
+                $settings_updated = true;
+                update_option( $starlineOptionName, $_REQUEST[$starlineOptionName] );
+                $starlineUrl = get_option( $starlineOptionName );
+
+                break;
+
+            // Default is to get the current settings and display the form
+            default:
+                $starlineUrl = get_option( $starlineOptionName );
+
+                break;
+            }
+            break;
+        }
+
+        // Compile template data
+        $template_data = array(
+            'option'              => $option,
+            'starlineUrl'        => $starlineUrl,
+            'starlineOptionName'  => $starlineOptionName,
+            'settingsUpdated'     => $settings_updated,
+            'settingsUpdateError' => $settings_update_error,
+            'apisSettings'        => $api_settings,
+        );
+
+        // Return status, suggested view, and data to controller
+        return array(
+            'status'           => true,
+            'menuItemRedirect' => false,
+            'modelRedirect'    => false,
+            'view'             => 'admin/management/apis.html',
+            'data'             => $template_data
+        );
+
+
+    }
+
+}
+
+?>

diff --git a/models/front/apis/schedule.php b/models/front/apis/schedule.php
index d23ee0b..83717f8 100644 (file)
--- a/models/front/apis/schedule.php
+++ b/models/front/apis/schedule.php
@@ -54,7 +54,8 @@ class GlmMembersFront_apis_schedule
         $content  = '';
 
         // Get the schedule from starline
-        $curl = curl_init( 'http://localhost:8080/www.mackinacferry.com/ferrySchedule.php' );
+        $url = get_option( GLM_MEMBERS_APIS_STARLINE_OPTION_NAME ) . 'ferrySchedule.php';
+        $curl = curl_init( $url );
         curl_setopt( $curl, CURLOPT_RETURNTRANSFER, true );
         $content = curl_exec( $curl );
         curl_close( $curl );

diff --git a/setup/adminTabs.php b/setup/adminTabs.php
index cd3ec95..16fd519 100644 (file)
--- a/setup/adminTabs.php
+++ b/setup/adminTabs.php
@@ -33,3 +33,21 @@
  *
  */
 
+// If user can manage all members
+if (current_user_can('glm_members_members')) {
+    if (apply_filters('glm_members_permit_admin_members_apis_tab', true)) {
+        add_filter('glm-member-db-add-tab-for-management',
+            function($addOnTabs) {
+                $newTabs = array(
+                    array(
+                        'text' => 'API',
+                        'menu' => 'management',
+                        'action' => 'apis'
+                    )
+                );
+                $addOnTabs = array_merge($addOnTabs, $newTabs);
+                return $addOnTabs;
+            }
+        );
+    }
+}

diff --git a/setup/shortcodes.php b/setup/shortcodes.php
index 96a99b7..392a46a 100644 (file)
--- a/setup/shortcodes.php
+++ b/setup/shortcodes.php
@@ -98,5 +98,14 @@ $glmMembersApisShortcodes = array(
     ),
 );
 
-$glmMembersApisShortcodesDescription = '';
+$glmMembersApisShortcodesDescription = '
+    <tr><th>Shortcode</th><th>Attribute</th><th>Description</th></tr>
+     <tr>
+        <th>[glm-members-api-schedule]</th>
+        <td>&nbsp;</td>
+        <td width="50%">
+            Pulls in the Schedule for Starline
+        </td>
+    </tr>
+    ';
 

diff --git a/setup/validActions.php b/setup/validActions.php
index 4efeb2f..972d477 100644 (file)
--- a/setup/validActions.php
+++ b/setup/validActions.php
@@ -61,7 +61,10 @@ $glmMembersApisAddOnValidActions = array(
     'adminActions' => array(
         'ajax' => array(
             'schedule' => GLM_MEMBERS_APIS_PLUGIN_SLUG,
-        )
+        ),
+        'management' => array(
+            'apis' => GLM_MEMBERS_APIS_PLUGIN_SLUG
+        ),
     ),
     'frontActions' => array(
         'apis' => array(

diff --git a/views/admin/management/apis.html b/views/admin/management/apis.html
new file mode 100644 (file)
index 0000000..8fd4930
--- /dev/null
+++ b/views/admin/management/apis.html
@@ -0,0 +1,48 @@
+{include file='admin/management/header.html'}
+
+    <h2 class="nav-tab-wrapper" style="margin-bottom: 1em;"> API Settings </h2>
+
+    <!-- Management Settings -->
+
+    <table id="glm-table-settings" class="glm-admin-table glm-settings-table">
+        <tr>
+            <td colspan="2">
+                {if $settingsUpdated}<h2 class="glm-notice glm-flash-updated glm-right">Settings Updated</h2>{/if}
+                {if $settingsUpdateError}<span class="glm-error glm-flash-updated glm-right">Settings Update Error</span>{/if}
+                <h2>Management Settings</h2>
+            </td>
+        </tr>
+        <tr>
+            <td>
+                <form action="{$thisUrl}?page={$thisPage}" method="post" enctype="multipart/form-data">
+                    <input type="hidden" name="glm_action" value="apis">
+                    <input type="hidden" name="option" value="settings">
+                    <input type="hidden" name="option2" value="submit">
+                    <table class="glm-admin-table">
+                        <tr>
+                            <th class="emailLabel"> URL for ticketing system (Starline) [include ending slash]</th>
+                            <td>
+                                <input
+                                    class="glm-form-text-input-medium"
+                                    name="{$starlineOptionName}"
+                                    id="ticketUrl"
+                                    type="text"
+                                    value="{$starlineUrl}">
+                            </td>
+                        </tr>
+                    </table>
+                    <input type="submit" value="Update Settings" class="button-primary">
+                </form>
+            </td>
+        </tr>
+    </table>
+
+<script>
+jQuery(document).ready(function($) {
+
+    // Flash certain elements for a short time after display
+    $(".glm-flash-updated").fadeOut(500).fadeIn(500)
+        .fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500)
+        .fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500).fadeOut(500);
+});
+</script>