diff --git a/www/data/css/styles.css b/www/data/css/styles.css index 03617c6..fca8797 100644 --- a/www/data/css/styles.css +++ b/www/data/css/styles.css @@ -1,6 +1,7 @@ body { background-color: #EEE; - color: #CCC; } + color: #CCC; + font-family: serif; } #content { padding-top: 64px; @@ -53,6 +54,7 @@ body { width: 100%; } #headerdiv { + z-index: 999; background-color: #333; display: flex; border-bottom: 1px solid #111; @@ -254,6 +256,103 @@ html, body { margin: 0 0 20px; border-left: 5px solid #CCC; } +.mdtable_container { + overflow-x: auto; } + +.mdtable { + border-collapse: collapse; + text-align: left; + width: 100%; + border: 1px solid #666; } + .mdtable td, .mdtable th { + padding: 3px 10px; } + .mdtable thead th { + background-color: #7D7D7D; + color: #FFFFFF; + font-weight: bold; + border-left: 1px solid #444; } + .mdtable thead th:first-child { + border: none; } + .mdtable tbody td { + border-left: 1px solid #666; + font-weight: normal; } + .mdtable tbody .alt td { + background: #EBEBEB; } + .mdtable tbody td:first-child { + border-left: none; } + .mdtable tbody tr:last-child td { + border-bottom: none; } + .mdtable tbody tr:nth-child(odd) { + background-color: #ccc; } + +#PEB_tableProblems .PEB_tablerowProblems:hover { + background-color: #888; } +#PEB_tableProblems .PEB_TC_Value { + font-family: Consolas, Monaco, "Courier New", Menlo, monospace; } +#PEB_tableProblems .PEB_TC_Value:not(:hover) { + color: transparent; + -o-transition: .5s; + -ms-transition: .5s; + -moz-transition: .5s; + -webkit-transition: .5s; + transition: .5s; } +#PEB_tableProblems .PEB_TC_Value:hover { + color: #333; + -o-transition: .5s; + -ms-transition: .5s; + -moz-transition: .5s; + -webkit-transition: .5s; + transition: .5s; } +#PEB_tableProblems .PEB_TC_Time { + border-radius: 1px; + display: inline-block; + padding: 1px 6px; + min-width: 60px; } +#PEB_tableProblems .PEB_TC_Timelevel_0 { + background-color: #0A0 !important; } +#PEB_tableProblems .PEB_TC_Timelevel_1 { + background-color: #84FF0A !important; } +#PEB_tableProblems .PEB_TC_Timelevel_2 { + background-color: #FF0 !important; } +#PEB_tableProblems .PEB_TC_Timelevel_3 { + background-color: #F60 !important; } +#PEB_tableProblems .PEB_TC_Timelevel_4 { + background-color: #F11 !important; } +#PEB_tableProblems .PEB_TC_Size { + font-family: Consolas, Monaco, "Courier New", Menlo, monospace; } +#PEB_tableProblems .PEB_TC_Size_93 { + float: right; + font-family: serif; + border-radius: 1px; + background-color: #0A0; + display: inline-block; + padding: 1px 6px; } +#PEB_tableProblems .PEB_TC_Size_98 { + float: right; + font-family: serif; + border-radius: 1px; + background-color: #FF0; + display: inline-block; + padding: 1px 6px; } +#PEB_tableProblems a { + color: #333; + display: block; + text-decoration: none; } +#PEB_tableProblems .PEB_TC_Title a { + text-decoration: underline; } + +@media (max-width: 1199px) { + #PEB_tableProblems tr td:nth-child(1), #PEB_tableProblems tr th:nth-child(1) { + display: none; } } +@media (max-width: 767px) { + #PEB_tableProblems tr td:nth-child(1), #PEB_tableProblems tr th:nth-child(1) { + display: none; } + + #PEB_tableProblems tr td:nth-child(3), #PEB_tableProblems tr th:nth-child(3) { + display: none; } + + #PEB_tableProblems tr td:nth-child(4), #PEB_tableProblems tr th:nth-child(4) { + display: none; } } .euler_pnl_base { display: inline-flex; flex-direction: column; diff --git a/www/data/css/styles_blogview.scss b/www/data/css/styles_blogview.scss index f1ca04e..86ffe3d 100644 --- a/www/data/css/styles_blogview.scss +++ b/www/data/css/styles_blogview.scss @@ -56,3 +56,135 @@ border-left: 5px solid #CCC; } +.mdtable_container {overflow-x: auto;} + +.mdtable { + border-collapse: collapse; + text-align: left; + width: 100%; + border: 1px solid #666; + + td, th { + padding: 3px 10px; + } + + thead th { + background-color: #7D7D7D; + color: #FFFFFF; + font-weight: bold; + border-left: 1px solid #444; + } + + thead th:first-child { + border: none; + } + + tbody td { + border-left: 1px solid #666; + font-weight: normal; + } + + tbody .alt td { + background: #EBEBEB; + } + + tbody td:first-child { + border-left: none; + } + + tbody tr:last-child td { + border-bottom: none; + } + + tbody tr:nth-child(odd) { + background-color: #ccc; + } + +} + +#PEB_tableProblems { + .PEB_tablerowProblems { } + .PEB_tablerowProblems:hover { background-color: #888; } + + .PEB_tablecellProblems { } + + .PEB_TC_Value { font-family: $FONT_CODE; } + + .PEB_TC_Value:not(:hover) { + color: transparent; + + -o-transition:.5s; + -ms-transition:.5s; + -moz-transition:.5s; + -webkit-transition:.5s; + transition:.5s; + } + + .PEB_TC_Value:hover { + color: $COL_TEXT_DARK; + + -o-transition:.5s; + -ms-transition:.5s; + -moz-transition:.5s; + -webkit-transition:.5s; + transition:.5s; + } + + .PEB_TC_Time { + border-radius: 1px; + + display: inline-block; + padding: 1px 6px; + + min-width: 60px; + } + + .PEB_TC_Timelevel_0 { background-color: #0A0 !important; } + .PEB_TC_Timelevel_1 { background-color: #84FF0A !important; } + .PEB_TC_Timelevel_2 { background-color: #FF0 !important; } + .PEB_TC_Timelevel_3 { background-color: #F60 !important; } + .PEB_TC_Timelevel_4 { background-color: #F11 !important; } + + .PEB_TC_Size { font-family: $FONT_CODE; } + + .PEB_TC_Size_93 { + float: right; + font-family: $FONT_DEFAULT; + + border-radius: 1px; + background-color: #0A0; + + display: inline-block; + padding: 1px 6px; + } + + .PEB_TC_Size_98 { + float: right; + font-family: $FONT_DEFAULT; + + border-radius: 1px; + background-color: #FF0; + + display: inline-block; + padding: 1px 6px; + } + + a { + color: #333; + display: block; + text-decoration: none; + } + + .PEB_TC_Title a { text-decoration: underline; } + +} + +@media(max-width:1199px) { + #PEB_tableProblems tr td:nth-child(1), #PEB_tableProblems tr th:nth-child(1) { display: none; } +} + +@media(max-width:767px) { + #PEB_tableProblems tr td:nth-child(1), #PEB_tableProblems tr th:nth-child(1) { display: none; } + #PEB_tableProblems tr td:nth-child(3), #PEB_tableProblems tr th:nth-child(3) { display: none; } + #PEB_tableProblems tr td:nth-child(4), #PEB_tableProblems tr th:nth-child(4) { display: none; } +} \ No newline at end of file diff --git a/www/data/css/styles_config.scss b/www/data/css/styles_config.scss index 982b514..0f5648e 100644 --- a/www/data/css/styles_config.scss +++ b/www/data/css/styles_config.scss @@ -6,4 +6,5 @@ $COL_TEXT_DARK: #333; $COL_TRANSPARENT: #FFFFFF00; $FONT_HEADER: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; -$FONT_CODE: Consolas, Monaco, "Courier New", Menlo, monospace; \ No newline at end of file +$FONT_CODE: Consolas, Monaco, "Courier New", Menlo, monospace; +$FONT_DEFAULT: serif; \ No newline at end of file diff --git a/www/data/css/styles_global.scss b/www/data/css/styles_global.scss index 4b5fb79..e76d873 100644 --- a/www/data/css/styles_global.scss +++ b/www/data/css/styles_global.scss @@ -3,6 +3,7 @@ body { background-color: $COL_BACKGROUND; color: $COL_TEXT_NORMAL; + font-family: $FONT_DEFAULT; } #content { diff --git a/www/data/css/styles_header.scss b/www/data/css/styles_header.scss index 65b940d..9548230 100644 --- a/www/data/css/styles_header.scss +++ b/www/data/css/styles_header.scss @@ -1,6 +1,7 @@ @import 'styles_config'; #headerdiv { + z-index: 999; background-color: #333; display: flex; border-bottom: 1px solid #111; diff --git a/www/data/images/github_band.png b/www/data/images/github_band.png new file mode 100644 index 0000000..146ef8a Binary files /dev/null and b/www/data/images/github_band.png differ diff --git a/www/fragments/blogview_euler_list.php b/www/fragments/blogview_euler_list.php new file mode 100644 index 0000000..7867e9e --- /dev/null +++ b/www/fragments/blogview_euler_list.php @@ -0,0 +1,105 @@ + + +
+ +
+ + Fork me on GitHub + +
+ +
+ +
+ +
+

+ +

+ A lot of you probably know Project Euler.
+ For those who don't here a short explanation: Project Euler is a collection of mathematical/programming problems. + Most problems consist of finding a single number and are solved by writing a program in the programming language of your choice. +

+

+ Most people solve these by using normal languages like C, Java, Phyton, Haskell etc. + But you can also go a step further and try solving it with a little bit more exotic languages. +

+

+ So here are my solutions written in Befunge +

+
+

+ Note:
+ Similar to most Befunge content on this site I only used the Befunge-93 instruction-set but ignored the 80x25 size restriction.
+ Still I tries to keep the programs in the Befunge-93 grid size, but that wasn't possible for all. So I guess some programs are technically Befunge-98. +

+
+

+ I have a included javascript runner here, but for one I only enabled it for programs of reasonable sizes (a few soutions had source files in the megabyte range).
+ And also it's not the fastest interpreter and some solution take quite a while to finish.
+ I recommend using BefunExec. I specially made that interpreter for this project. It can run befunge code with around 6.5 MHz (on my machine) +

+ +
+ + + + + + + + + ' . "\r\n"; + + echo '' . "\r\n"; + + echo '' . "\r\n"; + + echo '\r\n"; + echo ''; + echo ''; + echo '' . "\r\n"; + + echo '' . "\r\n"; + + echo '' . "\r\n"; + + echo "\r\n"; + } + ?> + +
Number Title Time Size Solution (hover to reveal)
'; + echo ''; + echo $problem['number']; + echo ''; + echo ''; + echo ''; + echo htmlspecialchars($problem['title']); + echo ''; + echo ''; + echo ''; + echo '
'; + echo formatMilliseconds($problem['time']) . "
'; + echo ''; + echo $problem['width'] . 'x' . $problem['height']; + echo '
'; + echo ($problem['is93'] ? 'Bef-93' : 'Bef-98'); + echo '
'; + echo '
'; + echo '
'; + echo number_format($problem['value'], 0, null, ','); + echo '
+
+
+
\ No newline at end of file diff --git a/www/fragments/eulerpanel.php b/www/fragments/eulerpanel.php index ce7b20a..005c52d 100644 --- a/www/fragments/eulerpanel.php +++ b/www/fragments/eulerpanel.php @@ -1,5 +1,5 @@ Home - Project Euler + Project Euler Blog Programs About diff --git a/www/internals/base.php b/www/internals/base.php index c36bd47..3d82eb2 100644 --- a/www/internals/base.php +++ b/www/internals/base.php @@ -25,4 +25,36 @@ function destructiveUrlEncode($str) { $str = str_replace('+', '_', $str); $str = str_replace('.', '', $str); return urlencode($str); +} + +function formatMilliseconds($millis) +{ + if ($millis < 1000) + { + return $millis . 'ms'; + } + else if ($millis < 10 * 1000) + { + return number_format($millis / (1000), 2) . 's'; + } + else if ($millis < 60 * 1000) + { + return floor($millis / (1000)) . 's'; + } + else if ($millis < 10 * 60 * 1000) + { + return floor($millis / (60 * 1000)) . 'min ' . floor(($millis % (60 * 1000)) / 1000) . 's'; + } + else if ($millis < 60 * 60 * 1000) + { + return floor($millis / (60 * 1000)) . 'min'; + } + else if ($millis < 10 * 60 * 60 * 1000) + { + return number_format($millis / (60 * 60 * 1000), 2) . ' hours'; + } + else + { + return floor($millis / (60 * 60 * 1000)) . ' hours'; + } } \ No newline at end of file diff --git a/www/internals/euler.php b/www/internals/euler.php index 4dce030..436a270 100644 --- a/www/internals/euler.php +++ b/www/internals/euler.php @@ -6,6 +6,9 @@ class Euler { $a = require $f; $a['rating'] = self::rateTime($a); + $a['url'] = '/blog/1/Project_Euler_with_Befunge/problem-' . str_pad($a['number'], 3, '0', STR_PAD_LEFT); + $a['canonical'] = "https://www.mikescher.com" . $a['url']; + $a['is93'] = ($a['width'] <= 80 AND $a['height'] <= 25); return $a; } diff --git a/www/pages/blog_view.php b/www/pages/blog_view.php index 8bf41ee..448013f 100644 --- a/www/pages/blog_view.php +++ b/www/pages/blog_view.php @@ -19,7 +19,7 @@ if ($post === NULL) httpError(404, 'blogpost not found'); - +
@@ -48,7 +48,8 @@ if ($post === NULL) httpError(404, 'blogpost not found'); } elseif ($post['type'] === 'euler') { - include (__DIR__ . '/../fragments/blogview_euler.php'); + if ($subview === '') include (__DIR__ . '/../fragments/blogview_euler_list.php'); + else include (__DIR__ . '/../fragments/blogview_euler_single.php'); } ?>