diff --git a/t/css/main.css b/t/css/main.css
index 212a8af..aee1447 100644
--- a/t/css/main.css
+++ b/t/css/main.css
@@ -17,8 +17,20 @@ a{
 	color: #525252;
 }
 
+header{
+	position:fixed;
+	z-index:20;
+	height:65px;
+	top:0;
+	left: 0;
+	right:0;
+	background-color:#FAFBFB;
+	border-bottom:1px solid #CCCCCC;
+}
+
 header div:nth-child(1){
 	position: absolute;
+	top:10px;
 	left:3px;
 	right: 60px;
 	height:40px;
@@ -26,7 +38,7 @@ header div:nth-child(1){
 
 #search_input{
 	padding-left: 5px;
-	height:40px;
+	height:36px;
 	width: 100%;
 	border:1px solid #DDDDDD;
 	outline:none;
@@ -37,13 +49,14 @@ header div:nth-child(1){
 
 header div:nth-child(2){
 	position: absolute;
+	top:10px;
 	right:3px;
 	width:50px;
 	height:40px;
 }
 #search_btn{
 	width:50px;
-	height:40px;
+	height:36px;
 	line-height:45px;
 	text-align:center;
 	background-color:#0091FF;
diff --git a/t/html/index.html b/t/html/index.html
index 2cbcb0d..7636334 100644
--- a/t/html/index.html
+++ b/t/html/index.html
@@ -3,34 +3,29 @@
 	<head>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
-		<title>天天爱搜索</title>
+		<title>测试Angular</title>
 		<link rel="stylesheet" type="text/css" href="../css/main.css">
 	</head>
 	<body>
-		<header ng-controller="SearchController">
-			<div>
-				<input id="search_input" type="text" placeholder="请输入关键字"/>
-			</div>
-			<div>
-				<input id="search_btn" ng-click="search()" value="搜索"/>
-			</div>
-		</header>
-		
+		<ng-include id="header_div" src="'./view/header_search.html'"></ng-include>
 		<div ng-view></div>
-		
-		<footer>
-			<a >图书</a>
-			<a>音乐</a>
-			<a>电影</a>
+		<!--<div id="footer_div" ng-include="'./view/footer_search.html'"></div>-->
+		<footer ng-controller="MenuController">
+			<a ng-click="bookSearch()">图书</a>
+			<a ng-click="musicSearch()">音乐</a>
+			<a ng-click="movieSearch()">电影</a>
 		</footer>
-		
-		<div id="loading">
+		<div id="loading" ng-show="isNoLoaded">
 			<img src="../imgs/loading.gif" />
 		</div>
-		
+
 		<script type="text/javascript" src="../js/angular.js"></script>
 		<script type="text/javascript" src="../js/angular-route.js" ></script>
-		<script type="text/javascript" src="../lib/config.js"></script>
-		<script type="text/javascript" src="../lib/index.js"></script>
+		<script type="text/javascript" src="../lib/main.js"></script>
+		<script type="text/javascript" src="../lib/bookService.js"></script>
+		<script type="text/javascript" src="../lib/BookController.js"></script>
+		<script type="text/javascript" src="../lib/searchController.js"></script>
+		<script type="text/javascript" src="../lib/menuController.js"></script>
+
 	</body>
 </html>
\ No newline at end of file
diff --git a/t/html/view/book_list.html b/t/html/view/book_list.html
index ad68cc0..f8dd689 100644
--- a/t/html/view/book_list.html
+++ b/t/html/view/book_list.html
@@ -1,7 +1,7 @@
 
 <section ng-controller="BookListController">
 <div>
-	<div class="list_item" ng-repeat="data in list">
+	<div class="list_item" ng-repeat="data in rootList">
 		<a class="list_bookname_a" href="#/list/book/{{data.id}}">
 		<div class="list_img overflow fl">
 			<img class="list_img" ng-src="{{data.image}}"/>
diff --git a/t/html/view/footer_search.html b/t/html/view/footer_search.html
new file mode 100644
index 0000000..7e9cc00
--- /dev/null
+++ b/t/html/view/footer_search.html
@@ -0,0 +1,6 @@
+<footer>
+	<a >图书</a>
+	<a>音乐</a>
+	<a>电影</a>
+</footer>
+		
\ No newline at end of file
diff --git a/t/html/view/header_search.html b/t/html/view/header_search.html
new file mode 100644
index 0000000..1d92c60
--- /dev/null
+++ b/t/html/view/header_search.html
@@ -0,0 +1,8 @@
+<header ng-controller="SearchController">
+	<div>
+		<input id="search_input" ng-model="keywords" type="text" placeholder="请输入关键字"/>
+	</div>
+	<div>
+		<input id="search_btn" ng-click="search()" value="搜索"/>
+	</div>
+</header>
diff --git a/t/lib/BookController.js b/t/lib/BookController.js
new file mode 100644
index 0000000..27a9036
--- /dev/null
+++ b/t/lib/BookController.js
@@ -0,0 +1,16 @@
+/*图书列表页*/
+app.controller('BookListController', function($scope, bookList){
+	bookList.getData('C语言');
+});
+
+
+/*图书详情页*/
+app.controller('BookDetailController', function($rootScope, $http, $scope, $location, ServiceConfig){
+	var bookId = $location.path().split('/book/')[1] || '';
+	$rootScope.isNoLoaded = true;
+	$http.jsonp(ServiceConfig.book_search_id + '' + bookId + '?callback=showBookDeatil');
+	window.showBookDeatil = function(data){
+		$rootScope.isNoLoaded = false;
+		$scope.data = data;
+	};
+});
\ No newline at end of file
diff --git a/t/lib/bookService.js b/t/lib/bookService.js
new file mode 100644
index 0000000..2532393
--- /dev/null
+++ b/t/lib/bookService.js
@@ -0,0 +1,31 @@
+/*构建BookList服务*/
+app.factory('bookList', function($rootScope, $http, ServiceConfig){
+	$rootScope.isNoLoaded = true;
+	var _BookList = {		
+		getData: function(keywords){
+			$http.jsonp(ServiceConfig.book_search + '?callback=searchBookList&count=10&q=' + keywords);
+			window.searchBookList = function(data){
+				if(data.books.length){
+					$rootScope.isNoLoaded = false;
+				}
+				var list = [];
+				for(var i = 0; i < data.books.length; i++){
+					var book = data.books[i];
+					var item = {
+						id: book.id,
+						image: book.image,
+						origin_title: book.title || '书名未共享',
+						author: book.author[0] || '作者未知',
+						publisher: book.publisher || '出版社未知',
+						price: book.price.split('.')[0] || '未知',
+						pages: book.pages
+					};
+					list.push(item);
+				}
+				$rootScope.rootList = list;
+			};
+		}
+	};
+	
+	return _BookList;
+});
\ No newline at end of file
diff --git a/t/lib/index.js b/t/lib/index.js
index 11534cf..481f39b 100644
--- a/t/lib/index.js
+++ b/t/lib/index.js
@@ -1,9 +1,23 @@
 var app = angular.module('app', ['ngRoute']);
 
+app.run(function($rootScope){
+    $rootScope.version = '0.1';
+    $rootScope.author = 'vczero';
+    $rootScope.author_alias = '鬼谣';
+    $rootScope.isNoLoaded = true;
+    $rootScope.rootList = []; //当然这是个不好的做法，只因为APP太simple
+});
 
-app.config(['$routeProvider', function ($routeProvider) {
-//	$locationProvider.html5Mode(true); 
+/*服务的URL配置*/
+app.constant('ServiceConfig', {
+	book_search: 'https://api.douban.com/v2/book/search',
+	book_search_id: 'https://api.douban.com/v2/book/'
+});
+
+/*路由控制*/
+app.config(['$routeProvider', function ($routeProvider) { 
     $routeProvider
+    	/*图书搜索*/
         .when('/list/book', {
             templateUrl: 'view/book_list.html',
             controller: 'BookListController'
@@ -12,6 +26,17 @@ app.config(['$routeProvider', function ($routeProvider) {
             templateUrl: 'view/book_detail.html',
             controller: 'BookDetailController'
         })
+        /*音乐搜索*/
+        .when('/list/music', {
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        })
+        /*电影搜索*/
+        .when('/list/movie', {
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        })
+        /*定向到首页*/
         .otherwise({
             redirectTo: '/',
             templateUrl: 'view/book_list.html',
@@ -19,52 +44,15 @@ app.config(['$routeProvider', function ($routeProvider) {
         });
 }]);
 
-app.controller('BookListController', function($http, $scope){
-	$http.jsonp(window.CONFIG_SERVER.book_search + '?callback=showBookList&count=10&q=C%E8%AF%AD%E8%A8%80');
-	window.showBookList = function(data){
-		if(data.books){
-			document.getElementById('loading').style.visibility = 'hidden';
-		}
-		var list = [];
-		for(var i = 0; i < data.books.length; i++){
-			var book = data.books[i];
-			var item = {
-				id: book.id,
-				image: book.image,
-				origin_title: book.title || '书名未共享',
-				author: book.author[0] || '作者未知',
-				publisher: book.publisher || '出版社未知',
-				price: book.price.split('.')[0] || '未知',
-				pages: book.pages
-			};
-			list.push(item);
-		}
-		$scope.list = list;
-	};
-});
-
-app.controller('BookDetailController', function($http, $scope, $location){
-	var id = $location.path().split('/book/')[1] || '';
-	$http.jsonp(window.CONFIG_SERVER.book_search_id + '' + id + '?callback=showBookDeatil');
-	window.showBookDeatil = function(data){
-		$scope.data = data;
-	};
-});
-
-
-app.controller('SearchController', function($http, $scope, $location){
-	var path = $location.path();
-	$scope.search = function(){
-		var value = document.getElementById('search_input').value;
-		console.log(value);
-		console.log(path);
-		//图书搜索
-		if(path.indexOf('/list/book') !== -1 || path === '/'){
-			console.log(window.CONFIG_SERVER.book_search + '?callback=searchBookList&count=10&q=' + value);
-			$http.jsonp(window.CONFIG_SERVER.book_search + '?callback=searchBookList&count=10&q=' + value);
+/*构建BookList服务*/
+app.factory('bookList', function($rootScope, $http, ServiceConfig){
+	$rootScope.isNoLoaded = true;
+	var _BookList = {		
+		getData: function(keywords){
+			$http.jsonp(ServiceConfig.book_search + '?callback=searchBookList&count=10&q=' + keywords);
 			window.searchBookList = function(data){
-				if(data.books){
-					document.getElementById('loading').style.visibility = 'hidden';
+				if(data.books.length){
+					$rootScope.isNoLoaded = false;
 				}
 				var list = [];
 				for(var i = 0; i < data.books.length; i++){
@@ -80,12 +68,153 @@ app.controller('SearchController', function($http, $scope, $location){
 					};
 					list.push(item);
 				}
-				$scope.list = list;
+				$rootScope.rootList = list;
 			};
 		}
 	};
+	
+	return _BookList;
 });
 
 
 
+/*图书列表页*/
+app.controller('BookListController', function($scope, bookList){
+	bookList.getData('C语言');
+});
+/*图书详情页*/
+app.controller('BookDetailController', function($rootScope, $http, $scope, $location, ServiceConfig){
+	$rootScope.isNoLoaded = true;
+	var bookId = $location.path().split('/book/')[1] || '';
+	$http.jsonp(ServiceConfig.book_search_id + '' + bookId + '?callback=showBookDeatil');
+	window.showBookDeatil = function(data){
+		$rootScope.isNoLoaded = false;
+		$scope.data = data;
+	};
+});
+
+
+/*搜索*/
+app.controller('SearchController', function($scope, $location, bookList){
+	var path = $location.path();
+	$scope.search = function(){
+		var keywords = $scope.keywords;
+		if(path.indexOf('/list/book') !== -1 || path === '/'){
+			bookList.getData(keywords);
+		}else if(path.indexOf('/list/music') !== -1 || path === '/music'){
+			
+		}
+	};
+});
+
+app.controller('MenuController', function($scope, $location){
+	$scope.bookSearch = function(){
+		$location.path('/list/book');
+	};
+	
+	$scope.musicSearch = function(){
+		$location.path('/list/music');
+	};
+	
+	$scope.movieSearch = function(){
+		$location.path('/list/movie');
+	};
+	
+});
+
+
+//
+//app.directive('nprLink', function() {
+//return {
+//  restrict: 'EA',
+//  require: ['^ngModel'],
+//  replace: true,
+//  scope: {
+//    ngModel: '=',
+//    play: '&'
+//  },
+//  templateUrl: '/views/nprListItem.html',
+//  link: function(scope, ele, attr) {
+//    scope.duration = scope.ngModel.audio[0].duration.$text;
+//  }
+//}
+//});
+
+// simple directive
+//app.directive('helloWorld',function(){
+//  return {
+//      restrict: 'AE',
+//      replace: true,
+//      template: '<h3>Hello World!</h3>'
+//  }
+//}); 
+
+
+//app.directive('helloWorld',function(){
+//  return {
+//      restrict: 'AE',   
+//      replace: true,
+//      template: '<p style="background-color:{{color}}"></p>',   
+//      link: function(scope,elem,attr){
+//          elem.bind('click',function(){
+//              elem.css('background-color','white');
+//          scope.$apply(function(){
+//              scope.color = "white";
+//          });
+//          });
+//          elem.bind('mouseover',function(){
+//              elem.css('cursor','pointer');
+//          });
+//      }
+//  }
+//});   
+
+
+//注意到link函数被用在了指令中。它接收三个参数：
+//
+//scope - 它代表指令被使用的作用域。在上面的例子中它等同于符控制器的作用域。
+//elem - 它代表绑定指令的元素的jQlite（jQuery的一个自己）包裹元素。如果你在AngularJS被包含之前就包括了jQuery，
+//那么它将变成jQuery包裹元素。由于该元素已经被jQuery/jQlite包裹，我们没有必要将它包含在$()中来进行DOM操作。
+//attars - 它代表绑定指令的元素上的属性。例如，如果你在HTML元素上有一些指令形式为：<hello-world some-attribute>
+//</hello-world>，你可以在link函数内用attrs.someAttribute来引用这些属性。
+
+//
+//app.directive('test',function(){
+//  return {
+//      compile: function(tElem,attrs){
+//          //在这里原则性的做一些DOM转换   
+//          return function(scope,elem,attrs){
+//           //这里编写link函数
+//          }
+//      }
+//  }
+//});   
+
+
+//改变作用域
+//app.directive('helloWorld',function(){
+//  return {
+//      scope: true, //使用一个继承父作用域的自作用域   ，如果需要隔离的话，值为{}即可
+//      restrict: 'AE',
+//      replace: true,
+//      template: '<h3>Hello World!</h3>'
+//  }
+//});   
+
+//var editor = elem.find('#editor');  
+//
+//scope.restore(); //初始化我们的应用控制   
+//scope.notes = notesFactory.getAll();//载入笔记  
+//
+//editor.bind('keyup keydown',function(){
+//  scope.noetText = editor.text().trim();
+//});  
+
+
+
+
+
+
+
+
 
diff --git a/t/lib/main.js b/t/lib/main.js
new file mode 100644
index 0000000..707f3b2
--- /dev/null
+++ b/t/lib/main.js
@@ -0,0 +1,45 @@
+var app = angular.module('app', ['ngRoute']);
+
+app.run(function($rootScope){
+    $rootScope.version = '0.1';
+    $rootScope.author = 'vczero';
+    $rootScope.author_alias = '鬼谣';
+    $rootScope.isNoLoaded = true;
+    $rootScope.rootList = []; //当然这是个不好的做法，只因为APP太simple
+});
+
+/*服务的URL配置*/
+app.constant('ServiceConfig', {
+	book_search: 'https://api.douban.com/v2/book/search',
+	book_search_id: 'https://api.douban.com/v2/book/'
+});
+
+/*路由控制*/
+app.config(['$routeProvider', function ($routeProvider) { 
+    $routeProvider
+    	/*图书搜索*/
+        .when('/list/book', {
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        })
+        .when('/list/book/:id', {
+            templateUrl: 'view/book_detail.html',
+            controller: 'BookDetailController'
+        })
+        /*音乐搜索*/
+        .when('/list/music', {
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        })
+        /*电影搜索*/
+        .when('/list/movie', {
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        })
+        /*定向到首页*/
+        .otherwise({
+            redirectTo: '/',
+            templateUrl: 'view/book_list.html',
+            controller: 'BookListController'
+        });
+}]);
\ No newline at end of file
diff --git a/t/lib/menuController.js b/t/lib/menuController.js
new file mode 100644
index 0000000..a3ce15b
--- /dev/null
+++ b/t/lib/menuController.js
@@ -0,0 +1,14 @@
+app.controller('MenuController', function($scope, $location){
+	$scope.bookSearch = function(){
+		$location.path('/list/book');
+	};
+	
+	$scope.musicSearch = function(){
+		$location.path('/list/music');
+	};
+	
+	$scope.movieSearch = function(){
+		$location.path('/list/movie');
+	};
+	
+});
\ No newline at end of file
diff --git a/t/lib/searchController.js b/t/lib/searchController.js
new file mode 100644
index 0000000..32db69f
--- /dev/null
+++ b/t/lib/searchController.js
@@ -0,0 +1,12 @@
+/*搜索*/
+app.controller('SearchController', function($scope, $location, bookList){
+	var path = $location.path();
+	$scope.search = function(){
+		var keywords = $scope.keywords;
+		if(path.indexOf('/list/book') !== -1 || path === '/'){
+			bookList.getData(keywords);
+		}else if(path.indexOf('/list/music') !== -1 || path === '/music'){
+			
+		}
+	};
+});
\ No newline at end of file
