{% load staticfiles %}

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>拍爱 PAI.AI 联系我们</title>
<meta name="keywords" content="摄影 图片 影像 分享 交流 社交 交友 摄影师 女性 孩子 亲子 旅行 旅游 约拍 iphone android app" />
<link href="{% static 'website/css/layout.css' %}" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="{% static 'website/js/jquery.min.js' %}"></script>
<style>
        
        .my-map { margin: 0 auto 30px auto; width: 550px; height: 350px;float:left}
        .my-map .icon { background: url(http://lbs.amap.com/console/public/show/marker.png) no-repeat; }
        .my-map .icon-cir { height: 31px; width: 28px; }
        .my-map .icon-cir-red { background-position: -11px -5px; }
    </style>
</head>

<body>
<div id="header">
	<div class="content">
	    <a href="{%  url 'pai2_home' %}" target="_self" class="logo"></a>
		<div class="navigation">
			<a href="{%  url 'pai2_contactus' %}" target="_self" class="current">联系我们</a>
			<a href="{%  url 'pai2_joinus' %}" target="_self" >加入拍爱</a>
            <a href="{%  url 'pai2_aboutus' %}" target="_self" >关于我们</a>
			<a href="{%  url 'pai2_home' %}" target="_self" >首页</a>
		</div>
	</div>	
</div>


<div id="container" ><div class="content contactus">
	
	
	
<div id="wrap" class="my-map map">
        <div id="mapContainer"></div>
    </div>
    <script src="http://webapi.amap.com/maps?v=1.2&key=8325164e247e15eea68b59e89200988b"></script>
    <script>
    !function(){
        var infoWindow, map, level = 16,
            center = {lng: 116.284361, lat: 39.931229},
            features = [{type: "Marker", name: "拍爱 PAI.AI", desc: "北京市海淀区西八里庄路玲珑商务楼", color: "red", icon: "cir", offset: {x: -9, y: -31}, lnglat: {lng: 116.28449, lat: 39.930834}}];
 
        function loadFeatures(){
            for(var feature, data, i = 0, len = features.length, j, jl, path; i < len; i++){
                data = features[i];
                switch(data.type){
                    case "Marker":
                        feature = new AMap.Marker({ map: map, position: new AMap.LngLat(data.lnglat.lng, data.lnglat.lat),
                            zIndex: 3, extData: data, offset: new AMap.Pixel(data.offset.x, data.offset.y), title: data.name,
                            content: '<div class="icon icon-' + data.icon + ' icon-'+ data.icon +'-' + data.color +'"></div>' });
                        break;
                    case "Polyline":
                        for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){
                            path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
                        }
                        feature = new AMap.Polyline({ map: map, path: path, extData: data, zIndex: 2,
                            strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity });
                        break;
                    case "Polygon":
                        for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){
                            path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
                        }
                        feature = new AMap.Polygon({ map: map, path: path, extData: data, zIndex: 1,
                            strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity,
                            fillColor: data.fillColor, fillOpacity: data.fillOpacity });
                        break;
                    default: feature = null;
                }
                if(feature){ AMap.event.addListener(feature, "click", mapFeatureClick); }
            }
        }
 
        function mapFeatureClick(e){
            if(!infoWindow){ infoWindow = new AMap.InfoWindow({autoMove: true}); }
            var extData = e.target.getExtData();
            infoWindow.setContent("<h5>" + extData.name + "</h5><div>" + extData.desc + "</div>");
            infoWindow.open(map, e.lnglat);
        }
 
        map = new AMap.Map("mapContainer", {center: new AMap.LngLat(center.lng, center.lat), level: level});
         
        loadFeatures();
        map.plugin(["AMap.ToolBar", "AMap.OverView", "AMap.Scale"], function(){
            map.addControl(new AMap.ToolBar);
            map.addControl(new AMap.OverView({isOpen: true}));
            map.addControl(new AMap.Scale);
        });
    }();
    </script>	
	
	<p style="width:400px;float:right"><img src="{% static 'website/img/weixin_qr.png' %}" ><br><strong>关注拍爱 官方微信：</strong>pai_ai</p>
	<p style="width:400px;float:right">
		<strong>商务合作：</strong>partner@pai.ai<br>
		
		<strong>用户反馈及帮助：</strong>feedback@pai.ai<br>
		<strong>公司地址：</strong>北京市海淀区西八里庄路玲珑商务楼
	</p>
	
</div></div>
<div id="footer">
	<div class="content foot">
	<a href="{%  url 'pai2_aboutus' %}" target="_self" >关于我们</a>
	<span>|</span>
	<a href="{%  url 'pai2_contactus' %}" target="_self" >联系我们</a>
    <span>|</span>
	<a href="{%  url 'pai2_termofservice' %}" target="_self" >服务条款</a>

	©2016 拍爱 PAI.AI 北京佳艺徕经贸有限责任公司 琼ICP备16000076号
	</div>
</div>
</body>
</html>
