;(function(window) { 'use strict'; var GNB = {}, FILE_NAME = 'M_debug.gnb.js', $ = window.jQuery || window.$ || null, _this = GNB; if( !window.M_debug ) { window.M_debug = {}; console.error( FILE_NAME + ' >> window.M_debug Not Found!!' ); }; /** * @namespace M_debug.GNB * @author Fishingtree Dev ( hyunkwan roh ) * @type {{}|*} * @description */ window.M_debug.GNB = window.M_debug.GNB || GNB; GNB.$gnb = null; GNB.$dp1 = null; GNB.$dp2 = null; GNB.$dp2Conatiner = null; GNB.$gnbM = null; GNB.$gnbMopen = null; GNB.$gnbMclose = null; GNB.$gnbMdp1 = null; GNB.$share = null; GNB._isFirst = true; GNB._isOver = false; GNB._timeOutId = null; GNB._duration = 500; GNB._aniDuration = 300; GNB._idxDp1 = null; GNB._idxDp2 = null; var MOBILE_WIDTH = 1000; /** * Util * @description * Util ±â´É Á¤ÀÇ */ var Util = { getPageLocation : function( url ) { DEBUG.log( FILE_NAME + ' > Util > getPageLocation > url : ' + url ); DEBUG.log( FILE_NAME + ' > Util > getPageLocation > host : ' + location.host + ' , href : ' + location.href ); if( url ) { return Fishingtree.location.getPageLocation( url ); }; return location.href.split( location.host )[ 1 ]; } }; GNB.setEvents = function() { // 1µª½º ¸Þ´º ·Ñ¿À¹ö this.$dp1.mouseover(function(event) { event.preventDefault(); var idx = $(this).index(), gnbIdx = $(this).data( 'gnb' ); _this._isOver = true; _this.$dp1.removeClass( 'on' ); $(this).addClass( 'on' ); _this.$dp2.find( 'li' ).removeClass( 'on' ); var $target = _this.$dp2Conatiner.children( 'ul[data-gnb="' + gnbIdx + '"]' ); if( $target.length ) { var pos = $target.data( 'pos' ); if( $( window ).width() >= MOBILE_WIDTH ) { _this.$dp2Conatiner.slideDown(); _this.$dp2Conatiner.children( 'ul' ).show(); }; _this.$dp2Conatiner.children( 'ul' ).eq( 0 ).stop().animate( { 'margin-top' : pos }, _this._aniDuration, function() { }); } else { _this.$dp2Conatiner.slideUp(); _this.$dp2Conatiner.children( 'ul' ).hide(); }; }); // 1µª½º ¸Þ´º ·Ñ¾Æ¿ô this.$dp1.mouseleave(function(event) { event.preventDefault(); var idx = $(this).index(); _this._isOver = false; clearTimeout( _this._timeOutId ); _this._timeOutId = setTimeout( _this.setPageLocation, _this._duration ); }); // 1µª½º ¸Þ´º Ŭ¸¯ this.$dp1.click(function(event) { var idx = $(this).index(), gnbIdx = $(this).data( 'gnb' ); var $target = _this.$dp2Conatiner.children( 'ul[data-gnb="' + gnbIdx + '"]' ); if( !$target.length ) { DEBUG.log( FILE_NAME + ' > Gnb > setEvents > 1µª½º ¸Þ´º Ŭ¸¯ : 2µª½º ¸Þ´º°¡ ¾ø´Â °æ¿ì href °ªÀ¸·Î À̵¿' ); } else { if( $(this).children( 'a' ).attr( 'href' ) == '#' ) { event.preventDefault(); DEBUG.log( FILE_NAME + ' > Gnb > setEvents > 1µª½º ¸Þ´º Ŭ¸¯ : href °ªÀÌ "#" ÀÏ °æ¿ì preventDefault' ); } } }); // 2µª½º ¸Þ´º ·Ñ¿À¹ö this.$dp2.find( 'li' ).mouseover(function(event) { event.preventDefault(); _this._isOver = true; $(this).siblings( 'li' ).removeClass( 'on' ); $(this).addClass( 'on' ); }); // 2µª½º ¸Þ´º ·Ñ¾Æ¿ô this.$dp2.find( 'li' ).mouseleave(function(event) { event.preventDefault(); _this._isOver = false; clearTimeout( _this._timeOutId ); _this._timeOutId = setTimeout( _this.setPageLocation, _this._duration ); }); // Gnb - Mobile open this.$gnbMopen.click(function(event) { event.preventDefault(); _this.$gnbM.css( { 'left' : '-100%' }); _this.$gnbM.show(); _this.$gnbM.animate( { 'left' : 0 }, _this._aniDuration, function() { }); }); // Gnb - Mobile close this.$gnbMclose.click(function(event) { event.preventDefault(); _this.$gnbM.animate( { 'right' : '-100%' }, _this._aniDuration, function() { _this.$gnbM.hide(); _this.$gnbM.css( { 'right' : 0 }); }); }); // Gnb - Mobile 1µª½º ¸Þ´º this.$gnbMdp1.click(function(event) { var $li = $(this).closest( 'li' ), $mdp2 = $li.find( 'ul > li' ); $li.siblings( 'li' ).children( 'ul' ).slideUp(); $li.children( 'ul' ).slideDown(); if( !$mdp2.length ) { DEBUG.log( FILE_NAME + ' > Gnb > setEvents > Mobile 1µª½º ¸Þ´º : 2µª½º ¸Þ´º°¡ ¾ø´Â °æ¿ì href °ªÀ¸·Î À̵¿' ); } else { if( $(this).children( 'a' ).attr( 'href' ) == '#' ) { event.preventDefault(); DEBUG.log( FILE_NAME + ' > Gnb > setEvents > Mobile 1µª½º ¸Þ´º : 1µª½ºÀÇ href °ªÀÌ "#" ÀÏ °æ¿ì preventDefault' ); } } }); }; GNB.setPageLocation = function() { var page = Util.getPageLocation(), $target = null; DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > ¸Þ´º È°¼ºÈ­¸¦ À§ÇÑ ±âÁØ Page °ª : ' + page ); // 2µª½º ¸Þ´ºÀÇ href °ªÀ» ±âÁØÀ¸·Î üũ $.each(_this.$dp2.find( 'li' ), function(index, val) { var $ul = $(this).closest( 'ul' ), href = $(this).children( 'a' ).attr( 'href' ); if( href.indexOf( page, 0 ) > -1 ) { _this._idxDp2 = $(this).index(); _this._idxDp1 = $ul.data( 'gnb' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 2µª½º ¸Þ´º °ª ±âÁØ Ã¼Å© idx : ' + _this._idxDp1 + ' / ' + _this._idxDp2 ); return; }; }); // 1µª½º ¸Þ´ºÀÇ href °ªÀ» ±âÁØÀ¸·Î üũ $.each(_this.$dp1, function(index, val) { var href = $(this).children( 'a' ).attr( 'href' ); if( href.indexOf( page, 0 ) > -1 ) { _this._idxDp1 = $(this).data( 'gnb' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 1µª½º ¸Þ´º °ª ±âÁØ Ã¼Å© idx : ' + _this._idxDp1 ); return; }; }); // ¸Þ´ºÀÇ mouseover ¿©ºÎ üũ if( _this._isOver ) { return; }; // 1µª½º ¸Þ´º È°¼ºÈ­ $target = _this.$dp1.filter('[data-gnb="' + _this._idxDp1 + '"]'); if( _this._idxDp1 != null && $target.length ) { $target.trigger( 'mouseover' ); $target.addClass( 'on' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 1µª½º ¸Þ´º È°¼ºÈ­ : ' , $target ); } else { _this.$dp1.removeClass( 'on' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 1µª½º ¸Þ´º ºñÈ°¼ºÈ­' ); }; // 2µª½º ¸Þ´º È°¼ºÈ­ $target = _this.$dp2.filter('[data-gnb="' + _this._idxDp1 + '"]'); if( _this._idxDp2 != null && $target.length ) { $target = $target.children( 'li' ).eq( _this._idxDp2 ); $target.trigger( 'mouseover' ); $target.addClass( 'on' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 2µª½º ¸Þ´º È°¼ºÈ­ : ' , $target ); } else { _this.$dp2.find( 'li' ).removeClass( 'on' ); _this.$dp2Conatiner.slideUp(); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > 2µª½º ¸Þ´º ºñÈ°¼ºÈ­' ); }; // Gnb - Mobile - 1µª½º ¸Þ´º È°¼ºÈ­ if( _this._idxDp1 != null && _this.$gnbMdp1.eq( _this._idxDp1 ).length ) { $target = _this.$gnbMdp1.eq( _this._idxDp1 ); $target.trigger( 'click' ); $target.closest( 'li' ).addClass( 'on' ); DEBUG.log( FILE_NAME + ' > Gnb > setPageLocation > ¸ð¹ÙÀÏ 1µª½º ¸Þ´º È°¼ºÈ­ : ' , $target ); // Gnb - Mobile - 2µª½º ¸Þ´º È°¼ºÈ­ var $mdp2 = $target.closest( 'li' ).find( 'ul > li' ); $mdp2.eq( _this._idxDp2 ).addClass( 'on' ); }; }; /** * @description * SNS Share °ü·Ã */ GNB.setShareEvents = function() { // Share ¹öÆ° this.$gnb.find( '*[data-action="share"]' ).click(function(event) { event.preventDefault(); $(this).closest( 'div' ).find( '*[data-view="share"]' ).show(); }); // Share pop Close ¹öÆ° this.$gnb.find( '*[data-view="share"] > div.share_p_icon > a' ).click(function(event) { event.preventDefault(); $(this).closest( 'div[data-view="sns"]' ).find( '*[data-view="share"]' ).hide(); }); // Share pop SNS ¹öÆ° this.$gnb.find( '*[data-view="share"] > div.share_p_sns > ul > li' ).click(function(event) { event.preventDefault(); var type = $(this).data( 'type' ), $img = _this.$gnb.find( '*[data-view="share"] li[data-type="' + type + '"]' ).find( 'img' ), src = $img.attr( 'src' ); //alert( 'SNS type : ' + type ); if(type == "fb"){ FB.ui({ method: 'feed', picture : $("meta[property='og\\:image']").attr("content"), name : $("meta[property='og\\:title']").attr("content"), link: $("meta[property='og\\:url']").attr("content"), description : $("meta[property='og\\:description']").attr("content"), caption: "skt-drama.com", }, function(response){}); }else if(type == "tw"){ window.open('http://twitter.com/intent/tweet?text=' + encodeURIComponent("SKT-DRAMA, SKÅÚ·¹ÄÞÀÌ ¸¸µå´Â »õ·Î¿î µå¶ó¸¶ Ä·ÆäÀÎ " + document.location.href),'', "height=560,width=530,scrollbars=true"); }else if(type == "ks"){ //kakao story start:: /* Kakao.Auth.login({ persistRefreshToken : true, success: function(authObj) { Kakao.API.request( { url : '/v1/api/story/linkinfo', data : { url : 'http://www.skt-drama.com/main/main', } }).then(function (res) { // ÀÌÀü API È£ÃâÀÌ ¼º°øÇÑ °æ¿ì ´ÙÀ½ API¸¦ È£ÃâÇÕ´Ï´Ù. return Kakao.API.request( { url : '/v1/api/story/post/link', data : { link_info : res } }); }).then(function (res) { return Kakao.API.request( { url : '/v1/api/story/mystory', data : { id : res.id } }); }).then(function (res) { alert('Ä«Ä«¿À ½ºÅ丮¿¡ µî·Ï µÇ¾ú½À´Ï´Ù!'); }, function (err) { alert(JSON.stringify(err)); }) } }); */ window.open('https://story.kakao.com/share?url=' + encodeURIComponent(document.location.href),'', "height=560,width=530,scrollbars=true"); } // Share ÈÄ À̹ÌÁö º¯°æ $img.attr( 'src', src.replace( '_off', '_on' ) ); }); }; /** * @description * ¸®»çÀÌ¡¿¡ µû¸¥ GNB È­¸é ±¸¼º */ GNB.resize = function() { var winWidth = $( window ).width(); //console.log(this._idxDp2) if( winWidth <= MOBILE_WIDTH ) { DEBUG.log( FILE_NAME + ' > GNB.resize Mobile' ); if( this._idxDp1 == 1 || this._idxDp1 == 2 || this._idxDp1 == 3 || this._idxDp1 == 4 ) { this.$dp2Conatiner.hide(); } this.$gnb.children( 'div.top' ).find( '*[data-view="share"]' ).hide(); } else { DEBUG.log( FILE_NAME + ' > GNB.resize Wide' ); this.$gnbM.hide(); if( this._idxDp1 == 1 || this._idxDp1 == 2 || this._idxDp1 == 3 || this._idxDp1 == 4 ) { this.$dp2Conatiner.show(); } } }; GNB.init = function() { this.$gnb = $( '.gnb' ); this.$dp1 = this.$gnb.children( 'div.dp1' ).find( 'li' ); this.$dp2Conatiner = this.$gnb.children( 'div.dp2' ); this.$dp2 = this.$gnb.children( 'div.dp2' ).find( 'ul' ); this.$gnbM = this.$gnb.children( 'div.menu' ); this.$gnbMopen = this.$gnb.find( 'div.top > a.menu' ); this.$gnbMclose = this.$gnbM.children( 'a.close' ); this.$gnbMdp1 = this.$gnbM.find( 'ul > li > span' ); this.setEvents(); this.setPageLocation(); this.setShareEvents(); this.resize(); $( window ).resize(function(event) { _this.resize(); }); }; $(document).ready(function() { GNB.init(); }); }(window));