Update russian translation. Need to subtract and to bring the terminology to a common denominator

release/server/docroot/css/reset.css

@@ -0,0 +1,46 @@
+html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
+{
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	font-weight: inherit;
+	font-style: inherit;
+	font-size: 100%;
+	font-family: inherit;
+	vertical-align: baseline;
+}
+/* remember to define focus styles! */
+:focus
+{
+	outline: 0;
+}
+body
+{
+	line-height: 1;
+	color: black;
+}
+ol, ul
+{
+	list-style: none;
+}
+/* tables still need 'cellspacing="0"' in the markup */
+table, td, tr
+{
+	border: 0;
+	border-collapse: separate;
+	border-spacing: 0;
+}
+caption, th, td
+{
+	text-align: left;
+	font-weight: normal;
+}
+blockquote:before, blockquote:after, q:before, q:after
+{
+	content: "";
+}
+blockquote, q
+{
+	quotes: "" "";
+}

release/server/docroot/css/styles_ipad.css

@@ -0,0 +1,466 @@
+body{
+	background-color: #F5F5F5;
+	font-family: Arial, Helvetica, sans-serif;
+}
+
+/* libraries */
+#contentLibraries{
+	width: 400px;
+	border: 1px solid #C6C6C6;
+	background-color: white;
+	margin-left: auto;
+	margin-right: auto;
+	margin-top: 9px;	
+}
+
+#contentLibraries .library-icon
+{
+	float: left;
+	background-color: white;
+	height: 18px;
+	padding: 11px 19px 10px 19px;
+		display:block;
+}
+
+#contentLibraries li
+{
+	border-bottom: 1px solid #e2e2e2;
+	position: relative;
+	list-style: none;
+}
+
+#contentLibraries li:last-child
+{
+	border: none;
+}
+
+#contentLibraries .library-link
+{
+	width: 311px;
+	height: 28px;
+	border: none;
+	padding: 11px 0 0 0px;
+	background-color: white;
+	display: block;
+	float:left;
+	font-family: Arial;
+	font-size: 16px; 
+	text-decoration: none;
+	color: #525252 ;
+	overflow: hidden;
+}
+
+ #contentLibraries a
+{
+	position: absolute;
+	height: 39px;
+	width: 100%;
+	z-index: 10;
+	display: block;
+	top 0;
+	text-decoration: none;
+}
+
+#contentLibraries .library-indicator
+{
+	float: left;
+	background-color: white;
+	height: 8px;
+	padding: 16px 16px 15px 16px;
+		display:block;
+}
+
+
+#content h1
+{
+	color: #292929;
+	text-align: center;
+	font-size: 21px;
+}
+
+#contentLibraries h1{
+	color: #292929;
+	text-align: center;
+	border-bottom: 1px solid #C6C6C6;
+	font-size: 21px;
+	padding: 15px 0 16px 0;
+}
+
+#folder-header
+{
+	position: fixed;
+	width: 100%;
+	height: 88px;
+	background-color: rgba(255,255,255,0.9);
+	border-bottom: 1px solid #C6C6C6;
+	z-index: 999;
+}
+
+#folder-subheader1
+{
+	width: 100%;
+	height: 40px;
+	margin-top: 18px;
+
+}
+
+#folder-subheader2
+{
+	width: 100%;
+	padding-left: 16px;
+}
+
+#topIndex
+{
+	position: absolute;
+	left: 16px;
+	top: 19px;
+}
+
+#topIndex a
+{
+	float: left;
+}
+
+.indicator {
+	margin: 0 9px;
+}
+
+.path {
+	text-decoration: none;
+	color: #5C5C5C;
+	font-family: Arial, Helvetica;
+	font-size: 15px;
+
+}
+
+#header-combos
+{
+	position: absolute;
+	right: 15px;
+	top: 15px;
+	color: #a3a3a3;
+	width: 160px;
+}
+
+#topIndex .next{
+	width: 25px;
+	height: 19px;
+	border: none;
+	margin: 0 21px 4px 0;
+	padding: 5px 0 0 0;
+	display: block;
+	background: url("/images/next.png") no-repeat scroll 0 0 transparent;
+	background-size: 25px 19px;
+	padding: 0;
+	text-indent: -99999px;
+}
+
+#topIndex .previous{
+	width: 25px;
+	height: 19px;
+	border: none;
+	margin: 0 14px 4px 0;
+	padding: 5px 0 0 0;
+	display: block;
+	background: url("/images/prev.png") no-repeat scroll 0 0 transparent;
+	background-size: 25px 19px;
+	padding: 0;
+	text-indent: -99999px;
+}
+
+#topIndex .up{
+	width: 15px;
+	height: 19px;
+	border: none;
+	background: url("/images/up.png") no-repeat scroll 0 0 transparent;
+	background-size: 15px 19px;
+	color: #FFF;
+	display: block;
+	text-indent: -99999px;	
+}
+
+#itemContainer li
+{
+float: left;
+width: 242px;
+height: 120px;
+border: 1px solid #E2E2E2;
+margin: 9px 9px 0px 0;
+background-color: white;
+overflow: hidden;
+position: relative;
+}
+
+.folderContent
+{
+	padding-top: 90px;
+	padding-left: 9px;
+}
+/* hasta aquí */
+
+.folder
+{
+float: left;
+
+}
+
+.cover
+{
+float: left;
+overflow: hidden;
+}
+
+.mark
+{
+	position: absolute;
+	top: 0px;
+	margin-left: 55px;
+}
+
+.info
+{
+padding: 8px 0px 0px 0px;
+float: left;
+position: relative;
+height: 115px;
+width: 158px;
+
+}
+
+.buttons
+{
+	position:absolute;
+	bottom:0px;
+	left:0px;
+	border-top: 1px solid #e2e2e2;
+	padding-top: 3px;
+	height: 25px;
+	width: 162px;
+	font-family: Arial;
+	color: #6e6e6e;
+	font-size: 10px;
+}
+
+.elementInfo
+{
+	position:absolute;
+	bottom:24px;
+	padding-top: 3px;
+	height: 25px;
+	width: 162px;
+	font-family: Arial;
+	color: #adadad;
+	font-size: 10px;
+}
+
+.numPages
+{
+	float: left;
+	padding-left:8px;
+}
+
+.comicSize
+{
+	float: right;
+	padding-right: 9px;
+}
+
+
+
+#itemContainer a
+{
+	text-decoration: none;
+
+	
+}
+
+.browseButton
+{
+	width: 60px;
+	background: url("/images/browse.png") no-repeat scroll 0 0 transparent;
+	background-position: 1px 6px;
+	background-size: 7px 7px;
+	border: none;
+	text-align:right;
+	display: block;
+	float: right;
+	padding: 4px 10px 0 0;
+	color: #6e6e6e;
+}
+
+.importButton
+{
+	width: 60px;
+	background: url("/images/download.png") no-repeat scroll 0 0 transparent;
+	background-position: 3px 5px;
+	background-size: 7px 8px;
+	border: none;
+	text-align:left;
+	display: block;
+	float: left;
+	margin: 0 0 0 4px;
+	padding: 4px 0 0 16px;
+	color: #6e6e6e;
+}
+
+.readButton
+{
+	width: 60px;
+	background: url("/images/read.png") no-repeat scroll 0 0 transparent;
+	background-position: 18px 5px;
+	background-size: 7px 9px;
+	border: none;
+	text-align:right;
+	display: block;
+	float: right;
+	padding: 4px 10px 0 0;
+	color: #6e6e6e;
+}
+
+.importedButton
+{
+	width: 60px;
+	background: url("/images/imported.png") no-repeat scroll 0 0 transparent;
+	background-position: 2px 6px;
+	background-size: 8px 6px;
+	border: none;
+	text-align:left;
+	display: block;
+	float: left;
+	margin: 0 0 0 4px;
+	padding: 4px 0 0 16px;
+	color: #6e6e6e;
+}
+
+
+#indexes{
+	border-top: 1px solid #C6C6C6;
+	background-color: white;
+	padding: 0px;
+	margin: 9px 0 0 0;
+}
+
+.index{
+	background-color: white;
+	margin: 9px 0 9px 0;
+}
+
+
+#alphaIndex a, #pageIndex a{
+	width: 29px;
+	height: 24px;
+	border: none;
+	margin: 0 0 9px 9px;
+	padding: 5px 0 0 0px;
+	color: #5C5C5C;
+	font-size: 20px;
+	text-align: center;
+	display: block;
+	text-decoration: none;
+	font-family: Arial;
+	border: 1px solid #E2E2E2;
+	text-align:center;
+}
+
+#alphaIndex li, #pageIndex li{
+	float: left;
+}
+
+#pageIndex .current{
+	color: white;
+	background-color: #A2A2A2;
+	border: 1px solid #A2A2A2;
+
+}
+
+	#content h2, #contentLibraries h2{
+		color: #000;
+		font-weight: bold;
+		font-size: 12px;
+		margin: 0 0 16px 0;
+	}
+	
+	.inputs_login{
+		width: 256px;
+		height: 64px;
+		background: url("/images/fnd_inputs.jpg") no-repeat scroll 0 0 #FFF;
+		margin: 0 0 18px 0;
+	}
+		.username{
+			width: 200px;
+			height: 24px;
+			background: url("/images/fnd_input_username.jpg") no-repeat scroll 0 0 #2b2b2b;
+			border: none;
+			padding: 0 0 0 44px;
+			margin: 5px 0 6px 8px;
+			font-size: 14px;
+			color: #6e6e6e;
+		}
+		.pass{
+			width: 200px;
+			height: 24px;
+			background: url("/images/fnd_input_pass.jpg") no-repeat scroll 0 0 #2b2b2b;
+			border: none;
+			padding: 0 0 0 44px;
+			margin: 0 0 0 8px;
+			font-size: 14px;
+			color: #6e6e6e;
+		}
+		.button_sign{
+			width: 86px;
+			height: 30px;
+			background: url("/images/bt_login.jpg") no-repeat scroll 0 0 transparent;
+			border: none;
+			margin: 0;
+			padding: 0;
+			color: #FFF;
+			font-size: 14px;
+			float: left;
+		}
+		.infor{
+			color: #666;
+			font-size: 8px;
+			float: left;
+			width: 112px;
+			margin: 0 0 0 8px;
+			line-height: 120%;
+		}
+
+.clear{
+	height: 2px;
+	clear: both;
+}
+
+.title{
+	font-family: Arial;
+	font-size: 12px;
+	margin: 0 0 0 6px;
+	color: #555555                                                                     ;
+	overflow: hidden;
+	word-wrap: break-word;
+	height: 80px;
+		text-decoration: none;
+}
+
+#indexalpha, #indexnumber{
+
+    -webkit-appearance: none;
+    background-color: rgba(255,255,255,0);
+    border-radius: 0px;
+    border: none;
+    color: #a3a3a3;
+    font-size: 16px;
+    font-family: Arial, Helvetica;
+    height: 30px;
+    margin: 0 0 0 10px;
+    padding:0;
+   	float: right;
+}
+
+.comboIndicator {
+	float: right;
+	padding: 14px 0 0 0;
+	margin: 0 0 0 4px;
+	width: 5px;
+}

