From bf5750a2ddb6d4fa34b2cdfd39c4ef8cd402c159 Mon Sep 17 00:00:00 2001
From: Li Jianxuan <la5c@qq.com>
Date: Tue, 8 Nov 2011 10:09:09 +0000
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=BA=86=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E4=BF=A1=E6=81=AF=E7=9A=84jquery=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../default/views/scripts/heihe/index.phtml   | 92 ++++++++++++-------
 1 file changed, 59 insertions(+), 33 deletions(-)

diff --git a/application/default/views/scripts/heihe/index.phtml b/application/default/views/scripts/heihe/index.phtml
index 53f6d5d4..af497236 100755
--- a/application/default/views/scripts/heihe/index.phtml
+++ b/application/default/views/scripts/heihe/index.phtml
@@ -1,34 +1,60 @@
-<?php
-$this->headTitle($this->config->title->site);
-$this->headTitle($this->config->title->data);
-$this->headTitle()->setSeparator(' - ');
-$this->headLink()->appendStylesheet('/css/water.css');
-$this->breadcrumb('<a href="/">首页</a>');
-$this->breadcrumb('<a href="/data">'.$this->config->title->data.'</a>');
-$this->breadcrumb($this->config->title->heihe);
-$this->breadcrumb()->setSeparator(' > ');
-?>
-<div id='sidebar'>
-<div id='leftnavi'>
-<?= $this->partial('heihe/navi.phtml'); ?>
-</div>
-</div>
-<div id='right'>
-<div class="clear">&nbsp;</div>
-<div id="intro">
-<h1>黑河流域数据简介</h1>
-<p>
-黑河流域是我国第二大内陆河流域，从流域上游到下游，以水为纽带形成了“冰雪/冻土－森林－草原－河流－湖泊－绿洲－沙漠－戈壁”的多元自然景观，流域内寒区和干旱区并存，山区冰冻圈和极端干旱的河流尾闾地区形成了鲜明对比。与此同时，黑河开发历史悠久，人类活动显著地影响了流域的水文环境，2000多年来，这一地区的农业开发，屯田垦殖，多种文化的碰撞交流、此消彼长，无不与水深刻地联系在一起。自然和人文过程交汇在一起，使黑河流域成为开展流域综合研究的一个十分理想的试验流域。
-无论从黑河流域独特的自然地理环境，还是从几千年的人类活动影响，黑河流域都是我国内陆河研究的重要基地。目前，大量科学研究与实验积累下来的丰富和宝贵的资料，为流域生态水文研究奠定了很好的科学数据基础。
-</p>
-<p>黑河流域各种类型的空间数据，其空间坐标系统主要包括了以下三个类型：WGS84坐标系，ALBERS坐标系，高斯坐标系。其中WGS84坐标系采用原点是地球质心，椭球体为WGS84椭球体，主要考虑到许多来自GPS野外定位测量的数据和国际组织机构发布的空间数据使用这一坐标系；ALBERS坐标系采用Krasovsky椭球体，两根标准纬线分别为北纬25度和北纬47度，中央经线采用东经105度，该坐标系主要在小比例尺而且要求保持等面积特性的数据情况下使用，如小于1:100万比例尺的数据，同时该投影与我国小比例尺专题图的投影是吻合的，有助于和这些数据的配准；高斯坐标系采用Krasovsky椭球体，中央经线采用东经99度，假东取500Km，该坐标系适用于大于等于50万比例尺的各类空间数据。</p>
-</div>
-<div id="heihe_ad">
-<h2>已整理数据展示</h2>
-<?php foreach($this->meatdata as $md) : ?>
+<?php
+$this->headTitle($this->config->title->site);
+$this->headTitle($this->config->title->data);
+$this->headTitle()->setSeparator(' - ');
+$this->headLink()->appendStylesheet('/css/water.css');
+$this->breadcrumb('<a href="/">首页</a>');
+$this->breadcrumb('<a href="/data">'.$this->config->title->data.'</a>');
+$this->headScript()->appendFile('/js/jquery-1.6.4.min.js');
+$this->breadcrumb($this->config->title->heihe);
+$this->breadcrumb()->setSeparator(' > ');
+?>
+<div id='sidebar'>
+<div id='leftnavi'>
+<?= $this->partial('heihe/navi.phtml'); ?>
+</div>
+</div>
+<div id='right'>
+<div class="clear">&nbsp;</div>
+<div id="intro">
+<h1>黑河流域数据简介</h1>
+<p>
+黑河流域是我国第二大内陆河流域，从流域上游到下游，以水为纽带形成了“冰雪/冻土－森林－草原－河流－湖泊－绿洲－沙漠－戈壁”的多元自然景观，流域内寒区和干旱区并存，山区冰冻圈和极端干旱的河流尾闾地区形成了鲜明对比。与此同时，黑河开发历史悠久，人类活动显著地影响了流域的水文环境，2000多年来，这一地区的农业开发，屯田垦殖，多种文化的碰撞交流、此消彼长，无不与水深刻地联系在一起。自然和人文过程交汇在一起，使黑河流域成为开展流域综合研究的一个十分理想的试验流域。
+无论从黑河流域独特的自然地理环境，还是从几千年的人类活动影响，黑河流域都是我国内陆河研究的重要基地。目前，大量科学研究与实验积累下来的丰富和宝贵的资料，为流域生态水文研究奠定了很好的科学数据基础。
+</p>
+<p>黑河流域各种类型的空间数据，其空间坐标系统主要包括了以下三个类型：WGS84坐标系，ALBERS坐标系，高斯坐标系。其中WGS84坐标系采用原点是地球质心，椭球体为WGS84椭球体，主要考虑到许多来自GPS野外定位测量的数据和国际组织机构发布的空间数据使用这一坐标系；ALBERS坐标系采用Krasovsky椭球体，两根标准纬线分别为北纬25度和北纬47度，中央经线采用东经105度，该坐标系主要在小比例尺而且要求保持等面积特性的数据情况下使用，如小于1:100万比例尺的数据，同时该投影与我国小比例尺专题图的投影是吻合的，有助于和这些数据的配准；高斯坐标系采用Krasovsky椭球体，中央经线采用东经99度，假东取500Km，该坐标系适用于大于等于50万比例尺的各类空间数据。</p>
+</div>
+<div id="heihe_ad">
+<h2>已整理数据展示</h2>
+<ul id="heihe_list">
+	<li><img src="/images/water/arid.jpg" /></li>
+	<li><img src="/images/water/arid.jpg" /></li>
+	<li><img src="/images/water/arid.jpg" /></li>
+</ul>
+<a href="javascript:;" onclick="changetlist()">换一组</a>
+<?php foreach($this->meatdata as $md) : ?>
 	<a href="/heihe/view/uuid/<?php echo $md['uuid']; ?>"><span><?php echo $md['title']; ?></span>
