From 40d1b7481a6e83feb8c127202eac5e349ff347a2 Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <fabio.manganiello@booking.com>
Date: Mon, 16 Apr 2018 14:38:08 +0200
Subject: [PATCH] Added TTS web plugin

---
 platypush/backend/http/static/css/tts.css     |  9 +++
 platypush/backend/http/static/js/tts.js       | 65 +++++++++++++++++++
 .../backend/http/templates/plugins/tts.html   | 19 ++++++
 3 files changed, 93 insertions(+)
 create mode 100644 platypush/backend/http/static/css/tts.css
 create mode 100644 platypush/backend/http/static/js/tts.js
 create mode 100644 platypush/backend/http/templates/plugins/tts.html

diff --git a/platypush/backend/http/static/css/tts.css b/platypush/backend/http/static/css/tts.css
new file mode 100644
index 00000000..2714662e
--- /dev/null
+++ b/platypush/backend/http/static/css/tts.css
@@ -0,0 +1,9 @@
+#tts-container {
+    max-width: 60em;
+    margin: 3em auto;
+}
+
+    #tts-form input[type=text] {
+        width: 100%;
+    }
+
diff --git a/platypush/backend/http/static/js/tts.js b/platypush/backend/http/static/js/tts.js
new file mode 100644
index 00000000..2b46af89
--- /dev/null
+++ b/platypush/backend/http/static/js/tts.js
@@ -0,0 +1,65 @@
+$(document).ready(function() {
+    var $container = $('#tts-container'),
+        $ttsForm = $('#tts-form');
+
+    var execute = function(request, onSuccess, onError, onComplete) {
+        request['target'] = 'localhost';
+        return $.ajax({
+            type: 'POST',
+            url: '/execute',
+            contentType: 'application/json',
+            dataType: 'json',
+            data: JSON.stringify(request),
+            complete: function() {
+                if (onComplete) {
+                    onComplete();
+                }
+            },
+            error: function(xhr, status, error) {
+                if (onError) {
+                    onError(xhr, status, error);
+                }
+            },
+            success: function(response, status, xhr) {
+                if (onSuccess) {
+                    onSuccess(response, status, xhr);
+                }
+            },
+            beforeSend: function(xhr) {
+                if (window.token) {
+                    xhr.setRequestHeader('X-Token', window.token);
+                }
+            },
+        });
+    };
+
+    var initBindings = function() {
+        $ttsForm.on('submit', function(event) {
+            var formData = $(this).serializeArray().reduce(function(obj, item) {
+                var value = item.value.trim();
+                if (value.length > 0) {
+                    obj[item.name] = item.value;
+                }
+
+                return obj;
+            }, {});
+
+            execute(
+                {
+                    type: 'request',
+                    action: 'tts.say',
+                    args: formData,
+                }
+            );
+
+            return false;
+        });
+    };
+
+    var init = function() {
+        initBindings();
+    };
+
+    init();
+});
+
diff --git a/platypush/backend/http/templates/plugins/tts.html b/platypush/backend/http/templates/plugins/tts.html
new file mode 100644
index 00000000..e33391fb
--- /dev/null
+++ b/platypush/backend/http/templates/plugins/tts.html
@@ -0,0 +1,19 @@
+<script type="text/javascript" src="{{ url_for('static', filename='js/tts.js') }}"></script>
+<link rel="stylesheet" href="{{ url_for('static', filename='css/tts.css') }}"></script>
+
+<div class="row" id="tts-container">
+    <form action="#" id="tts-form">
+        <div class="eight columns">
+            <input type="text" name="phrase" placeholder="Text to say">
+        </div>
+        <div class="three columns">
+            <input type="text" name="lang" placeholder="Lang code">
+        </div>
+        <div class="one column">
+            <button type="submit">
+                <i class="fa fa-microphone"></i>
+            </button>
+        </div>
+    </form>
+</div>
+