Merge branch 'master' into filesystem

14 files changed, 806 insertions, 13 deletions

diff --git a/reader/ajax/canvas_saver.php b/reader/ajax/canvas_saver.php
index 78fa5b5ac..6c8f9e217 100644
--- a/reader/ajax/canvas_saver.php
+++ b/reader/ajax/canvas_saver.php
@@ -11,7 +11,7 @@
 	$save_dir = OCP\Config::getSystemValue("datadirectory").'/'. $owner .'/reader';	
     $save_dir .= $location;
 	$thumb_file = $save_dir . $title;
-	if (!is_dir($save_dir)) {
+	if (!is_dir($save_dir)) {		
 		mkdir($save_dir, 0777, true);
 	}
 	$image = new OC_Image($filteredData);
diff --git a/reader/appinfo/app.php b/reader/appinfo/app.php
index 506cd34e6..fd55a8755 100755
--- a/reader/appinfo/app.php
+++ b/reader/appinfo/app.php
@@ -1,4 +1,6 @@
 <?php
+OC::$CLASSPATH['OC_ReaderSearchProvider'] = 'apps/reader/lib/search.php';
+
 OCP\App::register(array(
   'order' => 20,
   'id' => 'reader',
@@ -10,5 +12,8 @@ OCP\App::addNavigationEntry( array(
  'href' => OCP\Util::linkTo('reader', 'index.php'),
  'icon' => OCP\Util::imagePath( 'reader', 'reader.png' ),
  'name'=>'Reader'));
+ 
+OC_Search::registerProvider('OC_ReaderSearchProvider');
 
 
+?>
diff --git a/reader/css/reader.css b/reader/css/reader.css
index 8edfbd55a..69a08285f 100644
--- a/reader/css/reader.css
+++ b/reader/css/reader.css
@@ -1,12 +1,13 @@
-div#controls{z-index:1000;}
-
+div#controls{z-index:60;}
 div.crumb { float:left; display:block; background:no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em;}
 div.crumb:first-child { padding-left:1em; }
 div.crumb.last { font-weight:bold; }
 
-table { white-space:normal; position:absolute; top:40px; left:5px;font-family:Arial;}
+table#readerContent { white-space:normal; position:absolute; top:40px; left:5px;font-family:Arial;}
 
-tbody tr { background:white; float:left; height:150px;font-size:12px;}
+table { position:relative; top:7px; width:100%;}
+tbody tr { background-color:#fff; height:2.5em;}
+tbody#fileList tr { background:white; float:left; height:150px;font-size:12px;}
 tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#ffffff; }
 	
 .thumbnail:not([data-loaded]) { background-color: white; }
diff --git a/reader/index.php b/reader/index.php
index 4fa3801ab..b8358433c 100755
--- a/reader/index.php
+++ b/reader/index.php
@@ -21,4 +21,5 @@ $dir = empty($_GET['dir'])?'/':$_GET['dir'];
 $tmpl = new OCP\Template( 'reader', 'index', 'user' );
 $tmpl->assign('dir', $dir);
 $tmpl->printPage();
+
 ?>
diff --git a/reader/js/.goutputstream-7F73MW b/reader/js/.goutputstream-7F73MW
new file mode 100755
index 000000000..65672461e
--- /dev/null
+++ b/reader/js/.goutputstream-7F73MW
@@ -0,0 +1,218 @@
+$(document).ready(function() {
+	$('#fileList tr').each(function(){
+		// data-file attribute to contain unescaped filenames.
+		$(this).attr('data-file',decodeURIComponent($(this).attr('data-file')));
+	});
+	
+	$('#file_action_panel').attr('activeAction', false);
+	/*$('table').ready(function(){
+		$('a.name').each(function(){
+		*/     
+		/*});
+	});*/
+});	
+
+      
+
+
+
+$(function() {
+	// See if url conatins the index 'reader'
+	if(location.href.indexOf("reader")!=-1) {
+		'use strict';
+		// create thumbnails for pdfs inside current directory.
+		create_thumbnails();
+
+		// Render pdf view on every click of a thumbnail, now and in future.
+		$('td.filename a').live('click',function(event) {
+			event.preventDefault();
+			var filename=$(this).parent().parent().attr('data-file');
+			var tr=$('tr').filterAttr('data-file',filename);
+			var mime=$(this).parent().parent().data('mime');
+			var type=$(this).parent().parent().data('type');
+			// Check if clicked link is a pdf file or a directory, perform suitable function.
+			var action=getAction(mime,type);
+			if(action){
+				action(filename);
+			}
+		});
+		// Generate thumbnails for folders.
+		create_folder_thumbnails();
+		
+		// On close of the pdf viewer, reload the page.
+		$('#close').live('click',function(event) {
+			location.reload();
+		});
+		// On hover over pdf thumbnails, their title should show.
+		$('a.name').hover(function(){
+			if($(this).children().hasClass('title'))
+				$(this).children().addClass('visible');
+		});
+		$('a.name').mouseleave(function(){
+			if($(this).children().hasClass('title'))
+				$(this).children().removeClass('visible');
+		});
+		
+		/*$('#thumbnail').live('hover',function(event){
+		  var canvas1 = document.getElementById("thumbnail");
+          if (canvas1.getContext) {
+              var ctx = canvas1.getContext("2d");                // Get the context for the canvas.
+              var myImage = canvas1.toDataURL("image/png");      // Get the data as an image.
+          }
+          var imageElement = document.getElementById("theimage");  // Get the img object.
+          imageElement.src = myImage;                           // Set the src to data from the canvas.
+
+		});*/
+	}
+});
+
+/* Function that returns suitable function definition to be executed on 
+ * click of the file whose mime and type are passed. */
+function getAction(mime,type) {
+	var name;
+	if(mime == 'application/pdf') {
+		name = function (filename){
+			showPDFviewer($('#dir').val(),filename);
+		}
+	}
+	else {
+		name = function (filename){
+			window.location=OC.linkTo('reader', 'index.php') + '&dir='+
+			encodeURIComponent($('#dir').val()).replace(/%2F/g, '/')+'/'+
+			encodeURIComponent(filename) + '/';
+		}
+	}
+	return name;
+}
+
+function create_thumbnails() {
+	PDFJS.disableWorker = true;
+		$('td.filename a').each(function() {
+			// Get url and title of each pdf file from anchor tags.
+			var url = $(this).attr('href');
+			var title = $(this).parent().parent().attr('data-file');
+			if (url.indexOf('pdf') != -1) {
+				PDFJS.getDocument(url).then(function(pdf) {
+				// Using promise to fetch the page
+					pdf.getPage(1).then(function(page) {
+						var scale = 0.2;
+						var viewport = page.getViewport(scale);
+						
+						/*var div = document.createElement('div');
+						div.id = 'thumbnailContainer';
+						div.className = 'thumbnail';
+						var anchor = document.getElementById(url);*/
+						// Create canvas elements for each pdf's first page.
+						var canvas = document.createElement("canvas");
+						canvas.id = 'thumbnail';
+						
+						// Canvas elements should be of proper size, not too big, not too small. 
+						if (viewport.height > 170 || viewport.width > 130) {
+							scale = 0.1;
+						}
+						else if (viewport.height < 129 || viewport.width < 86) {
+							scale = 0.3;
+						}
+						
+						viewport = page.getViewport(scale);
+						canvas.height = viewport.height;
+						canvas.width = viewport.width;
+
+						/*div.style.height = canvas.height + 'px';
+						div.style.width = canvas.width + 'px';
+						div.appendChild(canvas);
+						anchor.appendChild(div);
+						
+						var title_div = document.createElement('div');
+						title_div.className = 'title';
+						title_div.innerHTML = title;
+						anchor.appendChild(title_div);*/
+						
+						var ctx = canvas.getContext('2d');
+						ctx.save();
+						ctx.fillStyle = 'rgb(255, 255, 255)';
+						ctx.fillRect(0, 0, canvas.width, canvas.height);
+						ctx.restore(); 
+						
+						var view = page.view;
+						var scaleX = (canvas.width / page.width);
+						var scaleY = (canvas.height / page.height);
+						ctx.translate(-view.x * scaleX, -view.y * scaleY);
+					
+					// Render PDF page into canvas context
+						var renderContext = {
+							canvasContext: ctx,
+							viewport: viewport
+						};
+						page.render(renderContext);
+						alert('yoto'); 
+					});
+				});
+			}
+		});
+}
+
+// Function to create thumbnails for folders.
+function create_folder_thumbnails() {
+	$('a.dirs input').each(function() {
+		// fetch margin, url and and directory name values for each pdf, stored in input tags.
+			var margin = $(this).attr('name');
+			var pdf_dir = $(this).attr('value');
+			var url = $(this).attr('id');
+			
+			PDFJS.getDocument(url).then(function(pdf) {
+				// Using promise to fetch the page
+					pdf.getPage(1).then(function(page) {
+						var scale = 0.3;
+						var viewport = page.getViewport(scale);
+					
+						// Prepare canvas using PDF page dimensions
+						var anchor = document.getElementById(pdf_dir);
+			
+						var canvas = document.createElement("canvas");
+						canvas.id = "dirsCanvas";
+						// Each thumbnail in the 3-thumbnail set should be of same dimensions.
+						canvas.height = '168';
+						canvas.width = '120';
+						// Canvases should be on top of each other
+						$(canvas).css('z-index',100 - margin);
+						$(canvas).css('margin-left', margin  + 'px');
+						$(canvas).css('-webkit-backface-visibility', 'visible');
+						$(canvas).css('-webkit-transform-origin', '0% 51%');
+						$(canvas).css('-webkit-transform',' perspective(' + margin*35 + 'px) rotateY(23deg)');
+				
+						anchor.appendChild(canvas);
+
+						var ctx = canvas.getContext('2d');
+						ctx.save();
+						ctx.fillStyle = 'rgb(255, 255, 255)';
+						ctx.fillRect(0, 0, canvas.width, canvas.height);
+						ctx.restore();
+    
+						var view = page.view;
+						var scaleX = (canvas.width / page.width);
+						var scaleY = (canvas.height / page.height);
+						ctx.translate(-view.x * scaleX, -view.y * scaleY);
+					
+						// Render PDF page into canvas context
+					
+						var renderContext = {
+							canvasContext: ctx,
+							viewport: viewport
+						};
+						page.render(renderContext);
+					});
+			});
+	});
+}
+
+window.onload = function(){
+	var canvas = document.getElementById("thumbnail");
+	//alert(canvas);
+	if (canvas.getContext) {
+       var ctx = canvas.getContext("2d"); 				
+	   var myImage = canvas.toDataURL("image/png");      // Get the data as an image.
+    }  
+	var imageElement = document.getElementById("theimage");  // Get the img object.
+	imageElement.src = myImage;
+}
diff --git a/reader/js/.goutputstream-H39LNW b/reader/js/.goutputstream-H39LNW
new file mode 100755
index 000000000..0d028f84d
--- /dev/null
+++ b/reader/js/.goutputstream-H39LNW
@@ -0,0 +1,189 @@
+$(document).ready(function() {
+	$('#fileList tr').each(function(){
+		// data-file attribute to contain unescaped filenames.
+		$(this).attr('data-file',decodeURIComponent($(this).attr('data-file')));
+	});
+	
+	$('#file_action_panel').attr('activeAction', false);
+});	
+
+$(function() {
+	// See if url conatins the index 'reader'
+	if(location.href.indexOf("reader")!=-1) {
+		'use strict';
+		// create thumbnails for pdfs inside current directory.
+		create_thumbnails();
+
+		// Render pdf view on every click of a thumbnail, now and in future.
+		$('td.filename a').live('click',function(event) {
+			event.preventDefault();
+			var filename=$(this).parent().parent().attr('data-file');
+			var tr=$('tr').filterAttr('data-file',filename);
+			var mime=$(this).parent().parent().data('mime');
+			var type=$(this).parent().parent().data('type');
+			// Check if clicked link is a pdf file or a directory, perform suitable function.
+			var action=getAction(mime,type);
+			if(action){
+				action(filename);
+			}
+		});
+		// Generate thumbnails for folders.
+		create_folder_thumbnails();
+
+		// On hover over pdf thumbnails, their title should show.
+		$('a.name').hover(function(){
+			if($(this).children().hasClass('title'))
+				$(this).children().addClass('visible');
+		});
+		$('a.name').mouseleave(function(){
+			if($(this).children().hasClass('title'))
+				$(this).children().removeClass('visible');
+		});
+	}
+});
+
+/* Function that returns suitable function definition to be executed on 
+ * click of the file whose mime and type are passed. */
+function getAction(mime,type) {
+	var name;
+	if(mime == 'application/pdf') {
+		name = function (filename){
+			showPDFviewer($('#dir').val(),filename);
+		}
+	}
+	else {
+		name = function (filename){
+			window.location=OC.linkTo('reader', 'index.php') + '&dir='+
+			encodeURIComponent($('#dir').val()).replace(/%2F/g, '/')+'/'+
+			encodeURIComponent(filename) + '/';
+		}
+	}
+	return name;
+}
+
+function create_thumbnails() {
+	PDFJS.disableWorker = true;
+		$('td.filename a').each(function() {
+			// Get url and title of each pdf file from anchor tags.
+			var url = $(this).attr('href');
+			var title = $(this).parent().parent().attr('data-file');
+			var location = $(this).attr('title');
+			check_thumbnail_exists(location,title);
+			
+		
+		
+			if (url.indexOf('pdf') != -1) {
+				PDFJS.getDocument(url).then(function(pdf) {
+				// Using promise to fetch the page
+					pdf.getPage(1).then(function(page) {
+						var scale = 0.2;
+						var viewport = page.getViewport(scale);
+						
+						// Create canvas elements for each pdf's first page.
+						var canvas = document.createElement("canvas");
+						
+						// Canvas elements should be of proper size, not too big, not too small. 
+						if (viewport.height > 170 || viewport.width > 130) {
+							scale = 0.1;
+						}
+						else if (viewport.height < 129 || viewport.width < 86) {
+							scale = 0.3;
+						}
+						
+						viewport = page.getViewport(scale);
+						canvas.height = viewport.height;
+						canvas.width = viewport.width;
+						
+						var ctx = canvas.getContext('2d');
+						ctx.save();
+						ctx.fillStyle = 'rgb(255, 255, 255)';
+						ctx.fillRect(0, 0, canvas.width, canvas.height);
+						ctx.restore(); 
+						
+						var view = page.view;
+						var scaleX = (canvas.width / page.width);
+						var scaleY = (canvas.height / page.height);
+						ctx.translate(-view.x * scaleX, -view.y * scaleY);
+					
+					// Render PDF page into canvas context
+						var renderContext = {
+							canvasContext: ctx,
+							viewport: viewport
+						};
+					
+						pageRendering = page.render(renderContext);
+						pageRendering.onData(function(){
+							var imageElement = document.getElementById(url);
+							imageElement.src = canvas.toDataURL();
+							canvasSaver(canvas,title,location);
+						});
+					});
+				});
+			}
+		});
+}
+
+// Function to create thumbnails for folders.
+function create_folder_thumbnails() {
+	$('a.dirs input').each(function() {
+		// fetch margin, url and and directory name values for each pdf, stored in input tags.
+			var margin = $(this).attr('name');
+			var pdf_dir = $(this).attr('value');
+			var url = $(this).attr('id');
+			
+			PDFJS.getDocument(url).then(function(pdf) {
+				// Using promise to fetch the page
+					pdf.getPage(1).then(function(page) {
+						var scale = 0.3;
+						var viewport = page.getViewport(scale);
+						
+						// Prepare canvas using PDF page dimensions
+						var anchor = document.getElementById(pdf_dir);
+			
+						var canvas = document.createElement("canvas");
+						canvas.id = "dirsCanvas";
+						// Each thumbnail in the 3-thumbnail set should be of same dimensions.
+						canvas.height = '168';
+						canvas.width = '120';
+						// Canvases should be on top of each other
+						$(canvas).css('z-index',100 - margin);
+						$(canvas).css('margin-left', margin  + 'px');
+						$(canvas).css('-webkit-backface-visibility', 'visible');
+						$(canvas).css('-webkit-transform-origin', '0% 51%');
+						$(canvas).css('-webkit-transform',' perspective(' + margin*35 + 'px) rotateY(23deg)');
+				
+						anchor.appendChild(canvas);
+
+						var ctx = canvas.getContext('2d');
+						ctx.save();
+						ctx.fillStyle = 'rgb(255, 255, 255)';
+						ctx.fillRect(0, 0, canvas.width, canvas.height);
+						ctx.restore();
+    
+						var view = page.view;
+						var scaleX = (canvas.width / page.width);
+						var scaleY = (canvas.height / page.height);
+						ctx.translate(-view.x * scaleX, -view.y * scaleY);
+					
+						// Render PDF page into canvas context
+					
+						var renderContext = {
+							canvasContext: ctx,
+							viewport: viewport
+						};
+						page.render(renderContext);
+					});
+			});
+	});
+}
+
+function canvasSaver(canvas,title,location) {
+	var canvas_data = canvas.toDataURL('image/png');
+	$.post("apps/reader/ajax/canvas_saver.php", {canv_data:canvas_data,title:title,location:location});
+}
+
+function check_thumbnail_exists(location,title) {
+	var r;
+	$.post("apps/reader/ajax/check_thumbnail.php", {title:title,location:location} ,function(data) {$("input#thumbnail_checker").html(result)});
+}
+
diff --git a/reader/js/integrate.js b/reader/js/integrate.js
index aac47d8ba..79dec7ef6 100755
--- a/reader/js/integrate.js
+++ b/reader/js/integrate.js
@@ -58,7 +58,7 @@ function getAction(mime,type) {
 	}
 	else {
 		name = function (filename){
-			window.location=OC.linkTo('reader', 'index.php') + '?dir='+
+			window.location=OC.linkTo('reader', 'index.php') + '&dir='+
 			encodeURIComponent($('#dir').val()).replace(/%2F/g, '/')+'/'+
 			encodeURIComponent(filename) + '/';
 		}
diff --git a/reader/lib/search.php b/reader/lib/search.php
new file mode 100644
index 000000000..2964bce55
--- /dev/null
+++ b/reader/lib/search.php
@@ -0,0 +1,16 @@
+<?php
+class OC_ReaderSearchProvider extends OC_Search_Provider{
+	function search($query){
+		$files=OC_FileCache::search($query,true);
+		$results=array();
+		foreach($files as $fileData){
+			$file=$fileData['path'];
+			$mime=$fileData['mimetype'];
+			if($mime=='application/pdf'){
+				$results[]=new OC_Search_Result(basename($file),'',OC_Helper::linkTo( 'reader', 'results.php' ).'?file='.$file,'eBook');
+			}
+		}
+		return $results;
+	}
+}
+?>
diff --git a/reader/lib/thumbnail.php b/reader/lib/thumbnail.php
index 04dafaa06..3b3cd946d 100644
--- a/reader/lib/thumbnail.php
+++ b/reader/lib/thumbnail.php
@@ -25,7 +25,8 @@
 		$path = OCP\Config::getSystemValue("datadirectory").'/'. $owner .'/reader';
 		$path .= $current_dir.$dir;
 		if (!is_dir($path)) {
-			return false;
+			mkdir($path, 0777, true);
+			return true;
 		}
 		else
 			return true;
diff --git a/reader/results.php b/reader/results.php
new file mode 100644
index 000000000..7b9936984
--- /dev/null
+++ b/reader/results.php
@@ -0,0 +1,17 @@
+<?php
+
+OCP\Util::addscript( 'reader', 'integrate' );
+OCP\Util::addscript( 'reader', 'pdf' );
+OCP\Util::addStyle('reader','reader');
+
+$file = $_GET['file'];
+$path = dirname($file);
+$filename = basename($file); 
+
+$tmpl = new OCP\Template( 'reader', 'results', 'user' );
+$tmpl->assign('file', $file);
+$tmpl->assign('path', $path);
+$tmpl->assign('filename', $filename);
+$tmpl->printPage();
+
+?>
diff --git a/reader/templates/.goutputstream-9T50LW b/reader/templates/.goutputstream-9T50LW
new file mode 100755
index 000000000..d5f734dd5
--- /dev/null
+++ b/reader/templates/.goutputstream-9T50LW
@@ -0,0 +1,123 @@
+<style>
+	#the-canvas{
+		align:middle;
+	}
+	#thumbnailContainer {
+		margin-top:100px;
+		vertical-align:left;
+	}
+	.thumbnail {
+		margin-left:20px;;
+	}
+</style>
+<script type="text/javascript">
+    // Specify the main script used to create a new PDF.JS web worker.
+    // In production, change this to point to the combined `pdf.js` file.
+    PDFJS.workerSrc = 'apps/reader/js/pdf.js';
+</script>
+
+
+<div id = "controls">
+	<?php
+	// Get the current directory.
+	$dir = empty($_['dir'])?'/':$_['dir'];
+	$base_url = OCP\Util::linkTo('reader', 'index.php').'&dir=';
+	
+	$curr_path = '';
+	$path = explode( '/', trim($dir,'/')); 
+	if( $path != '' ){
+		for($i=0; $i<count($path); $i++){ 
+			$curr_path .= '/'.str_replace('+','%20', urlencode($path[$i]));?>
+			<div class="crumb <?php if($i == count($path)-1) echo 'last';?> svg" data-dir='<?php echo $curr_path;?>' style='background-image:url("<?php echo OCP\image_path('core','breadcrumb.png');?>")'>
+				<a href="<?php echo $base_url.$curr_path.'/'; ?>"><?php echo htmlentities($path[$i],ENT_COMPAT,'utf-8'); ?></a>
+			</div>
+	<?php }
+	}	
+	?>
+
+	<div id="file_action_panel"></div>
+	<!-- Set dir value to be passed to integrate.js -->
+	<input type="hidden" name="dir" value="<?php echo empty($_['dir'])?'':rtrim($_['dir'],'/') ?>" id="dir">
+</div>
+<div class="actions"></div>
+<?php
+	// Get the current directory.
+	$dir = empty($_['dir'])?'/':$_['dir'];
+
+	// Search for pdf files in current directory.
+	$pdfs = \OC_FileCache::searchByMime('application', 'pdf', '/'.\OCP\USER::getUser().'/files'.$dir);
+	sort($pdfs);
+
+	// Construct an array, to store pdf files and directory names, in which pdf files reside.
+	$files = array();
+	// Store file info in the file array.
+	foreach ($pdfs as $pdf) {
+		$file_info = pathinfo($pdf);
+		$file = array();
+		$file['dirname'] = $file_info['dirname'];
+		$file['basename'] = $file_info['filename'];
+		$file['filename'] = $file_info['basename'];
+		$file['extension'] = '.'.$file_info['extension'];	
+		$files[] = $file;
+	}
+?>
+
+<table>
+	<tbody id = "fileList">
+		<?php
+		// Array to store directory entries, which contain pdfs.
+			$dirs = array();
+			foreach ($files as $file) {
+				// Encode the file and directory names so that they can be used in querying a url.
+				$name = str_replace('+','%20',urlencode($file['filename']));
+				$name = str_replace('%2F','/', $name);
+				$directory = str_replace('+','%20',urlencode($dir));
+				$directory = str_replace('%2F','/', $directory);
+				if ($file['dirname'] == '.') { 
+		?>			
+					<!-- Each tr displays a file -->	
+					<tr id = "row" data-file="<?php echo $name;?>" data-type="<?php echo 'file'?>" data-mime="<?php echo 'application/pdf'?>" data-size="3462755" data-write="true" >
+						<td class="filename svg" style="background-image:url(<?php echo OCP\mimetype_icon('application/pdf'); ?>)">
+							<a class="name" href="http://localhost<?php echo \OCP\Util::linkTo('files', 'download.php').'?file='.$directory.$name; ?>" title="">
+								<div id = "carrier">
+								<span class = "nametext">
+									<?php echo htmlspecialchars($file['basename']);?><span class='extension'><?php echo $file['extension'];?></span>
+								</span>
+								</div>
+							</a>
+						</td>
+					</tr>
+		<?php
+					echo '<br>';
+				}
+				else {
+					// Trim the extra slash that we don't need.
+					$dir_name = ltrim($file['dirname'], '/');
+					// Explode the variable to check if the pdf file is contained in a directory.
+					$dir_array = explode('/', $dir_name);
+					// Each tr entry here contains name of a directory which has a link to reader/index.php.
+					// TODO: correct mime type to be rendered explicitly.
+					$d = '<tr data-file="'.$dir_array[0].'" data-type="dir" data-mime="httpd/unix-directory">
+							<td class="filename svg" style="background-image:url('.OCP\mimetype_icon('dir').')">
+								<a class = "name" href = "'.OCP\Util::linkTo('reader', 'index.php').'&dir='.$dir.$dir_array[0].'/">
+									<span class = "nametext">'.
+										htmlspecialchars($dir_array[0]).
+									'</span>
+								</a>
+							</td>
+						</tr>';
+					/* Store the directory entries in an array so that incase 2 pdf files are conatined in a directory
+					 * we don't end up printing the directory name twice. */
+					if (!in_array($d, $dirs)) {
+						$dirs[] = $d;
+						echo $d;
+						echo '<br>';
+					}
+				}
+			}
+		?>
+	</tbody>
+</table>	
+
+<!--<script type="text/javascript" src="apps/reader/js/integrate.js"></script>
+-->
diff --git a/reader/templates/.goutputstream-SP0SLW b/reader/templates/.goutputstream-SP0SLW
new file mode 100755
index 000000000..def2264c1
--- /dev/null
+++ b/reader/templates/.goutputstream-SP0SLW
@@ -0,0 +1,163 @@
+<style>
+	div.crumb { float:left; display:block; background:no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em; }
+div.crumb:first-child { padding-left:1em; }
+div.crumb.last { font-weight:bold; }
+	div.thumbnail {
+		box-shadow: 5px 5px 5px #888888;
+		border:1px solid #888888;
+		 -webkit-border-radius: 3px; /* Safari 3-4, iOS 1-3.2, Android ≤1.6 */
+          border-radius: 3px;
+	}
+	
+	tbody tr {
+		background:white;
+		float:left;
+		height:200px;
+		width:200px;
+		font-size:10px;
+		margin-right:15px;
+		
+	}
+	tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#f8f8f8; }
+	.thumbnail:not([data-loaded]) {
+  background-color: white;
+}
+td.filename.svg{
+	background:no-repeat;
+	background-position:center;
+	height:200px;
+	width:200px;
+	white-space:normal;
+}
+td.filename.svg:hover{
+	background-color:#f8f8f8;
+}
+table {
+	margin-left:10px;
+	margin-top:30px;
+	<!--width:100%;-->
+	display:inline-block;
+}
+span.nametext{
+	font-weight:bold;
+	margin-left:3px;
+	margin-right:3px;
+	text-transform:capitalize;
+}
+ .extension{
+	 text-transform:lowercase;
+ }
+
+</style>
+<script type="text/javascript">
+    // Specify the main script used to create a new PDF.JS web worker.
+    // In production, change this to point to the combined `pdf.js` file.
+    PDFJS.workerSrc = 'apps/reader/js/pdf.js';
+</script>
+
+
+<div id = "controls">
+	<?php
+	// Get the current directory.
+	$dir = empty($_['dir'])?'/':$_['dir'];
+	$base_url = OCP\Util::linkTo('reader', 'index.php').'&dir=';
+	
+	$curr_path = '';
+	$path = explode( '/', trim($dir,'/')); 
+	if( $path != '' ){
+		for($i=0; $i<count($path); $i++){ 
+			$curr_path .= '/'.str_replace('+','%20', urlencode($path[$i]));?>
+			<div class="crumb <?php if($i == count($path)-1) echo 'last';?> svg" data-dir='<?php echo $curr_path;?>' style='background-image:url("<?php echo OCP\image_path('core','breadcrumb.png');?>")'>
+				<a href="<?php echo $base_url.$curr_path.'/'; ?>"><?php echo htmlentities($path[$i],ENT_COMPAT,'utf-8'); ?></a>
+			</div>
+	<?php }
+	}	
+	?>
+
+	<div id="file_action_panel"></div>
+	<!-- Set dir value to be passed to integrate.js -->
+	<input type="hidden" name="dir" value="<?php echo empty($_['dir'])?'':rtrim($_['dir'],'/') ?>" id="dir">
+</div>
+<div class="actions"></div>
+<?php
+	// Get the current directory.
+	$dir = empty($_['dir'])?'/':$_['dir'];
+
+	// Search for pdf files in current directory.
+	$pdfs = \OC_FileCache::searchByMime('application', 'pdf', '/'.\OCP\USER::getUser().'/files'.$dir);
+	sort($pdfs);
+
+	// Construct an array, to store pdf files and directory names, in which pdf files reside.
+	$files = array();
+	// Store file info in the file array.
+	foreach ($pdfs as $pdf) {
+		$file_info = pathinfo($pdf);
+		$file = array();
+		$file['dirname'] = $file_info['dirname'];
+		$file['basename'] = $file_info['filename'];
+		$file['filename'] = $file_info['basename'];
+		$file['extension'] = '.'.$file_info['extension'];	
+		$files[] = $file;
+	}
+?>
+
+<table>
+	<tbody id = "fileList">
+		<?php
+		// Array to store directory entries, which contain pdfs.
+			$dirs = array();
+			foreach ($files as $file) {
+				// Encode the file and directory names so that they can be used in querying a url.
+				$name = str_replace('+','%20',urlencode($file['filename']));
+				$name = str_replace('%2F','/', $name);
+				$directory = str_replace('+','%20',urlencode($dir));
+				$directory = str_replace('%2F','/', $directory);
+				if ($file['dirname'] == '.') { 
+		?>			
+					<!-- Each tr displays a file -->	
+					<tr id = "row" data-file="<?php echo $name;?>" data-type="<?php echo 'file'?>" data-mime="<?php echo 'application/pdf'?>" data-size="3462755" data-write="true" >
+						<td class="filename svg">
+							<a class="name" id = "http://localhost<?php echo \OCP\Util::linkTo('files', 'download.php').'?file='.$directory.$name; ?>" href="http://localhost<?php echo \OCP\Util::linkTo('files', 'download.php').'?file='.$directory.$name; ?>" title="">
+								<center>
+									<span class = "nametext">
+										<?php echo htmlspecialchars($file['basename']);?><span class='extension'><?php echo $file['extension'];?></span>
+									</span>
+								</center>
+							</a>
+						</td>
+					</tr>
+		<?php
+					echo '<br>';
+				}
+				else {
+					// Trim the extra slash that we don't need.
+					$dir_name = ltrim($file['dirname'], '/');
+					// Explode the variable to check if the pdf file is contained in a directory.
+					$dir_array = explode('/', $dir_name);
+					// Each tr entry here contains name of a directory which has a link to reader/index.php.
+					// TODO: correct mime type to be rendered explicitly.
+					$d = '<tr data-file="'.$dir_array[0].'" data-type="dir" data-mime="httpd/unix-directory">
+							<td class="filename svg" style="background-image:url('.OCP\mimetype_icon('dir').')">
+								<a class = "name" href = "'.OCP\Util::linkTo('reader', 'index.php').'&dir='.$dir.$dir_array[0].'/">
+									<span class = "nametext">'.
+										htmlspecialchars($dir_array[0]).
+									'</span>
+								</a>
+							</td>
+						</tr>';
+					/* Store the directory entries in an array so that incase 2 pdf files are conatined in a directory
+					 * we don't end up printing the directory name twice. */
+					if (!in_array($d, $dirs)) {
+						$dirs[] = $d;
+						echo $d;
+						echo '<br>';
+					}
+				}
+			}
+		?>
+	</tbody>
+</table>	
+
+<!--<script type="text/javascript" src="apps/reader/js/integrate.js"></script>
+-->
+<!--style="background-image:url(<?php /*echo OCP\mimetype_icon('application/pdf'); */?>)"-->
diff --git a/reader/templates/index.php b/reader/templates/index.php
index f2c694510..72b91ebbc 100755
--- a/reader/templates/index.php
+++ b/reader/templates/index.php
@@ -2,7 +2,6 @@
 <META HTTP-EQUIV="Expires" CONTENT="-1">
 <script type="text/javascript">
     // Specify the main script used to create a new PDF.JS web worker.
-    // In production, change this to point to the combined `pdf.js` file.
     PDFJS.workerSrc = 'apps/reader/js/pdf.js';
 </script>
 
@@ -12,7 +11,7 @@
 	include('apps/reader/lib/thumbnail.php');
 	// Get the current directory.
 	$current_dir = empty($_['dir'])?'/':$_['dir'];
-	$base_url = OCP\Util::linkTo('reader', 'index.php').'?dir=';
+	$base_url = OCP\Util::linkTo('reader', 'index.php').'&dir=';
 	
 	$curr_path = '';
 	$path = explode( '/', trim($current_dir,'/')); 
@@ -53,7 +52,7 @@
 	}
 ?>
 
-<table>
+<table id = "readerContent">
 	<tbody id = "fileList">
 		<?php
 		
@@ -105,7 +104,7 @@
 			<!-- Display folder name--> 
 				<tr id = "row" data-file="<?php echo $r[0];?>" data-type="dir">
 					<td class = "filename svg">
-						<a class = "dirs" id = "<?php echo $r[0];?>" href = "<?php echo OCP\Util::linkTo('reader', 'index.php').'?dir='.$current_dir.$r[0].'/';?>">
+						<a class = "dirs" id = "<?php echo $r[0];?>" href = "<?php echo OCP\Util::linkTo('reader', 'index.php').'&dir='.$current_dir.$r[0].'/';?>">
 							<center>
 								<span class = "nametext">
 									<?php echo htmlspecialchars($r[0]);?>
@@ -121,7 +120,8 @@
 									$img = 1;
 									// Display thumbnails of 3 pdf pages to show a folder. 
 									foreach ($r[1] as $thumbs) {
-										echo '<img id = "img'.$img.'" src = "'.\OCP\Util::linkTo('reader', 'ajax/thumbnail.php').'&filepath='.urlencode($current_dir.$r[0].'/'.rtrim($thumbs,'pdf').'png').'" style = "position:absolute; top:20px; left:10px; margin-left:'.$margin.'px; z-index:'.(100-$margin).';">';
+										$path1 = \OCP\Util::linkTo('reader', 'ajax/thumbnail.php').'&filepath='.urlencode($current_dir.$r[0].'/'.rtrim($thumbs,'pdf').'png');
+										echo '<img id = "img'.$img.'" src = "'.$path1.'" style = "position:absolute; top:20px; left:10px; margin-left:'.$margin.'px; z-index:'.(50-$margin).';">';
 										$margin = $margin + 5;
 										$img = $img + 1;
 									}
@@ -132,7 +132,7 @@
 					</td>
 				</tr><?php
 			}
-		?>
+			?>
 	</tbody>
 </table>	
  
diff --git a/reader/templates/results.php b/reader/templates/results.php
new file mode 100644
index 000000000..90367343d
--- /dev/null
+++ b/reader/templates/results.php
@@ -0,0 +1,59 @@
+<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
+<META HTTP-EQUIV="Expires" CONTENT="-1">
+<script type="text/javascript">
+    PDFJS.workerSrc = 'apps/reader/js/pdf.js';
+</script>
+
+<div id = "controls">
+	<?php
+	$current_dir = empty($_['path'])?'/':$_['path'];
+	$base_url = OCP\Util::linkTo('reader', 'index.php').'?dir=';
+	
+	$curr_path = '';
+	$path = explode( '/', trim($current_dir,'/')); 
+	// Navaigation Tab.
+	if( $path != '' ){
+		for($i=0; $i<count($path); $i++){ 
+			$curr_path .= '/'.str_replace('+','%20', urlencode($path[$i]));?>
+			<div class="crumb <?php if($i == count($path)-1) echo 'last';?> svg" data-dir='<?php echo $curr_path;?>' style='background-image:url("<?php echo OCP\image_path('core','breadcrumb.png');?>")'>
+				<a href="<?php echo $base_url.$curr_path.'/'; ?>"><?php echo htmlentities($path[$i],ENT_COMPAT,'utf-8'); ?></a>
+			</div>
+	<?php }
+	}	
+	?>
+	<div id="file_action_panel"></div>
+	<input type="hidden" name="dir" value="<?php echo empty($_['path'])?'':rtrim($_['path'],'/') ?>" id="dir">
+</div>
+
+<div class="actions"></div>
+
+<table id = "readerContent">
+	<tbody id = "fileList">
+		<?php
+			include('apps/reader/lib/thumbnail.php');
+			$file = $_['file'];
+			$path = $_['path'];
+			$filename = $_['filename']; 
+				// Encode the file and directory names so that they can be used in querying a url.
+			$name = str_replace('+','%20',urlencode($filename));
+			$name = str_replace('%2F','/', $name);
+			$directory = str_replace('+','%20',urlencode($path));
+			$directory = str_replace('%2F','/', $path);
+		?>			
+			<!-- Each tr displays a file -->	
+			<tr id = "row" data-file="<?php echo $name;?>" data-type="<?php echo 'file'?>" data-mime="<?php echo 'application/pdf'?>" data-size="3462755" data-write="true">
+				<td class="filename svg">
+				<?php $check_thumb = check_thumb_exists($directory,$name);?>
+					<a class="name" href="http://localhost<?php echo \OCP\Util::linkTo('files', 'download.php').'?file='.$directory.$name; ?>" title="<?php echo urldecode($name);?>" dir ="<?php echo $directory.$name?>" value  = "<?php echo $check_thumb;?>">
+						<center>
+							<span class = "nametext">
+								<?php echo htmlspecialchars($filename);?>
+							</span>
+						</center>
+						<img rel ="images" src = "<?php echo \OCP\Util::linkTo('reader', 'ajax/thumbnail.php').'&filepath='.urlencode($path.rtrim($filename,'pdf').'png');?>">	
+					</a>
+				</td>
+			</tr> 
+	</tbody>
+</table>
+