release/server/docroot/css/styles_iphone.css

@@ -0,0 +1,463 @@
+body{
+	background-color: #F5F5F5;
+	font-family: Arial, Helvetica, sans-serif;
+}
+
+/* libraries */
+#contentLibraries{
+	border: 1px solid #C6C6C6;
+	background-color: white;
+	margin-left: 20px;
+	margin-right: 20px;
+	margin-top: 9px;	
+}
+
+#contentLibraries .library-icon
+{
+	float: left;
+	background-color: white;
+	height: 18px;
+	padding: 11px 19px 10px 19px;
+		display:block;
+}
+
+#contentLibraries li
+{
+	border-bottom: 1px solid #e2e2e2;
+	position: relative;
+	list-style: none;
+}
+
+#contentLibraries li:last-child
+{
+	border: none;
+}
+
+#contentLibraries .library-link
+{
+	width: 65%;
+	height: 28px;
+	border: none;
+	padding: 11px 0 0 0px;
+	background-color: white;
+	display: block;
+	float:left;
+	font-family: Arial;
+	font-size: 16px; 
+	text-decoration: none;
+	color: #525252 ;
+	overflow: hidden;
+}
+
+ #contentLibraries a
+{
+	position: absolute;
+	height: 39px;
+	width: 100%;
+	z-index: 10;
+	display: block;
+	top 0;
+	text-decoration: none;
+}
+
+#contentLibraries .library-indicator
+{
+	float: right;
+	background-color: white;
+	height: 8px;
+	padding: 16px 16px 15px 16px;
+		display:block;
+}
+
+
+#content h1
+{
+	color: #292929;
+	text-align: center;
+	font-size: 21px;
+}
+
+#contentLibraries h1{
+	color: #292929;
+	text-align: center;
+	border-bottom: 1px solid #C6C6C6;
+	font-size: 21px;
+	padding: 15px 0 16px 0;
+}
+
+#folder-header
+{
+	position: fixed;
+	width: 100%;
+	height: 88px;
+	background-color: rgba(255,255,255,0.9);
+	border-bottom: 1px solid #C6C6C6;
+	z-index: 999;
+}
+
+#folder-subheader1
+{
+	width: 100%;
+	height: 40px;
+	margin-top: 18px;
+
+}
+
+#folder-subheader2
+{
+	width: 100%;
+	padding-left: 16px;
+}
+
+#topIndex
+{
+	position: absolute;
+	left: 16px;
+	top: 19px;
+}
+
+#topIndex a
+{
+	float: left;
+}
+
+.indicator {
+	margin: 0 5px;
+}
+
+.path {
+	text-decoration: none;
+	color: #5C5C5C;
+	font-family: Arial, Helvetica;
+	font-size: 15px;
+
+}
+
+#header-combos
+{
+	position: absolute;
+	right: 10px;
+	top: 15px;
+	color: #a3a3a3;
+	width: 160px;
+}
+
+#topIndex .next{
+	width: 25px;
+	height: 19px;
+	border: none;
+	margin: 0 21px 4px 0;
+	padding: 5px 0 0 0;
+	display: block;
+	background: url("/images/next.png") no-repeat scroll 0 0 transparent;
+	background-size: 25px 19px;
+	padding: 0;
+	text-indent: -99999px;
+}
+
+#topIndex .previous{
+	width: 25px;
+	height: 19px;
+	border: none;
+	margin: 0 14px 4px 0;
+	padding: 5px 0 0 0;
+	display: block;
+	background: url("/images/prev.png") no-repeat scroll 0 0 transparent;
+	background-size: 25px 19px;
+	padding: 0;
+	text-indent: -99999px;
+}
+
+#topIndex .up{
+	width: 15px;
+	height: 19px;
+	border: none;
+	background: url("/images/up.png") no-repeat scroll 0 0 transparent;
+	background-size: 15px 19px;
+	color: #FFF;
+	display: block;
+	text-indent: -99999px;	
+}
+
+#itemContainer li
+{
+
+height: 120px;
+border: 1px solid #E2E2E2;
+margin: 9px 10px 0px 10px;
+background-color: white;
+overflow: hidden;
+position: relative;
+}
+
+.folderContent
+{
+	padding-top: 90px;
+}
+/* hasta aquí */
+
+.folder
+{
+float: left;
+
+}
+
+.cover
+{
+float: left;
+overflow: hidden;
+}
+
+.mark
+{
+	position: absolute;
+	top: 0px;
+	margin-left: 55px;
+}
+
+.info
+{
+padding: 8px 0px 0px 0px;
+
+position: relative;
+height: 115px;
+
+padding-left: 82px;
+}
+
+.buttons
+{
+	position:absolute;
+	bottom:0px;
+	left:80px;
+	right: 0px;
+	border-top: 1px solid #e2e2e2;
+	padding-top: 3px;
+	height: 25px;
+	font-family: Arial;
+	color: #6e6e6e;
+	font-size: 10px;
+}
+
+.elementInfo
+{
+	position:absolute;
+	bottom:24px;
+	padding-top: 3px;
+	height: 25px;
+	width: 100%;
+	font-family: Arial;
+	color: #adadad;
+	font-size: 10px;
+}
+
+.numPages
+{
+	float: left;
+	padding-left:8px;
+}
+
+.comicSize
+{
+	float: right;
+	padding-right: 9px;
+}
+
+
+
+#itemContainer a
+{
+	text-decoration: none;
+
+	
+}
+
+.browseButton
+{
+	width: 60px;
+	background: url("/images/browse.png") no-repeat scroll 0 0 transparent;
+	background-position: 1px 6px;
+	background-size: 7px 7px;
+	border: none;
+	text-align:right;
+	display: block;
+	float: right;
+	padding: 4px 10px 0 0;
+	color: #6e6e6e;
+}
+
+.importButton
+{
+	width: 60px;
+	background: url("/images/download.png") no-repeat scroll 0 0 transparent;
+	background-position: 3px 5px;
+	background-size: 7px 8px;
+	border: none;
+	text-align:left;
+	display: block;
+	float: left;
+	margin: 0 0 0 4px;
+	padding: 4px 0 0 16px;
+	color: #6e6e6e;
+}
+
+.readButton
+{
+	width: 60px;
+	background: url("/images/read.png") no-repeat scroll 0 0 transparent;
+	background-position: 18px 5px;
+	background-size: 7px 9px;
+	border: none;
+	text-align:right;
+	display: block;
+	float: right;
+	padding: 4px 10px 0 0;
+	color: #6e6e6e;
+}
+
+.importedButton
+{
+	width: 60px;
+	background: url("/images/imported.png") no-repeat scroll 0 0 transparent;
+	background-position: 2px 6px;
+	background-size: 8px 6px;
+	border: none;
+	text-align:left;
+	display: block;
+	float: left;
+	margin: 0 0 0 4px;
+	padding: 4px 0 0 16px;
+	color: #6e6e6e;
+}
+
+
+#indexes{
+	border-top: 1px solid #C6C6C6;
+	background-color: white;
+	padding: 0px;
+	margin: 9px 0 0 0;
+}
+
+.index{
+	background-color: white;
+	margin: 9px 0 9px 0;
+}
+
+
+#alphaIndex a, #pageIndex a{
+	width: 29px;
+	height: 24px;
+	border: none;
+	margin: 0 0 9px 9px;
+	padding: 5px 0 0 0px;
+	color: #5C5C5C;
+	font-size: 20px;
+	text-align: center;
+	display: block;
+	text-decoration: none;
+	font-family: Arial;
+	border: 1px solid #E2E2E2;
+	text-align:center;
+}
+
+#alphaIndex li, #pageIndex li{
+	float: left;
+}
+
+#pageIndex .current{
+	color: white;
+	background-color: #A2A2A2;
+	border: 1px solid #A2A2A2;
+
+}
+
+	#content h2, #contentLibraries h2{
+		color: #000;
+		font-weight: bold;
+		font-size: 12px;
+		margin: 0 0 16px 0;
+	}
+	
+	.inputs_login{
+		width: 256px;
+		height: 64px;
+		background: url("/images/fnd_inputs.jpg") no-repeat scroll 0 0 #FFF;
+		margin: 0 0 18px 0;
+	}
+		.username{
+			width: 200px;
+			height: 24px;
+			background: url("/images/fnd_input_username.jpg") no-repeat scroll 0 0 #2b2b2b;
+			border: none;
+			padding: 0 0 0 44px;
+			margin: 5px 0 6px 8px;
+			font-size: 14px;
+			color: #6e6e6e;
+		}
+		.pass{
+			width: 200px;
+			height: 24px;
+			background: url("/images/fnd_input_pass.jpg") no-repeat scroll 0 0 #2b2b2b;
+			border: none;
+			padding: 0 0 0 44px;
+			margin: 0 0 0 8px;
+			font-size: 14px;
+			color: #6e6e6e;
+		}
+		.button_sign{
+			width: 86px;
+			height: 30px;
+			background: url("/images/bt_login.jpg") no-repeat scroll 0 0 transparent;
+			border: none;
+			margin: 0;
+			padding: 0;
+			color: #FFF;
+			font-size: 14px;
+			float: left;
+		}
+		.infor{
+			color: #666;
+			font-size: 8px;
+			float: left;
+			width: 112px;
+			margin: 0 0 0 8px;
+			line-height: 120%;
+		}
+
+.clear{
+	height: 2px;
+	clear: both;
+}
+
+.title{
+	font-family: Arial;
+	font-size: 12px;
+	margin: 0 0 0 6px;
+	color: #555555                                                                     ;
+	overflow: hidden;
+	word-wrap: break-word;
+	height: 65px;
+	text-decoration: none;
+}
+
+#indexalpha, #indexnumber{
+
+    -webkit-appearance: none;
+    background-color: rgba(255,255,255,0);
+    border-radius: 0px;
+    border: none;
+    color: #a3a3a3;
+    font-size: 16px;
+    font-family: Arial, Helvetica;
+    height: 30px;
+    margin: 0 0 0 10px;
+    padding:0;
+   	float: right;
+}
+
+.comboIndicator {
+	float: right;
+	padding: 14px 0 0 0;
+	margin: 0 0 0 4px;
+	width: 5px;
+}