- 	<img src="/service/thumb/id/<?php echo $md['id']; ?>" alt="Data Thumbnail" title="<?php echo mb_strlen($md['description'])>400?$this->escape(mb_substr($md['description'],0,400,'UTF-8').'...'):$this->escape($md['description']);?>" />
- 	</a>
-<?php endforeach; ?>
-</div>
-</div>
\ No newline at end of file
+ 	<img src="/service/thumb/id/<?php echo $md['id']; ?>" alt="Data Thumbnail" title="<?php echo mb_strlen($md['description'])>400?$this->escape(mb_substr($md['description'],0,400,'UTF-8').'...'):$this->escape($md['description']);?>" />
+ 	</a>
+<?php endforeach; ?>
+
+</div>
+</div>
+<script type="text/javascript" language="javascript">
+function changetlist(){
+	$.getJSON("/heihe/changelist", function(data){
+		$('#heihe_list').html('');
+		if(data.length>0)
+		{
+			$.each(data, function(key, val) {
+				var a = '<a href="/heihe/view/uuid/'+val['uuid']+'"><span>'+val['title']+'</span>';
+				var img = '<img src="'+val['src']+'" alt="Data Thumbnail" />';
+				$('<li/>', {
+				//"class":'list_img',
+				"html": a+img+'</a>'
+				}).appendTo('#heihe_list');
+			});
+		}
+	});
+}
+</script>
\ No newline at end of file