Skip to content

Commit 8018703

Browse files
author
VGGeorgiev
committed
Added Unit testing and underscore.js demos
1 parent 3fbe103 commit 8018703

File tree

114 files changed

+18326
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

114 files changed

+18326
-0
lines changed

‎3. Cookies and Web Storages/2. local-storage.html

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Local Storage Demo</title>
5+
</head>
6+
<body>
7+
<div>
8+
<input id="key" type="text" placeholder="Insert key" />
9+
<input id="value" type="text" placeholder="Insert value" />
10+
<button id="put-btn">Put in local storage</button>
11+
<button id="get-btn">get from local storage</button>
12+
</div>
13+
<div id="result">
14+
Items: <br/>
15+
</div>
16+
<script>
17+
(function () {
18+
var result = document.getElementById('result');
19+
var button = document.getElementById('put-btn');
20+
button.addEventListener('click', function (e) {
21+
var keyText = document.getElementById('key').value;
22+
var valueText = document.getElementById('value').value;
23+
24+
localStorage.setItem(keyText, valueText);
25+
result.innerHTML += 'Item added: ' + keyText + ' => ' + valueText + '<br />';
26+
});
27+
28+
var getButton = document.getElementById('get-btn');
29+
getButton.addEventListener('click', function (e) {
30+
var keyText = document.getElementById('key').value;
31+
32+
result.innerHTML += keyText + ' => ' + localStorage.getItem(keyText) + '<br />';
33+
});
34+
}())
35+
</script>
36+
</body>
37+
</html>

‎3. Cookies and Web Storages/3. session-storage.html

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Session Storage Demo</title>
5+
</head>
6+
<body>
7+
<div id="countDiv"></div>
8+
<script>
9+
function incrementLoads() {
10+
if (!sessionStorage.counter) {
11+
sessionStorage.setItem("counter", 0);
12+
}
13+
14+
var currentCount = parseInt(sessionStorage.getItem("counter"));
15+
currentCount++;
16+
sessionStorage.setItem("counter", currentCount);
17+
18+
document.getElementById("countDiv").innerHTML = currentCount;
19+
}
20+
21+
incrementLoads();
22+
</script>
23+
</body>
24+
</html>

‎3. Cookies and Web Storages/4. saving-objects-in-web-storages.html

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title></title>
5+
</head>
6+
<body>
7+
<script src="scripts/storage-extensions.js"></script>
8+
<script>
9+
var person = { name: 'Pesho', age: 12, grade: 3 };
10+
localStorage.setObject('person', person);
11+
console.log(localStorage.getObject('person'));
12+
</script>
13+
</body>
14+
</html>

‎3. Cookies and Web Storages/5. storage-event.html

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Storage event</title>
5+
</head>
6+
<body>
7+
<script>
8+
// Works only with different tabs
9+
window.addEventListener('storage', storageEventHandler, false);
10+
11+
function storageEventHandler(evt){
12+
alert('Storage event called!');
13+
console.dir("storage event called key: " + evt );
14+
}
15+
16+
localStorage.setItem("someKey", "someValue");
17+
</script>
18+
</body>
19+
</html>

‎3. Cookies and Web Storages/scripts/cookie.js

