Strona główna Odkrywaj Pomoc
Zarejestruj się Zaloguj się
bulomakaka
/
ekexiu.app
Obserwuj 2
Polub 1
Forkuj 0
Kod Problemy 0 Oczekujące zmiany 0 Commity 867 Wydania 0 Wiki
Przeglądaj źródła

发现

luyanan 7 lat temu
rodzic
9508929cdf
commit
84802b85c4
8 zmienionych plików z 1120 dodań i 2 usunięć
Widok podzielony Pokaż statystyki zmian
  1. 327 0
      app/html/discoverNew.html
  2. 2 2
      app/html/discover_index.html
  3. BIN
      app/images/cbd.jpg
  4. BIN
      app/images/muwu.jpg
  5. BIN
      app/images/shuijiao.jpg
  6. BIN
      app/images/yuantiao.jpg
  7. 375 0
      app/js/discoverNew.js
  8. 416 0
      app/js/public/mui.pullToRefresh1.js

+ 327 - 0
app/html/discoverNew.html
Wyświetl plik 

@ -0,0 +1,327 @@
1 
<!DOCTYPE html>
2 
<html>
3
4 
	<head>
5 
		<meta charset="UTF-8">
6 
		<title>发现</title>
7 
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
8 
		<link href="../css/mui.min.css" rel="stylesheet" />
9 
		<link href="../css/app.css" rel="stylesheet" />
10 
		<link href="../css/iconfont.css" rel="stylesheet" />
11 
		<style type="text/css">
12 
			.mui-bar~.mui-content .mui-fullscreen {
13 
				top: 44px;
14 
				height: auto;
15 
			}
16 
			.mui-pull-top-tips {
17 
				width: 100%;
18 
				height: 1px;
19 
			}
20 
			.mui-bar~.mui-pull-top-tips {
21 
				top: 24px;
22 
			}
23 
			.mui-pull-top-wrapper {
24 
				width: 100%;
25 
				height: 44px;
26 
				display: block;
27 
				text-align: center;
28 
				overflow: hidden;
29 
			}
30 
			.mui-pull-top-tips.mui-transitioning {
31 
				-webkit-transition-duration: 800ms;
32 
				transition-duration: 800ms;
33 
			}
34 
			.mui-pull-top-tips .mui-pull-loading {
35 
				-webkit-backface-visibility: hidden;
36 
				-webkit-transition-duration: 600ms;
37 
				transition-duration: 600ms;
38 
				margin: 0;
39 
			}
40 
			.mui-pull-top-wrapper .mui-icon,
41 
			.mui-pull-top-wrapper .mui-spinner {
42
43 
			}
44 
			.mui-pull-down-cap{
45 
				display:inline-block;
46 
				margin-top:22px;
47 
				margin-left:5px;
48 
			}
49 
			.mui-pull-top-wrapper .mui-icon.mui-reverse {
50 
				/*-webkit-transform: rotate(180deg) translateZ(0);*/
51 
			}
52 
			.mui-pull-bottom-tips {
53 
				text-align: center;
54 
				background-color: #efeff4;
55 
				font-size: 15px;
56 
				line-height: 40px;
57 
				color: #777;
58 
			}
59 
			.mui-pull-top-canvas {
60 
				overflow: hidden;
61 
				background-color: #fafafa;
62 
				border-radius: 40px;
63 
				box-shadow: 0 4px 10px #bbb;
64 
				width: 40px;
65 
				height: 40px;
66 
				margin: 0 auto;
67 
			}
68 
			.mui-pull-top-canvas canvas {
69 
				width: 40px;
70 
			}
71 
			.mui-slider-indicator.mui-segmented-control {
72 
				background-color: #efeff4;
73 
			}
74 
			.sizefont{
75 
				font-size:16px;
76 
			}
77 
			.elipse{
78 
				text-overflow:ellipsis;white-space:nowrap;overflow:hidden;
79 
			}
80 
			.bgImg{
81 
				display:block;height:276px;background-size:cover;
82 
			}
83 
			.photoTop{
84 
				top:135px;
85 
			}
86 
			.he{
87 
				height:35px;
88 
			}
89 
			.tem{
90 
				height:210px;
91 
			}
92 
		</style>
93 
	</head>
94 
	<body>
95 
		<div class="mui-content maincontent searchTab">
96 
			<!--<div id="slider1" class="mui-slider" style="top:40px;z-index: 1;">
97
98 
			</div>-->
99 
			<div id="slider" class="mui-slider mui-fullscreen">
100 
				<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
101 
					<div class="mui-scroll">
102 
						<a class="mui-control-item  mui-active" href="#item1mobile">最新文章</a>
103 
						<a class="mui-control-item" href="#item2mobile">前沿动态</a>
104 
						<a class="mui-control-item" href="#item3mobile">学术经验</a>
105 
						<a class="mui-control-item" href="#item4mobile">检测分析</a>
106 
						<a class="mui-control-item" href="#item5mobile">会议培训</a>
107 
						<a class="mui-control-item tab-article" href="#item6mobile">科袖访谈</a>
108 
						<a class="mui-control-item tab-article" href="#item7mobile">招聘招生</a>
109 
					</div>
110 
				</div>
111 
				<!--最后一张图片-->
112
113
114 
				<div class="mui-slider-group">
115 
					<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
116 
						<div id="scroll1" class="mui-scroll-wrapper">
117 
							<div class="mui-scroll" id="dd">
118 
							<div id="slider1" class="mui-slider">
119 
								<div class="mui-slider-group mui-slider-loop" style="height:210px;">
120 
					<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
121
122 
					<div class="mui-slider-item mui-slider-item-duplicate tem" data-id="">
123 
						<a href="#"  class="bgImg photoTop" style="background-image:url(../images/yuantiao.jpg);top:135px;">
124 
							<p class="mui-slider-title sizefont elipse he">静静看这世界</p>
125 
						</a>
