From 44909ac087107cc43fce0cb823fea0a631c5b8ef Mon Sep 17 00:00:00 2001 From: svk28 Date: Fri, 25 Aug 2017 16:37:26 +0300 Subject: [PATCH] Added CSS. Code refactoring. --- www/css/layout.css | 112 +++++++++++++++++++++++++++++++++++ www/css/menu.css | 129 +++++++++++++++++++++++++++++++++++++++++ www/index.py | 141 +++++++++++++++++++++++++++------------------ 3 files changed, 325 insertions(+), 57 deletions(-) create mode 100644 www/css/layout.css create mode 100644 www/css/menu.css diff --git a/www/css/layout.css b/www/css/layout.css new file mode 100644 index 0000000..51e66c1 --- /dev/null +++ b/www/css/layout.css @@ -0,0 +1,112 @@ +*{ + margin:0; + padding:0; +} +body { + font:14px/1.3 Arial,sans-serif; + background-color:#212121; +} +header { + background-color:#212121; + box-shadow: 0 -1px 2px #111111; + color:#fff; + display:block; + height:50px; + position:relative; + width:100%; + z-index:100; +} +h2{ + font-size:22px; + font-weight:normal; + /*left:50%;*/ + margin-left:20px; + padding:10px 0; + position:absolute; + /*width:540px;*/ + color:#fff; +} +h3{ + font-size:18px; + font-weight:normal; + left:50%; + /*margin-left:-400px;*/ + padding:10px 0; + /*position:absolute;*/ + width:540px; + color:#fff; +} +h4{ + font-size:16px; + font-weight:normal; + /*margin-left:20px;*/ + padding:10px 0; + color:#fff; +} + +header a.stuts,a.stuts:visited{ + border:none; + text-decoration:none; + color:#fcfcfc; + font-size:14px; + left:50%; + line-height:31px; + margin:23px 0 0 110px; + position:absolute; + top:0; +} +header .stuts span { + font-size:22px; + font-weight:bold; + margin-left:5px; +} +.container { + height: 40px; + margin: 30px auto; + /*width: 957px;*/ +} +.table_dark { + font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; + font-size: 12px; + width: 100%; + text-align: left; + border-collapse: collapse; + margin: 10px; +} +.table_dark th { + color: #CAD4D6; + border-top: 1px solid #CAD4D6; + border-bottom: 1px solid #CAD4D6; + padding: 12px 17px; + background: #212121; +} +.table_dark td { + color: #CAD4D6; + border-bottom: 1px solid #CAD4D6; + border-right:1px solid #CAD4D6; + padding: 7px 17px; +} +.table_dark tr:last-child td { + border-bottom: none; +} +.table_dark td:last-child { + border-right: none; +} + +A:link { + text-decoration: none; + color: #CAD4D6; +} +A:visited { + text-decoration: none; + color: #CAD4D6; +} +A:active { + text-decoration: none; + color: #CAD4D6; +} +A:hover { + text-decoration: none; + color: #00B4FF; +} + diff --git a/www/css/menu.css b/www/css/menu.css new file mode 100644 index 0000000..a100a38 --- /dev/null +++ b/www/css/menu.css @@ -0,0 +1,129 @@ +#nav,#nav ul { +list-style: none outside none; +margin: 0; +padding: 0; +} +#nav { +background: url('menu_bg.png') no-repeat scroll 0 0 transparent; +clear: both; +font-size: 12px; +height: 58px; +padding: 0 0 0 9px; +position: relative; +width: 957px; +} +#nav ul { +background-color: #222; +border:1px solid #222; +border-radius: 0 5px 5px 5px; +border-width: 0 1px 1px; +box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5); +left: -9999px; +overflow: hidden; +position: absolute; +top: -9999px; +z-index: 2; +-moz-transform: scaleY(0); +-ms-transform: scaleY(0); +-o-transform: scaleY(0); +-webkit-transform: scaleY(0); +transform: scaleY(0); +-moz-transform-origin: 0 0; +-ms-transform-origin: 0 0; +-o-transform-origin: 0 0; +-webkit-transform-origin: 0 0; +transform-origin: 0 0; +-moz-transition: -moz-transform 0.1s linear; +-ms-transition: -ms-transform 0.1s linear; +-o-transition: -o-transform 0.1s linear; +-webkit-transition: -webkit-transform 0.1s linear; +transition: transform 0.1s linear; +} +#nav li { +background: url('menu_line.png') no-repeat scroll right 5px transparent; +float: left; +position: relative; +} +#nav li a { +color: #FFFFFF; +display: block; +float: left; +font-weight: normal; +height: 30px; +padding: 23px 20px 0; +position: relative; +text-decoration: none; +text-shadow: 1px 1px 1px #000000; +} +#nav li:hover > a { +color: #00B4FF; +} +#nav li:hover, #nav a:focus, #nav a:hover, #nav a:active { +background: none repeat scroll 0 0 #121212; +outline: 0 none; +} +#nav li:hover ul.subs { +left: 0; +top: 53px; +width: 180px; +-moz-transform: scaleY(1); +-ms-transform: scaleY(1); +-o-transform: scaleY(1); +-webkit-transform: scaleY(1); +transform: scaleY(1); +} +#nav ul li { +background: none; +width: 100%; +} +#nav ul li a { +float: none; +} +#nav ul li:hover > a { +background-color: #121212; +color: #00B4FF; +} +#lavalamp { +background: url('lavalamp.png') no-repeat scroll 0 0 transparent; +height: 16px; +left: 13px; +position: absolute; +top: 0px; +width: 64px; +-moz-transition: all 300ms ease; +-ms-transition: all 300ms ease; +-o-transition: all 300ms ease; +-webkit-transition: all 300ms ease; +transition: all 300ms ease; +} +#lavalamp:hover { +-moz-transition-duration: 3000s; +-ms-transition-duration: 3000s; +-o-transition-duration: 3000s; +-webkit-transition-duration: 3000s; +transition-duration: 3000s; +} +#nav li:nth-of-type(1):hover ~ #lavalamp { +left: 13px; +} +#nav li:nth-of-type(2):hover ~ #lavalamp { +left: 90px; +} +#nav li:nth-of-type(3):hover ~ #lavalamp { +left: 170px; +} +#nav li:nth-of-type(4):hover ~ #lavalamp { +left: 250px; +} +#nav li:nth-of-type(5):hover ~ #lavalamp { +left: 330px; +} +#nav li:nth-of-type(6):hover ~ #lavalamp { +left: 410px; +} +#nav li:nth-of-type(7):hover ~ #lavalamp { +left: 490px; +} +#nav li:nth-of-type(8):hover ~ #lavalamp { +left: 565px; +} diff --git a/www/index.py b/www/index.py index 3542b10..29419ba 100755 --- a/www/index.py +++ b/www/index.py @@ -1,66 +1,93 @@ -#!/usr/bin/python3 -# -*- coding: utf-8 -*- -# Turn on debug mode. -import sys -import cgi -import cgitb -cgitb.enable() -# Print necessary headers. -print("Content-Type: text/html; charset=UTF-8\n\n") -# Connect to the database. -import pymysql -conn = pymysql.connect( -db='ats', -user='user', -passwd='password', -host='localhost', -charset='utf8') +import os, sys, \ + pymysql, urlparse3 -c = conn.cursor() -# Insert some example data. -#c.execute("INSERT INTO numbers VALUES (1, 'One!')") -#c.execute("INSERT INTO numbers VALUES (2, 'Two!')") -#c.execute("INSERT INTO numbers VALUES (3, 'Three!')") -#conn.commit() -# Print the contents of the database. -#c.execute("SELECT * FROM int_number") -print("") -print("Телефоны") -print("

ТЕЛЕФОНЫ

") -print("

[Справочник] [Отчёты]

") -print("

Телефонный справочник

") -print("
Внутренние
Городские		") +def application(environ, start_response): + #sys.stdout._encoding = 'utf-8' + status = '200 OK' + # проверяем наличие параметров в запросе и всяко-разно реагируем + if environ['QUERY_STRING'] == '': + output = bytes((header() + body() + footer()).encode('utf8')) + elif environ['QUERY_STRING'].split('&'): + paramDict = {item.split('=')[0]: item.split('=')[1] for item in environ['QUERY_STRING'].split('&')} + if paramDict.get('query_type') == 'internal': + output = bytes((header() + body() + getInternalNumbers() + footer()).encode('utf8')) + elif paramDict.get('query_type') == 'external': + output = bytes((header() + body() + getCOline() + footer()).encode('utf8')) + else: + output = bytes((header() + body() + footer()).encode('utf8')) -param = cgi.FieldStorage() -#Передали заголовки ранее -param = cgi.FieldStorage() #Здесь пустых значений нет! -if "qwery_type" not in param: - qwery_type="internal" -else: - qwery_type = param["qwery_type"].value -if "order" not in param: - order="fio" -else: - order = param["order"].value + response_headers = [('Content-type', 'text/html;charset=utf-8'), + ('Content-Length', str(len(output)))] + start_response(status, response_headers) -if qwery_type == "internal": - print("

Список внутренних телефонов

") + return [output] + +def header(): + txtHeader = '\n' \ + '\n' \ + '\n' \ + 'Телефоны\n' \ + '\n' + return txtHeader + +def footer(): + txtFooter = '
\n' + return txtFooter + +def body(): + txtBody = '\n' \ + '\n" % (row[0], row[1], row[2], row[4], row[3]) + result = result + rowData + return (result + "

ТЕЛЕФОНЫ

{}
\n'.format(menu()) + return txtBody +def menu(): + #
+ txtMenu = '
\n' + return txtMenu + +def getInternalNumbers(): + conn = connectDB() + c = conn.cursor() + order = 'int_number' + result = '

Список внутренних телефонов

' qwr = "SELECT * FROM int_number ORDER by " + order c.execute(qwr) - print("") + listHeader = '
№ п/пТелефонФИООписаниеЭлектро-почта
\n' \ + '\n' \ + '\n' \ + '\n' + result = result + listHeader for row in c.fetchall(): - print("" % (row[0], row[1], row[2], row[4], row[3])) - print("
№ п/пТелефонФИООписаниеЭлектро-почта
%s%s%s%s%s
") + rowData = "
%s%s%s%s%s
\n") -if qwery_type == "external": - print("

Список городских телефонов

") - c.execute("SELECT * FROM ext_co_line") - print("") - for r in c.fetchall(): - print("" % (r[0], r[1], r[2], r[3])) - print("
№ п/пЛинияТелефонОписание
%s%s%s%s
") +def getCOline(): + conn = connectDB() + c = conn.cursor() + order = 'ext_co_line' + result = '

Список внешних линий

' + qwr = "SELECT * FROM ext_co_line ORDER by " + order + c.execute(qwr) + listHeader = '\n' \ + '\n' \ + '\n' \ + '\n' + result = result + listHeader + for row in c.fetchall(): + rowData = "" % (row[0], row[1], row[2], row[3]) + result = result + rowData + return (result + "
№ п/пЛинияНомер телефонаОписание
%s%s%s%s
\n") -print("") - -print("") \ No newline at end of file +def connectDB(): + c = pymysql.connect( + db='ats_test', + user='ats', + passwd='', + host='kis', + charset='utf8') + return c \ No newline at end of file