release/server/docroot/login.html

@@ -0,0 +1,26 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>	
+	<link rel="stylesheet" href="css/reset.css" type="text/css" />
+	<link rel="stylesheet" href="css/styles.css" type="text/css" />
+	<title>Login</title>	
+</head>
+<body>
+	<div id="content">
+		
+		<h1>LOGIN</h1>
+		<h2>YACREADER LIBRARY</h2>
+		
+		<form>
+			<div class="inputs_login">
+				<input type="text" class="username" value="username" name="username" />
+				<input type="text" class="pass" value="password" name="pass" />
+			</div>
+			<input class="button_sign" type="submit" value="Sign in" />
+			<p class="infor">If you have forgotten your login information, please reset it on the YACReaderLibrary</p>
+			<div class="clear">&nbsp;</div>			
+		</form>				
+	</div>
+	<div class="sombra">&nbsp;</div>
+</body>
+</html>

release/server/templates/folder_ipad.tpl

@@ -0,0 +1,115 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+	<link rel="stylesheet" href="/css/reset.css" type="text/css" />
+	<link rel="stylesheet" href="/css/styles.css" type="text/css" />
+	<title>Folder</title>	
+</head>
+<body>
+	<div id="content">
+		<div>
+
+			<div id="folder-header">
+				<div id="topIndex">  {if pageIndex} <a class="previous" href="{page.previous}">previous</a> <a class="next" href="{page.next}">next</a> {end pageIndex} <a class="up" href="{upurl}">up</a>  </div>
+
+
+				<div id="folder-subheader1">
+					<h1>{folder.name}</h1>
+				</div>
+
+				<div id ="folder-subheader2">
+					<a class="path" href="/">Libraries</a> <img class="indicator" src="/images/indicator.png" style="width: 5px"/> <a class="path" href="{library.url}">{library.name}</a> {loop path}  <img class="indicator" src="/images/indicator.png" style="width: 5px"/> <a class="path" href="{path.url}">{path.name}</a> {end path} 
+				</div>
+				<div id ="header-combos">
+					{if pageIndex}
+						<img class="comboIndicator" src="/images/combo.png"/>
+						<select name="indexnumber" id="indexnumber" onchange="navigateTo(this, 'window', false);">
+							<option value="" disabled selected>{page}/{pages}</option>
+							{loop page}
+							<option value="{page.url}">{page.number}</option>
+							{end page}
+						</select>
+					{end pageIndex}
+
+					{if alphaIndex}
+						<img class="comboIndicator" src="/images/combo.png"/>
+						<select name="indexalpha" id="indexalpha" onchange="navigateTo(this, 'window', false);">
+							<option value="" disabled selected>index</option>
+							{loop index}
+							<option value="{index.url}">{index.indexname}</option>
+							{end index}
+						</select>
+					{end alphaIndex}
+
+				</div>
+			</div>
+
+			<!--<a href="javascript:javascript:history.go(-1)">up</a>-->
+			<div class="folderContent">
+				<ul id="itemContainer">
+					{loop element}
+					<li>
+						<div class="{element.class}">
+							{element.cover.browse} <img style="width: 80px" src="{element.image.url}"/> {element.cover.browse.end}
+						</div> 
+						<div class="info"> 
+							<div class="title"><p>{element.name}</p> 
+							</div>
+							<div class="elementInfo"> {element.pages} {element.size} 
+							</div>
+							<div class="buttons"> {element.download} {element.read} {element.browse}  
+							</div>
+						</div>
+						{element.status}
+					</li>
+					{end element}
+				</ul>
+				<div class="clear">&nbsp;</div>
+			</div>
+		</div>
+
+		{if index}
+		<div id="indexes">
+		{if alphaIndex}
+
+		<div class="index">
+			<ul id="alphaIndex">
+				{loop index} 
+
+				<li>  <a href="{index.url}"> {index.indexname} </a> </li>
+
+				{end index}
+			</ul>
+			<div class="clear">&nbsp;</div>
+		</div>
+
+		{end alphaIndex}
+
+
+		{if pageIndex}
+
+		<div class="index">
+			<ul id="pageIndex">
+<!--				<li> <a class="first" href="{page.first}">first</a> </li>
+				<li> <a class="previous" href="{page.previous}">previous</a> </li>-->
+
+				{loop page} <li>  <a class="{page.current}" href="{page.url}"> {page.number} </a> </li> {end page} 
+
+<!--				<li> <a class="next" href="{page.next}">next</a> </li>
+				<li> <a class="last" href="{page.last}">last</a> </li>-->
+			</ul>
+			<div class="clear">&nbsp;</div>
+		</div>
+		{end pageIndex}
+		</div>
+		{end index}
+
+		<script type="text/javascript">
+		function navigateTo(sel, target) {
+		    window[target].location.href = sel.options[sel.selectedIndex].value;
+		}
+		</script>
+
+	</body>
+	</html>

