$(function () {
var $secB = $("#secB");
$("#chartD").css({"width":$secB.width() - 10,"height":$secB.height()});
var $seC = $("#secC");
$("#chartE").css({"width":$seC.width() - 10,"height":$seC.height()});
var weatherArea = $("#weatherArea");
var weather = $("#weather");
weatherArea.attr("height", weather.height());
weatherArea.attr("width", weather.width());
//插件调用地址
weatherArea.attr("src", "http://www.thinkpage.cn/weather/weather.aspx?uid=U043823AC5&cid=CHZJ000000&l=zh-CHS&p=SMART&a=1&u=C&s=1&m=0&x=0&d=3&fc=FFFFFF&bgc=&bc=&ti=0&in=0&li=");
if (weather.height() > 100) {
weather.css("paddingTop", parseInt((weather.height() - 100) / 2))
} else {
weather.css("paddingTop", 0)
}
var curWeather = {
"results": [{
"location": {
"id": "C23NB62W20TF",
"name": "西雅图",
"country": "US",
"timezone": "America/Los_Angeles",
"timezone_offset": "-07:00"
},
"now": {
"text": "多云", //天气现象文字
"code": "4", //天气现象代码
"temperature": "14", //温度,单位为c摄氏度或f华氏度
"feels_like": "14", //体感温度,单位为c摄氏度或f华氏度
"pressure": "1018", //气压,单位为mb百帕或in英寸
"humidity": "76", //相对湿度,0~100,单位为百分比
"visibility": "16.09", //能见度,单位为km公里或mi英里
"wind_direction": "西北", //风向文字
"wind_direction_degree": "340", //风向角度,范围0~360,0为正北,90为正东,180为正南,270为正西
"wind_speed": "8.05", //风速,单位为km/h公里每小时或mph英里每小时
"wind_scale": "2", //风力等级,请参考:http://baike.baidu.com/view/465076.htm
"clouds": "90", //云量,范围0~100,天空被云覆盖的百分比
"dew_point": "-12" //露点温度,请参考:http://baike.baidu.com/view/118348.htm
},
"last_update": "2015-09-25T22:45:00-07:00" //数据更新时间(该城市的本地时间)
}]
};
var clock = new Vue({
el: '#clock',
data: {
data: "2016年5月7号 周五",
time: "13:33",
imageSrc: "views/hkclient/common/weather_png/99.png",
temperature: 22,
feels_like: 24,
wind_direction: "北",
wind_scale: 1,
humidity: 20
}
});
var dayTran = ["一", "二", "三", "四", "五", "六", "日"];
function renewClock() {
clock.data = (new Date()).toLocaleDateString() + " 星期" + dayTran[(new Date()).getDay() - 1];
clock.time = (new Date()).getHours() + ":" + (new Date()).getMinutes();
}
renewClock();
var renewClockTimer = setInterval(renewClock, 40000);
var timer1;
var count = 0;
var secA = $("#secA");
var height = secA.height();
loadXxlist(height);
//window.clearInterval(timer1);
var toRollMsgList;
timer1 = window.setInterval(function () {
height = secA.height();
loadSyph();
count++;
if (count > 10) {
count = 0;
loadXxlist(height);
getHkClentWeather();
}
}, 600000);
/**
* 加载消息
*/
function loadXxlist(height) {
clearInterval(toRollMsgList);
var mcid = $("#mcid").val();
var count = parseInt(parseInt(height) / 33);
//count = 5;
jQuery.getJSON("getHkClientXxts.htm", {mcid: mcid, count: count}, function (data) {
var html = "";
var bjjb = "";
for (var o in data) {
var str = data[o].bt;
str = str.replace(/\d{4}(-)\d{2}\1\d{2}\s\d{2}(:)\d{2}\2\d{2}/g, "");
//console.log(str + "-" + str.indexOf('清除') + "-" + str.indexOf('恢复'));
if (str.indexOf('清除') > 0 || str.indexOf('恢复') > 0) {
bjjb = "style='color:green;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;'";
} else {
bjjb = "style='color:red;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;'";
}
if (str.length > 33) {
str = str.substring(0, 31) + "...";
}
var sj = data[o].fbsjString;
if (sj.length > 8) {
sj = sj.substring(5, sj.length - 3);
}
html += "
";
html += "" + str + "";
html += "" + sj + "";
html += "";
}
$("#xxlist").html(html);
//$("#xxlistCopy").html(html);
//滚动消息列表
var msgList = $("#xxlist");
var msgListHeight = msgList.height();
var msgListTop = parseInt(msgList.css("marginTop"));
toRollMsgList = setInterval(function () {
if (parseInt(msgList.css("marginTop")) > -msgListHeight) {
msgList.css("marginTop", --msgListTop);
} else {
msgList.css("marginTop", 0);
msgListTop = 0;
}
}, 40);
});
}
/**
* 天气
*/
function getHkClentWeather() {
jQuery.getJSON("getHkClentWeather.htm", {}, function (data) {
var now = data.results[0].now;
clock.imageSrc = "views/hkclient/common/weather_png/" + now.code + ".png";
clock.temperature = now.temperature;
});
}
getHkClentWeather();
function loadSyph() {
// var mcid = $("#mcid").val();
// if (mcid == 21) {
// hkclient.loadMobilePage("chartD", "getHkClientSYPHMain.htm?mcid=" + $("#mcid").val());
// }
hkclient.loadMobilePage("chartD", "getHkClientSYMain.htm?mcid=" + $("#mcid").val());
hkclient.loadMobilePage("chartE", "getHkClientPHMain.htm?mcid=" + $("#mcid").val());
}
loadSyph();
//获取canvas元素
var canvasleft = document.getElementById('canvasleft'), //获取canvas元素
context = canvasleft.getContext('2d'), //获取画图环境,指明为2d
centerX = canvasleft.width/2, //Canvas中心点x轴坐标
centerY = canvasleft.height/2, //Canvas中心点y轴坐标
rad = Math.PI*2/100, //将360度分成100份,那么每一份就是rad度
speed = 0; //加载的快慢就靠它了
//绘制5像素宽的运动外圈
function blueCircle(n){
context.save();
context.strokeStyle = "#f04f2f"; //设置描边样式
context.lineWidth = 5; //设置线宽
context.beginPath(); //路径开始
context.arc(centerX, centerY, 35 , -Math.PI/2, -Math.PI/2 +n*rad, false); //用于绘制圆弧context.arc(x坐标,y坐标,半径,起始角度,终止角度,顺时针/逆时针)
context.stroke(); //绘制
context.restore();
}
//绘制白色外圈
function whiteCircle(){
context.save();
context.beginPath();
context.lineWidth = 5; //设置线宽
context.strokeStyle = "#34171b";
context.arc(centerX, centerY, 35 , 0, Math.PI*2, false);
context.stroke();
context.closePath();
context.restore();
}
//百分比文字绘制
function text(n){
context.save(); //save和restore可以保证样式属性只运用于该段canvas元素
context.font = "bold 24px Arial"; //设置字体大小和字体
context.fillStyle = '#f04f2f';
//绘制字体,并且指定位置
context.fillText(n.toFixed(0), centerX-14, centerY-15);
//绘制字体,并且指定位置
var text = '今日未处理';
context.font = 'bold 14px Arial';
context.fillStyle = '#f04f2f';
context.fillText(text,centerX-38, centerY+15);
context.restore();
}
//绘制线条
function line(){
context.save();
context.moveTo(centerX-30,centerY-5);
context.lineTo(centerX+30,centerY-5);
context.lineWidth = 2;//线条的宽度
context.strokeStyle = "#f04f2f";//线条的颜色
context.stroke();//绘制
context.closePath();
}
//动画循环
(function drawFrame(){
window.requestAnimationFrame(drawFrame);
context.clearRect(0, 0, canvasleft.width, canvasleft.height);
whiteCircle();
blueCircle(speed);
text(speed);
line();
var jrwcl = $("#jrwcl").val();
if(speed > parseInt(jrwcl)) {
speed = parseInt(jrwcl);
}else{
speed += 0.3;
}
}());
/* //获取canvas元素
var canvasright = document.getElementById('canvasright'), //获取canvas元素
context1 = canvasright.getContext('2d'), //获取画图环境,指明为2d
centerX1 = canvasright.width/2, //Canvas中心点x轴坐标
centerY1 = canvasright.height/2, //Canvas中心点y轴坐标
rad1 = Math.PI*2/100, //将360度分成100份,那么每一份就是rad度
speeds = 0; //加载的快慢就靠它了
//绘制5像素宽的运动外圈
function blueCircle1(n){
context1.save();
context1.strokeStyle = "#f0b72f"; //设置描边样式
context1.lineWidth = 5; //设置线宽
context1.beginPath(); //路径开始
context1.arc(centerX, centerY, 30 , -Math.PI/2, -Math.PI/2 +n*rad1, false); //用于绘制圆弧context.arc(x坐标,y坐标,半径,起始角度,终止角度,顺时针/逆时针)
context1.stroke(); //绘制
context1.restore();
}
//绘制白色外圈
function whiteCircle1(){
context1.save();
context1.beginPath();
context1.lineWidth = 5; //设置线宽
context1.strokeStyle = "#50493e";
context1.arc(centerX1, centerY1, 30 , 0, Math.PI*2, false);
context1.stroke();
context1.closePath();
context.restore();
}
//百分比文字绘制
function text1(n){
context1.save(); //save和restore可以保证样式属性只运用于该段canvas元素
context1.font = "bold 16px Arial"; //设置字体大小和字体
context1.fillStyle = '#f0b72f';
//绘制字体,并且指定位置
context1.fillText(n.toFixed(0), centerX-8, centerY-15);
//绘制字体,并且指定位置
var text = '昨日未处理';
context1.font = 'bold 12px Arial';
context1.fillStyle = '#f0b72f';
context1.fillText(text,centerX1-32, centerY1+15);
context1.restore();
}
//绘制线条
function line1(){
context1.save();
context1.moveTo(centerX1-20,centerY1-5);
context1.lineTo(centerX1+20,centerY1-5);
context1.lineWidth = 2;//线条的宽度
context1.strokeStyle = "#f0b72f";//线条的颜色
context1.stroke();//绘制
context1.closePath();
}
//动画循环
(function drawFrame1(){
window.requestAnimationFrame(drawFrame1);
context1.clearRect(0, 0, canvasright.width, canvasright.height);
whiteCircle1();
blueCircle1(speeds);
text1(speeds);
line1();
var zrwcl = $("#zrwcl").val();
if(speeds > parseInt(zrwcl)) {
speeds = parseInt(zrwcl);
}else{
speeds += 0.3;
}
}());*/
});