Added flash messages support

pylons_app/public/css/monoblue_custom.css

@@ -1,754 +1,809 b''
 /*** Initial Settings ***/
 #mainhtml{
 	margin: 15px 50px;
 	background: #DBD4C6;
 	font-family: sans-serif;
 }
 
 a {
 	color: #556CB5;
 	text-decoration: none;
 }
 a:HOVER{
 	text-decoration: underline;
 }
 
 /*** end of Initial Settings ***/ 
 
 /*** ***/
 .table_disp {
     border-left: 0px solid #666666;
     border-bottom: 1px solid #666666;
     border-right: 1px solid #666666;
     padding: 0px;
     margin: 0px;
     border-spacing: 0px;    
 }
 
 .table_disp .header {
     border-top: 1px solid #666666;
     background-color: #556CB5;
     font-weight: bold;
     color: white;
     vertical-align: middle;
     padding: 3px 5px;
     text-align: left;
     font-size: 0.9em;
 }
 
 .table_disp .header td {
     padding: 4px;
     vertical-align: middle;
     border-top: 1px solid #AAAAAA;
     border-bottom: 2px solid #666666;
 }
 .table_disp td {
     border-left: 1px solid #AAAAAA;
-    padding-left: 2px;
-    padding-right: 0px;
+    padding-left: 4px;
+    padding-right: 4px;
 }
 
 table tr.parity0:hover,table tr.parity1:hover {
     background: #D5E1E6;
 }
 
 table tr.parity0 {
     background: #EAEAE9;
 }
 
 table tr.parity1 {
     background: #FFFFFF;
 }
 
 
 /*** ***/
 
 /** common settings **/
 .add_icon{
     background: url("/images/icons/add.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
 
 }
 .edit_icon{
     background: url("/images/icons/folder_edit.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
 }
 
 .delete_icon{
     background: url("/images/icons/delete.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
 
 }
 
 .action_button{
     border:0px;
     display: block;
 }
 .action_button:hover{
     border:0px;
     font-style:italic;
     cursor: pointer;
 }
 
+.flash_msg ul{
+	margin:0;
+	padding:25px 0px 0px 0px;
+	
+}
+.error_msg {
+	background-color:#FFCFCF;
+	background-image: url("/images/icons/error_msg.png");
+	border:1px solid #FF9595;
+	color:#CC3300;
+}
+.warning_msg {
+	background-color:#FFFBCC;
+	background-image: url("/images/icons/warning_msg.png");
+	border:1px solid #FFF35E;
+	color:#C69E00;
+}
+.success_msg {
+	background-color:#D5FFCF;
+	background-image: url("/images/icons/success_msg.png");
+	border:1px solid #97FF88;
+	color:#009900;
+}
+.notice_msg {
+	background-color:#DCE3FF;
+	background-image: url("/images/icons/notice_msg.png");
+	border:1px solid #93A8FF;
+	color:#556CB5;
+}
+
+.success_msg, .error_msg, .notice_msg, .warning_msg{
+	background-position:10px center;
+	background-repeat:no-repeat;
+	font-size:12px;
+	font-weight:bold;
+	min-height:14px;
+	line-height:14px;
+	margin-bottom:0px;
+	margin-top:0px;
+	padding:3px 10px 3px 40px;
+	display:block;
+	overflow: auto;
+}        
+
+#msg_close {
+	background:transparent url("icons/cross_grey_small.png")	no-repeat scroll 0 0;
+	cursor:pointer;
+	height:16px;
+	position:absolute;
+	right:5px;
+	top:5px;
+	width:16px;
+}
+
+
 div#main {
 	padding: 5px;
 }
 
 div#container {
 	background: #FFFFFF;
 	position: relative;
 	color: #666;
 }
 
 div.page-header {
 	padding: 50px 20px 0;
 	background: #556cb5 top left repeat-x;
 	position: relative;
 }
 
 div.page-header h1 {
 	margin: 10px 0 30px;
 	font-size: 1.8em;
 	font-weight: bold;
 	font-family: sans-serif;
 	letter-spacing: 1px;
 	color: #FFFFFF;
 }
 
 div.page-header h1 a {
 	font-weight: bold;
 	color: #FFFFFF;
 }
 
 div.page-header a {
 	text-decoration: none;
 }
 
 div.page-header form {
 	position: absolute;
 	margin-bottom: 2px;
 	bottom: 0;
 	right: 20px;
 }
 
 div.page-header form label {
 	color: #DDD;
 }
 
 div.page-header form input {
 	padding: 2px;
 	border: solid 1px #DDD;
 }
 
 div.page-header form dl {
 	overflow: hidden;
 }
 
 div.page-header form dl dt {
 	font-size: 1.2em;
 }
 
 div.page-header form dl dt,div.page-header form dl dd {
 	margin: 0 0 0 5px;
 	float: left;
 	height: 24px;
 	line-height: 20px;
 }
 
 ul.page-nav {
 	margin: 10px 0 0 0;
 	list-style-type: none;
 	overflow: hidden;
 	width: 800px;
 	padding: 0;
 }
 
 ul.page-nav li {
 	margin: 0 4px 0 0;
 	float: left;
 	height: 24px;
 	font-size: 1.1em;
 	line-height: 24px;
 	text-align: center;
 	background: #556CB5;
 }
 
 ul.page-nav li.current {
 	background: #FFF;
 	padding-right: 5px;
 	padding-left: 5px;
 }
 ul.page-nav li.current a {
 	color: #556CB5;
 }
 ul.page-nav li a {
 	height: 24px;
 	color: #FFF;
 	padding-right: 5px;
 	padding-left: 5px;
 	display: block;
 	text-decoration: none;
 	font-weight: bold;
 }
 ul.page-nav li.logout a {
 	color: #FDAC9D;
 }
 ul.page-nav li a:hover {
 	background: #FFF;
 	color: #556CB5;
 }
 
 ul.submenu {
 	margin: 5px 0px -20px 0px;
 	list-style-type: none;
 }
 
 ul.submenu li {
 	margin: 0 10px 0 0;
 	font-size: 0.9em;
 	font-weight:bold;
 	display: inline;
 }
 ul.submenu .repos {
     background: url("/images/icons/folder_edit.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
    
 }
 ul.submenu .users {
     background: url("/images/icons/user_edit.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
 }
 ul.submenu .permissions {
     background: url("/images/icons/folder_key.png") no-repeat scroll 3px;
     height: 16px;
     padding-left: 20px;
     padding-top: 0px;
     text-align: left;
 }
 
 ul.submenu .current_submenu {
     border-bottom: 2px solid #556CB5;
 }
 
 h2 {
 	margin: 20px 0 10px;
 	height: 30px;
 	line-height: 30px;
 	text-indent: 20px;
 	background: #FFF;
 	font-size: 1.2em;
 	border-top: dotted 1px #D5E1E6;
 	font-weight: bold;
 	color:#556CB5;
 }
 
 h2.no-link {
 	color: #006699;
 }
 
 h2.no-border {
 	color: #FFF;
 	background: #556CB5;
 	border: 0;
 }
 
 h2 a {
 	font-weight: bold;
 	color: #006699;
 }
 
 div.page-path {
 	text-align: right;
 	padding: 20px 30px 10px 0;
 	border: solid #d9d8d1;
 	border-width: 0px 0px 1px;
 	font-size: 1.2em;
 }
 
 div.page-footer {
 	margin: 50px 0 0;
 	position: relative;
 	text-align: center;
 	font-weight: bold;
 	font-size: 90%;
 }
 
 div.page-footer p {
 	position: relative;
 	left: 20px;
 	bottom: 5px;
 	font-size: 1.2em;
 }
 
 ul.rss-logo {
 	position: absolute;
 	top: -10px;
 	right: 20px;
 	height: 20px;
 	list-style-type: none;
 }
 
 ul.rss-logo li {
 	display: inline;
 }
 
 ul.rss-logo li a {
 	padding: 3px 6px;
 	line-height: 10px;
 	border: 1px solid;
 	border-color: #fcc7a5 #7d3302 #3e1a01 #ff954e;
 	color: #ffffff;
 	background-color: #ff6600;
 	font-weight: bold;
 	font-family: sans-serif;
 	font-size: 10px;
 	text-align: center;
 	text-decoration: none;
 }
 
 div.rss-logo li a:hover {
 	background-color: #ee5500;
 }
 
 p.normal {
 	margin: 20px 0 20px 30px;
 	font-size: 1.2em;
 }
 
 span.logtags span {
 	background-repeat: no-repeat;
 	height: 16px;
 	padding-left: 20px;
 	padding-top: 0px;
 	text-align: left;
 	font-weight: bold;
 }
 
 span.logtags span.tagtag {
 	background-image: url("/images/icons/tag_green.png");
 }
 
 span.logtags span.branchtag {
 	background-image: url("/images/icons/arrow_branch.png");
 	color: #628F53;
 }
 
 span.logtags span.inbranchtag {
 	background-image: url("/images/icons/arrow_branch.png");
 }
 
 div.diff pre {
 	margin: 10px 0 0 0;
 }
 
 div.diff pre span {
 	font-family: monospace;
 	white-space: pre;
 	font-size: 1.2em;
 	padding: 3px 0;
 }
 
 td.source {
 	white-space: pre;
 	font-family: monospace;
 	margin: 10px 30px 0;
 	font-size: 1.2em;
 	font-family: monospace;
 }
 
 div.source div.parity0,div.source div.parity1 {
 	padding: 1px;
 	font-size: 1.2em;
 }
 
 div.source div.parity0 {
 	background: #F1F6F7;
 }
 
 div.source div.parity1 {
 	background: #FFFFFF;
 }
 
 div.parity0:hover,div.parity1:hover {
 	background: #D5E1E6;
 }
 
 .linenr {
 	color: #999;
 	text-align: right;
 }
 
 .lineno {
 	text-align: right;
 }
 
 .lineno a {
 	color: #999;
 }
 
 td.linenr {
 	width: 60px;
 }
 
 div#powered-by {
 	position: absolute;
 	width: 75px;
 	top: 15px;
 	right: 20px;
 	font-size: 1.2em;
 }
 
 div#powered-by a {
 	color: #EEE;
 	text-decoration: none;
 }
 
 div#powered-by a:hover {
 	text-decoration: underline;
 }
 
 dl.overview {
 	margin: 0 0 0 30px;
 	font-size: 1.1em;
 	overflow: hidden;
 }
 
 dl.overview dt,dl.overview dd {
 	margin: 5px 0;
 	float: left;
 }
 
 dl.overview dt {
 	clear: left;
 	font-weight: bold;
 	width: 150px;
 }
 
 #clone_url{
     border: 0px;
 }
 /** end of summary **/ 
 
 /** chagelog **/
 h3.changelog {
 	margin: 20px 0 5px 30px;
 	padding: 0 0 2px;
 	font-size: 1.4em;
 	border-bottom: dotted 1px #D5E1E6;
 }
 
 ul.changelog-entry {
 	margin: 0 0 10px 30px;
 	list-style-type: none;
 	position: relative;
 }
 
 ul.changelog-entry li span.revdate {
 	font-size: 1.1em;
 }
 
 ul.changelog-entry li.age {
 	position: absolute;
 	top: -25px;
 	right: 10px;
 	font-size: 1.4em;
 	color: #CCC;
 	font-weight: bold;
 	font-style: italic;
 }
 
 ul.changelog-entry li span.name {
 	font-size: 1.2em;
 	font-weight: bold;
 }
 
 ul.changelog-entry li.description {
 	margin: 10px 0 0;
 	font-size: 1.1em;
 }
 
 /** end of changelog **/ 
 
 /** file **/
 p.files {
 	margin: 0 0 0 20px;
 	font-size: 2.0em;
 	font-weight: bold;
 }
 
 /** end of file **/ 
 
 /** changeset **/
 #changeset_content{
 	width:60%;
 	float:left;
 }
 
 #changeset_content .container .wrapper{
 	width: 600px;
 }
 #changeset_content .container{
 	border:1px solid #CCCCCC;
 	height:120px;
 }
 
 #changeset_content .container .left{
 	float:left;
 	width: 70%;
 	padding-left: 5px;
 }
 
 #changeset_content .container .right{
 	float:right;
 	width: 25%;
 	text-align: right;
 }
 
 #changeset_content .container .left .date{
 	font-weight:bold;
 }
 #changeset_content .container .left .author{
 	
 }
 #changeset_content .container .left .message{
 	font-style: italic;
 	color: #556CB5;
 }
 
 .cs_files{
 	width: 60%;
 }
 
 .cs_files .cs_added{
 	background: url("/images/icons/page_white_add.png") no-repeat scroll 3px;
 	/*background-color:#BBFFBB;*/
 	height: 16px;
 	padding-left: 20px;
 	margin-top: 7px;
 	text-align: left;	
 }
 .cs_files .cs_changed{
 	background: url("/images/icons/page_white_edit.png") no-repeat scroll 3px;
 	/*background-color: #FFDD88;*/
 	height: 16px;
 	padding-left: 20px;
 	margin-top: 7px;
 	text-align: left;	
 }
 .cs_files .cs_removed{
 	background: url("/images/icons/page_white_delete.png") no-repeat scroll 3px;
 	/*background-color: #FF8888;*/
 	height: 16px;
 	padding-left: 20px;
 	margin-top: 7px;
 	text-align: left;	
 }
 
 /** end of changeset **/ 
 
 /** canvas **/
 canvas {
 	position: absolute;
 	z-index: 5;
 	top: -0.7em;
 }
 #graph{
 	overflow: hidden;
 
 }
 #graph_nodes{
 	width:160px;
 	float:left;
 }
 
 #graph_content{
 	width:800px;
 	float:left;
 }
 #graph_content .container_header{
 	border:1px solid #CCCCCC;
 	height:30px;
 	background: #EEEEEE;
 }
 
 
 #graph_content .container .wrapper{
 	width: 600px;
 }
 #graph_content .container{
 	border-bottom: 1px solid #CCCCCC;
 	border-left: 1px solid #CCCCCC;
 	border-right: 1px solid #CCCCCC;
 	height:120px;
 }
 
 #graph_content .container .left{
 	float:left;
 	width: 70%;
 	padding-left: 5px;
 }
 
 #graph_content .container .right{
 	float:right;
 	width: 25%;
 	text-align: right;
 }
 #graph_content .container .left .date{
 	font-weight:bold;
 }
 #graph_content .container .left .author{
 	
 }
 #graph_content .container .left .message{
 	font-size: 80%;
 }
 
 .right div{
 	clear: both;
 }
 .right .changes .added,.changed,.removed{
 	border:1px solid #DDDDDD;
 	display:block;
 	float:right;
 	font-size:0.75em;
 	text-align:center;
 	min-width:15px;
 }
 .right .changes .added{
 	background:#BBFFBB; 
 }
 .right .changes .changed{
 	background: #FFDD88;
 }
 .right .changes .removed{
 	background: #FF8888;
 }
 
 .right .merge{
 	vertical-align: top;
 	font-size: 60%;
 	font-weight: bold;
 }
 .right .merge img{
 	vertical-align: bottom;	
 }
 
 .right .parent{
 	font-size: 90%;
 	font-family: monospace;
 }
 /** end of canvas **/
 
 /* FILE BROWSER */
 div.browserblock {
     overflow: hidden;
     padding: 0px;
     border: 1px solid #ccc;
     background: #f8f8f8;
     font-size: 100%;
     line-height: 100%;
     /* new */
     line-height: 125%;
 }
 div.browserblock .browser-header{
 	border-bottom: 1px solid #CCCCCC;
 	background: #EEEEEE;
 	color:blue;
 	padding:10px 0 10px 0;
 }
 div.browserblock .browser-header span{
 	margin-left:25px;
 	font-weight: bold;
 }
 div.browserblock .browser-body{
 	background: #EEEEEE;
 }
 
 table.code-browser {
 	border-collapse:collapse;
 	width: 100%;
 }
 table.code-browser tr{
 	margin:3px;	
 }
 
 table.code-browser thead th {
 	background-color: #EEEEEE;
 	height: 20px;
 	font-size: 1.1em;
 	font-weight: bold;
 	text-align: center;
 	text-align: left;
 	padding-left: 10px;
 }
 table.code-browser tbody tr {
 	
 }
 
 table.code-browser tbody td {
 	
 	padding-left:10px;
 	height: 20px;
 }
 
 .info-table {
 	background: none repeat scroll 0 0 #FAFAFA;
 	border-bottom: 1px solid #DDDDDD;
 	width: 100%;
 }
 
 .rss_logo {
 	background: url("/images/icons/rss_16.png") no-repeat scroll 3px;
 	height: 16px;
 	padding-left: 20px;
 	padding-top: 0px;
 	text-align: left;
 }
 
 .atom_logo {
 	background: url("/images/icons/atom.png") no-repeat scroll 3px;
 	height: 16px;
 	padding-left: 20px;
 	padding-top: 0px;
 	text-align: left;
 }
 .archive_logo{
 	background: url("/images/icons/compress.png") no-repeat scroll 3px;
 	height: 16px;
 	padding-left: 20px;
 	text-align: left;
 }
 
 .browser-file {
 	background: url("/images/icons/document_16.png") no-repeat scroll 3px;
 	height: 16px;
 	padding-left: 20px;
 	text-align: left;
 }
 
 .browser-dir {
 	background: url("/images/icons/folder_16.png") no-repeat scroll 3px;
 	height: 16px;
 	padding-left: 20px;
 	text-align: left;
 }
 
 #repos_list {
 	border: 1px solid #556CB5;
 	background: #FFFFFF;
 }
  No newline at end of file

