Initial Commit

rebornweb · Sep 25, 2015 · 69b3369 · 69b3369
commit 69b3369
Show file tree

Hide file tree

Showing 319 changed files with 50,166 additions and 0 deletions.
diff --git a/JavaScriptexamples/ajax.html b/JavaScriptexamples/ajax.html
@@ -0,0 +1,31 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+
+
+</body>
+
+<script type='text/javascript'>
+//This is a common ajax request
+
+var req = new XMLHttpRequest();
+req.onreadystatechange = function() {
+    if (req.readyState == 4) {
+        alert(req.responseText);
+    }
+};
+
+req.open('GET','test.txt', true);
+req.send();
+
+</script>
+</html>
diff --git a/JavaScriptexamples/canvasctx.html b/JavaScriptexamples/canvasctx.html
@@ -0,0 +1,65 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+
+<canvas></canvas>
+</body>
+
+<script type='text/javascript'>
+//Canvas CTX bouncing black box
+
+
+
+
+var canvas = document.querySelector('canvas'),
+    ctx = canvas.getContext('2d');
+
+var resize = function () {
+  canvas.width = window.innerWidth;
+  canvas.height = window.innerHeight;
+};
+
+window.addEventListener('resize', resize);
+
+window.addEventListener('load', function () {
+
+  resize();
+
+  var pos, vel;
+  pos = {
+    x: 10,
+    y: 10
+  };
+  vel = {
+    x: 1,
+    y: 1
+  };
+
+  var loop = function () {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    pos.x += vel.x;
+    pos.y += vel.y;
+    if (pos.x < 5 || pos.x > canvas.width - 5) {
+      vel.x *= -1;
+    }
+    if (pos.y < 5 || pos.y > canvas.height - 5) {
+      vel.y *= -1;
+    }
+    ctx.fillRect(pos.x - 5, pos.y - 5, 10, 10);
+  };
+
+  setInterval(loop, 1000 / 60);
+});
+
+
+</script>
+</html>
diff --git a/JavaScriptexamples/closures.html b/JavaScriptexamples/closures.html
@@ -0,0 +1,49 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+
+
+</body>
+
+<script type='text/javascript'>
+//Closures gets a function to Return another inner function value 
+
+
+var saver = function (value) {
+    return function () {
+        var value =50
+        return value + 20;
+    };
+};
+
+var retriever = saver(); // Equals 
+
+//alert(retriever());
+
+
+//New Function
+
+var add = function (a) {
+    return function (b) {
+        return a + b;
+    };
+};
+
+var addFive = add(5);
+
+//the inner function b is automatically the contextual object of addFive
+alert(addFive(10));
+
+
+
+</script>
+</html>
diff --git a/JavaScriptexamples/dyncontent.html b/JavaScriptexamples/dyncontent.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+
+</body>
+<script type='text/javascript'>
+//Dynamic Creating Objects
+
+
+//Create Div
+var div = document.createElement('div');
+div.textContent = "Sup, y'all?";
+div.setAttribute('class', 'note');
+document.body.appendChild(div);
+
+//Create Span
+var span = document.createElement('span');
+span.textContent = "Hello!";
+div.appendChild(span);
+
+
+if (span.textContent) {
+    span.textContent = "Hello!";
+} else if (span.innerText) {
+    span.innerText = "Hello!";
+}
+
+/*jquery
+$(function(){
+    
+   var div = $('<div/>').text("Sup, y'all?").appendTo(document.body);
+$('<span/>').text('Hello!').appendTo(div); 
+});
+*/
+
+</script>
+
+</html>
diff --git a/JavaScriptexamples/eventListen.html b/JavaScriptexamples/eventListen.html
@@ -0,0 +1,29 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+<button id='big-button'>Big Button</button>
+
+
+</body>
+
+<script type='text/javascript'>
+//This is a common event Listener
+
+var handleClick = function (event) {
+    alert("Hi i'm the event listener");
+};
+var button = document.querySelector('#big-button');
+button.addEventListener('click', handleClick);
+
+
+</script>
+</html>
diff --git a/JavaScriptexamples/jqueryDOM.html b/JavaScriptexamples/jqueryDOM.html
@@ -0,0 +1,42 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+
+
+</head>
+
+<body>
+<header>HEADER yum
+<h1 class='note'>Header Boxes</h1>
+</header>
+</body>
+
+<script type='text/javascript'>
+//Jquery Getters and Setters
+$(function(){
+$('.note').css('background', 'red').height(100);
+
+
+var currentHeight = $('.note').height(),
+    currentColor = $('.note').css('color');
+
+//alert( 'Current height: '  +currentHeight +' Current Color: ' + currentColor);
+
+//This is how you chain declaring mulitple objects
+var $header = $('header'),
+    $headerBoxes = $('.note',$header);
+
+
+
+console.log('Header:'+ $header + 'Header Boxes:' + $headerBoxes);
+
+$headerBoxes.fadeOut(1000,function(){});
+
+});
+</script>
+</html>
diff --git a/JavaScriptexamples/json.html b/JavaScriptexamples/json.html
@@ -0,0 +1,35 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+Check Console Log
+
+
+</body>
+
+<script type='text/javascript'>
+/*stringify makes JSON objects into a string and
+parse back into JSON objects*/
+
+var jsonString = JSON.stringify({
+    name: "Yoda",
+    age: 894,
+    lightsaber: "Green"
+});
+
+var jsonP = JSON.parse(jsonString);
+
+
+
+console.log(jsonString + ' Json Parsed: ' + jsonP );
+
+</script>
+</html>
diff --git a/JavaScriptexamples/localstorage.html b/JavaScriptexamples/localstorage.html
@@ -0,0 +1,41 @@
+
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+
+</head>
+
+<body>
+
+
+<canvas></canvas>
+</body>
+
+<script type='text/javascript'>
+
+//Json handling Pure Javascript withp with
+
+// Object example
+try{
+ asf
+localStorage.setItem('user', JSON.stringify({
+    username: 'htmldog',
+    api_key: 'abc123xyz789'
+}));
+
+
+var user = JSON.parse(localStorage.getItem('user'));
+
+alert(JSON.stringify(user));
+}
+ catch(error){
+
+  // Handle the error
+
+    alert(error.message+'wang');
+}
+</script>
+</html>