Some work on blink, some placeholder files

zinas · May 11, 2014 · fb5f347 · fb5f347
1 parent dc4049c
commit fb5f347
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 0 deletions.
diff --git a/nineties-blink/index.html b/nineties-blink/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="UTF-8">
+ <title>90s Blink</title>
+
+ <!-- Importing Custom Elements -->
+ <!-- <link rel="import" href="nineties-blink.html"> -->
+
+ <script>
+ var Blink = Object.create(HTMLElement.prototype);
+
+ Blink.blink = function() {
+ if (this.style.visibility === 'hidden') {
+ this.style.visibility = '';
+ } else {
+ this.style.visibility = 'hidden';
+ }
+ }
+
+ Blink.attachedCallback = function () {
+ var self = this;
+ setInterval(function () {self.blink();},this.dataset.duration/2);
+ }
+
+ document.registerElement('nineties-blink', {prototype: Blink});
+ </script>
+
+</head>
+<body>
+
+ <!-- Using Custom Elements -->
+ <nineties-blink data-duration="5000">Hello there!</nineties-blink>
+
+</body>
+</html>
diff --git a/nineties-blink/nineties-blink.html b/nineties-blink/nineties-blink.html
@@ -0,0 +1,5 @@
+<script>
+var Blink = document.registerElement('nineties-blink');
+
+Blink.addEventListener('click', function () {alert('aaa');})
+</script>
diff --git a/nineties-marquee/index.html b/nineties-marquee/index.html
diff --git a/nineties-marquee/nineties-marquee.html b/nineties-marquee/nineties-marquee.html
diff --git a/nineties-welcome/index.html b/nineties-welcome/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="UTF-8">
+ <title>90s Blink</title>
+
+ <!-- Importing Custom Elements -->
+ <!-- <link rel="import" href="nineties-blink.html"> -->
+
+ <script>
+ var Welcome = Object.create(HTMLElement.prototype);
+
+ Welcome.attachedCallback = function () {
+ var msg = this.innerHTML;
+ this.innerHTML = '';
+ alert(msg);
+ }
+
+ document.registerElement('nineties-welcome', {prototype: Welcome});
+ </script>
+
+</head>
+<body>
+
+ <!-- Using Custom Elements -->
+ <nineties-welcome>Hello there, Nikos!</nineties-blink>
+
+</body>
+</html>
diff --git a/nineties-welcome/nineties-welcome.html b/nineties-welcome/nineties-welcome.html