Converting from integers to output

K

Krista Bailie

I'm sure this is so easy that it will hurt for anyone to read it, but I
really need some direction. I'm trying to create a color chart (RGB) that
shows steps between two different colors as entered by the user. I know the
web script must convert the values into integers, store them as variables
and then output them, but I cannot seem to establish the calculation for
this. I'm attaching the html I've got, that works when the page is static,
and I know I need to create a fraction for each color by using the formula,
fraction = (i+1.0)/nsteps
r = (1-fraction)*red1 + fraction*red2

but the program won't recognize i... anyway, here is the html...if anyone
can give me any help I'd be so grateful!!

Thanks,
Krista

import cgi
form = cgi.FieldStorage()
print "Content-type: text/html"
print
print """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Colour Blend</title>
<style type="text/css">
#blend {
width: 10em;
padding: 0;
border: 1px solid black;
margin-left: 3em;
}
..colourblock {
width: 10em;
height: 1em;
}
</style>
</head>
<body>
<h1>Colour Blend</h1>

<p>
Here is a mix of the two colours you specified:
</p>
<div id="blend">

<div class="colourblock" style="background-color: rgb(100.0%,10.0%,10.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,20.0%,20.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,30.0%,30.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,40.0%,40.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,50.0%,50.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,60.0%,60.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,70.0%,70.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,80.0%,80.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,90.0%,90.0%)">
</div>
<div class="colourblock" style="background-color:
rgb(100.0%,100.0%,100.0%)"> </div>

</div>

</body>
</html>"""
 
D

Dennis Lee Bieber

I'm sure this is so easy that it will hurt for anyone to read it, but I
really need some direction. I'm trying to create a color chart (RGB) that
shows steps between two different colors as entered by the user. I know the
web script must convert the values into integers, store them as variables
and then output them, but I cannot seem to establish the calculation for
this. I'm attaching the html I've got, that works when the page is static,
and I know I need to create a fraction for each color by using the formula,
fraction = (i+1.0)/nsteps
r = (1-fraction)*red1 + fraction*red2

but the program won't recognize i... anyway, here is the html...if anyone
can give me any help I'd be so grateful!!
Click to expand...
Where's the INPUT HTML? I presume you display something from
which the user is supposed to pick two colors. If "i" is one of the
fields being returned from the input HTML then...
Thanks,
Krista

import cgi
form = cgi.FieldStorage()
Click to expand...

.... it would be accessed as
form["i"]
(unless I misread the help file for the cgi module).

Without knowing the input HTML, it is difficult to guess what
the data looks like. Does the user enter first RGB, then second RGB? Are
the RGB entries triplets in the range 0..255, or 0.0 .. 1.0, or
singletons of the form RRGGBB where each RR, GG, BB is in the range
00..FF?

It looks like the output wants percentages, so you'd have to
divide each part of the triplet by (100.0/255.0), or just multiple by
100.0 if the range was 0.0 .. 1.0. I leave the third variant for the
student <G>


start = int(raw_input("Start value> "))
end = int(raw_input("End value> "))
steps = int(raw_input("Number of steps> "))

if start > end:
print "Swapping start and end points"
(start, end) = (end, start)

span = end - start
incr = float(span) / steps

print "Data Point Value"
for n in range(steps+1):
print " %5s %5s (%5s)" % (n,
int(start + incr * n),
(start + incr * n))


Input:
5
18
10
Output:
Data Point Value
0 5 ( 5.0)
1 6 ( 6.3)
2 7 ( 7.6)
3 8 ( 8.9)
4 10 ( 10.2)
5 11 ( 11.5)
6 12 ( 12.8)
7 14 ( 14.1)
8 15 ( 15.4)
9 16 ( 16.7)
10 18 ( 18.0)

Input:
240
128
8
Output:
Swapping start and end points
Data Point Value
0 128 (128.0)
1 142 (142.0)
2 156 (156.0)
3 170 (170.0)
4 184 (184.0)
5 198 (198.0)
6 212 (212.0)
7 226 (226.0)
8 240 (240.0)