126 
					</div>
127 
					<!--第一张图片-->
128 
					<div class="mui-slider-item" data-id="" style="height:210px;">
129 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/shuijiao.jpg);top:105px;height:210px;">
130 
							<p class="mui-slider-title sizefont elipse he">幸福就是可以一起睡觉幸福就是可以一起睡觉幸福就是可以一起睡觉幸福就是可以一起睡觉</p>
131 
						</a>
132 
					</div>
133 
					<!--第二张-->
134 
					<div class="mui-slider-item" data-id="">
135 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/muwu.jpg);top:135px;">
136 
							<p class="mui-slider-title sizefont elipse he">想要一间这样的木屋，静静的喝咖啡</p>
137 
						</a>
138 
					</div>
139 
					<!--第三张-->
140 
					<div class="mui-slider-item" data-id="">
141 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/cbd.jpg);top:135px;">
142 
							<p class="mui-slider-title sizefont">Color of SIP CBD</p>
143 
						</a>
144 
					</div>
145 
					<!--第四张-->
146 
					<div class="mui-slider-item" data-id="">
147 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/yuantiao.jpg);top:135px;">
148 
							<p class="mui-slider-title sizefont elipse">去外面看看</p>
149 
						</a>
150 
					</div>
151 
					<!--最后一张-->
152 
					<div class="mui-slider-item "data-id="">
153 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/yuantiao.jpg);top:135px;">
154 
							<p class="mui-slider-title sizefont elipse">静静看这世界</p>
155 
						</a>
156 
					</div>
157 
					<!--第一张-->
158 
					<div class="mui-slider-item mui-slider-item-duplicate" data-id="">
159 
						<a href="#" class="bgImg photoTop" style="background-image:url(../images/shuijiao.jpg);top:135px;">
160 
							<p class="mui-slider-title sizefont elipse">幸福就是可以一起睡觉幸福就是可以一起睡觉幸福就是可以一起睡觉幸福就是可以一起睡觉</p>
161 
						</a>
162 
					</div>
163 
				</div>
164 
				<div class="mui-slider-indicator mui-text-right" style="bottom:30px;">
165 
					<div class="mui-indicator mui-active"></div>
166 
					<div class="mui-indicator"></div>
167 
					<div class="mui-indicator"></div>
168 
					<div class="mui-indicator"></div>
169 
					<div class="mui-indicator"></div>
170 
				</div></div>
171 
								<ul class="mui-table-view" id="list">
172 
									<!--<li class="mui-table-view-cell">
173 
							<div class="flexCenter OflexCenter mui-clearfix">
174 
							<div class="madiaHead artHead"></div>
175 
							<div class="madiaInfo OmadiaInfo">
176 
							<p class="mui-ellipsis-2 h1Font">机械设备</p>
177 
							<p class="h2Font mui-ellipsis">
178 
								<span> 新闻</span>
179 
							<span class="nameSpan" style="margin-right:10px">北京科袖</span>
180 
							<span class="time">8月25日 14:29</span>
181 
							</p>
182 
							</div>
183 
							</div>
184 
									</li>-->
185 
								</ul>
186 
								<div class="nodatabox displayNone" >
187 
									<div class="nodata">
188 
										<div class="picbox picNull"></div>
189 
										<div class="txtbox">
190 
											<p class="noContip">暂时没有内容</p>
191 
										</div>
192 
									</div>
193 
								</div>
194 
							</div>
195 
						</div>
196 
					</div>
197 
					<div id="item2mobile" class="mui-slider-item mui-control-content posi">
198 
						<div class="mui-scroll-wrapper">
199 
							<div class="mui-scroll">
200 
								<ul class="mui-table-view" id="companyList">
201 
								</ul>
202 
								<div class="nodatabox displayNone" >
203 
									<div class="nodata">
204 
										<div class="picbox picNull"></div>
205 
										<div class="txtbox">
206 
											<p class="noContip">暂时没有内容</p>
207 
										</div>
208 
									</div>
209 
								</div>
210 
							</div>
211 
						</div>
212 
					</div>
213 
					<div id="item3mobile" class="mui-slider-item mui-control-content">
214 
						<div class="mui-scroll-wrapper">
215 
							<div class="mui-scroll">
216
217 
								<ul class="mui-table-view" id="resourceList">
218
219 
								</ul>
220 
								<div class="nodatabox displayNone" >
221 
									<div class="nodata">
222 
										<div class="picbox picNull"></div>
223 
										<div class="txtbox">
224 
											<p class="noContip">暂时没有内容</p>
225 
										</div>
226 
									</div>
227 
								</div>
228 
							</div>
229 
						</div>
230 
					</div>
231 
					<div id="item4mobile" class="mui-slider-item mui-control-content">
232 
						<div class="mui-scroll-wrapper">
233 
							<div class="mui-scroll">
234 
								<ul class="mui-table-view" id="patentList" >
235
236 
								</ul>
237 
								<div class="nodatabox displayNone" >
238 
									<div class="nodata">
239 
										<div class="picbox picNull"></div>
240 
										<div class="txtbox">
241 
											<p class="noContip">暂时没有内容</p>
242 
										</div>
243 
									</div>
244 
								</div>
245 
							</div>
246 
						</div>
247 
					</div>
248 
					<div id="item5mobile" class="mui-slider-item mui-control-content">
249 
						<div class="mui-scroll-wrapper">
250 
							<div class="mui-scroll">
251 
								<ul class="mui-table-view" id="paperList">
252
253 
								</ul>
254 
								<div class="nodatabox displayNone" >
255 
									<div class="nodata">
256 
										<div class="picbox picNull"></div>
257 
										<div class="txtbox">
258 
											<p class="noContip">暂时没有内容</p>
259 
										</div>
260 
									</div>
261 
								</div>
262 
							</div>
263 
						</div>
264 
					</div>
265 
					<div id="item6mobile" class="mui-slider-item mui-control-content cnt-article">
