author | Tero Marttila <terom@paivola.fi> |
Sun, 20 Apr 2014 23:51:57 +0300 | |
changeset 80 | 5254ba612630 |
parent 76 | ca10547ba9db |
child 82 | b5878197d017 |
permissions | -rw-r--r-- |
75 | 1 |
import pvl.web |
2 |
from pvl.web import urls, html |
|
3 |
||
4 |
import logging; log = logging.getLogger('qmsk.dmx.web') |
|
5 |
||
6 |
class Handler (pvl.web.Handler) : |
|
7 |
# Bootstrap |
|
8 |
DOCTYPE = 'html' |
|
9 |
HTML_XMLNS = None |
|
10 |
HTML_LANG = 'en' |
|
11 |
CSS = ( |
|
12 |
'//code.jquery.com/ui/1.10.4/themes/ui-darkness/jquery-ui.css', |
|
13 |
'//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css', |
|
14 |
) |
|
15 |
JS = ( |
|
16 |
'//code.jquery.com/jquery-2.1.0.js', |
|
17 |
'//code.jquery.com/ui/1.10.4/jquery-ui.js', |
|
18 |
'//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js', |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
19 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
20 |
'/static/color-slider.js', |
75 | 21 |
) |
22 |
||
23 |
STYLE = """ |
|
24 |
body { |
|
25 |
padding-top: 2em; |
|
26 |
text-align: center; |
|
27 |
} |
|
28 |
||
29 |
.container { |
|
30 |
padding: 2em 1em; |
|
31 |
text-align: left; |
|
32 |
} |
|
33 |
||
34 |
.panel { |
|
35 |
width: 30em; |
|
36 |
margin: 1em auto; |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
37 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
38 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
39 |
input.color-control { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
40 |
width: 5em; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
41 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
42 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
43 |
div#color { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
44 |
width: 5em; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
45 |
height: 5em; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
46 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
47 |
margin: 1em auto; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
48 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
49 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
50 |
div.color-slider { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
51 |
margin: 1em; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
52 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
53 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
54 |
div.color-slider#slider-r .ui-slider-range { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
55 |
background: #ff0000; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
56 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
57 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
58 |
div.color-slider#slider-g .ui-slider-range { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
59 |
background: #00ff00; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
60 |
} |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
61 |
|
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
62 |
div.color-slider#slider-b .ui-slider-range { |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
63 |
background: #0000ff; |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
64 |
} |
75 | 65 |
""" |
66 |
||
67 |
# test |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
68 |
TITLE = u"DMX Control" |
75 | 69 |
|
70 |
def process (self) : |
|
76
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
71 |
if self.request.method == 'POST' : |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
72 |
self.color = tuple((int(x, 16) if x else 0) for x in ( |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
73 |
self.request.form.get('r'), |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
74 |
self.request.form.get('g'), |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
75 |
self.request.form.get('b'), |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
76 |
)) |
75 | 77 |
|
78 |
r, g, b = self.color |
|
79 |
||
80 |
self.app.dmx_color(r, g, b, 255) |
|
81 |
||
76
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
82 |
else : |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
83 |
self.color = None |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
84 |
|
75 | 85 |
log.info("%s", self.color) |
86 |
||
87 |
def render (self) : |
|
76
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
88 |
if self.color : |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
89 |
r, g, b = self.color |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
90 |
else : |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
91 |
r = g = b = None |
75 | 92 |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
93 |
def color_swatch () : |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
94 |
return html.div(id='color', |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
95 |
style='background-color: rgb({r}, {g}, {b})'.format(r=r, g=g, b=b) |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
96 |
)(' '), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
97 |
|
75 | 98 |
def color_input (name, value) : |
99 |
color = dict(r=0, g=0, b=0) |
|
100 |
bgcolor = dict(r=0, g=0, b=0) |
|
101 |
||
102 |
if value : |
|
103 |
color[name] = value |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
104 |
alpha = value / 255.0 |
76
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
105 |
else : |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
106 |
alpha = 0 |
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
107 |
|
75 | 108 |
bgcolor[name] = 255 |
109 |
||
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
110 |
return html.input(type='text', name=name, |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
111 |
class_ = 'form-control color-control', |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
112 |
placeholder = name, |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
113 |
id = name, |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
114 |
|
76
ca10547ba9db
qmsk.dmx.web: separate r/g/b/
Tero Marttila <terom@paivola.fi>
parents:
75
diff
changeset
|
115 |
value = '{v:02x}'.format(v=value) if value else None, |
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
116 |
style = 'background-color: rgba({r}, {g}, {b}, {a:0.2f})'.format(a=alpha, **bgcolor), |
75 | 117 |
) |
118 |
||
119 |
return html.div(class_='container')( |
|
120 |
html.div(class_='panel')( |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
121 |
color_swatch(), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
122 |
html.div(id='slider-r', class_='color-slider')(' '), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
123 |
html.div(id='slider-g', class_='color-slider')(' '), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
124 |
html.div(id='slider-b', class_='color-slider')(' '), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
125 |
html.form(action='.', method='POST', class_='form-inline')( |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
126 |
#html.label(for_='color', class_='control-label')("Color"), |
75 | 127 |
html.div(class_='form-group')( |
128 |
color_input('r', r), |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
129 |
), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
130 |
html.div(class_='form-group')( |
75 | 131 |
color_input('g', g), |
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
132 |
), |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
133 |
html.div(class_='form-group')( |
75 | 134 |
color_input('b', b), |
135 |
), |
|
136 |
html.div(class_='form-group')( |
|
137 |
html.button(type='submit', class_='btn btn-primary')("Go"), |
|
138 |
), |
|
139 |
) |
|
140 |
) |
|
141 |
) |
|
142 |
||
143 |
class DMXWebApplication (pvl.web.Application) : |
|
144 |
URLS = urls.Map(( |
|
145 |
urls.rule('/', Handler), |
|
146 |
)) |
|
147 |
||
148 |
def __init__ (self, dmx, **opts) : |
|
149 |
super(DMXWebApplication, self).__init__(**opts) |
|
150 |
||
151 |
self.dmx = dmx |
|
152 |
||
153 |
def dmx_color (self, r, g, b, a=255) : |
|
154 |
for c in (1, 30) : |
|
80
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
155 |
# XXX: separate commands... each one flushes... |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
156 |
self.dmx[c + 0:c + 26] = (r, g, b) |
5254ba612630
dmx-web: slightly better RGB colorpicker control..
Tero Marttila <terom@paivola.fi>
parents:
76
diff
changeset
|
157 |
self.dmx[c + 27] = (0, a) |
75 | 158 |