Extrapolate for three color components (I'm assuming you want to
do this in RGB coordinates -- you'll likely get different results if you
convert the end-points to HSV and interpolate through that coordinate,
then convert back to RGB)
--
 
P

Peter Maas

Krista said:
and I know I need to create a fraction for each color by using the formula,
fraction = (i+1.0)/nsteps
r = (1-fraction)*red1 + fraction*red2

but the program won't recognize i... anyway, here is the html...if anyone
can give me any help I'd be so grateful!!
Click to expand...

def longtorgb(c):
'''long to (r,g,b) tuple assuming that r
the r bits are high and the b bits are low'''

return ((c & 0xff0000) >> 16, (c & 0xff00) >> 8, c & 0xff)

colorstring = ""
for i in range(nsteps+1):
fraction = i/nsteps
mix = (1-fraction)*red1 + fraction*red2
rgb = longtorgb(mix)
colorstring += "color %d is rgb(%d,%d,%d)\n" % ((i,)+rgb)

This is a start. You can insert tuples in a html string with the
formatting operator (%). Literal % characters in the string have to
be doubled if you are using the formatting operator.

Mit freundlichen Gruessen,

Peter Maas
 
C

Christopher T King

Where's the INPUT HTML? I presume you display something from
which the user is supposed to pick two colors. If "i" is one of the
fields being returned from the input HTML then...
Click to expand...
... it would be accessed as
form["i"]
(unless I misread the help file for the cgi module).
Click to expand...

You did ;) It's form["i"].value (form["i"] returns a FieldStorage
instance).
 
D

Dennis Lee Bieber

You did ;) It's form["i"].value (form["i"] returns a FieldStorage
instance).
Click to expand...

Ah well... It would, at least, have returned /something/,
opposed to referencing an undefined i

--
 
K

Krista Bailie

Okay, I've almost got this, but I still don't understand how to actually
make the data appear. It is supposed to show up in bars(nsteps) that blend
one color to the other, but I can only get the static html colors to show.
Should I just erase the html div class info and put in a formula instead?
(File is below...)

Many, many thanks,
Krista

import cgi
form = cgi.FieldStorage()
def longtorgb(c):
'''long to (r,g,b) tuple assuming that r
the r bits are high and the b bits are low'''

return ((c & 0xff0000) >> 16, (c & 0xff00) >> 8, c & 0xff)

def nsteps():
nsteps = int(raw_input("steps> "))
def red1():
red1 = int(raw_input("red1> "))
def red2():
red2 = int(raw_input("red2> "))
def blue1():
blue1 = int(raw_input("blue1> "))
def blue2():
blue2 = int(raw_input("blue2> "))
def green1():
green1 = int(raw_input("green1> "))
def green2():
green2 = int(raw_input("green2> "))

colorstring = ""
def fraction():
fraction = i/nsteps
def mix():
mix = (1-fraction)*blue1 + fraction*blue2
mix = (1-fraction)*red1 + fraction*red2
mix = (1-fraction)*green1 + fraction*green2
def rgb():
rgb = longtorgb(mix)
colorstring += "color %d is rgb(%d,%d,%d)\n" % ((i,)+rgb)



print "Content-type: text/html"
print
print """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Colour Blend</title>
<style type="text/css">
#blend {
width: 10em;
padding: 0;
border: 1px solid black;
margin-left: 3em;
}
..colourblock {
width: 10em;
height: 1em;
}
</style>
</head>
<body>
<h1>Colour Blend</h1>

<p>
Here is a mix of the two colours you specified:
</p>
<div id="blend">

<div class="colourblock" style="background-color: rgb(100.0%,10.0%,10.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,20.0%,20.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,30.0%,30.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,40.0%,40.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,50.0%,50.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,60.0%,60.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,70.0%,70.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,80.0%,80.0%)">
</div>
<div class="colourblock" style="background-color: rgb(100.0%,90.0%,90.0%)">
</div>
<div class="colourblock" style="background-color:
rgb(100.0%,100.0%,100.0%)"> </div>
</div>

</div>

</body>
</html>"""
 
