Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang=en>
- <style>html {
- font-family: sans-serif;
- -ms-text-size-adjust: 100%;
- -webkit-text-size-adjust: 100%
- }
- body {
- margin: 0
- }
- article,
- aside,
- details,
- figcaption,
- figure,
- footer,
- header,
- hgroup,
- main,
- menu,
- nav,
- section,
- summary {
- display: block
- }
- audio,
- canvas,
- progress,
- video {
- display: inline-block;
- vertical-align: baseline
- }
- audio:not([controls]) {
- display: none;
- height: 0
- }
- [hidden],
- template {
- display: none
- }
- a {
- background-color: transparent
- }
- a:active,
- a:hover {
- outline: 0
- }
- abbr[title] {
- border-bottom: 1px dotted
- }
- b,
- strong {
- font-weight: 700
- }
- dfn {
- font-style: italic
- }
- h1 {
- font-size: 2em;
- margin: .67em 0
- }
- mark {
- background: #ff0;
- color: #000
- }
- small {
- font-size: 80%
- }
- sub,
- sup {
- font-size: 75%;
- line-height: 0;
- position: relative;
- vertical-align: baseline
- }
- sup {
- top: -.5em
- }
- sub {
- bottom: -.25em
- }
- img {
- border: 0
- }
- svg:not(:root) {
- overflow: hidden
- }
- figure {
- margin: 1em 40px
- }
- hr {
- -moz-box-sizing: content-box;
- box-sizing: content-box;
- height: 0
- }
- pre {
- overflow: auto
- }
- code,
- kbd,
- pre,
- samp {
- font-family: monospace, monospace;
- font-size: 1em
- }
- button,
- input,
- optgroup,
- select,
- textarea {
- color: inherit;
- font: inherit;
- margin: 0
- }
- button {
- overflow: visible
- }
- button,
- select {
- text-transform: none
- }
- button,
- html input[type=button],
- input[type=reset],
- input[type=submit] {
- -webkit-appearance: button;
- cursor: pointer
- }
- button[disabled],
- html input[disabled] {
- cursor: default
- }
- button::-moz-focus-inner,
- input::-moz-focus-inner {
- border: 0;
- padding: 0
- }
- input {
- line-height: normal
- }
- input[type=checkbox],
- input[type=radio] {
- box-sizing: border-box;
- padding: 0
- }
- input[type=number]::-webkit-inner-spin-button,
- input[type=number]::-webkit-outer-spin-button {
- height: auto
- }
- input[type=search] {
- -webkit-appearance: textfield;
- -moz-box-sizing: content-box;
- -webkit-box-sizing: content-box;
- box-sizing: content-box
- }
- input[type=search]::-webkit-search-cancel-button,
- input[type=search]::-webkit-search-decoration {
- -webkit-appearance: none
- }
- fieldset {
- border: 1px solid silver;
- margin: 0 2px;
- padding: .35em .625em .75em
- }
- legend {
- border: 0;
- padding: 0
- }
- textarea {
- overflow: auto
- }
- optgroup {
- font-weight: 700
- }
- table {
- border-collapse: collapse;
- border-spacing: 0
- }
- td,
- th {
- padding: 0
- }
- .container {
- position: relative;
- width: 100%;
- max-width: 960px;
- margin: 0 auto;
- padding: 0 20px;
- box-sizing: border-box
- }
- .column,
- .columns {
- width: 100%;
- float: left;
- box-sizing: border-box
- }
- @media (min-width: 400px) {
- .container {
- width: 85%;
- padding: 0
- }
- }
- @media (min-width: 550px) {
- .container {
- width: 80%
- }
- .column,
- .columns {
- margin-left: 4%
- }
- .column:first-child,
- .columns:first-child {
- margin-left: 0
- }
- .one.column,
- .one.columns {
- width: 4.66666666667%
- }
- .two.columns {
- width: 13.3333333333%
- }
- .three.columns {
- width: 22%
- }
- .four.columns {
- width: 30.6666666667%
- }
- .five.columns {
- width: 39.3333333333%
- }
- .six.columns {
- width: 48%
- }
- .seven.columns {
- width: 56.6666666667%
- }
- .eight.columns {
- width: 65.3333333333%
- }
- .nine.columns {
- width: 74%
- }
- .ten.columns {
- width: 82.6666666667%
- }
- .eleven.columns {
- width: 91.3333333333%
- }
- .twelve.columns {
- width: 100%;
- margin-left: 0
- }
- .one-third.column {
- width: 30.6666666667%
- }
- .two-thirds.column {
- width: 65.3333333333%
- }
- .one-half.column {
- width: 48%
- }
- .offset-by-one.column,
- .offset-by-one.columns {
- margin-left: 8.66666666667%
- }
- .offset-by-two.column,
- .offset-by-two.columns {
- margin-left: 17.3333333333%
- }
- .offset-by-three.column,
- .offset-by-three.columns {
- margin-left: 26%
- }
- .offset-by-four.column,
- .offset-by-four.columns {
- margin-left: 34.6666666667%
- }
- .offset-by-five.column,
- .offset-by-five.columns {
- margin-left: 43.3333333333%
- }
- .offset-by-six.column,
- .offset-by-six.columns {
- margin-left: 52%
- }
- .offset-by-seven.column,
- .offset-by-seven.columns {
- margin-left: 60.6666666667%
- }
- .offset-by-eight.column,
- .offset-by-eight.columns {
- margin-left: 69.3333333333%
- }
- .offset-by-nine.column,
- .offset-by-nine.columns {
- margin-left: 78%
- }
- .offset-by-ten.column,
- .offset-by-ten.columns {
- margin-left: 86.6666666667%
- }
- .offset-by-eleven.column,
- .offset-by-eleven.columns {
- margin-left: 95.3333333333%
- }
- .offset-by-one-third.column,
- .offset-by-one-third.columns {
- margin-left: 34.6666666667%
- }
- .offset-by-two-thirds.column,
- .offset-by-two-thirds.columns {
- margin-left: 69.3333333333%
- }
- .offset-by-one-half.column,
- .offset-by-one-half.columns {
- margin-left: 52%
- }
- }
- html {
- font-size: 62.5%
- }
- body {
- font-size: 1.5em;
- line-height: 1.6;
- font-weight: 400;
- font-family: Raleway, HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
- color: #222
- }
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- margin-top: 0;
- margin-bottom: 2rem;
- font-weight: 300
- }
- h1 {
- font-size: 4rem;
- line-height: 1.2;
- letter-spacing: -.1rem
- }
- h2 {
- font-size: 3.6rem;
- line-height: 1.25;
- letter-spacing: -.1rem
- }
- h3 {
- font-size: 3rem;
- line-height: 1.3;
- letter-spacing: -.1rem
- }
- h4 {
- font-size: 2.4rem;
- line-height: 1.35;
- letter-spacing: -.08rem
- }
- h5 {
- font-size: 1.8rem;
- line-height: 1.5;
- letter-spacing: -.05rem
- }
- h6 {
- font-size: 1.5rem;
- line-height: 1.6;
- letter-spacing: 0
- }
- @media (min-width: 550px) {
- h1 {
- font-size: 5rem
- }
- h2 {
- font-size: 4.2rem
- }
- h3 {
- font-size: 3.6rem
- }
- h4 {
- font-size: 3rem
- }
- h5 {
- font-size: 2.4rem
- }
- h6 {
- font-size: 1.5rem
- }
- }
- p {
- margin-top: 0
- }
- a {
- color: #1eaedb
- }
- a:hover {
- color: #0fa0ce
- }
- .button,
- button,
- input[type=button],
- input[type=reset],
- input[type=submit] {
- display: inline-block;
- height: 38px;
- padding: 0 30px;
- color: #555;
- text-align: center;
- font-size: 11px;
- font-weight: 600;
- line-height: 38px;
- letter-spacing: .1rem;
- text-transform: uppercase;
- text-decoration: none;
- white-space: nowrap;
- background-color: transparent;
- border-radius: 4px;
- border: 1px solid #bbb;
- cursor: pointer;
- box-sizing: border-box
- }
- .button:focus,
- .button:hover,
- button:focus,
- button:hover,
- input[type=button]:focus,
- input[type=button]:hover,
- input[type=reset]:focus,
- input[type=reset]:hover,
- input[type=submit]:focus,
- input[type=submit]:hover {
- color: #333;
- border-color: #888;
- outline: 0
- }
- .button.button-primary,
- button.button-primary,
- input[type=button].button-primary,
- input[type=reset].button-primary,
- input[type=submit].button-primary {
- color: #fff;
- background-color: #33c3f0;
- border-color: #33c3f0
- }
- .button.button-primary:focus,
- .button.button-primary:hover,
- button.button-primary:focus,
- button.button-primary:hover,
- input[type=button].button-primary:focus,
- input[type=button].button-primary:hover,
- input[type=reset].button-primary:focus,
- input[type=reset].button-primary:hover,
- input[type=submit].button-primary:focus,
- input[type=submit].button-primary:hover {
- color: #fff;
- background-color: #1eaedb;
- border-color: #1eaedb
- }
- input[type=email],
- input[type=number],
- input[type=password],
- input[type=search],
- input[type=tel],
- input[type=text],
- input[type=url],
- select,
- textarea {
- height: 38px;
- padding: 6px 10px;
- background-color: #fff;
- border: 1px solid #d1d1d1;
- border-radius: 4px;
- box-shadow: none;
- box-sizing: border-box
- }
- input[type=email],
- input[type=number],
- input[type=password],
- input[type=search],
- input[type=tel],
- input[type=text],
- input[type=url],
- textarea {
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none
- }
- textarea {
- min-height: 65px;
- padding-top: 6px;
- padding-bottom: 6px
- }
- input[type=email]:focus,
- input[type=number]:focus,
- input[type=password]:focus,
- input[type=search]:focus,
- input[type=tel]:focus,
- input[type=text]:focus,
- input[type=url]:focus,
- select:focus,
- textarea:focus {
- border: 1px solid #33c3f0;
- outline: 0
- }
- label,
- legend {
- display: block;
- margin-bottom: .5rem;
- font-weight: 600
- }
- fieldset {
- padding: 0;
- border-width: 0
- }
- input[type=checkbox],
- input[type=radio] {
- display: inline
- }
- label>.label-body {
- display: inline-block;
- margin-left: .5rem;
- font-weight: 400
- }
- ul {
- list-style: circle inside
- }
- ol {
- list-style: decimal inside
- }
- ol,
- ul {
- padding-left: 0;
- margin-top: 0
- }
- ol ol,
- ol ul,
- ul ol,
- ul ul {
- margin: 1.5rem 0 1.5rem 3rem;
- font-size: 90%
- }
- li {
- margin-bottom: 1rem
- }
- code {
- padding: .2rem .5rem;
- margin: 0 .2rem;
- font-size: 90%;
- white-space: nowrap;
- background: #f1f1f1;
- border: 1px solid #e1e1e1;
- border-radius: 4px
- }
- pre>code {
- display: block;
- padding: 1rem 1.5rem;
- white-space: pre
- }
- td,
- th {
- padding: 12px 15px;
- text-align: left;
- border-bottom: 1px solid #e1e1e1
- }
- td:first-child,
- th:first-child {
- padding-left: 0
- }
- td:last-child,
- th:last-child {
- padding-right: 0
- }
- .button,
- button {
- margin-bottom: 1rem
- }
- fieldset,
- input,
- select,
- textarea {
- margin-bottom: 1.5rem
- }
- blockquote,
- dl,
- figure,
- form,
- ol,
- p,
- pre,
- table,
- ul {
- margin-bottom: 2.5rem
- }
- .u-full-width {
- width: 100%;
- box-sizing: border-box
- }
- .u-max-full-width {
- max-width: 100%;
- box-sizing: border-box
- }
- .u-pull-right {
- float: right
- }
- .u-pull-left {
- float: left
- }
- hr {
- margin-top: 3rem;
- margin-bottom: 3.5rem;
- border-width: 0;
- border-top: 1px solid #e1e1e1
- }
- .container:after,
- .row:after,
- .u-cf {
- content: "";
- display: table;
- clear: both
- }
- .navbar {
- display: none
- }
- @media (min-width: 550px) {
- .header {
- margin-top: 18rem
- }
- .value-props {
- margin-top: 9rem;
- margin-bottom: 7rem
- }
- .value-img {
- margin-bottom: 1rem
- }
- .example-grid .column,
- .example-grid .columns {
- margin-bottom: 1.5rem
- }
- .docs-section {
- padding: 6rem 0
- }
- .example-send-yourself-copy {
- float: right;
- margin-top: 12px
- }
- .example-screenshot-wrapper {
- position: absolute;
- width: 48%;
- height: 100%;
- left: 0;
- max-height: none
- }
- }
- @media (min-width: 750px) {
- .navbar+.docs-section {
- border-top-width: 0
- }
- .navbar,
- .navbar-spacer {
- display: block;
- width: 100%;
- height: 6.5rem;
- background: #fff;
- z-index: 99;
- border-top: 1px solid #eee;
- border-bottom: 1px solid #eee
- }
- .navbar-spacer {
- display: none
- }
- .navbar>.container {
- width: 100%
- }
- .navbar-list {
- list-style: none;
- margin-bottom: 0
- }
- .navbar-item {
- position: relative;
- float: left;
- margin-bottom: 0
- }
- .navbar-link {
- text-transform: uppercase;
- font-size: 11px;
- font-weight: 600;
- letter-spacing: .2rem;
- margin-right: 35px;
- text-decoration: none;
- line-height: 6.5rem;
- color: #222
- }
- .navbar-link.active {
- color: #33c3f0
- }
- .has-docked-nav .navbar {
- position: fixed;
- top: 0;
- left: 0
- }
- .has-docked-nav .navbar-spacer {
- display: block
- }
- .has-docked-nav .navbar>.container {
- width: 80%
- }
- .popover.open {
- display: block
- }
- .popover {
- display: none;
- position: absolute;
- top: 0;
- left: 0;
- background: #fff;
- border: 1px solid #eee;
- border-radius: 4px;
- top: 92%;
- left: -50%;
- -webkit-filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1));
- -moz-filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1));
- filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1))
- }
- .popover-item:first-child .popover-link:after,
- .popover-item:first-child .popover-link:before {
- bottom: 100%;
- left: 50%;
- border: solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none
- }
- .popover-item:first-child .popover-link:after {
- border-color: rgba(255, 255, 255, 0);
- border-bottom-color: #fff;
- border-width: 10px;
- margin-left: -10px
- }
- .popover-item:first-child .popover-link:before {
- border-color: rgba(238, 238, 238, 0);
- border-bottom-color: #eee;
- border-width: 11px;
- margin-left: -11px
- }
- .popover-list {
- padding: 0;
- margin: 0;
- list-style: none
- }
- .popover-item {
- padding: 0;
- margin: 0
- }
- .popover-link {
- position: relative;
- color: #222;
- display: block;
- padding: 8px 20px;
- border-bottom: 1px solid #eee;
- text-decoration: none;
- text-transform: uppercase;
- font-size: 1rem;
- font-weight: 600;
- text-align: center;
- letter-spacing: .1rem
- }
- .popover-item:first-child .popover-link {
- border-radius: 4px 4px 0 0
- }
- .popover-item:last-child .popover-link {
- border-radius: 0 0 4px 4px;
- border-bottom-width: 0
- }
- .popover-link:hover {
- color: #fff;
- background: #33c3f0
- }
- .popover-item:first-child .popover-link:hover:after,
- .popover-link:hover {
- border-bottom-color: #33c3f0
- }
- }
- </style>
- <meta charset=utf-8>
- <title>MafraLab Weather Station</title>
- <script language="javascript">function XMLhttp() {
- // all possible variants
- var XMLHTTPtypes = [
- function() { return new XMLHttpRequest(); },
- function() { return new ActiveXObject("Msxml3.XMLHTTP"); },
- function() { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); },
- function() { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); },
- function() { return new ActiveXObject("Msxml2.XMLHTTP"); },
- function() { return new ActiveXObject("Microsoft.XMLHTTP"); }
- ];
- // return the appropriate object
- function XMLhttp() {
- if(this instanceof XMLhttp) {
- XMLHTTPtypes.forEach(function(t) {
- try { xmlhttp = t(); }
- catch(e) {}
- });
- return xmlhttp;
- } else {
- return new XMLhttp();
- }
- }
- var req = {
- get: function get(obj, data) {
- obj.open("GET", this.url + "?" + data, this.async);
- obj.send();
- },
- post: function post(obj, data) {
- obj.open("POST", this.url, this.async);
- obj.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
- obj.send(data);
- },
- head: function head(obj, data) {
- obj.open("HEAD", this.url + "?" + data, this.async);
- obj.send();
- },
- // append more http request methods at will and include them in the condition below (102)!
- log: function log(obj, data) {
- console.log(this.type.toUpperCase() + " fired at: " + this.url + " || Data:" + data);
- }
- }
- function minAjax(config) {
- /*Config Structure
- url:"reqesting URL"
- type:"GET or POST"
- method: "(OPTIONAL) True for async and False for Non-async | By default its Async"
- data: "(OPTIONAL) another Nested Object which should contains reqested Properties in form of Object Properties"
- success: "(OPTIONAL) Callback function to process after response | function(data,status)"
- failed: "(OPTIONAL) Callback function to process after a failed response | function(data,status)"
- */
- if(config.url === "") {
- return;
- }
- if(config.type === "") {
- return;
- }
- if(config.method === true) {
- config.method = true;
- } else if ( config.method === undefined ) {
- // nothing is given - defaulting to true
- config.method = true;
- // everything else should be treated as false
- } else {
- config.method = false;
- }
- var xmlhttp = XMLhttp();
- xmlhttp.onreadystatechange = function() {
- if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
- {
- if (config.success)
- {
- config.success(xmlhttp.responseText, xmlhttp.readyState);
- }
- else
- {
- if (config.failed)
- {
- config.failed(xmlhttp.responseText, xmlhttp.readyState);
- }
- }
- }
- else
- {
- if (config.failed)
- {
- config.failed(xmlhttp.responseText, xmlhttp.readyState);
- }
- }
- }
- var sendString = [],
- sendData = config.data;
- if( typeof sendData === "string" ){
- var tmpArr = String.prototype.split.call(sendData,'&');
- for(var i = 0, j = tmpArr.length; i < j; i++){
- var datum = tmpArr[i].split('=');
- sendString.push(encodeURIComponent(datum[0]) + "=" + encodeURIComponent(datum[1]));
- }
- }else if( typeof sendData === 'object' && !( sendData instanceof String || (FormData && sendData instanceof FormData) ) ){
- for (var k in sendData) {
- var datum = sendData[k];
- if( Object.prototype.toString.call(datum) == "[object Array]" ){
- for(var i = 0, j = datum.length; i < j; i++) {
- sendString.push(encodeURIComponent(k) + "[]=" + encodeURIComponent(datum[i]));
- }
- }else{
- sendString.push(encodeURIComponent(k) + "=" + encodeURIComponent(datum));
- }
- }
- }
- sendString = sendString.join('&');
- if((config.type === "GET") || (config.type === "POST") || (config.type === "HEAD")) {
- req[config.type.toLowerCase()].call(config, xmlhttp, sendString);
- } else {
- console.log('Request type not supported');
- }
- }
- </script>
- <meta content="width=device-width,initial-scale=1"name=viewport>
- <body class="code-snippets-visible has-docked-nav">
- <div class="container">
- <div class="navbar-spacer"></div>
- <nav class="navbar">
- <div class="container">
- <ul class="navbar-list">
- <li class="navbar-item"><a class="navbar-link" href="#intro">Intro</a></li>
- </ul>
- </div>
- </nav>
- <script>
- function sendLogin()
- {
- minAjax(
- {
- url:"/dologin",
- type:"POST",
- debugLog:'true',
- data:"username="+document.getElementById("username").value+"&password="+document.getElementById("password").value,
- success:function(a){alert(a)},
- failed:function(b){alert("ERROR" + b)}})}</script>
- <div class=row>
- <div class="columns seven"><label for=username>Username</label><input id=username type=text name=username required placeholder=username><label for=password>Password</label><input id=password name=password required type=password></div>
- </div>
- <button class=button-primary onClick="sendLogin()">Log In</button>
- </div>
- <table bgcolor=white border=0 cellpadding=12 width=100%>
- <tr>
- <td>
- <p style=color:#000;background:#fff;font-size:.8em;font-weight:700;text-align:center;margin:0><a href=http://www.www.mafralab.com>Mafralab</a> © 2017
- </table>
Add Comment
Please, Sign In to add comment