Skip to content

Commit fb4df9d

Browse files
VimuxVimux
committed
Initial commit
* Polite version by default * Avoid jQuery * Remove PureCSS, but preserve required styles * Slightly different look and feel: more obvious inputs, remove "Why" block, restyle yellow links. * "Merge" some useful PR's from original repo
0 parents  commit fb4df9d

File tree

5 files changed

+421
-0
lines changed

5 files changed

+421
-0
lines changed

‎.editorconfig

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
indent_style = space
7+
indent_size = 2
8+
end_of_line = lf
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true
11+
12+
[*.md]
13+
trim_trailing_whitespace = false

‎.gitignore

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# Node/npm
2+
node_modules/
3+
npm-debug.log
4+
5+
# IDE
6+
.idea
7+
*.sublime-project
8+
*.sublime-workspace
9+
.vscode/*
10+
11+
# OS
12+
._*
13+
Thumbs.db
14+
.DS_Store
15+
.Trashes
16+
.Spotlight-V100
17+
.AppleDouble
18+
.LSOverride
19+
Desktop.ini

‎index.html

+110
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>strftime to Go Date Format Converter</title>
8+
<meta name="description" content="Simple strftime to Go Date Format Converter">
9+
<link rel="stylesheet" href="styles.css">
10+
</head>
11+
<body>
12+
<header class="header">
13+
<h1 class="header__title">Go Date Format</h1>
14+
<h2 class="header__subtitle">Because I've used <code class="header__title-code">strftime</code> a million times before</h2>
15+
</header>
16+
17+
<div class="content">
18+
<div id="converter" class="converter pure-g">
19+
<div class="converter__field pure-u-1-1 pure-u-md-11-24">
20+
<input id="strftime" class="converter__field-input" type="text" aria-label="Input strftime string" value="%B %e, %Y"/>
21+
</div>
22+
<div id="arrow" class="converter__arrow pure-u-1-1 pure-u-md-2-24">&rarr;</div>
23+
<div class="converter__field pure-u-1-1 pure-u-md-11-24">
24+
<input id="output" class="converter__field-input" type="text" aria-label="Go format string" readonly value=""/>
25+
</div>
26+
</div>
27+
28+
<div id="definitions" class="definitions pure-g">
29+
<div class="definition__box pure-u-1-1 pure-u-md-12-24">
30+
<dl class="definition__list">
31+
<dt class="definition__name">%a</dt>
32+
<dd class="definition__description pure-u-16-24">The abbreviated weekday name (&quot;Sun&quot;)</dd>
33+
<dt class="definition__name">%A</dt>
34+
<dd class="definition__description pure-u-16-24">The full weekday name (&quot;Sunday&quot;)</dd>
35+
<dt class="definition__name">%b</dt>
36+
<dd class="definition__description pure-u-16-24">The abbreviated month name (&quot;Jan&quot;)</dd>
37+
<dt class="definition__name">%B</dt>
38+
<dd class="definition__description pure-u-16-24">The full month name (&quot;January&quot;)</dd>
39+
<dt class="definition__name">%d</dt>
40+
<dd class="definition__description pure-u-16-24">Day of the month (01..31)</dd>
41+
<dt class="definition__name">%e</dt>
42+
<dd class="definition__description pure-u-16-24">Day of the month with a leading blank instead of zero (1..31)</dd>
43+
<dt class="definition__name">%m</dt>
44+
<dd class="definition__description pure-u-16-24">Month of the year (01..12)</dd>
45+
<dt class="definition__name">%y</dt>
46+
<dd class="definition__description pure-u-16-24">Year without a century (00..99)</dd>
47+
<dt class="definition__name">%Y</dt>
48+
<dd class="definition__description pure-u-16-24">Year with century</dd>
49+
</dl>
50+
</div>
51+
<div class="definition__box pure-u-1-1 pure-u-md-12-24">
52+
<dl class="definition__list">
53+
<dt class="definition__name">%H</dt>
54+
<dd class="definition__description pure-u-16-24">Hour of the day, 24-hour clock (00..23)</dd>
55+
<dt class="definition__name">%I</dt>
56+
<dd class="definition__description pure-u-16-24">Hour of the day, 12-hour clock (01..12)</dd>
57+
<dt class="definition__name">%l</dt>
58+
<dd class="definition__description pure-u-16-24">Hour of the day, 12-hour clock without a leading zero (1..12)</dd>
59+
<dt class="definition__name">%M</dt>
60+
<dd class="definition__description pure-u-16-24">Minute of the hour (00..59)</dd>
61+
<dt class="definition__name">%P</dt>
62+
<dd class="definition__description pure-u-16-24">Meridian indicator (&quot;am&quot; or &quot;pm&quot;)</dd>
63+
<dt class="definition__name">%p</dt>
64+
<dd class="definition__description pure-u-16-24">Meridian indicator (&quot;AM&quot; or &quot;PM&quot;)</dd>
65+
<dt class="definition__name">%S</dt>
66+
<dd class="definition__description pure-u-16-24">Second of the minute (00..60)</dd>
67+
<dt class="definition__name">%z</dt>
68+
<dd class="definition__description pure-u-16-24">Time zone hour and minute offset from UTC</dd>
69+
<dt class="definition__name">%Z</dt>
70+
<dd class="definition__description pure-u-16-24">Time zone name</dd>
71+
<dt class="definition__name">%%</dt>
72+
<dd class="definition__description pure-u-16-24">Literal &quot;%&quot; character</dd>
73+
</dl>
74+
</div>
75+
</div>
76+
77+
<div id="unsupported" class="unsupported pure-g">
78+
<h4 class="unsupported__title pure-u-1-1">Codes not natively supported in Go</h4>
79+
<div class="pure-u-1-1 pure-u-md-12-24">
80+
<dl class="unsupported__list">
81+
<dt class="unsupported__name">%j</dt>
82+
<dd class="unsupported__description pure-u-16-24">Day of the year (001..366)<br>use <a href="https://godoc.org/time#Time.YearDay">YearDay()</a> instead</dd>
83+
<dt class="unsupported__name">%U</dt>
84+
<dd class="unsupported__description pure-u-16-24">Week number of the current year, starting with the first Sunday as the first day of the first week (00..53)</dd>
85+
<dt class="unsupported__name">%W</dt>
86+
<dd class="unsupported__description pure-u-16-24">Week number of the current year, starting with the first Monday as the first day of the first week (00..53)<br>use <a href="https://godoc.org/time#Time.ISOWeek">ISOWeek()</a> instead</dd>
87+
<dt class="unsupported__name">%w</dt>
88+
<dd class="unsupported__description pure-u-16-24">Day of the week (Sunday is 0, 0..6)<br>use <a href="https://godoc.org/time#Time.Weekday">Weekday()</a> instead</dd>
89+
</dl>
90+
</div>
91+
<div class="pure-u-1-1 pure-u-md-12-24">
92+
<dl class="unsupported__list">
93+
<dt class="unsupported__name">%X</dt>
94+
<dd class="unsupported-definition__description pure-u-16-24">Preferred representation for the time alone, no date</dd>
95+
<dt class="unsupported-definition__name">%x</dt>
96+
<dd class="unsupported-definition__description pure-u-16-24">Preferred representation for the date alone, no time</dd>
97+
<dt class="unsupported-definition__name">%c</dt>
98+
<dd class="unsupported-definition__description pure-u-16-24">The preferred local date and time representation</dd>
99+
</dl>
100+
</div>
101+
</div>
102+
</div>
103+
104+
<footer class="footer">
105+
<p class="footer__copyright">©&#160;2019&#160;GoDateTime.com</p>
106+
<p class="footer__notice">This is polite version of <a href="" target="_blank" rel="license noopener">another similar repository</a>. <span>Code licensed under <a href="https://github.com/Vimux/godatetime/blob/master/LICENSE" target="_blank" rel="license noopener">MIT</a>.</span></p>
107+
</footer>
108+
<script src="main.js"></script>
109+
</body>
110+
</html>

‎main.js

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
document.addEventListener('DOMContentLoaded', function(){
2+
let mapping = {
3+
"%a": "Mon",
4+
"%A": "Monday",
5+
"%b": "Jan",
6+
"%B": "January",
7+
"%d": "02",
8+
"%e": "_2",
9+
"%m": "01",
10+
"%y": "06",
11+
"%Y": "2006",
12+
"%H": "15",
13+
"%I": "03",
14+
"%l": "3",
15+
"%M": "04",
16+
"%P": "pm",
17+
"%p": "PM",
18+
"%S": "05",
19+
"%Z": "MST",
20+
"%z": "-0700",
21+
"%%": "%",
22+
23+
// Go doesn't support that strftime codes
24+
"%j": "%j",
25+
"%U": "%U",
26+
"%W": "%W",
27+
"%w": "%w",
28+
"%x": "%x",
29+
"%X": "%X",
30+
"%c": "%c"
31+
}
32+
33+
function strftime(str) {
34+
let res = "";
35+
for (let i = 0; i < str.length; i++) {
36+
let f = mapping[str.substr(i, 2)];
37+
if (f) {
38+
res += f;
39+
i++;
40+
} else {
41+
res += str[i];
42+
}
43+
}
44+
45+
return res;
46+
}
47+
48+
function update(cb) {
49+
let input = document.querySelector("#strftime").value;
50+
let output = strftime(input);
51+
document.querySelector("#output").value = output;
52+
53+
if (cb) {
54+
cb();
55+
}
56+
}
57+
58+
function appendCode() {
59+
let inputEl = document.querySelector("#strftime");
60+
let code = this.textContent;
61+
62+
document.querySelector("#strftime").value = document.querySelector("#strftime").value + " " + code;
63+
64+
let event = document.createEvent("HTMLEvents");
65+
event.initEvent("update", true, false);
66+
inputEl.dispatchEvent(event);
67+
}
68+
69+
function highlight() {
70+
this.setSelectionRange(0, this.value.length);
71+
}
72+
73+
document.querySelector("#strftime").addEventListener("keyup", update);
74+
document.querySelector("#strftime").addEventListener("update", update);
75+
document.querySelector("#output").addEventListener("click", highlight);
76+
77+
definitions = document.querySelector("#definitions").querySelectorAll(".definition__name");
78+
for(let i = 0; i<definitions.length; i++){
79+
definitions[i].onclick = appendCode;
80+
}
81+
82+
update(function() {
83+
let el = document.querySelector("#strftime");
84+
85+
el.focus();
86+
el.selectionStart = el.selectionEnd = el.value.length;
87+
});
88+
}, false);

0 commit comments

Comments
 (0)