P

Peter Maas

Krista said:
Okay, I've almost got this, but I still don't understand how to actually
make the data appear.
Click to expand...
import cgi

def longtorgb(c):
'''long to (r,g,b) tuple assuming that the
r bits are high and the b bits are low'''

return ((c & 0xff0000) >> 16, (c & 0xff00) >> 8, c & 0xff)

if __name__ == '__main__':
form = cgi.FieldStorage()

# fetch input
#col1 = int(form['color1'].value)
#col2 = int(form['color2'].value)
# test only , to be deleted
col1 = 0xff # blue
col2 = 0xff00 # green
nsteps = 5
print col1, col2

# print header
print 'Content-type: text/html\n'

# print static part 1
print '''
<html>
<head>
<title>
Blending colors
</title>
</head>
<body>
Here is a mix of the two colours you specified:
'''

# print blend fields
for i in range(nsteps+1):
fraction = float(i)/nsteps
mix = int((1.0-fraction)*col1 + fraction*col2)
rgb = longtorgb(mix)
print '''
<div style="width: 50px; height: 20px; background: rgb(%d,%d,%d)">
step %d
</div>
''' % (rgb+(i,))

# print static part 2
print '''
</body>
</html>
'''

Mit freundlichen Gruessen,

Peter Maas
 
P

Peter Maas

Peter said:
import cgi

def longtorgb(c):
'''long to (r,g,b) tuple assuming that the
r bits are high and the b bits are low'''
Click to expand...
[...]

Sorry, serious error. longtorgb is nonlinear so the _tuples_
have to be mixed, not the integers. You probably want to work
with tuples only so you can drop the conversion crap. Correct
code:

import cgi

def rgbtolong(rgb):
'''(r,g,b) tuple to long assuming that the
r bits are high and the b bits are low'''

return (rgb[0] << 16) + (rgb[1] << 8) + rgb[2]

def longtorgb(c):
'''long to (r,g,b) tuple assuming that the
r bits are high and the b bits are low'''

return ((c & 0xff0000) >> 16, (c & 0x00ff00) >> 8, c & 0xff)

if __name__ == '__main__':

form = cgi.FieldStorage()

# fetch input
#col1 = int(form['color1'].value)
#col2 = int(form['color2'].value)
col1 = 0xff # blue
col2 = 0xff0000 # red
rcol1 = longtorgb(col1)
rcol2 = longtorgb(col2)
nsteps = 20

# print header
print 'Content-type: text/html\n'

# print static part 1
print '''
<html>
<head>
<title>
Blending colors
</title>
</head>
<body>
Here is a mix of the two colours you specified:
'''

# print blend fields
for i in range(nsteps+1):
fraction = float(i)/nsteps
mix = (int((1.0-fraction)*rcol1[0] + fraction*rcol2[0]),
int((1.0-fraction)*rcol1[1] + fraction*rcol2[1]),
int((1.0-fraction)*rcol1[2] + fraction*rcol2[2]))
print '''
<div style="width: 100px; height: 5px; background: rgb(%d,%d,%d)">
step %d
</div>
''' % (mix+(i,))

# print static part 2
print '''
</body>
</html>
'''

Mit freundlichen Gruessen,

Peter Maas
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

How to position the *tooltip* comment on these buttons? 9
"input-group-text" help 7
Justify-content not working 1
How can I add arrows to my FAQ 0
Need assistance finetuning HTML, CSS, Javascript - sticky header issue 3
Flip-Cards with Local Images 1
Help with my responsive home page 2
Image shifts to the right when export the page to pdf 4

Members online

Total: 36 (members: 1, guests: 35)
Robots: 419

Forum statistics

Threads
473,769
Messages
2,569,576
Members
45,054
Latest member
LucyCarper

Latest Threads

Top