release/server/templates/folder_iphone.tpl

@@ -0,0 +1,114 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+	<link rel="stylesheet" href="/css/reset.css" type="text/css" />
+	<link rel="stylesheet" href="/css/styles.css" type="text/css" />
+	<title>Folder</title>	
+</head>
+<body>
+	<div id="content">
+		<div>
+
+			<div id="folder-header">
+				<div id="topIndex">  {if pageIndex} <a class="previous" href="{page.previous}">previous</a> <a class="next" href="{page.next}">next</a> {end pageIndex} <a class="up" href="{upurl}">up</a>  </div>
+
+
+				<div id="folder-subheader1">
+				</div>
+
+				<div id ="folder-subheader2">
+					<a class="path" href="/">Libraries</a> <!--<img class="indicator" src="/images/indicator.png" style="width: 5px"/> <a class="path" href="{library.url}">{library.name}</a> -->{loop path}  <img class="indicator" src="/images/indicator.png" style="width: 5px"/> <a class="path" href="{path.url}">{path.name}</a> {end path} 
+				</div>
+				<div id ="header-combos">
+					{if pageIndex}
+						<img class="comboIndicator" src="/images/combo.png"/>
+						<select name="indexnumber" id="indexnumber" onchange="navigateTo(this, 'window', false);">
+							<option value="" disabled selected>{page}/{pages}</option>
+							{loop page}
+							<option value="{page.url}">{page.number}</option>
+							{end page}
+						</select>
+					{end pageIndex}
+
+					{if alphaIndex}
+						<img class="comboIndicator" src="/images/combo.png"/>
+						<select name="indexalpha" id="indexalpha" onchange="navigateTo(this, 'window', false);">
+							<option value="" disabled selected>index</option>
+							{loop index}
+							<option value="{index.url}">{index.indexname}</option>
+							{end index}
+						</select>
+					{end alphaIndex}
+
+				</div>
+			</div>
+
+			<!--<a href="javascript:javascript:history.go(-1)">up</a>-->
+			<div class="folderContent">
+				<ul id="itemContainer">
+					{loop element}
+					<li>
+						<div class="{element.class}">
+							{element.cover.browse} <img style="width: 80px" src="{element.image.url}"/> {element.cover.browse.end}
+						</div> 
+						<div class="info"> 
+							<div class="title"><p>{element.name}</p> 
+							</div>
+							<div class="elementInfo"> {element.pages} {element.size} 
+							</div>
+							<div class="buttons"> {element.download} {element.read} {element.browse}  
+							</div>
+						</div>
+						{element.status}
+					</li>
+					{end element}
+				</ul>
+				<div class="clear">&nbsp;</div>
+			</div>
+		</div>
+
+		{if index}
+		<div id="indexes">
+		{if alphaIndex}
+
+		<div class="index">
+			<ul id="alphaIndex">
+				{loop index} 
+
+				<li>  <a href="{index.url}"> {index.indexname} </a> </li>
+
+				{end index}
+			</ul>
+			<div class="clear">&nbsp;</div>
+		</div>
+
+		{end alphaIndex}
+
+
+		{if pageIndex}
+
+		<div class="index">
+			<ul id="pageIndex">
+<!--				<li> <a class="first" href="{page.first}">first</a> </li>
+				<li> <a class="previous" href="{page.previous}">previous</a> </li>-->
+
+				{loop page} <li>  <a class="{page.current}" href="{page.url}"> {page.number} </a> </li> {end page} 
+
+<!--				<li> <a class="next" href="{page.next}">next</a> </li>
+				<li> <a class="last" href="{page.last}">last</a> </li>-->
+			</ul>
+			<div class="clear">&nbsp;</div>
+		</div>
+		{end pageIndex}
+		</div>
+		{end index}
+
+		<script type="text/javascript">
+		function navigateTo(sel, target) {
+		    window[target].location.href = sel.options[sel.selectedIndex].value;
+		}
+		</script>
+
+	</body>
+	</html>

