initial commit

retornam · Sep 15, 2018 · e6bb9a6 · e6bb9a6
commit e6bb9a6
Show file tree

Hide file tree

Showing 5 changed files with 111 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,16 @@
+<html>
+<head>
+	<title>My IP</title>
+  <script   src="https://code.jquery.com/jquery-2.2.3.js"   integrity="sha256-laXWtGydpwqJ8JA+X9x2miwmaiKhn8tVmOVEigRNtP4="   crossorigin="anonymous"></script>
+	<link rel="stylesheet" type="text/css" href="./style/fonts.css">
+	<link rel="stylesheet" type="text/css" href="./style/style.css">	
+</head>
+<body>
+	<div id="outer">
+		<div id="inner">
+		</div>
+	</div>
+<script type="text/javascript" src="./js/main.js" defer></script>
+</body
+</html>
+
diff --git a/js/main.js b/js/main.js
@@ -0,0 +1,34 @@
+
+
+/*
+Given http://httpbin.org/ip as an API endpoint that returns your current IP,
+write a JavaScript function that makes a call to the endpoint, gets the value
+returned and displays it on an HTML page.
+
+How will you test this? */
+
+// (function() {
+//   var result;
+//   var xhr = new XMLHttpRequest();
+//   xhr.open("GET","https://httpbin.org/ip?format=json", false);
+//   xhr.overrideMimeType("application/json");
+//   xhr.send();
+//   if(xhr.status === 200){
+//     result = JSON.parse(xhr.responseText);
+//   }
+
+//   console.log("Log result");
+//   console.log(result);
+//   var inner = document.getElementById("inner");
+//   inner.innerHTML = result.origin;
+// })();
+
+$(function() {
+  var result;
+  $.getJSON("https://httpbin.org/ip?format=json").success( function(data) {
+    console.log("Log Result")
+    result = JSON.stringify(data);
+  }).then(function(result) {
+    $('#inner').text(result.origin);
+  })
+})
diff --git a/style/LeagueGothic-Regular-webfont.woff b/style/LeagueGothic-Regular-webfont.woff
diff --git a/style/fonts.css b/style/fonts.css
@@ -0,0 +1,11 @@
+@font-face {
+    font-family: 'LeagueGothicRegular';
+    src: url('LeagueGothic-Regular-webfont.eot');
+    src: url('LeagueGothic-Regular-webfont.eot?#iefix') format('embedded-opentype'),
+         url('LeagueGothic-Regular-webfont.woff') format('woff'),
+         url('LeagueGothic-Regular-webfont.ttf') format('truetype'),
+         url('LeagueGothic-Regular-webfont.svg#LeagueGothicRegular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+
+}
diff --git a/style/style.css b/style/style.css
@@ -0,0 +1,50 @@
+/* Regular */
+@font-face {
+    font-family: 'LeagueGothic';
+    src: url('leaguegothic-italic-webfont.eot');
+    src: url('leaguegothic-italic-webfont.eot?#iefix') format('embedded-opentype'),
+         url('leaguegothic-italic-webfont.woff') format('woff'),
+         url('leaguegothic-italic-webfont.ttf') format('truetype'),
+         url('leaguegothic-italic-webfont.svg#league_gothic_italicregular') format('svg');
+    font-weight: normal;
+    font-style: italic;
+
+}
+
+
+body {
+	background-color: ;
+	text-align: center;
+    color: red,
+    font-family: '90px LeagueGothic';
+
+}
+
+#outer {
+    display: table;
+    width: 100%;
+    height: 100%;
+}
+
+#inner {
+    display: table-cell;
+    vertical-align: middle;
+    text-align: center;
+    padding-left: 100px;
+    padding-right: 100px;
+    text-decoration: none;
+    font: 50px 'LeagueGothicRegular';
+    color: red;
+}
+
+#innerd {
+    display: table-cell;
+    vertical-align: middle;
+    text-align: center;
+    padding-left: 50px;
+    padding-right: 50px;
+    text-decoration: none;
+    font: 50px 'LeagueGothicRegular';
+    color: red;
+}
+