+172
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
// Copyright (c) 2012 Florian H., https://github.com/js-coder https://github.com/js-coder/cookie.js
2+
3+
!function (document, undefined) {
4+
5+
var cookie = function () {
6+
return cookie.get.apply(cookie, arguments);
7+
};
8+
9+
var utils = cookie.utils = {
10+
11+
// Is the given value an array? Use ES5 Array.isArray if it's available.
12+
isArray: Array.isArray || function (value) {
13+
return Object.prototype.toString.call(value) === '[object Array]';
14+
},
15+
16+
// Is the given value a plain object / an object whose constructor is `Object`?
17+
isPlainObject: function (value) {
18+
return !!value && Object.prototype.toString.call(value) === '[object Object]';
19+
},
20+
21+
// Convert an array-like object to an array – for example `arguments`.
22+
toArray: function (value) {
23+
return Array.prototype.slice.call(value);
24+
},
25+
26+
// Get the keys of an object. Use ES5 Object.keys if it's available.
27+
getKeys: Object.keys || function (obj) {
28+
var keys = [],
29+
key = '';
30+
for (key in obj) {
31+
if (obj.hasOwnProperty(key)) keys.push(key);
32+
}
33+
return keys;
34+
},
35+
36+
// Unlike JavaScript's built-in escape functions, this method
37+
// only escapes characters that are not allowed in cookies.
38+
escape: function (value) {
39+
return String(value).replace(/[,;"\\=\s%]/g, function (character) {
40+
return encodeURIComponent(character);
41+
});
42+
},
43+
44+
// Return fallback if the value is not defined, otherwise return value.
45+
retrieve: function (value, fallback) {
46+
return value == null ? fallback : value;
47+
}
48+
49+
};
50+
51+
cookie.defaults = {};
52+
53+
cookie.expiresMultiplier = 60 * 60 * 24;
54+
55+
cookie.set = function (key, value, options) {
56+
57+
if (utils.isPlainObject(key)) { // Then `key` contains an object with keys and values for cookies, `value` contains the options object.
58+
59+
60+
for (var k in key) { // TODO: `k` really sucks as a variable name, but I didn't come up with a better one yet.
61+
if (key.hasOwnProperty(k)) this.set(k, key[k], value);
62+
}
63+
64+
} else {
65+
66+
options = utils.isPlainObject(options) ? options : { expires: options };
67+
68+
var expires = options.expires !== undefined ? options.expires : (this.defaults.expires || ''), // Empty string for session cookies.
69+
expiresType = typeof(expires);
70+
71+
if (expiresType === 'string' && expires !== '') expires = new Date(expires);
72+
else if (expiresType === 'number') expires = new Date(+new Date + 1000 * this.expiresMultiplier * expires); // This is needed because IE does not support the `max-age` cookie attribute.
73+
74+
if (expires !== '' && 'toGMTString' in expires) expires = ';expires=' + expires.toGMTString();
75+
76+
var path = options.path || this.defaults.path; // TODO: Too much code for a simple feature.
77+
path = path ? ';path=' + path : '';
78+
79+
var domain = options.domain || this.defaults.domain;
80+
domain = domain ? ';domain=' + domain : '';
81+
82+
var secure = options.secure || this.defaults.secure ? ';secure' : '';
83+
84+
document.cookie = utils.escape(key) + '=' + utils.escape(value) + expires + path + domain + secure;
85+
86+
}
87+
88+
return this; // Return the `cookie` object to make chaining possible.
89+
90+
};
91+
92+
// TODO: This is commented out, because I didn't come up with a better method name yet. Any ideas?
93+
// cookie.setIfItDoesNotExist = function (key, value, options) {
94+
// if (this.get(key) === undefined) this.set.call(this, arguments);
95+
// },
96+
97+
cookie.remove = function (keys) {
98+
99+
keys = utils.isArray(keys) ? keys : utils.toArray(arguments);
100+
101+
for (var i = 0, l = keys.length; i < l; i++) {
102+
this.set(keys[i], '', -1);
103+
}
104+
105+
return this; // Return the `cookie` object to make chaining possible.
106+
};
107+
108+
cookie.empty = function () {
109+
110+
return this.remove(utils.getKeys(this.all()));
111+
112+
};
113+
114+
cookie.get = function (keys, fallback) {
115+
116+
fallback = fallback || undefined;
117+
var cookies = this.all();
118+
119+
if (utils.isArray(keys)) {
120+
121+
var result = {};
122+
123+
for (var i = 0, l = keys.length; i < l; i++) {
124+
var value = keys[i];
125+
result[value] = utils.retrieve(cookies[value], fallback);
126+
}
127+
128+
return result;
129+
130+
} else return utils.retrieve(cookies[keys], fallback);
131+
132+
};
133+
134+
cookie.all = function () {
135+
136+
if (document.cookie === '') return {};
137+
138+
var cookies = document.cookie.split('; '),
139+
result = {};
140+
141+
for (var i = 0, l = cookies.length; i < l; i++) {
142+
var item = cookies[i].split('=');
143+
result[decodeURIComponent(item[0])] = decodeURIComponent(item[1]);
144+
}
145+
146+
return result;
147+
148+
};
149+
150+
cookie.enabled = function () {
151+
152+
if (navigator.cookieEnabled) return true;
153+
154+
var ret = cookie.set('_', '_').get('_') === '_';
155+
cookie.remove('_');
156+
return ret;
157+
158+
};
159+
160+
// If an AMD loader is present use AMD.
161+
// If a CommonJS loader is present use CommonJS.
162+
// Otherwise assign the `cookie` object to the global scope.
163+
164+
if (typeof define === 'function' && define.amd) {
165+
define(function () {
166+
return cookie;
167+
});
168+
} else if (typeof exports !== 'undefined') {
169+
exports.cookie = cookie;
170+
} else window.cookie = cookie;
171+
172+
}(document);

