|
Server : Apache/2.2.17 (Unix) mod_ssl/2.2.17 OpenSSL/0.9.8e-fips-rhel5 DAV/2 PHP/5.2.17 System : Linux localhost 2.6.18-419.el5 #1 SMP Fri Feb 24 22:47:42 UTC 2017 x86_64 User : nobody ( 99) PHP Version : 5.2.17 Disable Function : NONE Directory : /proc/21571/root/home/queenjbs/yuchun_before_X/js/ |
Upload File : |
(function ($) {
MYSTIC.main = {
_isScrolling:false,
_resizeBool:false,
_headerH:70,
_footerH:80,
_minW:1024,
_minH:720,
_issueZ:8000,
_labelZ:7000,
_activityZ:6000,
_initBool:false,
_issueAniBool:false,
_issueVisibleBool:false,
_issueTimer:0,
_issueIntervalTime:8000,
_issueLineTimer:0,
_issueLineNum:0,
_issueInfoClickBool:false,
_sectionNum:120,
_specialAniBool:false,
_specialVisibleBool:false,
_specialTimer:0,
_specialIntervalTime:8000,
_clickScrollBool:false,
_scrolls:[],
_scrollCurNum:0,
_scrollTimer:0,
_exWindowScrolltop:0,
_labelsAreaBool:false,
_activitysAreaBool:false,
_paginationBool:false,
_lebels:[],
_resizeTimer:0,
_moonthYoon:0,
__labelAnim:function(el, zNum){
var __this = MYSTIC.main, _this = this;
_this.$el = $(el);
_this.$component = _this.$el.find('.label-component');
_this.$item = _this.$el.find('.image-item');
_this.$btnWork = _this.$el.find('.btn-work-archive');
_this.max = _this.$item.length;
_this.workMax = 3;
_this.time = 5000;
_this.workTime = 3000;
_this.scrollBool = false;
_this.reset = function(){
clearInterval(_this.timer);
_this.aniBool = false;
_this.timer = 0;
_this.curNum = 0;
_this.curWorkNum = 0;
_this.aniStopBool = false;
TweenLite.set(_this.$component, {css:{zIndex:zNum-50}});
if(_this.$item.length > 0){
_this.change(true);
_this.workChange(true);
}
};
_this.rolling = function(){
if(_this.aniStopBool || _this.aniBool) return;
_this.curNum++;
if(_this.curNum >= _this.max){
_this.curNum = 0;
}
if(_this.exNum != _this.curNum){
_this.change();
}
};
_this.interval = function(){
clearInterval(_this.timer);
if(_this.aniStopBool) return;
_this.timer = setTimeout(function(){
_this.rolling();
}, _this.time);
}
_this.colorCheck = function(){
var color = '#'+_this.$item.eq(_this.curNum).attr('data-color').replace('#', ''), bool;
bool = ((Util._hex2hsv(color)[2])>0.5) ? true : false;
_this.$el.removeClass('b');
if(!bool){
_this.$el.addClass('b');
}
}
_this.change = function(b){
var bool = (b)? b:false;
clearInterval(_this.timer);
_this.aniBool = true;
_this.colorCheck();
if(!bool){
TweenLite.set(_this.$item, {css:{zIndex:zNum-300}});
TweenLite.set(_this.$item.eq(_this.curNum), {css:{autoAlpha:1, zIndex:zNum-200}});
TweenLite.set(_this.$item.eq(_this.exNum), {css:{autoAlpha:1, zIndex:zNum-100}});
TweenLite.to(_this.$item.eq(_this.exNum), 0.8, {css:{autoAlpha:0}, onComplete:function(){
TweenLite.set(_this.$item, {css:{zIndex:zNum-300}});
TweenLite.set(_this.$item.eq(_this.curNum), {css:{autoAlpha:1, zIndex:zNum-100}});
_this.exNum = _this.curNum;
_this.aniBool = false;
_this.interval();
}});
}else{
TweenLite.set(_this.$item, {css:{zIndex:zNum-300}});
TweenLite.set(_this.$item.eq(_this.curNum), {css:{autoAlpha:1, zIndex:zNum-100}});
_this.exNum = _this.curNum;
_this.aniBool = false;
}
}
_this.workRolling = function(){
if(_this.aniStopBool || _this.workAniBool) return;
_this.curWorkNum++;
if(_this.curWorkNum >= _this.workMax){
_this.curWorkNum = 0;
}
_this.workChange();
};
_this.workInterval = function(){
clearInterval(_this.workTimer);
if(_this.aniStopBool) return;
_this.workTimer = setTimeout(function(){
_this.workRolling();
}, _this.workTime);
}
_this.workChange = function(b){
var bool = (b)? b:false;
clearInterval(_this.workTimer);
if(_this.aniStopBool) return;
_this.workAniBool = true;
_this.$btnWork.removeClass('album media performance');
if(_this.curWorkNum == 0){
_this.$btnWork.addClass('album');
}else if(_this.curWorkNum == 1){
_this.$btnWork.addClass('media');
}else if(_this.curWorkNum == 2){
_this.$btnWork.addClass('performance');
}
_this.workAniBool = false;
if(!bool){
setTimeout(function(){
_this.workInterval();
}, 500);
}
}
_this.stop = function(){
_this.aniStopBool = true;
}
_this.reset();
},
__workAnim:function(el){
var __this = MYSTIC.main, _this = this;
_this.$el = $(el);
_this.$btnWork = _this.$el.find('.btn-work-archive');
_this.workMax = 3;
_this.workTime = 3000;
_this.scrollBool = false;
_this.reset = function(){
_this.aniBool = false;
_this.curWorkNum = 0;
_this.aniStopBool = false;
_this.workAniBool = false;
_this.workChange(true);
};
_this.workRolling = function(){
if(_this.aniStopBool || _this.workAniBool) return;
_this.curWorkNum++;
if(_this.curWorkNum >= _this.workMax){
_this.curWorkNum = 0;
}
_this.workChange();
};
_this.workInterval = function(){
clearInterval(_this.workTimer);
if(_this.aniStopBool) return;
_this.workTimer = setTimeout(function(){
_this.workRolling();
}, _this.workTime);
}
_this.workChange = function(b){
var bool = (b)? b:false;
clearInterval(_this.workTimer);
if(_this.aniStopBool) return;
_this.workAniBool = true;
_this.$btnWork.removeClass('album media performance');
if(_this.curWorkNum == 0){
_this.$btnWork.addClass('album');
}else if(_this.curWorkNum == 1){
_this.$btnWork.addClass('media');
}else if(_this.curWorkNum == 2){
_this.$btnWork.addClass('performance');
}
_this.workAniBool = false;
if(!bool){
setTimeout(function(){
_this.workInterval();
}, 500);
}
}
_this.stop = function(){
_this.aniStopBool = true;
}
_this.reset();
},
appInit:function(){
var _this = MYSTIC.main;
_this.layout();
_this.reset();
_this.resetInit();
_this.resizeInit();
_this.scrollInit();
_this.afterReset();
},
layout:function(){
var _this = MYSTIC.main;
_this.$wrap = $('#wrap');
_this.$main = $('#main');
_this.$mainContainer = _this.$main.find('.main-container');
_this.$mainView = _this.$main.find('.main-view');
_this.$logo = $('#mystic-logo');
_this.$gnbPage = $('#page');
_this.$gnbPageEl = _this.$gnbPage.find('a');
_this.$load = $('#load');
_this.$issue = $('#issue');
_this.$issueGallery = _this.$issue.find('.issue-gallery');
_this.$issueGalleryItem = _this.$issueGallery.find('.issue-gallery-item');
_this.$issueWrap = _this.$issue.find('.issue-wrap');
_this.$issueMenuContainer = _this.$issue.find('.issue-container');
_this.$issueMenuContent = _this.$issueMenuContainer.find('.issue-content');
_this.$issueMenu = $('#issue-menu');
_this.$issueMenuEl = _this.$issueMenu.find('a');
_this.$issueArea = _this.$issue.find('#issue-area');
_this.$issueInfo = _this.$issue.find('.issue-info');
_this.$issueInfoItem = _this.$issueInfo.find('.info-item');
_this.$issueInfoItemEl = _this.$issueInfoItem.find('.title');
_this.$issueInfoPath = _this.$issueInfoItem.find('.path');
_this.$issueInfoPathEl = _this.$issueInfoPath.find('a');
_this.$issueDotNav = _this.$issue.find('.dot-nav');
_this.$issueDotNavEl = _this.$issueDotNav.find('b');
_this.$issuePaddleNav = _this.$issue.find('.paddle-nav');
_this.$issuePaddleNavArrow = _this.$issuePaddleNav.find('a');
_this.$issuePaddleNavPrev = _this.$issuePaddleNav.find('a.prev');
_this.$issuePaddleNavNext = _this.$issuePaddleNav.find('a.next');
_this.$guide = $('#btn-guide');
_this.$labels = $('#labels');
_this.$label = _this.$labels.find('.label');
_this.$labelContent = _this.$label.find('.label-content');
_this.$labelList = _this.$label.find('.label-list');
_this.$artistEl = _this.$labelList.find('a');
_this.$activitys = $('#activitys');
_this.$activity = _this.$activitys.find('.activity');
_this.$special = $('#activity-special');
_this.$specialImage = _this.$special.find('.special-image-container');
_this.$specialImageBanner = _this.$specialImage.find('.special-image-banner');
_this.$specialImageItem = _this.$specialImageBanner.find('.special-image-item');
_this.$specialText = _this.$special.find('.special-text-container');
_this.$specialTextBanner = _this.$specialText.find('.special-text-banner');
_this.$specialTextItem = _this.$specialTextBanner.find('.special-text-item');
_this.$specialPaddleNav = _this.$special.find('.paddle-nav');
_this.$specialPaddleNavArrow = _this.$specialPaddleNav.find('a');
_this.$specialPaddleNavPrev = _this.$specialPaddleNav.find('a.prev');
_this.$specialPaddleNavNext = _this.$specialPaddleNav.find('a.next');
_this.$monthYoon = $('#activity-month-yoon');
_this.$fullImage = $('.image-item.full');
_this.$pagination = $('#pagination');
_this.$paginationEl = _this.$pagination.find('a');
_this.$footer = $('#footer');
},
reset:function(){
var _this = MYSTIC.main;
_this._issueMax = _this.$issue.length;
_this._labelMax = _this.$label.length;
_this._activityMax = _this.$activity.length;
_this._mainMax = _this._issueMax + _this._labelMax + _this._activityMax;
_this._issueListCurNum = 0;
TweenLite.set(_this.$issue, {css:{zIndex:_this._issueZ}});
_this.$issueInfoItem.eq(_this._issueListCurNum).addClass('selected');
_this._issueListMax = _this.$issueGalleryItem.length;
if(_this._issueListMax > 1){
_this.$issueDotNavEl.eq(_this._issueListCurNum).addClass('selected');
_this.issueChange(true);
}else{
_this.$issueDotNav.remove();
_this.$issuePaddleNav.remove();
}
_this._issueListCurNum = _this._issueListExNum;
$.each(_this.$label, function(i, d){
var rolling, $el = $(d);
TweenLite.set($el, {css:{zIndex:_this._labelZ - i*200}});
rolling = new _this.__labelAnim($el, _this._labelZ - i*200);
_this._lebels.push(rolling);
});
_this._moonthYoon = new _this.__workAnim(_this.$monthYoon);
_this._specialListMax = _this.$specialImageItem.length;
if(_this._specialListMax > 1){
_this.specialClone();
}else{
_this.$specialPaddleNav.remove();
}
//History.pushState({name:'main',rand:Math.random()}, "MYSTIC Entertainment", PATH);
History.pushState({name:'main',rand:Math.random()}, null, "#/active");
},
resetInit:function(){
var _this = MYSTIC.main;
History.Adapter.bind(window, 'statechange', _this.onChangeHistory);
_this.$logo.bind('click.main.logo', _this.onLogoClick);
_this.$gnbPageEl.bind('click.gnb.page', _this.onGnbPageClick);
_this.$issueMenu.bind('mouseenter.main.issue.menu', _this.onIssueMenuOver);
_this.$issueMenu.bind('mouseleave.main.issue.menu', _this.onIssueMenuOut);
_this.$issueMenuEl.bind('click.main.issue.menu', _this.onIssueMenuClick);
_this.$issueDotNavEl.bind('click.main.issue.dot', _this.onIssueDotClick);
_this.$issuePaddleNavArrow.bind('click.main.issue.paddle', _this.onIssuePaddleClick);
_this.$issueInfoItemEl.bind('click.issue.info', _this.onIssueInfoClick);
_this.$issueInfoPathEl.bind('click.issue.info.path', _this.onClickBlock);
_this.$guide.bind('click', _this.onClickGuide);
_this.$specialPaddleNavArrow.bind('click.special.paddle', _this.onSpecialPaddleClick);
_this.$artistEl.bind('mouseenter.label.artist', _this.onArtistOver);
_this.$artistEl.bind('mouseleave.label.artist', _this.onArtistOut);
_this.$paginationEl.bind('mouseenter.pagination', _this.onPaginationOver);
_this.$paginationEl.bind('mouseleave.pagination', _this.onPaginationOut);
_this.$paginationEl.bind('click.pagination', _this.onPaginationClick);
_this.$issueArea.bind('click.issue.area', _this.onIssueAreaClick);
_this.$issueArea.bind('mouseenter.issue.area', _this.onIssueAreaOver);
_this.$issueArea.bind('mouseleave.issue.area', _this.onIssueAreaOut);
},
removeInit:function(){
_this.$logo.unbind('click.main.logo');
_this.$gnbPageEl.unbind('click.gnb.page');
_this.$issueMenuEl.unbind('click.main.issue.menu');
_this.$issueDotNavEl.unbind('click.main.issue.dot');
_this.$issuePaddleNavArrow.unbind('click.main.issue.paddle');
_this.$artistEl.unbind('mouseenter.label.artist');
_this.$artistEl.unbind('mouseleave.label.artist');
_this.$paginationEl.unbind('mouseenter.pagination');
_this.$paginationEl.unbind('mouseleave.pagination');
_this.$paginationEl.unbind('click.pagination');
_this.$issueArea.unbind('click.issue.area');
_this.$issueArea.unbind('mouseenter.issue.area');
_this.$issueArea.unbind('mouseleave.issue.area');
},
afterReset:function(){
var _this = MYSTIC.main;
if(PAGE != ''){
$.each(MENU_LIST, function(i, d){
if(PAGE == 'label-' + d){
$(window).scrollTop(_this.areaH * (i+1) + _this._headerH);
}
});
if(PAGE == 'issue') {
$(window).scrollTop(0);
}else if(PAGE == 'activity-special'){
$(window).scrollTop(_this.areaH * (_this._labelMax+1) + _this._headerH);
}else if(PAGE == 'activity-melody'){
$(window).scrollTop(_this.areaH * (_this._labelMax+2) + _this._headerH);
}else if(PAGE == 'activity-month-yoon'){
$(window).scrollTop(_this.areaH * (_this._labelMax+3) + _this._headerH);
}
_this.onScroll();
}
},
onChangeHistory:function(){
var _this = MYSTIC.main, _popup = MYSTIC.popup, state = History.getState(), data = state.data.name;
if(data == 'archive view') {
if(!_this._issueInfoClickBool){
_popup.archiveLoad(state.url);
}
_this._issueInfoClickBool = false;
}else if(data == 'main'){
if(!MYSTIC.popup._clickBool && MYSTIC.popup._openBool){
_popup.view(true);
}
_popup._clickBool = false;
}
},
onClickBlock:function(e){
var url = $(this).attr('href');
if(url.indexOf("#") != -1){
e.preventDefault();
}else if(url == ''){
e.preventDefault();
}
},
onLogoClick:function(e){
e.preventDefault();
Util._scrollTo(0);
},
onGnbPageClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), id = _this.$gnbPageEl.index($el);
_this.clickScroll(id);
},
onIssueMenuOver:function(e){
e.preventDefault();
var _this = MYSTIC.main;
_this.$issueMenu.addClass('over');
},
onIssueMenuOut:function(e){
e.preventDefault();
var _this = MYSTIC.main;
_this.$issueMenu.removeClass('over');
},
onIssueMenuClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), id = _this.$issueMenuEl.index($el);
_this.clickScroll(id);
},
onIssueDotClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this);
if(_this._issueAniBool) return;
if(!$el.hasClass('selected')){
_this._issueListCurNum = _this.$issueDotNavEl.index($el);
_this.issueChange();
}
},
onIssuePaddleClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this);
if(_this._issueAniBool) return;
if($el.hasClass('prev')){
_this._issueListCurNum--;
}else if($el.hasClass('next')){
_this._issueListCurNum++;
}
if(_this._issueListCurNum <= 0){
_this._issueListCurNum = 0;
}else if(_this._issueListCurNum >= _this._issueListMax-1){
_this._issueListCurNum = _this._issueListMax-1
}
_this.issueChange();
},
onIssueAreaClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = _this.$issueInfoItemEl.eq(_this._issueListCurNum), type= $el.attr('link-type'), path = $el.attr('href');
if(type == 'url'){
window.open(path);
}else if(type == 'archive'){
_this._issueInfoClickBool = true;
History.pushState({name:'archive view',rand:Math.random()}, "MYSTIC Entertainment", path);
MYSTIC.popup.archiveLoad(path, _this.intervalStart);
_this.intervalStop();
}
},
onIssueAreaOver:function(e){
e.preventDefault();
var _this = MYSTIC.main;
if(!_this.$issueMenuContainer.hasClass('over')){
_this.$issueMenuContainer.addClass('over');
}
},
onIssueAreaOut:function(e){
e.preventDefault();
var _this = MYSTIC.main;
if(_this.$issueMenuContainer.hasClass('over')){
_this.$issueMenuContainer.removeClass('over');
}
},
onIssueInfoClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), type= $el.attr('link-type'), path = $el.attr('href');
if(type == 'url'){
window.open(path);
}else if(type == 'archive'){
_this._issueInfoClickBool = true;
History.pushState({name:'archive view',rand:Math.random()}, "MYSTIC Entertainment", path);
MYSTIC.popup.archiveLoad(path, _this.intervalStart);
_this.intervalStop();
}
},
onClickGuide:function(e){
e.preventDefault();
var _this = MYSTIC.main;
_this.clickScroll(0);
},
issueDotNavCheck:function(){
var _this = MYSTIC.main;
_this.$issueDotNavEl.removeClass('selected');
_this.$issueDotNavEl.eq(_this._issueListCurNum).addClass('selected');
},
issuePaddleNavCheck:function(){
var _this = MYSTIC.main;
if(_this._issueListCurNum <= 0){
_this.$issuePaddleNavPrev.addClass('disabled');
_this.$issuePaddleNavNext.removeClass('disabled');
}else if(_this._issueListCurNum >= _this._issueListMax-1){
_this.$issuePaddleNavPrev.removeClass('disabled');
_this.$issuePaddleNavNext.addClass('disabled');
}else{
_this.$issuePaddleNavPrev.removeClass('disabled');
_this.$issuePaddleNavNext.removeClass('disabled');
}
},
issueChange:function(b){
var _this = MYSTIC.main, bool = (b)? b:false;
clearInterval(_this._issueTimer);
clearInterval(_this._issueLineTimer);
_this._issueAniBool = true;
_this.$issueInfoItem.removeClass('selected');
_this.$issueInfoItem.eq(_this._issueListCurNum).addClass('selected');
_this.issueDotNavCheck();
_this.issuePaddleNavCheck();
if(!bool){
TweenMax.set(_this.$issueGalleryItem.eq(_this._issueListCurNum), {css:{autoAlpha:1, zIndex:_this._issueZ-400}});
TweenMax.set(_this.$issueGalleryItem.eq(_this._issueListExNum), {css:{autoAlpha:1, zIndex:_this._issueZ-200}});
TweenMax.to(_this.$issueGalleryItem.eq(_this._issueListExNum), 0.3, {css:{autoAlpha:0}, onComplete:function(){
TweenMax.set(_this.$issueGalleryItem.eq(_this._issueListExNum), {css:{autoAlpha:0, zIndex:_this._issueZ-400}});
TweenMax.set(_this.$issueGalleryItem.eq(_this._issueListCurNum), {css:{autoAlpha:1, zIndex:_this._issueZ-200}});
_this._issueListExNum = _this._issueListCurNum;
_this._issueAniBool = false;
_this.issueInterval();
_this.issueLineInterval();
}});
}else{
TweenMax.set(_this.$issueGalleryItem, {css:{autoAlpha:0, zIndex:_this._issueZ-400}});
TweenMax.set(_this.$issueGalleryItem.eq(_this._issueListCurNum), {css:{autoAlpha:1, zIndex:_this._issueZ-200}});
_this._issueListExNum = _this._issueListCurNum;
_this._issueAniBool = false;
_this.issueInterval();
_this.issueLineInterval();
}
},
issueLineInterval:function(){
var _this = MYSTIC.main;
//line
$('.issue-line').css({'width':'0px', 'height':'0px'});
_this._issueLineTimer = setInterval(function(){
_this._issueLineNum = _this._issueLineNum + 1;
var section = Math.floor(_this._issueLineNum/_this._sectionNum);
if(section == 0){
var target = Math.floor(($('.issue-wrap').width()-0)/(110-0) * (_this._issueLineNum - 0)+0);
if(target > $('.issue-wrap').width()) target = $('.issue-wrap').width();
$('.issue-line:nth-child(1)').css({'width':target,'height':'5px'});
}else if(section == 1){
var target = Math.floor(($('.issue-wrap').height()-0)/(110-0) * ((_this._issueLineNum- (_this._sectionNum*section)) - 0)+0);
if(target > $('.issue-wrap').height()) target = $('.issue-wrap').height();
$('.issue-line:nth-child(2)').css({'width':'5px','height':target});
}else if(section == 2){
var target = Math.floor(($('.issue-wrap').width()-0)/(110-0) * ((_this._issueLineNum - (_this._sectionNum*section)) - 0)+0);
if(target > $('.issue-wrap').width()) target = $('.issue-wrap').width();
$('.issue-line:nth-child(3)').css({'width':target,'height':'5px'});
}else if(section == 3){
var target = Math.floor(($('.issue-wrap').height()-0)/(110-0) * ((_this._issueLineNum- (_this._sectionNum*section)) - 0)+0);
if(target > $('.issue-wrap').height()) target = $('.issue-wrap').height();
$('.issue-line:nth-child(4)').css({'width':'5px','height':target});
}else{}
}, 10);
},
issueRolling:function(){
var _this = MYSTIC.main;
if(_this._issueVisibleBool || _this._issueAniBool) return;
_this._issueListCurNum++;
if(_this._issueListCurNum >= _this._issueListMax){
_this._issueListCurNum = 0;
}
if(_this._issueListExNum != _this._issueListCurNum){
_this.issueChange();
}
},
issueInterval:function(){
var _this = MYSTIC.main;
if(_this._issueVisibleBool || _this._issueAniBool) return;
clearInterval(_this._issueTimer);
clearInterval(_this._issueLineTimer);
_this._issueLineNum = 0;
_this._issueTimer = setTimeout(function(){
_this.issueRolling();
}, _this._issueIntervalTime);
},
issueReset:function(){
var _this = MYSTIC.main;
_this._issueListCurNum = 0;
_this.issueChange(true);
},
onSpecialPaddleClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this);
if(_this._specialAniBool) return;
if($el.hasClass('prev')){
_this._specialListCurNum--;
}else if($el.hasClass('next')){
_this._specialListCurNum++;
}
if(_this._specialListExNum != _this._specialListCurNum){
clearInterval(_this._specialTimer);
_this.specialChange();
}
},
specialClone:function(){
var _this = MYSTIC.main, firstImage, lastImage, firstText, lastText;
firstImage = _this.$specialImageItem.eq(0).clone().addClass('clone');
lastImage = _this.$specialImageItem.eq(_this._specialListMax-1).clone().addClass('clone');
_this.$specialImageBanner.append(firstImage);
_this.$specialImageBanner.prepend(lastImage);
firstText = _this.$specialTextItem.eq(0).clone().addClass('clone');
lastText = _this.$specialTextItem.eq(_this._specialListMax-1).clone().addClass('clone');
_this.$specialTextBanner.append(firstText);
_this.$specialTextBanner.prepend(lastText);
_this.$specialImageItem = _this.$specialImageBanner.find('.special-image-item');
_this.$specialTextItem = _this.$specialTextBanner.find('.special-text-item');
_this._specialListMax = _this.$specialTextItem.length;
_this._specialListCurNum = 1;
_this._specialListExNum = _this._specialListCurNum;
_this.$fullImage = $('.image-item.full');
},
specialChange:function(b){
var _this = MYSTIC.main, bool = (b)? b:false, dirBool, itemLeft, itemWidth;
clearInterval(_this._specialTimer);
_this._specialAniBool = true;
if(!bool){
dirBool = (_this._specialListCurNum < _this._specialListExNum)? true:false;
TweenLite.to(_this.$specialTextBanner, 0.4, {css:{left:634 * _this._specialListCurNum * -1}, ease:Quad.easeInOut, onComplete:function(){
if(_this._specialListCurNum == 0){
_this._specialListCurNum = _this._specialListMax-2;
TweenLite.set(_this.$specialTextBanner, {css:{left:634 * _this._specialListCurNum*-1}});
}else if(_this._specialListCurNum == _this._specialListMax-1){
_this._specialListCurNum = 1;
TweenLite.set(_this.$specialTextBanner, {css:{left:634 * _this._specialListCurNum*-1}});
}
}});
TweenLite.set(_this.$specialImageItem, {css:{left:0, width:_this.ww, zIndex:_this._activityZ-600}});
TweenLite.set(_this.$specialImageItem.eq(_this._specialListCurNum), {css:{zIndex:_this._activityZ-400}});
TweenLite.set(_this.$specialImageItem.eq(_this._specialListExNum), {css:{zIndex:_this._activityZ-200}});
itemLeft = (!dirBool)? 0:_this.ww;
itemWidth = 0;
TweenLite.to(_this.$specialImageItem.eq(_this._specialListExNum), 0.6, {css:{left:itemLeft ,width:itemWidth}, ease:Cubic.easeInOut, onComplete:function(){
if(_this._specialListCurNum == 0){
_this._specialListCurNum = _this._specialListMax-2;
}else if(_this._specialListCurNum == _this._specialListMax-1){
_this._specialListCurNum = 1;
}
TweenLite.set(_this.$specialImageItem.eq(_this._specialListExNum), {css:{left:0, width:_this.ww, zIndex:_this._activityZ-400}});
TweenLite.set(_this.$specialImageItem.eq(_this._specialListCurNum), {css:{left:0, width:_this.ww, zIndex:_this._activityZ-200}});
_this._specialListExNum = _this._specialListCurNum;
_this._specialAniBool = false;
_this.specialInterval();
}});
}else{
if(_this._specialListCurNum == 0){
_this._specialListCurNum = _this._specialListMax-2;
}else if(_this._specialListCurNum == _this._specialListMax-1){
_this._specialListCurNum = 1;
}
TweenLite.set(_this.$specialTextBanner, {css:{left:634 * _this._specialListCurNum*-1}});
TweenLite.set(_this.$specialImageItem, {css:{left:0, width:_this.ww, zIndex:_this._activityZ-600}});
TweenLite.set(_this.$specialImageItem.eq(_this._specialListExNum), {css:{zIndex:_this._activityZ-400}});
TweenLite.set(_this.$specialImageItem.eq(_this._specialListCurNum), {css:{zIndex:_this._activityZ-200}});
if(_this._specialListExNum != _this._specialListCurNum) _this._specialListExNum = _this._specialListCurNum;
_this._specialAniBool = false;
_this.specialInterval();
}
},
specialRolling:function(){
var _this = MYSTIC.main;
if(!_this._specialVisibleBool || _this._specialAniBool) return;
_this._specialListCurNum++;
if(_this._specialListCurNum >= _this._specialListMax){
_this._specialListCurNum = 0;
}
if(_this._specialListExNum != _this._specialListCurNum){
_this.specialChange();
}
},
specialInterval:function(){
var _this = MYSTIC.main;
if(_this._specialAniBool) return;
clearInterval(_this._specialTimer);
_this._specialTimer = setTimeout(function(){
_this.specialRolling();
}, _this._specialIntervalTime);
},
specialReset:function(){
var _this = MYSTIC.main;
clearInterval(_this._specialTimer);
_this._specialListCurNum = 1;
_this.specialChange(true);
},
onArtistOver:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), $li = $el.parent('li');
if(!$li.hasClass('over')){
$li.addClass('over');
}
},
onArtistOut:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), $li = $el.parent('li');
if($li.hasClass('over')){
$li.removeClass('over');
}
},
onPaginationOver:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), $li = $el.parent('li');
if($li.hasClass('selected')) return;
if(!$li.hasClass('over')){
_this.$pagination.find('li.selected').removeClass('selected');
$li.addClass('over');
}
},
onPaginationOut:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), $li = $el.parent('li');
if($li.hasClass('selected')) return;
if($li.hasClass('over')){
$li.removeClass('over');
if(_this._scrollCurNum != 0){
_this.$paginationEl.eq(_this._scrollCurNum-1).parent('li').addClass('selected');
}
}
},
onPaginationClick:function(e){
e.preventDefault();
var _this = MYSTIC.main, $el = $(this), id = _this.$paginationEl.index($el);
_this.$paginationEl.parent('li').removeClass('over selected');
_this.$paginationEl.eq(id).parent('li').addClass('selected');
_this.clickScroll(id);
},
clickScroll:function(i, b){
var _this = MYSTIC.main, bool = (b)? b:false, id, top;
_this._clickScrollBool = true;
id = i+1;
top = _this.areaH * id + _this._headerH;
Util._scrollTo(top, false, false, false, function(){
if(!bool){
_this.$paginationEl.parent('li').removeClass('selected');
_this.$paginationEl.eq(i).parent('li').addClass('selected');
}
setTimeout(function(){
_this._clickScrollBool = false;
}, 100);
});
},
intervalStart:function(){
var _this = MYSTIC.main;
_this.issueInterval();
_this.issueLineInterval();
},
intervalStop:function(){
var _this = MYSTIC.main;
clearInterval(_this._issueTimer);
clearInterval(_this._issueLineTimer);
},
onScroll:function(b){
var _this = MYSTIC.main, windowScrolltop = Util._scrollPosition(), bool = (b)? b:false, distArr, distMin, distCur, direction;
direction = (_this._exWindowScrolltop - windowScrolltop < 0)? true:false;
clearInterval(_this._scrollTimer);
if(windowScrolltop >= _this._headerH + _this.areaH/3*2){
if(!_this._paginationBool){
_this.$pagination.addClass('selected');
_this._paginationBool = true;
}
}else{
if(_this._paginationBool){
_this.$pagination.removeClass('selected');
_this._paginationBool = false;
}
}
_this._scrolls = new Array();
distArr = new Array();
$.each(_this.$mainContainer, function(i, d){
var $el = $(d), elHeight, pos, dist;
pos = (i == 0)? 0:_this._headerH + _this.areaH * i;
dist = Math.abs(windowScrolltop -pos);
_this._scrolls.push({'pos':pos, 'dist':dist});
distArr.push(dist);
if(i == 0){
var issueWrapTop = 0;
}else if(i > 0 && i <= _this._labelMax){
var $lebelContent = $el.find('.label-content'), $lebelImage = $el.find('.image-container'), $workArchive = $el.find('.work-archive'), labelContentTop = 0, lebelImageTop = 0, workArchiveTop = 0;
}else if(i > _this._labelMax && i <= _this._labelMax + _this._activityMax){
var $activityContent = $el.find('.activity-content'), $activityImage = $el.find('.image-container'), activityContentTop = 0, activityImageTop = 0;
if(i == _this._mainMax-1){
var $workArchive = $el.find('.work-archive'), workArchiveTop = 0;
}
}
if(windowScrolltop >= _this.areaH * (i-1) && windowScrolltop <= _this._headerH + _this.areaH * Math.max(0, i+1)){
$el.show();
if(i == 0){
if(_this._issueVisibleBool){
_this._issueVisibleBool = false;
_this.issueInterval();
_this.issueLineInterval();
}
}else{
var standardPosition = (windowScrolltop - _this._headerH - (_this.areaH * i));
if(i > 0 && i <= _this._labelMax){
labelContentTop = standardPosition/0.5;
lebelImageTop = standardPosition/5;
workArchiveTop = standardPosition/3;
}else if(i > _this._labelMax && i <= _this._labelMax + _this._activityMax){
activityContentTop = standardPosition/0.5 * -1;
activityImageTop = standardPosition/5;
if(i == _this._mainMax-1){
workArchiveTop = standardPosition/3 * -1;
}
}
}
}else{
$el.hide();
if(i == 0){
if(!_this._issueVisibleBool){
_this._issueVisibleBool = true;
_this.issueReset();
clearInterval(_this._issueTimer);
clearInterval(_this._issueLineTimer);
}
}else{
if(i > 0 && i <= _this._labelMax){
labelContentTop = 0;
lebelImageTop = 0;
workArchiveTop = 0;
}else if(i > _this._labelMax && i <= _this._labelMax + _this._activityMax){
activityContentTop = 0;
activityImageTop = 0;
if(i == _this._mainMax-1){
workArchiveTop = 0;
}
}
}
}
if(windowScrolltop >= _this._headerH + _this.areaH * i && windowScrolltop <= _this._headerH + _this.areaH * Math.max(0, i+1)){
elHeight = _this.areaH - Math.max(0, windowScrolltop - _this._headerH - (_this.areaH * i));
if(i == 0){
issueWrapTop = _this.areaH * i + Math.max(0, windowScrolltop/2);
issueGalleryTop = _this.areaH * i + Math.max(0, windowScrolltop/3);
}else if(i > 0 && i <= _this._labelMax){
if(bool){
if(!_this._lebels[i-1].scrollBool){
_this._lebels[i-1].scrollBool = true;
_this._lebels[i-1].aniStopBool = true;
_this._lebels[i-1].reset();
_this._lebels[i-1].interval();
_this._lebels[i-1].workInterval();
}
}
if(direction){
if(!_this._lebels[i-1].scrollBool){
_this._lebels[i-1].scrollBool = true;
_this._lebels[i-1].aniStopBool = true;
_this._lebels[i-1].reset();
_this._lebels[i-1].interval();
_this._lebels[i-1].workInterval();
}
}
}else if(i == _this._labelMax+1){
if(_this._specialListMax > 1){
if(bool){
console.log(_this._specialVisibleBool)
if(!_this._specialVisibleBool){
_this._specialVisibleBool = true;
_this.specialReset();
_this.specialInterval();
}
}
if(direction) {
if(!_this._specialVisibleBool) {
_this._specialVisibleBool = true;
_this.specialReset();
_this.specialInterval();
}
}
}
}else if(i == _this._labelMax+_this._activityMax){
if(bool){
if(!_this._moonthYoon.scrollBool){
_this._moonthYoon.scrollBool = true;
_this._moonthYoon.aniStopBool = true;
_this._moonthYoon.reset();
_this._moonthYoon.workInterval();
}
}
if(direction) {
if(!_this._moonthYoon.scrollBool){
_this._moonthYoon.scrollBool = true;
_this._moonthYoon.aniStopBool = true;
_this._moonthYoon.reset();
_this._moonthYoon.workInterval();
}
}
}
}else{
elHeight = _this.areaH;
if(i == 0){
issueWrapTop = 0;
issueGalleryTop = 0;
}else if(i > 0 && i <= _this._labelMax){
if(!direction) {
if (_this._lebels[i - 1].scrollBool){
_this._lebels[i - 1].stop();
_this._lebels[i - 1].reset();
_this._lebels[i - 1].scrollBool = false;
_this._lebels[i - 1].aniStopBool = false;
}
}
}else if(i == _this._labelMax+1){
if(_this._specialListMax > 1) {
if (!direction) {
if(_this._specialVisibleBool){
_this._specialVisibleBool = false;
}
}
}
}else if(i == _this._labelMax+_this._activityMax){
if(!direction) {
_this._moonthYoon.stop();
_this._moonthYoon.reset();
_this._moonthYoon.scrollBool = false;
_this._moonthYoon.aniStopBool = false;
}
}
}
if(windowScrolltop >= _this._headerH + _this.areaH * (i-1) && windowScrolltop <= _this._headerH + _this.areaH * Math.max(0, i+1)){
}else{
if(i > 0 && i <= _this._labelMax){
if(_this._lebels[i-1].scrollBool){
_this._lebels[i-1].stop();
_this._lebels[i-1].reset();
_this._lebels[i-1].scrollBool = false;
_this._lebels[i-1].aniStopBool = false;
}
}else if(i == _this._labelMax+1){
if(_this._specialListMax > 1) {
clearInterval(_this._specialTimer);
_this.specialReset();
_this._specialVisibleBool = false;
}
}else if(i == _this._labelMax+_this._activityMax){
_this._moonthYoon.stop();
_this._moonthYoon.reset();
_this._moonthYoon.scrollBool = false;
_this._moonthYoon.aniStopBool = false;
}
}
TweenMax.set($el, {css:{height:elHeight}});
if(i == 0){
TweenMax.set(_this.$issueWrap, {css: {transform: 'translate3d(0, '+ (issueWrapTop * -1) +'px,0)'}});
TweenMax.set(_this.$issueGallery, {css: {transform: 'translate3d(0, '+ (issueGalleryTop * -1) +'px,0)'}});
}else if(i > 0 && i <= _this._labelMax){
TweenMax.set($lebelContent, {css: {transform: 'translate3d(0, '+ (labelContentTop * -1) +'px,0)'}});
TweenMax.set($lebelImage, {css: {transform: 'translate3d(0, '+ (lebelImageTop * -1) +'px,0)'}});
TweenMax.set($workArchive, {css: {transform: 'translate3d(0, '+ (workArchiveTop * -1) +'px,0)'}});
}else if(i > _this._labelMax && i <= _this._labelMax + _this._activityMax){
TweenMax.set($activityContent, {css: {transform: 'translate3d(0, '+ (activityContentTop * -1) +'px,0)'}});
TweenMax.set($activityImage, {css: {transform: 'translate3d(0, '+ (activityImageTop * -1) +'px,0)'}});
if(i == _this._mainMax-1){
TweenMax.set($workArchive, {css: {transform: 'translate3d(0, '+ (workArchiveTop * -1) +'px,0)'}});
}
}
if(windowScrolltop < 0){
if(i == 0){
TweenLite.set(_this.$issueGallery, {css:{'scale':(1+(-windowScrolltop*0.0005))}});
}
}else{
if(i == 0){
TweenLite.set(_this.$issueGallery, {css:{'scale':1}});
}
}
if(windowScrolltop > _this._mainMax * _this.areaH + _this._headerH - _this.areaH){
if(i == _this._mainMax-1){
_this.$mainContainer.eq(_this._mainMax-1).addClass('increase');
TweenLite.set($activityImage, {css:{'scale':(1+((windowScrolltop - (_this._mainMax * _this.areaH + _this._headerH - _this.areaH))*0.0005))}});
}
}else{
if(i == _this._mainMax-1){
_this.$mainContainer.eq(_this._mainMax-1).removeClass('increase');
TweenLite.set($activityImage, {css:{'scale':1}});
}
}
if(windowScrolltop >= _this._headerH + _this.areaH * (i-1) + _this.areaH/4*3 && windowScrolltop <= _this._headerH + _this.areaH * Math.max(0, i) + _this.areaH/4*3){
if(!_this._clickScrollBool){
if(i != 0){
_this.$paginationEl.parent('li').removeClass('selected');
_this.$paginationEl.eq(i-1).parent('li').addClass('selected');
}else{
_this.$paginationEl.parent('li').removeClass('selected');
}
}
}
});
distMin = Math.min.apply(null, distArr);
$.each(_this._scrolls, function(i, d){
if(d.dist == distMin){
distCur = i;
};
});
if(!bool){
_this._scrollCurNum = distCur;
if(_this._scrolls[distCur].pos != windowScrolltop){
_this._scrollTimer = setTimeout(function(){
//Util._scrollTo(_this._scrolls[distCur].pos, 800);
Util._scrollTo(_this._scrolls[distCur].pos);
}, 300);
}
}else{
$(window).scrollTop(_this._scrolls[_this._scrollCurNum].pos);
}
_this._exWindowScrolltop = windowScrolltop;
},
scrollInit:function(){
var _this = MYSTIC.main;
$(window).bind('scroll.mystic.main',function(){
//_this._isScrolling = true;
_this.onScroll();
});
/*
setInterval(function(){
if(_this._isScrolling){
_this._isScrolling = false;
_this.onScroll();
}
}, 10)
*/
document.body.scrollTop = 0;
$(window).scrollTop(0);
},
scrollRemoveInit:function(){
$(window).unbind('scroll.mystic.main');
},
onResize:function(){
var _this = MYSTIC.main;
_this._resizeBool = true;
_this.ww = $(window).width();
_this.ww = (_this._minW > _this.ww)? _this._minW : _this.ww;
_this.wh = $(window).height();
_this.wh = (_this._minH > _this.wh)? _this._minH : _this.wh;
_this.areaH = _this.wh - _this._headerH;
clearInterval(_this._resizeTimer);
_this.$load.show();
TweenLite.set(_this.$load, {css:{autoAlpha:1, height:_this.areaH}});
_this.$mainContainer.show();
TweenLite.set(_this.$main, {css:{height:_this._mainMax * _this.areaH + _this._headerH}});
TweenLite.set(_this.$mainContainer, {css:{height:_this.areaH}});
TweenLite.set(_this.$mainView, {css:{height:_this.areaH}});
TweenLite.set(_this.$issueMenu, {css:{marginTop:Math.round(_this.$issueMenu.height()/2)*-1, marginLeft:Math.round(_this.$issueMenu.width()/2)*-1}});
$.each(_this.$labelContent, function(i, d){
var $el = $(d);
TweenLite.set($el, {css:{top:Math.round(_this.areaH/2 - $el.height()/2)}});
});
TweenLite.set(_this.$pagination, {css:{top:Math.round(_this.areaH/2 - _this.$pagination.height()/2)+_this._headerH}});
$.each(_this.$fullImage, function(i, d){
var $el = $(d), imgW, imgH, oImgW = parseInt($el.attr('data-width'), 10), oImgH = parseInt($el.attr('data-height'), 10), imgT, imgL;
imgW = _this.ww;
imgH = Math.round(oImgH * imgW / oImgW);
if(_this.areaH > imgH){
imgH = _this.areaH;
imgW = Math.round(oImgW * imgH / oImgH);
}
imgT = Math.round(_this.areaH / 2 - imgH / 2) + _this._headerH;
imgL = Math.round(_this.ww / 2 - imgW / 2);
$el.css({'background-size':imgW+'px '+ imgH+'px', 'background-position':imgL+'px '+imgT+'px'});
});
if(!_this._initBool){
TweenLite.set(_this.$mainView, {css:{autoAlpha:1}});
_this._initBool = true;
}
var section = Math.floor(_this._issueLineNum/_this._sectionNum);
for(var i = 0 ; i < section ; i++){
if(i%2 == 0){
$('.issue-line').eq(i).css({'width':$('.issue-wrap').width()});
}else{
$('.issue-line').eq(i).css({'height':$('.issue-wrap').height()});
}
}
if(_this._specialListMax > 1){
_this.$specialTextBanner.css({width:634 * _this._specialListMax, left:634 * _this._specialListCurNum*-1});
_this.specialChange(true);
}else{
_this.$specialTextBanner.css({width:634 * _this._specialListMax, left:0});
}
_this._resizeTimer = setTimeout(function(){
TweenLite.to(_this.$load, 0.3, {css:{autoAlpha:0}, onComplete:function(){
_this.$load.hide();
}});
}, 500);
_this.onScroll(true);
_this._resizeBool = false;
},
resizeInit:function(){
var _this = MYSTIC.main;
$(window).bind('resize.mystic.main',function(){
_this.onResize();
});
if(window.onorientationchange!==undefined) {
$(window).bind('orientationchange.mystic.main', function() {
_this.onResize();
});
}
$(window).trigger('resize.mystic.main');
},
resizeRemoveInit:function(){
$(window).unbind('resize.mystic.main');
if(window.onorientationchange!==undefined){
$(window).unbind('orientationchange.mystic.main');
}
}
};
$(document).ready(function(){
MYSTIC.main.appInit();
});
})(jQuery);