const SetHome = new function() {
/*
xAxis:['105年', '106年', '107年', '108年', '109年'],
xAxisData:[550, 650, 850, 950, 1100]
*/
let self = this;
self.AreaInfoJson = AreaInfoJson;
self.SportInfoJson = [];
self.DataJson = {
DataDate:'112.7.31',
DataInfo:MainDataJson['Data'],
}
self.DataKey = '臺北市';
self.DataKeyEng = 'Taipei';
self.DataDate = '';
self.C1DataJson = {};
self.C2TaipeiTagInfoObj = document.querySelector( '.TaipeiTagInfo' );
self.C3DataJson = {};
self.C3Chart;
self.C4Chart;
self.C5Chart;
/*
self.C6DataJson = {
CheckNum:1275,
ImproveNum:228,
DataDate:'109.01.25'
};
*/
self.C7DataJson = {
Data:[
{
Image:'__/i/100_1.jpg',
Title:'Banana Fitness',
Tag:'健身房',
Address:'臺北市大同區重慶北路3段99號'
},
{
Image:'__/i/100_1.jpg',
Title:'Banana Fitnes1s',
Tag:'健身房1',
Address:'臺北市大同區重慶北路3段99號1'
}
]
};
self.C8DataJson = {
Data:[
{
Type:'消費專區',
TypeEng:'Consumer zone',
Title:'健身中心之「終生會籍」會員是否有效？',
Contents:'依據教育部體育署發布之「健身中心定型化契約應記載及不得記載事項」中規定「長期會員」期限不得超過10年，至於「終身會員」期限明顯超過10年，違反中央主管機關教育部體育署之規定，該約定條款應屬無效，併此說明。' ,
Tag:[
{ SN:1, Name:'契約', NameEng:'Contract' },{ SN:2, Name:'健身中心', NameEng:'GYM' }
]
},
{
Type:'消費專區',
TypeEng:'Consumer zone',
Title:'健身房常見消費爭議',
Contents:'Q1：小田為保持完美體態，與健身中心簽訂3年契約，但在使用3個月後，因朋友邀約欲前往澳洲打工度假，如向業者表示終止契約，是否還要給付其他費用?Ans：依據教育部體育署發布之「健身中心定型化契約應記載及不得記載事項」第7點第1項規定，消費者於加入健身中心成為會員後，雖可隨時終止契約，然同點第2項及第3項亦規定，消費者除因傷害或疾病等產生不可回復之健康問題，致不適宜運動須終止契約情況外，向業者終止合約時，除須繳交已經過月數產生的費用外，亦須給付一定金額之違約金。' ,
Tag:[
{ SN:1, Name:'契約', NameEng:'Contract' },{ SN:2, Name:'健身中心', NameEng:'GYM' }
]
}
]
};
self.Set = function() {
self.C1DataJson = JSON.parse( JSON.stringify( self.DataJson['DataInfo'][self.DataKey] ) );
self.DataDate = self.DataJson['DataDate'];
if( self.DataKey == '臺北市' ) {
var NewDataAry = [];
var NSportDataAry = [];
var NAreaDataAry = [];
for( var N in self.DataJson['DataInfo'] ) {
var D = self.DataJson['DataInfo'][N];
if( N == '臺北市' ) {
NSportDataAry = SortJsonAry( D['Item'], 'Num', 'D' );
/*產生SportInfo資料*/
for( var A = 0; A < D['Item'].length; A++ ) {
self.SportInfoJson.push( { 'Name': D['Item'][A]['Title'], 'NameEng': D['Item'][A]['TitleEng'] } );
}
} else {
var NameEng;
for( var A = 0; A < self.AreaInfoJson.length; A++ ) {
if( N == self.AreaInfoJson[A]['Name'] ) {
NameEng = self.AreaInfoJson[A]['EngName'];
break;
}
}
NewDataAry.push({
'Title':N,
'TitleEng':NameEng,
'Num':D['Num'],
'Item':D['Item'],
})
}
}
NAreaDataAry = SortJsonAry( NewDataAry, 'Num', 'D' );
var yAxisAry = [];
for( var A = 0; A < 5; A++ ) {
var T = NAreaDataAry[A]['Title']+' '+NAreaDataAry[A]['TitleEng'];
yAxisAry.push( T ); // yAxis:['士林區', '大安區', '中正區', '中山區', '南港區'],
}
var xAxisAry = [];
for( var S = 0; S < 5; S++ ) {
xAxisAry.push( NSportDataAry[S]['Title']+' '+NSportDataAry[S]['TitleEng'] ); // xAxis:['羽球', '排球', '網球', '桌球', '板球'],
}
self.ReturnC3Data( yAxisAry, xAxisAry );
} else {
}
/*
self.C3DataJson = {
yAxis:['士林區', '大安區', '中正區', '中山區', '南港區'],
xAxis:['羽球', '排球', '網球', '桌球', '板球'],
xAxisData:[
[18, 19, 15, 20, 32],
[18, 9, 10, 16, 28],
[6, 5, 8, 10, 9],
[29, 34, 22, 43, 39],
[8, 4, 5, 6, 9]
]
};
*/
}
self.ReturnC3Data = function( yAxisAry, xAxisAry ) {
var xAxisDataAry = [];
var NewyAxisAry = [];
for( var A = 0; A < yAxisAry.length; A++ ) {
NewyAxisAry[A] = yAxisAry[A].split( ' ' );
}
for( var S = 0; S < xAxisAry.length; S++ ) {
var AreaSportAry = [];
for( var A = 0; A < NewyAxisAry.length; A++ ) {
var N = NewyAxisAry[A];
var SportItemAry = self.DataJson['DataInfo'][N[0]]['Item'];
for( var SS = 0; SS < SportItemAry.length; SS++ ) {
var T = SportItemAry[SS]['Title']+' '+SportItemAry[SS]['TitleEng'];
if( T == xAxisAry[S] ) {
AreaSportAry.push( SportItemAry[SS]['Num'] );
}
}
}
xAxisDataAry.push( AreaSportAry );
}
self.C3DataJson = {};
self.C3DataJson = {
yAxis:yAxisAry,
xAxis:xAxisAry,
xAxisData:xAxisDataAry
}
}
self.ChangeDate = function( Key ) {
if( ! Key ) { Key = '臺北市'; }
self.DataKey = Key;
self.Set();
self.RunC1();
//self.RunC3SportTypeNum();
}
self.RunC1 = function() {
var C1Obj = document.getElementById( 'C1' );
var NameEng = self.DataKeyEng;
for( var A = 0; A < self.AreaInfoJson.length; A++ ) {
if( self.DataKey == self.AreaInfoJson[A]['Name'] ) {
NameEng = self.AreaInfoJson[A]['EngName'];
}
}
var CLeftObj = C1Obj.querySelector( '.CLeft' );
var CLeftCTextObj = CLeftObj.querySelector( '.CText' );
CLeftCTextObj.innerHTML = self.DataKey+""+NameEng+"";
var CLeftCNumObj = CLeftObj.querySelector( '.CNum' ).querySelector( 'span' );
CLeftCNumObj.innerHTML = self.C1DataJson.Num;
var CCenterCUpDateObj = C1Obj.querySelector( '.CCenter' ).querySelector( '.CUpDate' );
CCenterCUpDateObj.innerHTML = '截至'+self.DataDate;
var MaleNum = parseInt( self.C1DataJson.MaleNum );
var FemaleNum = parseInt( self.C1DataJson.FemaleNum );
var CCenterMaleObj = C1Obj.querySelector( '.CCenter' ).querySelector( '.Male' );
CCenterMaleObj.innerHTML = MaleNum.toLocaleString()+'人';
var CCenterFemaleObj = C1Obj.querySelector( '.CCenter' ).querySelector( '.Female' );
CCenterFemaleObj.innerHTML = FemaleNum.toLocaleString()+'人';
//服務率=(家數*3130) / 人口數
var CCenterServiceObj = C1Obj.querySelector( '.CCenter' ).querySelector( '.Service' );
var nn = ( self.C1DataJson.Num * 3130 ) / ( FemaleNum + MaleNum ) * 100;
console.log( '('+self.C1DataJson.Num +'*'+3130+') /'+'('+ ( FemaleNum+MaleNum ) +' )' );
CCenterServiceObj.innerHTML = '服務率 ( Service rate ) '+ nn.toFixed(2) +'%';
var CRAllObj = C1Obj.querySelector( '.CRAll' );
CRAllObj.innerHTML = '';
if( self.C1DataJson.Item.length ) {
var SDataAry = SortJsonAry( self.C1DataJson.Item, 'Num', 'D' );
//var l = ( SDataAry.length > 8 ) ? 8 : SDataAry.length ;
var l = SDataAry.length ;
for( var A = 0; A < l; A++ ) {
var CRItemObj = document.createElement( 'div' );
CRItemObj.classList.add( 'CRItem' );
var CTextObj = document.createElement( 'div' );
CTextObj.classList.add( 'CText' );
CTextObj.innerHTML = SDataAry[A]['Title']+""+SDataAry[A]['TitleEng']+"";
CRItemObj.appendChild( CTextObj );
var CNumObj = document.createElement( 'div' );
CNumObj.classList.add( 'CNum' );
CNumObj.innerHTML = ''+SDataAry[A]['Num']+'家';
CRItemObj.appendChild( CNumObj );
CRAllObj.appendChild( CRItemObj );
}
var AllW = 0;
var CRItemObjAry = CRAllObj.querySelectorAll( '.CRItem' );
for( var A = 0; A < CRItemObjAry.length; A++ ) {
AllW += CRItemObjAry[A].offsetWidth;
}
CRAllObj.style.width = ( AllW + 5 )+'px';
}
}
self.RunC2 = function() {
for( var AA = 0; AA < self.AreaInfoJson.length; AA++ ) {
var Name = '臺北市'+self.AreaInfoJson[AA]['Name'];
var AreaName = self.AreaInfoJson[AA]['Name'];
var AObj = document.getElementById( Name );
AObj.setAttribute( 'av', AreaName );
AObj.setAttribute( 't', 'area' );
AObj.onclick = function () {
self.ChangeDate( this.getAttribute( 'av' ) );
//self.RunC3ItemChange( this );
}
AObj.onmouseover = function () {
this.setAttribute( 't', 'hover' );
}
AObj.onmouseout = function () {
this.setAttribute( 't', '' );
}
var DivObj = document.createElement( 'a' );
DivObj.href = 'javascript:void(0);';
DivObj.title = AreaName+'運動場地數據';
DivObj.classList.add( 'Item' );
DivObj.setAttribute( 'v', Name );
DivObj.setAttribute( 'av', AreaName );
DivObj.setAttribute( 'a', AA );
DivObj.setAttribute( 't', 'area' );
DivObj.setAttribute( 'role', 'button' );
DivObj.innerHTML = self.AreaInfoJson[AA]['Name']+"
"+self.AreaInfoJson[AA]['EngName']+'';
DivObj.onclick = function () {
self.ChangeDate( this.getAttribute( 'av' ) );
//self.RunC3ItemChange( this );
}
DivObj.onmouseover = function () {
var N = this.getAttribute( 'v' );
document.getElementById( N ).setAttribute( 't', 'hover' );
}
DivObj.onmouseout = function () {
var N = this.getAttribute( 'v' );
document.getElementById( N ).setAttribute( 't', '' );
}
self.C2TaipeiTagInfoObj.appendChild( DivObj );
}
}
self.C2ReTagPosition = function() {
var CMTLConetntsObj = self.C2TaipeiTagInfoObj.parentNode;
var CMTLRectInfo = GetObjRectInfo( CMTLConetntsObj );
var ItemObjAry = self.C2TaipeiTagInfoObj.querySelectorAll( '.Item' );
for( var A = 0; A < ItemObjAry.length; A++ ) {
ItemObjAry[A].classList.add( 'Open' );
var Name = ItemObjAry[A].getAttribute( 'v' );
var AA = ItemObjAry[A].getAttribute( 'a' );
var MapAreaObj = document.getElementById( Name );
var ObjRectInfo = GetObjRectInfo( MapAreaObj );
ItemObjAry[A].style.top = ( ObjRectInfo['top'] - CMTLRectInfo['top'] + ObjRectInfo['height'] / 2 - ItemObjAry[A].offsetHeight / 2 + AreaInfoJson[AA]['MapTop'] * ObjRectInfo['height'] ) +'px';
ItemObjAry[A].style.left = ( ObjRectInfo['left'] - CMTLRectInfo['left'] + ObjRectInfo['width'] / 2 - ItemObjAry[A].offsetWidth / 2 + AreaInfoJson[AA]['MapLeft'] * ObjRectInfo['width'] ) +'px';
}
}
//C3圖表
self.RunC3SportTypeNum = function() {
var DfColor = [ "rgba(108, 164, 21, 1)", "rgba(162, 176, 41, 1)", "rgba(71, 186, 136, 1)", "rgba(94, 154, 128, 1)", "rgba(157, 178, 183, 1)" ];
var SportTypeNumObj = document.getElementById( 'SportTypeNum' );
SportTypeNumObj.innerHTML = '';
SportTypeNumObj.setAttribute( '_echarts_instance_', '' );
var option = {
textStyle: {
color: '#FFFFFF'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
left: 'left',
data: [],
textStyle: {
color: '#FFFFFF'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'value'
},
yAxis: {
type: 'category',
data: []
},
series: []
};
if( ! SportTypeNumObj.innerHTML ) {
self.C3Chart = echarts.init( SportTypeNumObj );
}
self.C3Chart.setOption( option );
var seriesData = [];
for( var A = 0; A < self.C3DataJson.xAxis.length; A++ ) {
var J = {
name: self.C3DataJson.xAxis[A],
type: 'bar',
stack: '總量',
label: {
show: true,
position: 'insideRight',
textStyle: {
color: '#FFFFFF'
}
},
itemStyle: {
color: DfColor[A]
},
data: self.C3DataJson.xAxisData[A]
}
seriesData.push( J );
}
var option = {
legend: {
data: self.C3DataJson.xAxis,
},
yAxis: {
data: self.C3DataJson.yAxis
},
series: seriesData
};
self.C3Chart.setOption( option );
}
//C3 Tag
self.RunC3 = function() {
var C3Area = document.getElementById( 'C3' ).querySelector( '.Area' ).querySelector( '.MDiv' );
var C3SType = document.getElementById( 'C3' ).querySelector( '.SType' ).querySelector( '.MDiv' );
for( var AA = 0; AA < self.AreaInfoJson.length; AA++ ) {
var DivObj = document.createElement( 'a' );
DivObj.href = 'javascript:void(0);';
DivObj.title = self.AreaInfoJson[AA]['Name'];
DivObj.innerHTML = self.AreaInfoJson[AA]['Name']+""+self.AreaInfoJson[AA]['EngName']+"";
DivObj.setAttribute( 'av', self.AreaInfoJson[AA]['Name'] );
DivObj.setAttribute( 'vv', self.AreaInfoJson[AA]['Name']+' '+self.AreaInfoJson[AA]['EngName'] );
DivObj.setAttribute( 't', 'area' );
DivObj.setAttribute( 'role', 'button' );
DivObj.onclick = function () { self.RunC3ItemChange( this ); }
C3Area.appendChild( DivObj );
}
for( var AA = 0; AA < self.SportInfoJson.length; AA++ ) {
var DivObj = document.createElement( 'a' );
DivObj.href = 'javascript:void(0);';
DivObj.title = self.SportInfoJson[AA]['Name'];
DivObj.innerHTML = self.SportInfoJson[AA]['Name']+""+self.SportInfoJson[AA]['NameEng']+"";
DivObj.setAttribute( 'av', self.SportInfoJson[AA]['Name'] );
DivObj.setAttribute( 'vv', self.SportInfoJson[AA]['Name']+' '+self.SportInfoJson[AA]['NameEng'] );
DivObj.setAttribute( 't', 'sport' );
DivObj.setAttribute( 'role', 'button' );
DivObj.onclick = function () { self.RunC3ItemChange( this ); }
C3SType.appendChild( DivObj );
}
self.RunC3Style();
}
self.RunC3Style = function() {
var C3AreaItemObjAry = document.getElementById( 'C3' ).querySelector( '.Area' ).querySelector( '.MDiv' ).querySelectorAll( 'a' );
var C3STypeItemObjAry = document.getElementById( 'C3' ).querySelector( '.SType' ).querySelector( '.MDiv' ).querySelectorAll( 'a' );
for( var I = 0; I < C3AreaItemObjAry.length; I++ ) {
var N = C3AreaItemObjAry[I].getAttribute( 'av' );
C3AreaItemObjAry[I].classList.remove( 'This' );
var Have = 0;
for( var A = 0; A < self.C3DataJson['yAxis'].length; A++ ) {
var NN = self.C3DataJson['yAxis'][A].split( ' ' );//取出中文比對
if( NN[0] == N ) { Have++; break; }
}
if( Have > 0 ) {
C3AreaItemObjAry[I].classList.add( 'This' );
}
}
for( var I = 0; I < C3STypeItemObjAry.length; I++ ) {
var N = C3STypeItemObjAry[I].getAttribute( 'av' );
C3STypeItemObjAry[I].classList.remove( 'This' );
var Have = 0;
for( var A = 0; A < self.C3DataJson['xAxis'].length; A++ ) {
var NN = self.C3DataJson['xAxis'][A].split( ' ' );//取出中文比對
if( NN[0] == N ) { Have++; break; }
}
if( Have > 0 ) {
C3STypeItemObjAry[I].classList.add( 'This' );
}
}
}
self.RunC3ItemChange = function( ThisObj ) {
var T = ThisObj.getAttribute( 't' );
var V = ThisObj.getAttribute( 'av' );
var VV = ThisObj.getAttribute( 'vv' );
var ThisAreaAry = self.C3DataJson['yAxis'];
var ThisSportAry = self.C3DataJson['xAxis'];
if( T == 'area' ) {
if( InArray( VV, ThisAreaAry ) ) { //移除選取
var Ary = DelArrayValue( ThisAreaAry, VV );
ThisAreaAry = Ary;
} else { //增加選取
if( ThisAreaAry.length >= 5 ) { ThisAreaAry.shift(); }
ThisAreaAry.push( VV );
}
} else if( T == 'sport' ) {
if( InArray( VV, ThisSportAry ) ) { //移除選取
var Ary = DelArrayValue( ThisSportAry, VV );
ThisSportAry = Ary;
} else { //增加選取
if( ThisSportAry.length >= 5 ) { ThisSportAry.shift(); }
ThisSportAry.push( VV );
}
}
self.ReturnC3Data( ThisAreaAry, ThisSportAry );
self.RunC3Style();
self.RunC3SportTypeNum();
}
self.RunC4SportGrowNum = function( DfJson ) {
DfJson = {
xAxis:['105年', '106年', '107年', '108年', '109年'],
xAxisData:[550, 650, 850, 950, 1100]
};
var SportGrowNumObj = document.getElementById('SportGrowNum');
self.C4Chart = echarts.init( SportGrowNumObj );
var option = {
textStyle: {
color: '#FFFFFF'
},
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: DfJson.xAxis
},
yAxis: {
type: 'value'
},
series: [
{
name: '運動場地',
type: 'line',
stack: '總量',
data: DfJson.xAxisData
}
]
};
self.C4Chart.setOption( option );
}
self.RunC4 = function( DfJson ) {
/*
DfJson = { AreaDf : [105,114,110,108,106,104,115,112,100,116] }
*/
var C4Area = document.getElementById( 'C4' ).querySelector( '.Area' ).querySelector( '.MDiv' );
for( var AA = 0; AA < self.AreaInfoJson.length; AA++ ) {
var DivObj = document.createElement( 'div' );
DivObj.innerHTML = self.AreaInfoJson[AA]['Name'];
DivObj.onclick = function () { }
if( InArray( self.AreaInfoJson[AA]['PostalCode'], DfJson.AreaDf ) ) { DivObj.classList.add( 'This' ); }
C4Area.appendChild( DivObj );
}
}
self.RunC5 = function( DfJson ) {
DfJson = {
Data:[
{value: 400, name: '運動中心'},
{value: 310, name: '健身房'},
{value: 335, name: '游泳池'},
{value: 235, name: '網球場'},
{value: 274, name: '保齡球'}
]
};
var Card5Obj = document.getElementById('Card5');
self.C5Chart = echarts.init( Card5Obj );
var option = {
textStyle: {
color: '#FFFFFF'
},
tooltip: {
trigger: 'axis',
axisPointer: {
crossStyle: {
color: '#FFFFFF'
}
},
formatter: function (datas) {
var res = datas[0].name + '
'
for( var i = 0, length = datas.length; i < length; i++ ) {
var T = ( i == 1 ) ? '%' : '' ;
res += datas[i].marker + datas[i].seriesName + '：' + datas[i].value + T + '
'
}
return res
}
},
grid: {
left: '0%',
right: '0%',
bottom: '0%',
containLabel: true
},
toolbox: {
feature: {}
},
legend: {
left: 'right',
data: ['平均每人半年消費金額 ( 元 )', '占有運動課程消費民眾比例'],
textStyle: {
color: '#FFFFFF'
}
},
xAxis: [
{
type: 'category',
data:
[
'上健身房',
'瑜珈',
'游泳',
'羽球',
'有氧舞蹈',
'桌球',
'直排輪',
'體適能',
'足球',
'飛輪有氧'
],
axisPointer: {
type: 'shadow'
},
axisLabel: {
color: '#FFFFFF',
interval: 0,
formatter: function(value) { return value.split('').join('\n') }
}
}
],
yAxis: [
{
type: 'value',
min: 0,
max: 4000,
interval: 1000,
},
{
type: 'value',
name: '比例',
min: 0,
max: 250,
interval: 10,
show:false
}
],
series: [
{
name: '平均每人半年消費金額 ( 元 )',
type: 'bar',
data:
[
3054,
1864,
2177,
1897,
1446,
2431,
1598,
2385,
2126,
2658
]
},
{
name: '占有運動課程消費民眾比例',
type: 'line',
yAxisIndex: 1,
data: [
23.1,
20.9,
14.0,
7.0,
6.8,
4.9,
3.1,
2.8,
2.7,
2.3
]
}
]
};
self.C5Chart.setOption(option);
}
/*
self.RunC6 = function() {
var C6Obj = document.getElementById( 'C6' );
var CLeftObj = C6Obj.querySelector( '.CLeft' );
var CLeftCNumObj = CLeftObj.querySelector( '.CNum' ).querySelector( 'span' );
CLeftCNumObj.innerHTML = self.C6DataJson.CheckNum;
var CRightObj = C6Obj.querySelector( '.CRight' );
var CRightCNumObj = CRightObj.querySelector( '.CNum' ).querySelector( 'span' );
CRightCNumObj.innerHTML = self.C6DataJson.ImproveNum;
var CCenterCTextObj = C6Obj.querySelector( '.CCenter' ).querySelector( '.CText' );
CCenterCTextObj.innerHTML = '截至'+self.DataDate;
}
self.RunC7 = function() {
var C7Obj = document.getElementById( 'C7' );
var CRecommendObj = document.getElementById( 'CRecommend' );
var CMainRecommendItemObj = document.getElementById( 'CMainRecommendItem' );
var ThisItem = 0;
if( self.C7DataJson.Data.length > 0 ) {
for( var A = 0; A < self.C7DataJson.Data.length; A++ ) {
var CItemObj = document.createElement( 'div' );
CItemObj.classList.add( 'CItem' );
var CImageObj = document.createElement( 'div' );
CImageObj.classList.add( 'Image' );
CImageObj.style.backgroundImage = "url( '"+self.C7DataJson.Data[A].Image+"' )";
CItemObj.appendChild( CImageObj );
var CInfoObj = document.createElement( 'div' );
CInfoObj.classList.add( 'Info' );
CItemObj.appendChild( CInfoObj );
var CTitleObj = document.createElement( 'div' );
CTitleObj.classList.add( 'Title' );
CTitleObj.innerHTML = self.C7DataJson.Data[A].Title;
CInfoObj.appendChild( CTitleObj );
var CTagObj = document.createElement( 'div' );
CTagObj.classList.add( 'Tag' );
CTagObj.innerHTML = self.C7DataJson.Data[A].Tag;
CInfoObj.appendChild( CTagObj );
var CAddressObj = document.createElement( 'div' );
CAddressObj.classList.add( 'Address' );
CAddressObj.innerHTML = self.C7DataJson.Data[A].Address;
CInfoObj.appendChild( CAddressObj );
CRecommendObj.appendChild( CItemObj );
var LiObj = document.createElement( 'li' );
if( ThisItem == 0 ) { LiObj.classList.add( 'Current' ); ThisItem++; }
CMainRecommendItemObj.appendChild( LiObj );
}
}
}
*/
/*
self.RunC8 = function() {
var C8Obj = document.getElementById( 'C8' );
var CNewsObj = document.getElementById( 'CNews' );
var CMainNewsItemObj = document.getElementById( 'CMainNewsItem' );
var ThisItem = 0;
if( self.C8DataJson.Data.length > 0 ) {
for( var A = 0; A < self.C8DataJson.Data.length; A++ ) {
var CItemObj = document.createElement( 'div' );
CItemObj.classList.add( 'CItem' );
var CTypeObj = document.createElement( 'div' );
CTypeObj.classList.add( 'CType' );
CTypeObj.innerHTML = self.C8DataJson.Data[A].Type+""+self.C8DataJson.Data[A].TypeEng+"";
CItemObj.appendChild( CTypeObj );
var CTitleObj = document.createElement( 'div' );
CTitleObj.classList.add( 'CTitle' );
CTitleObj.innerHTML = self.C8DataJson.Data[A].Title;
CItemObj.appendChild( CTitleObj );
var CContentsObj = document.createElement( 'div' );
CContentsObj.classList.add( 'CContents' );
CContentsObj.innerHTML = self.C8DataJson.Data[A].Contents;
CItemObj.appendChild( CContentsObj );
var CTagObj = document.createElement( 'div' );
CTagObj.classList.add( 'CTag' );
if( self.C8DataJson.Data[A].Tag.length ) {
for( var N = 0; N < self.C8DataJson.Data[A].Tag.length; N++ ) {
var CTagItemObj = document.createElement( 'a' );
CTagItemObj.classList.add( 'CTagItem' );
CTagItemObj.innerHTML = self.C8DataJson.Data[A].Tag[N]['Name']+""+self.C8DataJson.Data[A].Tag[N]['NameEng']+"";
CTagObj.appendChild( CTagItemObj );
}
}
CItemObj.appendChild( CTagObj );
CNewsObj.appendChild( CItemObj );
var LiObj = document.createElement( 'li' );
if( ThisItem == 0 ) { LiObj.classList.add( 'Current' ); ThisItem++; }
CMainNewsItemObj.appendChild( LiObj );
}
}
}
*/
}
function SetDivWH( Obj ) {
var Info = GetObjRectInfo( Obj );
Obj.style.width = Info['width']+'px';
Obj.style.height = Info['height']+'px';
}
const RunC8Marquee = new function() {
let self = this;
self.CNewsObj = document.getElementById( 'CNews' );
self.CMainNewsItemObj = document.getElementById( 'CMainNewsItem' );
self.PointTotal = 0;
self.ImageWidth = 0;
self.MarqueeSecond = 6000;
self.NPoint = 0;
self.NextPoint = 0;
self.flag = 0;
self.marquee;
self.Pointer = [];
self.Run = function() {
self.PointTotal = self.CMainNewsItemObj.querySelectorAll( 'li' ).length;
self.ImageWidth = self.CNewsObj.parentNode.offsetWidth;
self.PointerObjAry = self.CMainNewsItemObj.querySelectorAll( 'li' );
self.ImageMain = Flipsnap('.CNewsDiv', {
distance: self.ImageWidth
});
self.ImageMain.element.addEventListener('fspointmove', function() {
for( var A = 0; A < self.PointerObjAry.length; A++ ) {
if( self.PointerObjAry[A].classList.contains( 'Current' ) ) {
self.PointerObjAry[A].classList.remove( 'Current' );
}
}
self.PointerObjAry[self.ImageMain.currentPoint].classList.add( 'Current' );
}, false);
self.ImageMain.element.addEventListener('fspointmove', function(ev) {
self.NPoint = self.ImageMain.currentPoint;
}, false);
self.CNewsObj.parentNode.addEventListener( 'touchstart', function() { RunC8Marquee.ClearMove(); }, false );
self.CNewsObj.parentNode.addEventListener( 'touchend', function() { RunC8Marquee.ResetMove(); }, false );
self.CNewsObj.parentNode.addEventListener( 'mouseover', function() { RunC8Marquee.ClearMove(); }, false );
self.CNewsObj.parentNode.addEventListener( 'mouseout', function() { RunC8Marquee.ResetMove(); }, false );
self.CNewsObj.parentNode.addEventListener( 'focus', function() { RunC8Marquee.ClearMove(); }, false );
self.CNewsObj.parentNode.addEventListener( 'blur', function() { RunC8Marquee.ResetMove(); }, false );
var AobjAry = self.CNewsObj.querySelectorAll( 'a' );
for( var M = 0; M < AobjAry.length; M++ ) {
AobjAry[M].addEventListener( 'focus', function() { RunC8Marquee.ClearMove(); }, false );
AobjAry[M].addEventListener( 'blur', function() { RunC8Marquee.ResetMove(); }, false );
}
}
self.ResetMove = function() {
if( self.flag == 0 ) {
self.marquee = setTimeout( function () {
RunC8Marquee.Move()
}, self.MarqueeSecond );
}
}
self.ClearMove = function() {
clearTimeout( self.marquee );
self.flag = 0;
}
self.SetInfo = function() {
self.ClearMove();
self.ImageMain.init( '.CNewsDiv', { distance: self.ImageWidth } );
self.ImageMain.moveToPoint( self.NextPoint + 1 );
self.StartMove();
}
self.Move = function() {
self.NextPoint = self.NPoint + 1;
self.NextPoint = ( self.NextPoint > self.PointTotal - 1 ) ? 0 : self.NextPoint ;
self.ImageMain.moveToPoint( self.NextPoint );
self.marquee = setTimeout( function () {
RunC8Marquee.Move()
}, self.MarqueeSecond );
self.flag = 1;
}
self.StartMove = function() {
self.marquee = setTimeout( function () {
RunC8Marquee.Move()
}, self.MarqueeSecond );
}
self.SetResize = function() {
self.ImageWidth = self.CNewsObj.parentNode.offsetWidth;
self.CNewsObj.style.width = self.ImageWidth * self.PointTotal + 'px';
var H = 0;
var ItemObjAry = self.CNewsObj.querySelectorAll( '.CItem' );
for( var A = 0; A < ItemObjAry.length; A++ )
{
ItemObjAry[A].style.width = self.ImageWidth + 'px';
H = ( H < ItemObjAry[A].offsetHeight ) ? ItemObjAry[A].offsetHeight : H ;
}
self.CNewsObj.parentNode.style.height = H + 'px';
}
}
const RunC62Marquee = new function() {
let self = this;
self.CVenuesObj = document.getElementById( 'CVenues' );
self.CMainVenuesObj = self.CVenuesObj.parentNode;
self.PrevBtn = self.CMainVenuesObj.querySelector( '.PrevBtn' );
self.NextBtn = self.CMainVenuesObj.querySelector( '.NextBtn' );
self.CMainVenuesItemObj = document.getElementById( 'CMainVenuesItem' );
self.PointTotal = 0;
self.ImageWidth = 0;
self.MarqueeSecond = 6000;
self.NPoint = 0;
self.NextPoint = 0;
self.flag = 0;
self.marquee;
self.Pointer = [];
self.Run = function() {
self.PointTotal = self.CMainVenuesItemObj.querySelectorAll( 'li' ).length;
self.ImageWidth = self.CVenuesObj.parentNode.offsetWidth;
self.PointerObjAry = self.CMainVenuesItemObj.querySelectorAll( 'li' );
self.ImageMain = Flipsnap('.CVenuesDiv', {
distance: self.ImageWidth
});
self.ImageMain.element.addEventListener('fspointmove', function() {
for( var A = 0; A < self.PointerObjAry.length; A++ ) {
if( self.PointerObjAry[A].classList.contains( 'Current' ) ) {
self.PointerObjAry[A].classList.remove( 'Current' );
}
}
self.PointerObjAry[self.ImageMain.currentPoint].classList.add( 'Current' );
}, false);
self.ImageMain.element.addEventListener('fspointmove', function(ev) {
self.NPoint = self.ImageMain.currentPoint;
}, false);
self.CVenuesObj.parentNode.addEventListener( 'touchstart', function() { RunC62Marquee.ClearMove(); }, false );
self.CVenuesObj.parentNode.addEventListener( 'touchend', function() { RunC62Marquee.ResetMove(); }, false );
self.CVenuesObj.parentNode.addEventListener( 'mouseover', function() { RunC62Marquee.ClearMove(); }, false );
self.CVenuesObj.parentNode.addEventListener( 'mouseout', function() { RunC62Marquee.ResetMove(); }, false );
self.CVenuesObj.parentNode.addEventListener( 'focus', function() { RunC62Marquee.ClearMove(); }, false );
self.CVenuesObj.parentNode.addEventListener( 'blur', function() { RunC62Marquee.ResetMove(); }, false );
self.PrevBtn.addEventListener( 'click', function() { RunC62Marquee.PrevMove(); }, false );
self.NextBtn.addEventListener( 'click', function() { RunC62Marquee.NextMove(); }, false );
var AobjAry = self.CVenuesObj.querySelectorAll( 'a' );
for( var M = 0; M < AobjAry.length; M++ ) {
AobjAry[M].addEventListener( 'focus', function() { RunC62Marquee.ClearMove(); }, false );
AobjAry[M].addEventListener( 'blur', function() { RunC62Marquee.ResetMove(); }, false );
}
}
self.ResetMove = function() {
if( self.flag == 0 ) {
self.marquee = setTimeout( function () {
RunC62Marquee.Move()
}, self.MarqueeSecond );
}
}
self.ClearMove = function() {
clearTimeout( self.marquee );
self.flag = 0;
}
self.SetInfo = function() {
self.ClearMove();
self.ImageMain.init( '.CVenuesDiv', { distance: self.ImageWidth } );
self.ImageMain.moveToPoint( self.NextPoint + 1 );
self.StartMove();
}
self.Move = function() {
self.NextPoint = self.NPoint + 1;
self.NextPoint = ( self.NextPoint > self.PointTotal - 1 ) ? 0 : self.NextPoint ;
self.ImageMain.moveToPoint( self.NextPoint );
self.marquee = setTimeout( function () {
RunC62Marquee.Move()
}, self.MarqueeSecond );
self.flag = 1;
}
self.StartMove = function() {
self.marquee = setTimeout( function () {
RunC62Marquee.Move()
}, self.MarqueeSecond );
}
self.SetResize = function() {
self.ImageWidth = self.CVenuesObj.parentNode.offsetWidth;
self.CVenuesObj.style.width = self.ImageWidth * self.PointTotal + 'px';
var H = 0;
var ItemObjAry = self.CVenuesObj.querySelectorAll( '.CItem' );
for( var A = 0; A < ItemObjAry.length; A++ )
{
ItemObjAry[A].style.width = self.ImageWidth + 'px';
H = ( H < ItemObjAry[A].offsetHeight ) ? ItemObjAry[A].offsetHeight : H ;
}
self.CVenuesObj.parentNode.style.height = H + 'px';
}
self.PrevMove = function() {
//self.ChangeShow();
var PrevPoint = self.NPoint - 1;
self.NextPoint = ( PrevPoint < 0 ) ? self.PointTotal - 1 : PrevPoint ;
self.ImageMain.moveToPoint( self.NextPoint );
}
self.NextMove = function() {
//self.ChangeShow();
self.NextPoint = self.NPoint + 1;
self.NextPoint = ( self.NextPoint >= self.PointTotal ) ? 0 : self.NextPoint ;
self.ImageMain.moveToPoint( self.NextPoint );
}
}
window.addEventListener( "load", function ( event ) {
SetHome.Set();
SetHome.RunC1();
const asyncRun = async () => {
let mingRun = await SetHome.RunC2();
let auntieRun = await SetHome.C2ReTagPosition();
}
asyncRun().then(string => {
}).catch(response => {
})
SetHome.RunC3();
SetHome.RunC3SportTypeNum();
SetHome.RunC5({});
/*
SetHome.RunC6();
*/
/*
var wowsliderLinkObj = document.getElementById( 'wowslider-container1' ).querySelector( "a[href='http://wowslider.com']" );
wowsliderLinkObj.parentNode.removeChild(wowsliderLinkObj);
var ws_nextObj = document.getElementById( 'wowslider-container1' ).querySelector( "a[class='ws_next']" );
ws_nextObj.setAttribute( 'title', '下一張' );
var ws_prevObj = document.getElementById( 'wowslider-container1' ).querySelector( "a[class='ws_prev']" );
ws_prevObj.setAttribute( 'title', '上一張' );
*/
const asyncC8Run = async () => {
let A82 = await RunC8Marquee.Run();
let A83 = await RunC8Marquee.SetResize();
let A84 = await RunC8Marquee.StartMove();
}
asyncC8Run().then(string => {
}).catch(response => {
})
const asyncC62Run = async () => {
let A62 = await RunC62Marquee.Run();
let A63 = await RunC62Marquee.SetResize();
let A64 = await RunC62Marquee.StartMove();
}
asyncC62Run().then(string => {
}).catch(response => {
})
// 預設首頁影片播放起始時間
EL('C4MoviePlayer').currentTime = 1;
}, false );
window.addEventListener( "resize", function ( event ) {
SetHome.C2ReTagPosition();
SetHome.C3Chart.resize();
//SetHome.C4Chart.resize();
//SetDivWH( document.getElementById( 'C4Movie' ) );
SetHome.C5Chart.resize();
RunC8Marquee.SetResize();
RunC8Marquee.SetInfo();
RunC62Marquee.SetResize();
RunC62Marquee.SetInfo();
}, false );