266 
						<div class="mui-scroll-wrapper">
267 
							<div class="mui-scroll">
268 
								<ul class="mui-table-view" id="articleList">
269 
									<!--<li class="mui-table-view-cell">
270 
										<div class="flexCenter OflexCenter mui-clearfix">
271 
											<div class="madiaHead artHead"></div>
272 
											<div class="madiaInfo OmadiaInfo">
273 
												<p class="mui-ellipsis-2 h1Font">文章名称章名称文章名称</p>
274 
												<p><span class="h2Font">张某某</span><em class="authicon authicon-pro" title="科袖认证专家"></em></p>
275 
											</div>
276 
										</div>
277 
									</li>-->
278 
								</ul>
279 
								<div class="nodatabox displayNone" >
280 
									<div class="nodata">
281 
										<div class="picbox picNull"></div>
282 
										<div class="txtbox">
283 
											<p class="noContip">暂时没有内容</p>
284 
										</div>
285 
									</div>
286 
								</div>
287 
							</div>
288 
						</div>
289 
					</div>
290 
				<div id="item7mobile" class="mui-slider-item mui-control-content cnt-article">
291 
						<div class="mui-scroll-wrapper">
292 
							<div class="mui-scroll">
293 
								<ul class="mui-table-view" id="">
294 
									<!--<li class="mui-table-view-cell">
295 
										<div class="flexCenter OflexCenter mui-clearfix">
296 
											<div class="madiaHead artHead"></div>
297 
											<div class="madiaInfo OmadiaInfo">
298 
												<p class="mui-ellipsis-2 h1Font">文章名称章名称文章名称</p>
299 
												<p><span class="h2Font">张某某</span><em class="authicon authicon-pro" title="科袖认证专家"></em></p>
300 
											</div>
301 
										</div>
302 
									</li>-->
303 
								</ul>
304 
								<div class="nodatabox displayNone" >
305 
									<div class="nodata">
306 
										<div class="picbox picNull"></div>
307 
										<div class="txtbox">
308 
											<p class="noContip">暂时没有内容</p>
309 
										</div>
310 
									</div>
311 
								</div>
312 
							</div>
313 
						</div>
314 
					</div>
315
316 
				</div>
317 
			</div>
318
319 
		</div>
320 
		<script src="../js/public/mui.min.js"></script>
321 
		<script src="../js/public/base.js"></script>
322 
		<script src="../js/public/mui.pullToRefresh1.js"></script>
323 
		<!--<script src="../js/public/mui.pullToRefresh.material.js"></script>-->
324 
		<script src="../js/discoverNew.js"></script>
325 
	</body>
326
327 
</html>

+ 2 - 2
app/html/discover_index.html
Wyświetl plik 

@ -21,8 +21,8 @@
21 21 
		<script type="text/javascript">
