From 20ff27bf716e4d538ceb832ea93b59d599f917df Mon Sep 17 00:00:00 2001 From: Cedomir Djosic Date: Wed, 3 Feb 2016 01:30:41 +0100 Subject: [PATCH] T356 - Iguana Widget Beta Version initial commit --- widget/ReadMe.MD | 36 ++++++++++++ widget/index.html | 21 +++++++ widget/pasted-widget.html | 109 +++++++++++++++++++++++++++++++++++ widget/widguana-snippet.html | 95 ++++++++++++++++++++++++++++++ widget/widguana.js | 82 ++++++++++++++++++++++++++ 5 files changed, 343 insertions(+) create mode 100644 widget/ReadMe.MD create mode 100644 widget/index.html create mode 100644 widget/pasted-widget.html create mode 100644 widget/widguana-snippet.html create mode 100644 widget/widguana.js diff --git a/widget/ReadMe.MD b/widget/ReadMe.MD new file mode 100644 index 000000000..ce8bc1b4d --- /dev/null +++ b/widget/ReadMe.MD @@ -0,0 +1,36 @@ +WIDGUANA widget + + WidGuana is the simple widget which interacts with native Iguana at port 127.0.0.1:7778. +It was made to accomplish simple echo test. It has few predefined calls to API, and echos a +string in JSON format as a response. + + It is made completely with plain JavaScript, so it doesn't depend on any JS framework. +Widguana can be easily upgraded and styled. It has a simple modal window which can be altered +in any desired shape and form. + +INSTALLATION + + There are two ways to install WIDGUANA: + +1. INCLUDE AS A SEPARETE JAVASCRIPT FILE + + 1)Copy widguana.js file on your server. + 2)Include this file with correct path. + Example: + + + 3)put this HTML snippet where ever you want on your web page: +
+ + 4)Save all + 5)Done + +2. COPY / PASTE SNIPPET + + 1)Open widguana-snippet.html in a text editor + 2)Make
on your web page. You can add class or id attr in order to style it. + This will be a widget container for WIDGUANA. + 3)Select all code from widguana-snippet.html and copy it. + 4)Paste this between
here
tags you made + 5)Save all + 6)Done \ No newline at end of file diff --git a/widget/index.html b/widget/index.html new file mode 100644 index 000000000..4090f485c --- /dev/null +++ b/widget/index.html @@ -0,0 +1,21 @@ + + + + + WidGuana Test Page + + +

WidGuana - Iguana Widget Button Example

+ +

1st Example - External JS file

+ +
+ + +

2nd Example - copy/paste entire widget to the container

+ + Click here to see 2nd example + + + + \ No newline at end of file diff --git a/widget/pasted-widget.html b/widget/pasted-widget.html new file mode 100644 index 000000000..10d65ba13 --- /dev/null +++ b/widget/pasted-widget.html @@ -0,0 +1,109 @@ + + + + + WidGuana Test Page + + +

This is the test page for the widget WidGUana

+

Widget has been pasted between HTML div tags

+
+ + + + +
+ + + +
+ + + + + + \ No newline at end of file diff --git a/widget/widguana-snippet.html b/widget/widguana-snippet.html new file mode 100644 index 000000000..c1781d36f --- /dev/null +++ b/widget/widguana-snippet.html @@ -0,0 +1,95 @@ + + + + + + +
+ + \ No newline at end of file diff --git a/widget/widguana.js b/widget/widguana.js new file mode 100644 index 000000000..fcf75e270 --- /dev/null +++ b/widget/widguana.js @@ -0,0 +1,82 @@ +window.onload = function(){ + + var container = document.getElementById("widguana-container"); + var content = ''; + /* Style */ + content += ''; + + /* HTML */ + content += '
'; + content += ''; + content += '
'; + content += '

WidGuana

'; + content += '

Sends HTTP Request To Iguna Agent.

'; + content += ''; + content += ''; + content += '

Send Request

'; + content += ''; + content += '

Response:

'; + content += '

'; + content += 'Click here to [close]'; + content += '
'; + + + container.innerHTML = content; +} + + +/* Modal */ +function overlay() { + el = document.getElementById("widguana-overlay"); + el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible"; +} + + +/* XMLHttpRequest */ +function httpGetIguna() { + var xhttp; + var request; + var el = document.getElementById("widguana-requests"); + var selected = el.options[el.selectedIndex].value; + var response_cont = document.getElementById("widguana-response"); + + request = '//127.0.0.1:7778' + selected ; + + + if (window.XMLHttpRequest){ + xhttp = new XMLHttpRequest(); + }else{ + xhttp = new ActiveXObject("Microsoft.XMLHTTP"); + } + + xhttp.onreadystatechange = function() { + if (xhttp.readyState == 4 && xhttp.status == 200) { + + //response.innerHTML = ''; + //response = JSON.parse(xhttp.responseText); + response = xhttp.responseText; + console.log(response); + response_cont.innerHTML = response; + + } + }; + + xhttp.open("GET", request, true); + + xhttp.onprogress = function(){ + response.innerHTML = 'Status: ' + xhttp.status; + } + + xhttp.send(); +}