remove links in favor of commands

This commit is contained in:
Cade Scroggins
2016-01-31 20:22:00 -08:00
parent f0a047c5ee
commit cf9f4714f5
+46 -36
View File
@@ -23,13 +23,6 @@
text-align: center; text-align: center;
} }
ul,
li {
margin: 0;
padding: 0;
list-style: none;
}
.wrapper { .wrapper {
position: relative; position: relative;
top: 46%; top: 46%;
@@ -61,51 +54,68 @@
.search__text:focus{ .search__text:focus{
outline: 0; outline: 0;
} }
.links {
margin-top: 2rem;
}
.links li,
.links a {
display: inline-block;
}
.links a {
padding: 0.5rem;
color: #fff;
}
</style> </style>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<time class="time" id="js-time"></time> <time class="time" id="js-time"></time>
<form class="search" action="https://www.google.com/search" method="get" autocomplete="off"> <form class="search" id="js-search" autocomplete="off">
<input class="search__text" type="text" name="q" autofocus> <input class="search__text" id="js-search-text" type="text" autofocus>
</form> </form>
<ul class="links">
<li><a href="https://inbox.google.com/">Inbox</a></li>
<li><a href="https://github.com/">GitHub</a></li>
<li><a href="https://www.reddit.com/">Reddit</a></li>
</ul>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
function setTime() { ;(function() {
var zeros = function(num) { var Clock = {
el: document.getElementById('js-time'),
init: function() {
Clock.setTime();
setInterval(Clock.setTime, 1000);
},
zeros: function(num) {
return ('0' + num.toString()).slice(-2); return ('0' + num.toString()).slice(-2);
} },
setTime: function() {
var date = new Date(); var date = new Date();
var time = date.getHours() + ' ' + zeros(date.getMinutes()); var time = date.getHours() + ' ' + Clock.zeros(date.getMinutes());
document.getElementById('js-time').innerHTML = time; Clock.el.innerHTML = time;
} }
};
setTime(); var Commander = {
setInterval(setTime, 1000); searchForm: document.getElementById('js-search'),
searchText: document.getElementById('js-search-text'),
init: function(commands) {
Commander.commands = commands;
Commander.searchForm.addEventListener('submit', Commander.search, false);
},
search: function(e) {
var q = Commander.searchText.value;
Commander.location = 'https://www.google.com/search?q=' + q;
Commander.commands.forEach(function(command) {
if (q === command.key) Commander.location = command.url;
});
window.location.href = Commander.location;
e.preventDefault();
}
};
Clock.init();
Commander.init([
{ key: 'i', url: 'https://inbox.google.com' },
{ key: 'g', url: 'https://github.com' },
{ key: 'r', url: 'https://www.reddit.com' }
]);
}());
</script> </script>
</body> </body>
</html> </html>