add search method

meitu/css/main.css

@@ -231,20 +231,12 @@ html body {
 	width: 100%;
 	height: 70px;
 }
-.speed_data>div {
+
-	height: 20px;
-}
 .speed_title_strong {
 	color: #0091FF;
 	font-size: 15px;
-	/*font-style: italic;*/
-}
-.speed_l {
-	margin-left:5px;
-}
-.speed_r {
-	width: 100px;
 }
+
 /*-----------------router----------------------------**/
 
 .router {
@@ -254,10 +246,11 @@ html body {
 	width: 45px;
 	min-height: 190px;
 	background-color: #fff;
-	opacity: 0.8;
+	opacity: 0.9;
-	-webkit-opacity:0.8;
+	-webkit-opacity:0.9;
-	-moz-opacity: 0.8;
+	-moz-opacity: 0.9;
-	-moz-opacity: 0.8;
+	-moz-opacity: 0.9;
+	display:none;
 }
 #router_canvas {
 	-webkit-transform: translateZ(0);

meitu/index.html

@@ -121,41 +121,37 @@
 				</div>
 			</div>
 			<div class="speed_data">
-				<div>
+				<div style="width:96%;height:20px;margin-left:2%;">
 					<div class="fl">
-						<div class="speed_l">
+						<div>
 							<span>时速:</span>
 							<span id="speed_real" class="speed_title_strong">计算</span>
 						</div>
 					</div>
 					<div class="fr">
-						<div class="speed_r" >
+						<div>
 							<span>时长:</span>
 							<span id="total_time" class="speed_title_strong">计算</span>
 						</div>
 					</div>
 				</div>
-				<div>
+				<div style="width:96%;height:20px;margin-left:2%;">
-					<div class="fl">
+					<div class="fl" style="clear:both;">
-						<div class="speed_l">
+						<span>到达:</span>
-							<span>到达:</span>
+						<span id="ar_time" class="speed_title_strong">计算</span>
-							<span id="ar_time" class="speed_title_strong">计算</span>
-						</div>
 					</div>
 					<div class="fr">
-						<div class="speed_r">
+						<div>
 							<span>距离:</span>
 							<span id="total_dis" class="speed_title_strong">计算</span>
 						</div>
 					</div>
 				</div>
-				<div>
+				<div style="width:96%;height:20px;clear:both;margin-left:2%;">
-					<div style="margin-left:5px;width:160px;">
+					<span>模拟车速:</span><span>50,000 km/h</span>
-						<span>模拟车速:</span><span>50,000 km/h</span>
-					</div>
 				</div>
-				<div style="min-height:40px;">
+				<div style="min-height:40px;width:96%;margin-left:2%;">
-					<div style="margin-left:5px;width:96%;min-height:40px;margin-left:2%;margin-right:2%;">
+					<div style="margin-left:5px;width:100%;min-height:40px;">
 						<i class="fa fa-map-marker" style="color:#E82D00;"></i>
 						<span id="real_loc">
 	        					获取中

meitu/js/common/data.js

@@ -79,6 +79,25 @@ define('common/data', function() {
 		content: '衢州'
 	}]);
 	