‎3. Cookies and Web Storages/scripts/cookies.js

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
var cookie = (function () {
2+
if (!String.prototype.startsWith) {
3+
String.prototype.startsWith = function(str) {
4+
if (this.length < str.length) {
5+
return false;
6+
}
7+
for (var i = 0; i < str.length; i++) {
8+
if (this[i] !== str[i]) {
9+
return false;
10+
}
11+
}
12+
return true;
13+
}
14+
}
15+
16+
function setCookie(name, value, expires, path, domain) {
17+
var cookie = name + "=" + escape(value) + ";";
18+
19+
if (expires) {
20+
if(expires instanceof Date) {
21+
isNaN(expires.getTime()) ? expires = new Date() : null;
22+
} else {
23+
expires = new Date(new Date().getTime() + parseInt(expires) * 1000 * 60 * 60 * 24);
24+
}
25+
26+
cookie += "expires=" + expires.toGMTString() + ";";
27+
}
28+
29+
if (path) {
30+
cookie += "path=" + path + ";";
31+
}
32+
if (domain) {
33+
cookie += "domain=" + domain + ";";
34+
}
35+
36+
document.cookie = cookie;
37+
}
38+
39+
function getCookie(name) {
40+
var allCookies = document.cookie.split(";");
41+
for (var i = 0; i < allCookies.length; i++) {
42+
var cookie = allCookies[i];
43+
var trailingZeros = 0;
44+
for (var j = 0; j < cookie.length; j++) {
45+
if (cookie[j] !== " ") {
46+
break;
47+
}
48+
}
49+
cookie = cookie.substring(j);
50+
if (cookie.startsWith(name + "=")) {
51+
return cookie;
52+
}
53+
}
54+
}
55+
56+
function deleteCookie(name) {
57+
if(getCookie(name)) {
58+
setCookie(name, '', -1);
59+
}
60+
}
61+
62+
return {
63+
get: getCookie,
64+
set: setCookie,
65+
delete: deleteCookie
66+
}
67+
}());

‎3. Cookies and Web Storages/scripts/storage-extensions.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
Storage.prototype.setObject = function setObject(key, obj) {
2+
this.setItem(key, JSON.stringify(obj));
3+
};
4+
5+
Storage.prototype.getObject = function getObject(key) {
6+
return JSON.parse(this.getItem(key));
7+
};

‎4. Consuming-Remote-Data/1. using-xmlhttprequest/cross-browser-xhr.html

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head> <title>Consuming remote data with JavaScript: Crossbrowser XHR</title>
4+
<style>
5+
.info{
6+
font-size: 0.9em;
7+
font-style: italic;
8+
border: 1px solid orange;
9+
display: block;
10+
padding:5px 15px;
11+
width: 250px;
12+
margin: 0 auto;
13+
text-indent: 0;
14+
}
15+
</style>
16+
</head>
17+
<body>
18+
<p class='info'>This web page should be run on a server (localhost or in WWW).</p>
19+
<div id="http-response"></div>
20+
21+
<script src="cross-browser-xhr.js"></script>
22+
<script>
23+
sendRequest('GET', 'http://localhost:3000/students', true);
24+
</script>
25+
</body>
26+
</html>

0 commit comments

Comments
 (0)