forked from binarymax/bashfill
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbash.html
138 lines (125 loc) · 4.71 KB
/
bash.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE HTML">
<html>
<head>
<title>#bashfill > art for your terminal</title>
<meta name="author" content="max" >
<meta name="date" content="2013-08-18T19:28:12+0100" >
<meta name="copyright" content="Copyright 2013, Max Irwin">
<meta name="keywords" content="Bash,Art,Terminal,Shell">
<meta name="description" content="Bash Image Generator">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
body { font-family: monospace; color:#300A24; }
h1,h2 {display:inline-block;font-size:2em; margin-bottom:0px;}
.section { clear:both; padding-top:20px; width:800px;}
#drawing { border:1px solid #D3D7CF; padding:0px; border-spacing:0; border-collapse:collapse; float:left; }
#drawing td { margin:0px; padding:0px; cursor: crosshair; font-size:14px;}
#palette { width:24px; list-style: none; float:left; margin:0px; padding:0px;}
#clear { margin-left:10px; font-size:14px;}
.swatch { width:24px; margin:10px; border:1px solid #300A24; font-size:24px; cursor:pointer; }
.active > .swatch { border:1px solid #D3D7CF; }
.x {background-color:#300A24; color:#D3D7CF; }
.r {background-color:#CC0000;} .rf {color:#CC0000;}
.g {background-color:#4E9A06;} .gf {color:#4E9A06;}
.y {background-color:#C4A000;} .yf {color:#C4A000;}
.b {background-color:#3465A4;} .bf {color:#3465A4;}
.m {background-color:#75507B;} .mf {color:#75507B;}
.c {background-color:#06989A;} .cf {color:#06989A;}
.w {background-color:#D3D7CF;} .wf {color:#D3D7CF;}
#source {clear:both; width:640px; font-size:12px;border:1px solid #333;}
#output {white-space: normal; }
</style>
</head>
<body>
<h1 class=cf>bashfill</h1><h1 class=rf>@</h1><h1 class=gf>MAX.IO</h1><h1 class=yf>></h1><h2>art for your terminal</h2>
<div class="section">
<h3>>draw here</h3>
<table id="drawing"></table>
<ul id="palette">
<li data-swatch="x"><div class="swatch x"> </div></li>
<li data-swatch="r"><div class="swatch r"> </div></li>
<li data-swatch="g"><div class="swatch g"> </div></li>
<li data-swatch="y"><div class="swatch y"> </div></li>
<li data-swatch="b"><div class="swatch b"> </div></li>
<li data-swatch="m"><div class="swatch m"> </div></li>
<li data-swatch="c"><div class="swatch c"> </div></li>
<li data-swatch="w"><div class="swatch w"> </div></li>
<li><a href="#" id="clear">>rm</a></li>
</ul>
</div>
<div class="section">
<h3>>copy this script</h3>
<pre id="source" class="x">
#!/bin/bash
#Background Colors
E=$(tput sgr0); R=$(tput setab 1); G=$(tput setab 2); Y=$(tput setab 3);
B=$(tput setab 4); M=$(tput setab 5); C=$(tput setab 6); W=$(tput setab 7);
# pixel sizes
width=" ";
height=1;
function e() { echo -e "$E"; }
function x() { echo -n "$E$width"; }
function r() { echo -n "$R$width"; }
function g() { echo -n "$G$width"; }
function y() { echo -n "$Y$width"; }
function b() { echo -n "$B$width"; }
function m() { echo -n "$M$width"; }
function c() { echo -n "$C$width"; }
function w() { echo -n "$W$width"; }
#putpixels
function u() {
h="$*";o=${h:0:1};v=${h:1};
for i in `seq $v`
do
$o;
done
}
img="\
<div id="output"></div>
line=""
for n in $img
do
if [ "$n" = "e1" ]; then
for i in `seq 1 $height`; do
echo -n "$line"
e
done
line=""
else
line="${line}$(u "$n")";
fi
done
for i in `seq 1 $height`; do
echo -n "$line"
e
done
exit 0;
</pre>
</div>
<div class="section">
<h3>>share your talent</h3>
<p>
<a href="#" id="link">Link to this drawing</a>
</p>
<p>
<a href="https://github.com/binarymax/bashfill">Fork me on github</a><br>
</p>
<p>
<a href="https://twitter.com/share" class="twitter-share-button" data-lang="en" data-size="large">Tweet</a><a href="https://twitter.com/binarymax" class="twitter-follow-button" data-show-count="false" data-lang="en" data-size="large">Follow @binarymax</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</p>
<p class="rf">
<em>Made with love by <a href="http://max.io">Max Irwin</a> (<a href="http://binarymax.com">http://binarymax.com</a>)</em><br>
<em>©Copyright 2013, MIT License</em>
</p>
</div>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="bash.js"></script>
<script>
var _gaq=[['_setAccount','UA-22107593-8'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
</body>
</html>