+	data.router.push([
+		{
+			x: 113.643436,
+			y: 34.766435,
+			content: '郑州',
+			startTime: '7:00'
+		},
+		{
+			x: 117.296723,
+			y: 36.784095,
+			content: '济南'
+		},
+		{
+			x: 120.362091,
+			y: 36.060201,
+			content: '青岛'
+		}
+	]);
+	
 	//链接
 	data.urls = [
 		'http://m.ctrip.com/webapp/you/appshare/bargain/18484.html?from=http%3A%2F%2Fm.ctrip.com%2Fwebapp%2Fyou%2Fplace%2F12.html',

meitu/js/home/events.js

@@ -1,6 +1,7 @@
 //全局事件
 define('home/events', function(require, exports, module) {
 	var $ = require('lib/zepto_pj');
+	var rt = require('home/router');
 	var Events = require('lib/events');
 	//全局事件对象
 	var events = new Events();
@@ -8,26 +9,65 @@ define('home/events', function(require, exports, module) {
 	var map = require('home/map');
 	//获取路线数据
 	var router = require('common/data').router[0];
-	//地图对象
+	//	//地图对象
-	events.set('map', map);
+	//	events.set('map', map);
-	//默认路线
+	//	//默认路线
-	events.set('router', router);
+	//	events.set('router', router);
-	//起点
+	//	//起点
-	events.set('origin', new AMap.LngLat(router[0].x, router[0].y));
+	//	events.set('origin', new AMap.LngLat(router[0].x, router[0].y));
-	//终点
+	//	//终点
-	events.set('destination', new AMap.LngLat(router[router.length - 1].x, router[router.length - 1].y));
+	//	events.set('destination', new AMap.LngLat(router[router.length - 1].x, router[router.length - 1].y));
-	//途经点
+	//	//途经点
-	events.set('wayPoints', []);
+	//	events.set('wayPoints', []);
-	//采集数据
+	//	//采集数据
-	events.set('disTime', []);
+	//	events.set('disTime', []);
-	//所有点集合
+	//	//所有点集合
-	events.set('allPoints', []);
+	//	events.set('allPoints', []);
-	//汽车点
+	//	//汽车点
-	events.set('carMarker', null);
+	//	events.set('carMarker', null);
-	//实时车的位置
+	//	//实时车的位置
-	events.set('realCarIndex', 0);
+	//	events.set('realCarIndex', 0);
-	//仪表盘车速
+	//	//仪表盘车速
-	events.set('dashSpeed', 0);
+	//	events.set('dashSpeed', 0);
+	//	//计时器
+	//	events.set('realSpeedHandle', null);
+	//	events.set('carWatchHandle', null);
+	
+	events.on('mapRefresh', function(){
+		map.clearMap();
+		if(events.get('carWatchHandle')){
+			clearInterval(events.get('carWatchHandle'));
+		}
+		if(events.get('realSpeedHandle')){
+			clearInterval(events.get('realSpeedHandle'));
+		}
+		//查看用户是否设置router
+		var rt = events.get('router') || router;
+		//地图对象
+		events.set('map', map);
+		//默认路线
+		events.set('router', rt);
+		//起点
+		events.set('origin', new AMap.LngLat(rt[0].x, rt[0].y));
+		//终点
+		events.set('destination', new AMap.LngLat(rt[rt.length - 1].x, rt[rt.length - 1].y));
+		//途经点
+		events.set('wayPoints', []);
+		//采集数据
+		events.set('disTime', []);
+		//所有点集合
+		events.set('allPoints', []);
+		//汽车点
+		events.set('carMarker', null);
+		//实时车的位置
+		events.set('realCarIndex', 0);
+		//仪表盘车速
+		events.set('dashSpeed', 0);
+		//计时器
+		events.set('realSpeedHandle', null);
+		events.set('carWatchHandle', null);
+	});
+	
 
 	//获取途经点
 	events.on('getWayPoints', function() {
@@ -42,6 +82,8 @@ define('home/events', function(require, exports, module) {
 				wayPoints.contents.push(router[i].content);
 			}
 		}
+		rt.set('router', events.get('router'));
+		rt.trigger('show');
 		events.set('wayPoints', wayPoints);
 	});
 
@@ -160,7 +202,7 @@ define('home/events', function(require, exports, module) {
 		$('#router_circle_0').css('background-color', '#ccc');
 		$('#router_circle_1').css('background-color', 'red');
 		$('#router_circle_1').addClass('firebug_flash');
-		var carWatch = setInterval(function() {
+		var carWatchHandle = setInterval(function() {
 			if (!carMarker) {
 				return;
 			}
@@ -188,6 +230,7 @@ define('home/events', function(require, exports, module) {
 			}
 
 		}, 500);
+		events.set('carWatchHandle', carWatchHandle);
 	});
 	
 	events.on('getWeather', function(){
@@ -242,19 +285,9 @@ define('home/events', function(require, exports, module) {
 				}
 			}
 		}, 1000);
+		events.set('realSpeedHandle', realSpeedHandle);
 	});
 
-
-
-	//默认操作
-	events.trigger('drawOriginDestination');
-	events.trigger('getWayPoints');
-	events.trigger('drawRouter');
-	events.trigger('carRun');
-	events.trigger('calcuSpeed');
-	events.trigger('getWeather');
-
-
 	//绘制两点间路线
 	function driving(origin, destination) {
 		var map = events.get('map');

meitu/js/home/map.js

@@ -6,7 +6,7 @@ define('home/map', function(require, exports, module){
 		mapStyle: 'fresh',
 		resizeEnable: true,
 	});
-	
+	map.setZoom(10);
 	return map;
 
 });

meitu/js/home/router.js

@@ -2,16 +2,23 @@
 define('home/router', function(require, exports, module) {
 
 	var $ = require('lib/zepto');
-	var router = require('common/data').router[0];
+	var Events = require('lib/events');
-	var wrapper = $('#ROUTER_TPL');
+	var router = new Events();
-  	var tpl = $('#tpl_router').html();
-  	
-  	var data = {
-  		items: router
-  	};
-  	
-  	var html = _.template(tpl)(data);
-  	wrapper.html(html);
 	
+	router.on('show', function(){
+		$('.router').show();
+		var rt = router.get('router');
+		var wrapper = $('#ROUTER_TPL');
+	  	var tpl = $('#tpl_router').html();
+	  	
+	  	var data = {
+	  		items: rt
+	  	};
+	  	
+	  	var html = _.template(tpl)(data);
+	  	wrapper.html(html);
+	});
+	
+	return router;
 	
 });

meitu/js/home/search.js

@@ -3,15 +3,14 @@ define('home/search', function(require, exports, module){
 	
 	var $ = require('lib/zepto_pj');
 	var map = require('home/map');
-
+	var events = require('home/events');
-	var router = require('common/data').router;
+	var routers = require('common/data').router;
-	var events = require('lib/events');
-	
 	var input = $('#search_input_text');
+	var btn = $('.search_btn');
+
 	var tpl = $('#tpl_search').html();
 	var container = $('#SEARCH_TPL');
 	
-	
 	var data = {
 		items:[
 			{
@@ -45,17 +44,102 @@ define('home/search', function(require, exports, module){
 	container.on('click', function(e){
 		var el = $(e.target);
 		var index = el.attr('_index');
-		map.routes = router[index];
-		
-		
 		//路线出现在输入框
 		input.val(data.items[index].router);
 		//隐藏结果列表
-		container.fadeOut();
+		container.fadeOut();	
-		//触发搜索事件
+		
+		//搜索
+		//路径规划
+		events.set('router', routers[index]);
+		events.trigger('mapRefresh');
+		events.trigger('drawOriginDestination');
+		events.trigger('getWayPoints');
+		events.trigger('drawRouter');
+		events.trigger('carRun');
+		events.trigger('calcuSpeed');
+		events.trigger('getWeather');
+	});
+	
+		
+	btn.on('click', function(){
+		var val = input.val();
+		for(var i in data.items){
+			if(data.items[i].router === val){
+				return;
+			}
+		}
+		//格式过滤
+		if(val.split('到').length !== 2){
+			return;
+		}
+		var sName = val.split('到')[0];
+		var eName = val.split('到')[1];
+		//进行两点搜索,获取两点经纬度
+		AMap.service(["AMap.Geocoder"], function() {
+			var geocoder = new AMap.Geocoder({
+	            radius: 1000,
+	            extensions: 'base'
+	        });
+	        geocoder.getLocation(sName, function(status, result){
+	        		if(status === 'error') {
+	                console.log('服务请求出错');
+	            }
+	            if(status === 'no_data') {
+	                console.log('无数据返回，请换个关键字试试～～');
+	            }
+	            else {
+	            		var geocodes = result.geocodes;
+	                if(geocodes.length && result.info === 'OK'){
+	                		var sLoc = geocodes[0].location;
+	                		//解析第二个点
+	                		geocoder.getLocation(eName, function(eStatus, eResult){
+	                			if(eStatus === 'error') {
+				                console.log('服务请求出错');
+				            }
+				            if(eStatus === 'no_data') {
+				                console.log('无数据返回，请换个关键字试试～～');
+				            }
+				            else {				            		
+				            		var eGeocodes = eResult.geocodes;
+				                if(eGeocodes.length && eResult.info === 'OK'){
+				                		var eLoc = eGeocodes[0].location;
+				                		var seRouter = [
+				                			{
+				                				x: sLoc.lng,
+				                				y: sLoc.lat,
+				                				startTime: '6:00',
+				                				content: sName
+				                			},
+				                			{
+				                				x: eLoc.lng,
+				                				y: eLoc.lat,
+				                				content: eName
+				                			}
+				                		];
+				                		//规划路线
+				                		container.fadeOut();
+				                		events.set('router', seRouter);
+									events.trigger('mapRefresh');
+									events.trigger('drawOriginDestination');
+									events.trigger('getWayPoints');
+									events.trigger('drawRouter');
+									events.trigger('carRun');
+									events.trigger('calcuSpeed');
+									events.trigger('getWeather');
+				                		
+				                }
+				            }
+	                			
+	                			
+	                		});
+	                }
+	            }
+	        });
+	        
+		});
+		
 		
 	});
 	
-	
-	
 });

meitu/js/main.js

@@ -7,9 +7,7 @@ requirejs([
 		'lib/fastclick',
 		'lib/underscore',
 		'home/map',
-		'home/events',
 		'home/dashboard',
-		'home/router',
 		'home/info',
 		'home/tools',
 		'home/search'