release/server/templates/libraries_ipad.tpl

@@ -0,0 +1,27 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />	
+	<link rel="stylesheet" href="/css/reset.css" type="text/css" />
+	<link rel="stylesheet" href="/css/styles.css" type="text/css" />
+	<title>Libraries</title>	
+</head>
+<body>
+	<div id="contentLibraries">
+		<h1>Libraries</h1>
+		<p>
+			<ul id="librariesList"> 
+				{loop library}
+					<li>
+					<div class="library-icon"> <img width="14px" height="18px" src="../images/library.png" /> </div>
+					<div class="library-link"> {library.label} </div>
+					<div class="library-indicator"> <img width="5px" height="9px" src="../images/indicator.png" /> </div>
+					<a href="/library/{library.name}/folder/1">&nbsp;</a>
+					<div class="clear">&nbsp;</div>
+					</li>
+				{end library}
+			</ul>
+		</p>
+	</div>
+	</body>
+</html>

release/server/templates/libraries_iphone.tpl

@@ -0,0 +1,27 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />	
+	<link rel="stylesheet" href="/css/reset.css" type="text/css" />
+	<link rel="stylesheet" href="/css/styles.css" type="text/css" />
+	<title>Libraries</title>	
+</head>
+<body>
+	<div id="contentLibraries">
+		<h1>Libraries</h1>
+		<p>
+			<ul id="librariesList"> 
+				{loop library}
+					<li>
+					<div class="library-icon"> <img width="14px" height="18px" src="../images/library.png" /> </div>
+					<div class="library-link"> {library.label} </div>
+					<div class="library-indicator"> <img width="5px" height="9px" src="../images/indicator.png" /> </div>
+					<a href="/library/{library.name}/folder/1">&nbsp;</a>
+					<div class="clear">&nbsp;</div>
+					</li>
+				{end library}
+			</ul>
+		</p>
+	</div>
+	</body>
+</html>