22 22 
			mui.init({
23 23 
			    subpages:[{
24 
					url:'discover.html',
25 
					id:'html/discover.html',
24 
					url:'discoverNew.html',
25 
					id:'html/discoverNew.html',
26 26 
					styles:{
27 27 
						top: '44px',
28 28 
						bottom: '0px',

BIN
app/images/cbd.jpg
Wyświetl plik


BIN
app/images/muwu.jpg
Wyświetl plik


BIN
app/images/shuijiao.jpg
Wyświetl plik


BIN
app/images/yuantiao.jpg
Wyświetl plik


+ 375 - 0
app/js/discoverNew.js
Wyświetl plik 

@ -0,0 +1,375 @@
1 
(function($) {
2 
	//阻尼系数
3 
	var key1 = [];
4 
	var m = 0;
5 
	var deceleration = mui.os.ios ? 0.003 : 0.0009;
6 
	$('.mui-scroll-wrapper').scroll({
7 
		bounce: false,
8 
		indicators: true, //是否显示滚动条
9 
		deceleration: deceleration
10 
	});
11 
	$.ready(function() {
12 
		$.plusReady(function() {
13 
			var columnType = {
14 
	"1":{
15 
		fullName:"个人原创",
16 
		shortName:"原创"
17 
	},
18 
	"2":{
19 
		fullName:"企业原创",
20 
		shortName:"原创"
21 
	},
22 
	"3":{
23 
		fullName:"前沿动态",
24 
		shortName:"前沿"
25 
	},
26 
	"4":{
27 
		fullName:"学术经验",
28 
		shortName:"经验"
29 
	},
30 
	"5":{
31 
		fullName:"分析检测",
32 
		shortName:"检测"
33 
	},
34 
	"6":{
35 
		fullName:"会议培训",
36 
		shortName:"会议"
37 
	},
38 
	"7":{
39 
		fullName:"科袖访谈",
40 
		shortName:"访谈"
41 
	},
42 
	"8":{
43 
		fullName:"招聘招生",
44 
		shortName:"招聘"
45 
	},
46 
	"9":{
47 
		fullName:"重大新闻",
48 
		shortName:"新闻"
49 
	}
50 
}
51 
			var slider = mui("#slider1");
52 
			slider.slider({
53 
				interval: 5000
54 
			});
55 
			var oWidth = getViewportSize().width;
56
57 
			function getViewportSize() {
58 
				return {
59 
					width: window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,
60 
					height: window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
61 
				};
62 
			}
63 
			for(var n = 0; n < 7; n++) {
64 
				document.getElementsByClassName("mui-control-item")[n].style.paddingLeft = (oWidth - 4.5 * 45) / 9 + "px";
65 
				document.getElementsByClassName("mui-control-item")[n].style.paddingRight = (oWidth - 4.5 * 45) / 9 + "px";
66 
			}
67
68 
			function Discover(obj) {
69 
				return new Discover.prototype.Init(obj);
70 
			}
71 
			Discover.prototype = {
72 
				pageNo: {
73 
					"a": 1,
74 
					"1": 1,
75 
					"2": 1,
76 
					"3": 1,
77 
					"4": 1,
78 
					"5": 1,
79 
					"6": 1,
80 
				},
81 
				colum: {
82 
					"a": "", //最新文章
83 
					"3": 3, //前沿动态
84 
					"4": 4, //学术经验
85 
					"5": 5, //检测分析
86 
					"6": 6, //会议培训
87 
					"7": 7, //科袖访谈
88 
					"8": 8 //招聘招生
89 
				},
90 
				constructor: Discover,
91 
				Init: function(obj) {
92 
					if(obj) {
93 
						this.ajax(obj)
94 
					}
95 
				},
96 
				ajax: function(obj) {
97 
					$.ajax(baseUrl + obj.url, {
98 
						data: obj.data,
99 
						dataType: 'json', //服务器返回json格式数据
100 
						type: "get", //HTTP请求类型
101 
						timeout: 10000, //超时时间设置为10秒；
102 
						traditional: true,
103 
						async: true,
104 
						success: function(data) {
105 
							console.log(JSON.stringify(data));
106 
							if(obj.sele) {
107 
								obj.fun.call(obj.sele, data);
108 
							} else {
109 
								obj.fun(data, obj.flag);
110 
							}
111 
						},
112 
						error: function(xhr, type, errorThrown) {
113 
							plus.nativeUI.toast("服务器链接超时", toastStyle);
114 
						}
115 
					});
116 
				},
117 
				bindEvent: function() {
118 
					//循环初始化所有下拉刷新，上拉加载。
119 
					var _this = this
120 
					$.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
121 
						key1[index] = $(pullRefreshEl).pullToRefresh({
122 
							down: {
123 
								callback: function() {
124 
									var self = this;
125 
									self.refresh(true);
126 
									setTimeout(function() {
127 
										var ul = self.element.querySelector('.mui-table-view');
128 
										ul.innerHTML = "";
129 
										if(index == 0) {
130 
											_this.pageNo.a = 1;
131 
											_this.colum.a = ""
132 
											$D({
133 
												"fun": ob.createFragment,
134 
												data: {
135 
													col: 9,
136 
													pageNo: 1
137 
												},
138 
												flag: 1,
139 
												url: "/ajax/article/find"
140 
											});
141 
										} else {
142 
											_this.pageNo[index] = 1;
143 
											_this.colum[index + 2] = index + 2;
144 
										}
145
146 
										$D({
147 
											"fun": _this.createFragment,
148 
											data: {
149 
												col: index ? _this.colum[index + 2] : _this.colum.a,
150 
												pageNo: 1
151 
											},
152 
											url: "/ajax/article/find"
153 
										});
154 
									}, 1000);
155 
									self.endPullDownToRefresh();
156 
								}
157
158 
							},
159 
							up: {
160 
								callback: function() {
161 
									var self = this;
162 
									setTimeout(function() {
163 
										var pa;
164 
										if(index == 0) {
165 
											pa = ++_this.pageNo.a;
166 
											_this.colum.a = ""
167 
										} else {
168 
											pa = ++_this.pageNo[index];
169 
											_this.colum[index + 2] = index + 2;
170 
										}
171 
										//var ul = self.element.querySelector('.mui-table-view');
172 
										$D({
173 
											"fun": _this.createFragment,
174 
											data: {
175 
												col: index ? _this.colum[index + 2] : _this.colum.a,
176 
												pageNo: pa
177 
											},
178 
											url: "/ajax/article/find"
179 
										});
180 
									}, 1000);
181 
								}
182 
							}
183 
						});
184 
					});
185 
					mui("#slider").on("tap", "li", function() {
186 
						var id = this.getAttribute("data-id");
187 
						var datatype = this.getAttribute("data-type");
188 
						var ownerid = this.getAttribute("owner-id");
189 
						if(datatype == 1) {
190 
							plus.nativeUI.showWaiting();
191 
							plus.webview.create("../html/professorArticle.html", '../html/professorArticle.html', {}, {
192 
								articleId: id,
193 
								ownerid: ownerid,
194 
							});
195 
						} else if(datatype == 2) {
196 
							plus.nativeUI.showWaiting();
197 
							plus.webview.create("../html/professorArticle.html", '../html/professorArticle.html', {}, {
198 
								articleId: id,
199 
								ownerid: ownerid,
200 
								oFlag: 1
201 
							});
202 
						}
203 
					})
204 
				},
205 
				proName: function(data) {
206 
					if(data.success) {
207 
						this.innerHTML = data.data.name;
208 
					}
209 
				},
210 
				orgName: function(data) {
211 
					if(data.success) {
212 
						if(data.data.forShort) {
213 
							this.innerHTML = data.data.forShort;
214 
						} else {
215 
							this.innerHTML = data.data.name;
216 
						}
217
218 
					}
219 
				},
220 
				createFragment: function(data) {
221 
					if(!arguments[1]) {
222 
						document.getElementsByClassName("nodatabox")[m].classList.add("displayNone");
223 
						if(data.data.data.length == 0) {
224 
							document.getElementsByClassName("nodatabox")[m].classList.remove("displayNone");
225 
							key1[m].endPullUpToRefresh(true);
226 
							return;
227 
						}
228 
						if(data.data.pageNo < Math.ceil(data.data.total / data.data.pageSize)) {
229 
							key1[m].endPullUpToRefresh(false);
230 
						} else {
231 
							key1[m].endPullUpToRefresh(true);
232 
						}
233 
					}
234
235 
					var $data = data.data.data;
236 
					if(arguments[1]) {
237 
						if($data.length > 1) {
238 
							$data.length = 1;
239 
						}
240 
					}
241 
					for(var i = 0; i < $data.length; i++) {
242 
						var of ;
243 
						if($data[i].articleType == 1) { of = 1;
244 
						} else { of = 2;
245 
						}
246 
						var arImg = "../images/default-artical.jpg";
247 
						if($data[i].articleImg) {
248 
							arImg = baseUrl + "/data/article/" + $data[i].articleImg
249 
						}
250 
						var title = $data[i].articleTitle;
251 
						var colSpan="";
252 
						if(m==0) {
253 
							if(arguments[1]) {
254 
								colSpan="<span style='border:1px solid red;border-radius:3px;padding:0px 1px;margin-right:5px;color:red;'>置顶</span>"
255 
							}else{
256 
								if($data[i].colNum!=0)
257 
							colSpan="<span style='border:1px solid green;border-radius:3px;padding:0px 1px;margin-right:5px;color:green;'>"+columnType[$data[i].colNum].shortName+"</span>"
258 
							}
259
260 
						}
261 
						var li = document.createElement("li");
262 
						li.setAttribute("data-id", $data[i].articleId);
263 
						li.setAttribute("data-flag", 3);
264 
						li.className = "mui-table-view-cell";
265 
						li.innerHTML = '<div class="flexCenter OflexCenter mui-clearfix">' +
266 
							'<div class="madiaHead artHead" style="background-image:url(' + arImg + ')"></div>' +
267 
							'<div class="madiaInfo OmadiaInfo">' +
268 
							'<p class="mui-ellipsis-2 h1Font">' + title + '</p>' +
269 
							'<p class="h2Font mui-ellipsis">' +colSpan+
270 
							'<span class="nameSpan" style="margin-right:10px"></span>' +
271 
							'<span class="time">' + commenTime($data[i].publishTime) + '</span>' +
272 
							'</p>' +
273 
							'</div>' +
274 
							'</div>'
275 
						if(arguments[1]) {
276 
							if(document.getElementsByTagName("ul")[m].children[0]) {
277 
								document.getElementsByTagName("ul")[m].insertBefore(li, document.getElementsByTagName("ul")[m].children[0])
278 
							} else {
279 
								document.getElementsByTagName("ul")[m].appendChild(li);
280 
							}
281 
						} else {
282 
							document.getElementsByTagName("ul")[m].appendChild(li);
283 
						}
284 
						if( of == 1) {
285 
							li.setAttribute("owner-id", $data[i].professorId);
286 
							li.setAttribute("data-type", 1);
287 
							$D({
288 
								data: {},
289 
								fun: ob.proName,
290 
								url: "/ajax/professor/editBaseInfo/" + $data[i].professorId,
291 
								sele: li.getElementsByClassName("nameSpan")[0]
292 
							});
293 
						} else {
294 
							li.setAttribute("owner-id", $data[i].orgId);
295 
							li.setAttribute("data-type", 2);
296 
							$D({
297 
								data: {},
298 
								fun: ob.orgName,
299 
								url: "/ajax/org/" + $data[i].orgId,
300 
								sele: li.getElementsByClassName("nameSpan")[0]
301 
							});
302 
						}
303 
					}
304 
				}
305 
			}
306 
			Discover.prototype.Init.prototype = Discover.prototype;
307 
			var $D = Discover;
308 
			$D().bindEvent();
309 
			var ob = $D();
310 
			//alert(ob.createFragment)
311 
			$D({
312 
				"fun": ob.createFragment,
313 
				data: {
314 
					col: "",
315 
					pageNo: ob.pageNo.a
316 
				},
317 
				url: "/ajax/article/find"
318 
			});
319 
			$D({
320 
				"fun": ob.createFragment,
321 
				data: {
322 
					col: 9,
323 
					pageNo: 1
324 
				},
325 
				flag: 1,
326 
				url: "/ajax/article/find"
327 
			});
328 
			document.querySelector('#slider').addEventListener('slide', function(event) {
329
330 
				var $this = document.querySelector(".mui-scroll .mui-active");
331 
				if($this.innerHTML == "前沿动态") {
332 
					m = 1;
333 
				} else if($this.innerHTML == "学术经验") {
334 
					m = 2;
335 
				} else if($this.innerHTML == "检测分析") {
336 
					m = 3;
337 
				} else if($this.innerHTML == "会议培训") {
338 
					m = 4;
339 
				} else if($this.innerHTML == "科袖访谈") {
340 
					m = 5;
341 
				} else if($this.innerHTML == "招聘招生") {
342 
					m = 6;
343 
				} else if($this.innerHTML == "最新文章") {
344 
					m = 0;
345 
				}
346 
				if(!$this.getAttribute("flag")) {
347
348 
					$this.setAttribute("flag", 1);
349
350 
					$D({
351 
						"fun": ob.createFragment,
352 
						data: {
353 
							col: m + 2,
354 
							pageNo: 1
355 
						},
356 
						url: "/ajax/article/find"
357 
					});
358 
				}
359 
			})
360 
			$.ajax(baseUrl + "/inc/col_bannerApp.html", {
361 
						dataType: 'html', //服务器返回json格式数据
362 
						type: "get", //HTTP请求类型
363 
						timeout: 10000, //超时时间设置为10秒；
364 
						traditional: true,
365 
						async: true,
366 
						success: function(data) {
367 
								document.getElementById("slider1").innerHTML=data;
368 
						},
369 
						error: function(xhr, type, errorThrown) {
370 
							//plus.nativeUI.toast("服务器链接超时", toastStyle);
371 
						}
372 
					});
373 
		})
374 
	})
375 
})(mui)

+ 416 - 0
app/js/public/mui.pullToRefresh1.js
Wyświetl plik 

@ -0,0 +1,416 @@
1 
(function($, window, document) {
2 
	var STATE_BEFORECHANGEOFFSET = 'beforeChangeOffset';
3 
	var STATE_AFTERCHANGEOFFSET = 'afterChangeOffset';
4
5 
	var EVENT_PULLSTART = 'pullstart';
6 
	var EVENT_PULLING = 'pulling';
7 
	var EVENT_BEFORECHANGEOFFSET = STATE_BEFORECHANGEOFFSET;
8 
	var EVENT_AFTERCHANGEOFFSET = STATE_AFTERCHANGEOFFSET;
9 
	var EVENT_DRAGENDAFTERCHANGEOFFSET = 'dragEndAfterChangeOffset';
10
11 
	var CLASS_TRANSITIONING = $.className('transitioning');
12 
	var CLASS_PULL_TOP_TIPS = $.className('pull-top-tips');
13 
	var CLASS_PULL_BOTTOM_TIPS = $.className('pull-bottom-tips');
14 
	var CLASS_PULL_LOADING = $.className('pull-loading');
15 
	var CLASS_SCROLL = $.className('scroll');
16
17 
	var CLASS_PULL_TOP_ARROW = $.className('pull-loading') + ' ' + $.className('icon') + ' ' + $.className('icon-pulldown');
18 
	var CLASS_PULL_TOP_ARROW_REVERSE = CLASS_PULL_TOP_ARROW + ' ' + $.className('reverse');
19 
	var CLASS_PULL_TOP_SPINNER = $.className('pull-loading') + ' ' + $.className('spinner');
20 
	var CLASS_HIDDEN = $.className('hidden');
21
22 
	var SELECTOR_PULL_LOADING = '.' + CLASS_PULL_LOADING;
23 
	$.PullToRefresh = $.Class.extend({
24 
		init: function(element, options) {
25 
			this.element = element;
26 
			this.options = $.extend(true, {
27 
				down: {
28 
					height: 45,
29 
					callback: false,
30 
				},
31 
				up: {
32 
					auto: false,
33 
					offset: 100, //距离底部高度(到达该高度即触发)
34 
					show: true,
35 
					contentinit: '上拉显示更多',
36 
					contentdown: '上拉显示更多',
37 
					contentrefresh: '正在加载...',
38 
					contentnomore: '没有更多数据了',
39 
					callback: false
40 
				},
41 
				preventDefaultException: {
42 
					tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/
43 
				}
44 
			}, options);
45 
			this.stopped = this.isNeedRefresh = this.isDragging = false;
46 
			this.state = STATE_BEFORECHANGEOFFSET;
47 
			this.isInScroll = this.element.classList.contains(CLASS_SCROLL);
48 
			this.initPullUpTips();
49
50 
			this.initEvent();
51 
		},
52 
		_preventDefaultException: function(el, exceptions) {
53 
			for (var i in exceptions) {
54 
				if (exceptions[i].test(el[i])) {
55 
					return true;
56 
				}
57 
			}
58 
			return false;
59 
		},
60 
		initEvent: function() {
61 
			if ($.isFunction(this.options.down.callback)) {
62 
				this.element.addEventListener($.EVENT_START, this);
63 
				this.element.addEventListener('drag', this);
64 
				this.element.addEventListener('dragend', this);
65 
			}
66 
			if (this.pullUpTips) {
67 
				this.element.addEventListener('dragup', this);
68 
				if (this.isInScroll) {
69 
					this.element.addEventListener('scrollbottom', this);
70 
				} else {
71 
					window.addEventListener('scroll', this);
72 
				}
73 
			}
74 
		},
75 
		handleEvent: function(e) {
76 
			switch (e.type) {
77 
				case $.EVENT_START:
78 
					this.isInScroll && this._canPullDown() && e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
79 
					break;
80 
				case 'drag':
81 
					this._drag(e);
82 
					break;
83 
				case 'dragend':
84 
					this._dragend(e);
85 
					break;
86 
				case 'webkitTransitionEnd':
87 
					this._transitionEnd(e);
88 
					break;
89 
				case 'dragup':
90 
				case 'scroll':
91 
					this._dragup(e);
92 
					break;
93 
				case 'scrollbottom':
94 
					if (e.target === this.element) {
95 
						this.pullUpLoading(e);
96 
					}
97 
					break;
98 
			}
99 
		},
100 
		initPullDownTips: function() {
101 
			var self = this;
102 
			if ($.isFunction(self.options.down.callback)) {
103 
				self.pullDownTips = (function() {
104 
					var element = document.querySelector('.' + CLASS_PULL_TOP_TIPS);
105 
					if (element) {
106 
						element.parentNode.removeChild(element);
107 
					}
108 
					if (!element) {
109 
						element = document.createElement('div');
110 
						element.classList.add(CLASS_PULL_TOP_TIPS);
111 
						element.innerHTML = '<div class="mui-pull-top-wrapper"><span class="mui-pull-loading mui-icon mui-icon-pulldown"></span><span class="mui-pull-down-cap">下拉可以刷新</span></div>';
112 
						element.addEventListener('webkitTransitionEnd', self);
113 
					}
114 
					var ul = self.element.querySelector(".mui-table-view");
115 
					var Vl = self.element.querySelector("#slider1");
116 
					(Vl)?ul.parentElement.insertBefore(element,Vl):ul.parentElement.insertBefore(element,ul);
117 
					self.pullDownTipsIcon = element.querySelector(SELECTOR_PULL_LOADING);
118 
					self.pullDownTipsCap=element.querySelector(".mui-pull-down-cap");
119 
					return element;
120 
				}());
121 
			}
122 
		},
123 
		initPullUpTips: function() {
124 
			var self = this;
125 
			if ($.isFunction(self.options.up.callback)) {
126 
				self.pullUpTips = (function() {
127 
					var element = self.element.querySelector('.' + CLASS_PULL_BOTTOM_TIPS);
128 
					if (!element) {
129 
						element = document.createElement('div');
130 
						element.classList.add(CLASS_PULL_BOTTOM_TIPS);
131 
						if (!self.options.up.show) {
132 
							element.classList.add(CLASS_HIDDEN);
133 
						}
134 
						element.innerHTML = '<div class="mui-pull-bottom-wrapper"><span class="mui-pull-loading">' + self.options.up.contentinit + '</span></div>';
135 
						self.element.appendChild(element);
136 
					}
137 
					self.pullUpTipsIcon = element.querySelector(SELECTOR_PULL_LOADING);
138 
					return element;
139 
				}());
140 
			}
141 
		},
142 
		_transitionEnd: function(e) {
143 
			if (e.target === this.pullDownTips && this.removing) {
144 
				this.removePullDownTips();
145 
			}
146 
		},
147 
		_dragup: function(e) {
148 
			var self = this;
149 
			if (self.loading) {
150 
				return;
151 
			}
152 
			if (e && e.detail && $.gestures.session.drag) {
153 
				self.isDraggingUp = true;
154 
			} else {
155 
				if (!self.isDraggingUp) { //scroll event
156 
					return;
157 
				}
158 
			}
159 
			if (!self.isDragging) {
160 
				if (self._canPullUp()) {
161 
					self.pullUpLoading(e);
162 
				}
163 
			}
164 
		},
165 
		_canPullUp: function() {
166 
			if (this.removing) {
167 
				return false;
168 
			}
169 
			if (this.isInScroll) {
170 
				var scrollId = this.element.parentNode.getAttribute('data-scroll');
171 
				if (scrollId) {
172 
					var scrollApi = $.data[scrollId];
173 
					return scrollApi.y === scrollApi.maxScrollY;
174 
				}
175 
			}
176 
			return window.pageYOffset + window.innerHeight + this.options.up.offset >= document.documentElement.scrollHeight;
177 
		},
178 
		_canPullDown: function() {
179 
			if (this.removing) {
180 
				return false;
181 
			}
182 
			if (this.isInScroll) {
183 
				var scrollId = this.element.parentNode.getAttribute('data-scroll');
184 
				if (scrollId) {
185 
					var scrollApi = $.data[scrollId];
186 
					return scrollApi.y === 0;
187 
				}
188 
			}
189 
			return document.body.scrollTop === 0;
190 
		},
191 
		_drag: function(e) {
192 
			if (this.loading || this.stopped) {
193 
				e.stopPropagation();
194 
				e.detail.gesture.preventDefault();
195 
				return;
196 
			}
197 
			var detail = e.detail;
198 
			if (!this.isDragging) {
199 
				if (detail.direction === 'down' && this._canPullDown()) {
200 
					if (document.querySelector('.' + CLASS_PULL_TOP_TIPS)) {
201 
						e.stopPropagation();
202 
						e.detail.gesture.preventDefault();
203 
						return;
204 
					}
205 
					this.isDragging = true;
206 
					this.removing = false;
207 
					this.startDeltaY = detail.deltaY;
208 
					$.gestures.session.lockDirection = true; //锁定方向
209 
					$.gestures.session.startDirection = detail.direction;
210 
					this._pullStart(this.startDeltaY);
211 
				}
212 
			}
213 
			if (this.isDragging) {
214 
				e.stopPropagation();
215 
				e.detail.gesture.preventDefault();
216 
				var deltaY = detail.deltaY - this.startDeltaY;
217 
				deltaY = Math.min(deltaY, 1.5 * this.options.down.height);
218 
				this.deltaY = deltaY;
219 
				this._pulling(deltaY);
220 
				var state = deltaY > this.options.down.height ? STATE_AFTERCHANGEOFFSET : STATE_BEFORECHANGEOFFSET;
221 
				if (this.state !== state) {
222 
					this.state = state;
223 
					if (this.state === STATE_AFTERCHANGEOFFSET) {
224 
						this.removing = false;
225 
						this.isNeedRefresh = true;
226 
					} else {
227 
						this.removing = true;
228 
						this.isNeedRefresh = false;
229 
					}
230 
					this['_' + state](deltaY);
231 
				}
232 
				if ($.os.ios && parseFloat($.os.version) >= 8) {
233 
					var clientY = detail.gesture.touches[0].clientY;
234 
					if ((clientY + 10) > window.innerHeight || clientY < 10) {
235 
						this._dragend(e);
236 
						return;
237 
					}
238 
				}
239 
			}
240 
		},
241 
		_dragend: function(e) {
242 
			var self = this;
243 
			if (self.isDragging) {
244 
				self.isDragging = false;
245 
				self._dragEndAfterChangeOffset(self.isNeedRefresh);
246 
			}
247 
			if (self.isPullingUp) {
248 
				if (self.pullingUpTimeout) {
249 
					clearTimeout(self.pullingUpTimeout);
250 
				}
251 
				self.pullingUpTimeout = setTimeout(function() {
252 
					self.isPullingUp = false;
253 
				}, 1000);
254 
			}
255 
		},
256 
		_pullStart: function(startDeltaY) {
257 
			this.pullStart(startDeltaY);
258 
			$.trigger(this.element, EVENT_PULLSTART, {
259 
				api: this,
260 
				startDeltaY: startDeltaY
261 
			});
262 
		},
263 
		_pulling: function(deltaY) {
264 
			this.pulling(deltaY);
265 
			$.trigger(this.element, EVENT_PULLING, {
266 
				api: this,
267 
				deltaY: deltaY
268 
			});
269 
		},
270 
		_beforeChangeOffset: function(deltaY) {
271 
			this.beforeChangeOffset(deltaY);
272 
			$.trigger(this.element, EVENT_BEFORECHANGEOFFSET, {
273 
				api: this,
274 
				deltaY: deltaY
275 
			});
276 
		},
277 
		_afterChangeOffset: function(deltaY) {
278 
			this.afterChangeOffset(deltaY);
279 
			$.trigger(this.element, EVENT_AFTERCHANGEOFFSET, {
280 
				api: this,
281 
				deltaY: deltaY
282 
			});
283 
		},
284 
		_dragEndAfterChangeOffset: function(isNeedRefresh) {
285 
			this.dragEndAfterChangeOffset(isNeedRefresh);
286 
			$.trigger(this.element, EVENT_DRAGENDAFTERCHANGEOFFSET, {
287 
				api: this,
288 
				isNeedRefresh: isNeedRefresh
289 
			});
290 
		},
291 
		removePullDownTips: function() {
292 
			if (this.pullDownTips) {
293 
				try {
294 
					this.pullDownTips.parentNode && this.pullDownTips.parentNode.removeChild(this.pullDownTips);
295 
					this.pullDownTips = null;
296 
					this.removing = false;
297 
				} catch (e) {}
298 
			}
299 
		},
300 
		pullStart: function(startDeltaY) {
301 
			this.initPullDownTips(startDeltaY);
302 
		},
303 
		pulling: function(deltaY) {
304 
			//this.pullDownTips.style.webkitTransform = 'translate3d(0,' + deltaY + 'px,0)';
305 
			this.pullDownTips.style.height=""+(deltaY+1)+"px";
306
307 
		},
308 
		beforeChangeOffset: function(deltaY) {
309 
			this.pullDownTipsIcon.className = CLASS_PULL_TOP_ARROW;
310 
			this.pullDownTipsCap.innerHTML="下拉可以刷新";
311 
		},
312 
		afterChangeOffset: function(deltaY) {
313 
			this.pullDownTipsIcon.className = CLASS_PULL_TOP_ARROW_REVERSE;
314 
			this.pullDownTipsCap.innerHTML="释放立即刷新";
315 
		},
316 
		dragEndAfterChangeOffset: function(isNeedRefresh) {
317 
			if (isNeedRefresh) {
318 
				this.pullDownTipsIcon.className = CLASS_PULL_TOP_SPINNER;
319 
				this.pullDownTipsCap.innerHTML="正在刷新...";
320 
				this.pullDownLoading();
321 
			} else {
322 
				this.pullDownTipsIcon.className = CLASS_PULL_TOP_ARROW;
323 
				this.pullDownTipsCap.innerHTML="下拉可以刷新";
324 
				this.endPullDownToRefresh();
325 
			}
326 
		},
327 
		pullDownLoading: function() {
328 
			if (this.loading) {
329 
				return;
330 
			}
331 
			if (!this.pullDownTips) {
332 
				this.initPullDownTips();
333 
				this.dragEndAfterChangeOffset(true);
334 
				return;
335 
			}
336 
			this.loading = true;
337 
			this.pullDownTips.classList.add(CLASS_TRANSITIONING);
338 
			//this.pullDownTips.style.webkitTransform = 'translate3d(0,' + this.options.down.height + 'px,0)';
339 
			this.options.down.callback.apply(this);
340 
		},
341 
		pullUpLoading: function(e) {
342 
			if (this.loading || this.finished) {
343 
				return;
344 
			}
345 
			this.loading = true;
346 
			this.isDraggingUp = false;
347 
			this.pullUpTips.classList.remove(CLASS_HIDDEN);
348 
			e && e.detail && e.detail.gesture && e.detail.gesture.preventDefault();
349 
			this.pullUpTipsIcon.innerHTML = this.options.up.contentrefresh;
350 
			this.options.up.callback.apply(this);
351 
		},
352 
		endPullDownToRefresh: function() {
353 
			this.loading = false;
354 
			this.pullUpTips && this.pullUpTips.classList.remove(CLASS_HIDDEN);
355 
			this.pullDownTips.classList.add(CLASS_TRANSITIONING);
356 
			this.pullDownTips.style.webkitTransform = 'translate3d(0,0,0)';
357 
			if (this.deltaY <= 0) {
358 
				this.removePullDownTips();
359 
			} else {
360 
				this.removing = true;
361 
			}
362 
			if (this.isInScroll) {
363 
				$(this.element.parentNode).scroll().refresh();
364 
			}
365 
		},
366 
		endPullUpToRefresh: function(finished) {
367 
			if (finished) {
368 
				this.finished = true;
369 
				this.pullUpTipsIcon.innerHTML = this.options.up.contentnomore;
370 
				this.element.removeEventListener('dragup', this);
371 
				window.removeEventListener('scroll', this);
372 
			} else {
373 
				this.pullUpTipsIcon.innerHTML = this.options.up.contentdown;
374 
			}
375 
			this.loading = false;
376 
			if (this.isInScroll) {
377 
				$(this.element.parentNode).scroll().refresh();
378 
			}
379 
		},
380 
		setStopped: function(stopped) {
381 
			if (stopped != this.stopped) {
382 
				this.stopped = stopped;
383 
				this.pullUpTips && this.pullUpTips.classList[stopped ? 'add' : 'remove'](CLASS_HIDDEN);
384 
			}
385 
		},
386 
		refresh: function(isReset) {
387 
			if (isReset && this.finished && this.pullUpTipsIcon) {
388 
				this.pullUpTipsIcon.innerHTML = this.options.up.contentdown;
389 
				this.element.addEventListener('dragup', this);
390 
				window.addEventListener('scroll', this);
391 
				this.finished = false;
392 
			}
393 
		}
394 
	});
395 
	$.fn.pullToRefresh = function(options) {
396 
		var pullRefreshApis = [];
397 
		options = options || {};
398 
		this.each(function() {
399 
			var self = this;
400 
			var pullRefreshApi = null;
401 
			var id = self.getAttribute('data-pullToRefresh');
402 
			if (!id) {
403 
				id = ++$.uuid;
404 
				$.data[id] = pullRefreshApi = new $.PullToRefresh(self, options);
405 
				self.setAttribute('data-pullToRefresh', id);
406 
			} else {
407 
				pullRefreshApi = $.data[id];
408 
			}
409 
			if (options.up && options.up.auto) { //如果设置了auto，则自动上拉一次
410 
				pullRefreshApi.pullUpLoading();
411 
			}
412 
			pullRefreshApis.push(pullRefreshApi);
413 
		});
414 
		return pullRefreshApis.length === 1 ? pullRefreshApis[0] : pullRefreshApis;
415 
	}
416 
})(mui, window, document);