pylons_app/templates/base/base.html

@@ -1,143 +1,153 b''
 ## -*- coding: utf-8 -*-
 <!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" id="mainhtml">
 <head>
     <link rel="icon" href="/images/hgicon.png" type="image/png" />
     <meta name="robots" content="index, nofollow"/>
     <title>${next.title()}</title>
     ##For future use yui reset for cross browser compatability.
     ##<link rel="stylesheet" href="/js/yui/reset-fonts-grids/reset-fonts-grids.css" type="text/css" />
     ${self.css()}
     ${self.js()}
 </head>
 
 <body class="mainbody">
 <div id="container">
     <div class="page-header">
         <h1>${next.breadcrumbs()}</h1>
         ${self.page_nav()}
+    <div class="flash_msg">
+    <% messages = h.flash.pop_messages() %>
+		% if messages:
+		<ul id="flash-messages">
+		    % for message in messages:
+		    <li class="${message.category}_msg">${message}</li>
+		    % endfor
+		</ul>
+		% endif
+    </div>        
     <div id="main">
     	${next.main()}
     </div>
     <div class="page-footer">
         Hg App ${c.hg_app_version} &copy; 2010 by Marcin Kuzminski
     </div>   
 
     <div id="powered-by">
         <p>
         <a href="http://mercurial.selenic.com/" title="Mercurial">
             <img src="/images/hglogo.png" width="75" height="90" alt="mercurial"/></a>
         </p>
     </div>
 
     <div id="corner-top-left"></div>
     <div id="corner-top-right"></div>
     <div id="corner-bottom-left"></div>
     <div id="corner-bottom-right"></div>
 
 </div>
 </body>
 </html>
 
 ### MAKO DEFS ### 
 
 <%def name="page_nav()">
 	${self.menu()}
 	${self.submenu()}
 </%def>
 
 <%def name="menu(current)">
 <% 
 def is_current(selected):
 	if selected == current:
 		return "class='current'"
 %>
 		%if current not in ['home','admin']:
 		##regular menu
 	       <script type="text/javascript">
 	       	YAHOO.util.Event.onDOMReady(function(){
 				YAHOO.util.Event.addListener('repo_switcher','click',function(){
 					if(YAHOO.util.Dom.hasClass('repo_switcher','selected')){
 						YAHOO.util.Dom.setStyle('switch_repos','display','none');
 						YAHOO.util.Dom.setStyle('repo_switcher','background','');
 						YAHOO.util.Dom.removeClass('repo_switcher','selected');
 					}
 					else{
 						YAHOO.util.Dom.setStyle('switch_repos','display','');
 						YAHOO.util.Dom.setStyle('repo_switcher','background','#FFFFFF');
 						YAHOO.util.Dom.setStyle('repo_switcher','color','#556CB5');
 						YAHOO.util.Dom.addClass('repo_switcher','selected');
 					}
 					});
 				YAHOO.util.Event.addListener('repos_list','change',function(e){
 		            var wa = YAHOO.util.Dom.get('repos_list').value;
 		        	
 		            var url = "${h.url('summary_home',repo_name='__REPLACE__')}".replace('__REPLACE__',wa);
 			        window.location = url;
 				})
 	           });
 	       	</script>       	
 	        <ul class="page-nav">
 				<li>
 					<a id="repo_switcher" title="${_('Switch repository')}" href="#">&darr;</a>
 					<div id="switch_repos" style="display:none;position: absolute;width: 150px;height: 25px">
 						<select id="repos_list" size="=10">
 						%for repo in c.cached_repo_list:
 							<option value="${repo['name']}">${repo['name']}</option>
 						%endfor
 						</select>
 					</div>			
 				</li>
 	            <li ${is_current('summary')}>${h.link_to(_('summary'),h.url('summary_home',repo_name=c.repo_name))}</li>
 	            <li ${is_current('shortlog')}>${h.link_to(_('shortlog'),h.url('shortlog_home',repo_name=c.repo_name))}</li>
 				<li ${is_current('changelog')}>${h.link_to(_('changelog'),h.url('changelog_home',repo_name=c.repo_name))}</li>            
 	            <li ${is_current('branches')}>${h.link_to(_('branches'),h.url('branches_home',repo_name=c.repo_name))}</li>
 	            <li ${is_current('tags')}>${h.link_to(_('tags'),h.url('tags_home',repo_name=c.repo_name))}</li>
 	            <li ${is_current('files')}>${h.link_to(_('files'),h.url('files_home',repo_name=c.repo_name))}</li>
 	        </ul>
 		%else:
 		##Root menu
 			<ul class="page-nav">
 				<li ${is_current('home')}>${h.link_to(_('Home'),h.url('/'))}</li>
 				<li ${is_current('admin')}>${h.link_to(_('Admin'),h.url('admin_home'))}</li>
 				<li class="logout">${h.link_to(u'Logout',h.url('logout_home'))}</li>
 			</ul>
 		%endif    
 		</div>
 </%def>
 <%def name="submenu(current=None)">
 	<% 
 	def is_current(selected):
 		if selected == current:
 			return "class='current_submenu'"
 	%>
 	%if current != None:
 	<div>
     <ul class="submenu">
         <li ${is_current('repos')}>${h.link_to(u'repos',h.url('repos'),class_='repos')}</li>
         <li ${is_current('users')}>${h.link_to(u'users',h.url('users'),class_='users')}</li>
         <li ${is_current('permissions')}>${h.link_to(u'permissions',h.url('permissions'),class_='permissions')}</li>
     </ul>
     </div>
     %endif
 </%def>
 
 
 <%def name="css()">
 <link rel="stylesheet" href="/css/monoblue_custom.css" type="text/css" />
 </%def>
 
 <%def name="js()">
 <script type="text/javascript" src="/js/yui/utilities/utilities.js"></script>
 </%def>
 
 <!-- DEFINITION OF FORM ERROR FETCHER -->
 <%def name="get_form_error(element)">
 	%if hasattr(c,'form_errors') and type(c.form_errors) == dict:
         %if c.form_errors.get(element,False):
             <span class="error-message">
                 ${c.form_errors.get(element,'')}
             </span>
         %endif
 	%endif           
 </%def>
  No newline at end of file