Skip to content

Instantly share code, notes, and snippets.

@riix

riix/ui.common.js

Last active December 10, 2015 03:48
Show Gist options
  • Save riix/4376820 to your computer and use it in GitHub Desktop.
Save riix/4376820 to your computer and use it in GitHub Desktop.
Download ZIP
ui.common.js
Raw
ui.common.js
/*************************************************************************************************
* ui.common.js
* @Author : 박순길
* @Version 0.6
*
************************************************************************************************/
// Console-polyfill. MIT license. Make it safe to do console.log() always.
(function(con){ var method; var dummy = function() {}; var methods = ('assert,count,debug,dir,dirxml,error,exception,group,groupCollapsed,groupEnd,info,log,markTimeline,profile,profileEnd,time,timeEnd,trace,warn,memory').split(','); while (method = methods.pop()) { con[method] = con[method] || dummy; } })(window.console = window.console || {});
// $.browser.mobile, http://detectmobilebrowser.com
(function(a){(jQuery.browser=jQuery.browser||{}).mobile=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))})(navigator.userAgent||navigator.vendor||window.opera);
/* Extended Selector ------------------------------ */
$.extend($.expr[':'],{
// $('div:block');
block: function(el, i, m) {
return $(el).css('display') === 'block';
},
// $('div:css(display, inline-block)');
css: function(el, i, m) {
var _key = m[3];
if(!_key) return false;
_key = _key.replace(" ", "").split(',');
return $(el).css(_key[0]) === _key[1];
},
// $('div:width(>200)');
// $('div:width(<300):width(>100)');
width: function(el, i, m) {
var $this = $(el), _key = m[3];
if(!_key||!(/^(<|>)\d+$/).test(_key)) return false;
return _key.substr(0,1) === '>' ? $this.width() > _key.substr(1) : $this.width() < _key.substr(1);
},
// $('div:data(map)');
data: function(el, i, m) {
var $el = $(el), element = $el.get(0), _key;
if(!m[3]) {
for (var x in element) { if((/jQuery\d+/).test(x)) { return true; } }
} else {
_key = m[3].split('=');
if (_key[1]) {
if((/^\/.+\/([mig]+)?$/).test(_key[1])) {
return (new RegExp(
_key[1].substr(1,_key[1].lastIndexOf('/')-1),
_key[1].substr(_key[1].lastIndexOf('/')+1))
).test($el.data(_key[0]));
} else {
return $el.data(_key[0]) == _key[1];
}
} else {
if($el.data(_key[0])) {
return true;
} else {
$el.removeData(_key[0]);
return false;
}
}
}
return false;
},
// $('div:inView');
inView: function(el) {
var $el = $(el), _jqWinHeight = $(window).height();
var _scrollTop = (document.documentElement.scrollTop || document.body.scrollTop),
_offsetTop = $el.offset().top,
_winHeight = (window.innerHeight && window.innerHeight < _jqWinHeight) ? window.innerHeight : _jqWinHeight;
return _offsetTop > _scrollTop && ($el.height() + _offsetTop) < (_scrollTop + _winHeight);
}
});
/* User Function ------------------------------ */
$.extend({
// 최저값 구하기, var max = $.min(a,b); Math.max(a,b) 와 같으나 parseInt 처리
min: function(a, b){
var _a = parseInt(a, 10), _b = parseInt(b, 10);
return _a < _b ? _a : _b;
},
// 최고값 구하기, var min = $.min(a,b);
max: function(a,b){
var _a = parseInt(a, 10), _b = parseInt(b, 10);
return _a > _b ? _a : _b;
},
// 객체가 있는지 확인 후 함수 호출, $.callFuncElIs(el, func);
callFuncElIs: function(el, func){
if(el.length > 0 ) func(el);
}
});
(function($) {
// jQuery('div').eachQ(function(i){
// this.attr('id', 'd' + i).css('color', 'red'); // etc.
// });
$.fn.eachQ = (function(){
var jq = $([1]);
return function(c) {
var i = -1, el, len = this.length;
try {
while (
++i < len &&
(el = jq[0] = this[i]) &&
c.call(jq, i, el) !== false
);
} catch(e){
delete jq[0];
throw e;
}
delete jq[0];
return this;
};
}());
// img.imgToggle();
// img.imgToggle({ oldSrc: '_off', newSrc: '_on' });
$.fn.imgToggle = function(settings) {
var config = { oldSrc : '_off', newSrc : '_on' };
if (settings) $.extend(config, settings);
$.each(this, function(){
var $this = $(this);
var $src = $this.attr('src');
if($src) $this.attr('src', $src.replace(config.oldSrc, config.newSrc));
});
};
// $('img[src*="_off"]').imgHover();
// img.imgHover({ oldSrc: '_off', newSrc: '_on' });
$.fn.imgHover = function(settings) {
var config = { oldSrc : '_off', newSrc : '_on' };
if (settings) $.extend(config, settings);
$.each(this, function(){
var $this = $(this);
$this.on('mouseenter',function() {
var $src = $this.attr('src');
if ($src && $src.match(config.oldSrc)) {
$this.attr('src', $src.replace(config.oldSrc, config.newSrc)).on('mouseleave',function() {
$this.attr('src', $src.replace(config.newSrc, config.oldSrc));
});
}
});
});
};
// effect border, $('img').border(); , $('img').border({ color: 'blue' });
$.fn.border = function(settings){
var config = { color : '#ff0000' };
if (settings) $.extend(config, settings);
$.each(this, function(){
$(this).css('border', 'solid 1px ' + config.color);
});
};
// 콘솔창에 해당 객체 html 출력하기
$.fn.viewHtml = function(){
var result = '';
$.each(this, function(){
var $this = $(this);
$this.border();
result += $.trim($this.html()+'\n');
});
result = (result) ? "empty" : result;
console.log(result);
};
// 원하는 태그가 내부를 에워싸지 않을 경우 에워싸기, $('a.button, button').wrapInnerEl();
$.fn.wrapInnerEl = function(settings){
var config = { tag : 'span' };
if (settings) $.extend(config, settings);
$.each(this, function(){
var $this = $(this);
var temp = $this.html();
if(!temp.match('<' + config.tag + '>')) $this.wrapInner('<' + config.tag + '>');
});
};
})(jQuery);
/* Prototype ------------------------------ */
/* 전역변수 */
var $doc = $(document);
var $html = $('html');
var $body = $(document.body);
var $gnb = $('#gnb');
function riix(){ // 또는 var riix = {};
$html.removeClass('no-js').addClass('js '+riix.browser()); // browser detect
riix.isMain();
}
/**
* Page Detect
* @function
*/
var _isMain = false;
riix.isMain = function(){
var _class = $('body').attr('class');
_isMain = (_class && _class.match('main')) ? true : false;
};
/* Prototype Utility ------------------------------ */
/**
* Touch Device Check
* @function
*/
riix.isTouchAble = function() {
return 'ontouchstart' in document.documentElement;
};
/**
* URI Query String
* @function
*/
riix.getQuerystring = function (keyParam, _default, urlParam) {
var url = (urlParam) ? urlParam : window.location.href;
if (_default === null) _default = "";
var key = keyParam.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
var qs = regex.exec(url);
if (qs === null) {
return _default;
} else {
return decodeURIComponent(qs[1]);
}
};
/**
* IE png fix
* @function
*/
riix.png24 = function(selector) {
var target;
$target = ( typeof(selector) == 'string' ) ? $(selector+' img') : selector ;
var c = new Array();
$target.each( function(j) {
c[j] = new Image();
c[j].src = this.src;
// if ( $.browser.msie ) this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src='"+ this.src +"')";
});
};
/**
* Set Preloader
* @function
*/
riix.showPreloader = function($divPreloader){
if( ! $divPreloader instanceof jQuery ){
return;
}
var $imgPreloader = '<img class="preloader" src="../img/common/preloading.gif" alt="Loading..." />';
$divPreloader.addClass('loading').append( $imgPreloader );
};
riix.hidePreloader = function($divPreloader){
if( ! $divPreloader instanceof jQuery ){
$divPreloader = $(document.body);
}
var $imgPreloader = $divPreloader.find('.section-preloading');
$imgPreloader.parent().removeClass('loading').remove();
};
/**
* Embed Youtube Object
* @function
*/
riix.addVideoPlayer = function( $contain, width, height, id, autoPlay ){
var contentId = id;
var html = '<object id="object_yt_player" width="'+width +'" height="'+height+'">';
html += '<param name="movie" value="http://www.youtube.com/v/'+ contentId +'?playerapiid=object_yt_player&hl=ko_KR&el=0&autoplay='+autoPlay+'"></param>';
html += '<param name="allowFullScreen" value="true"></param>';
html += '<param name="allowscriptaccess" value="always"></param>';
html += '<embed id="embed_yt_player" src="http://www.youtube.com/v/'+ contentId +'?playerapiid=embed_yt_player&hl=ko_KR&rel=0&autoplay='+autoPlay+'" type="application/x-shockwave-flash" width="'+width +'" height="'+height+'" allowscriptaccess="always" allowfullscreen="true"></embed>';
html += '</object>';
$contain.empty().html(html);
};
/**
* Disable Window Scroll
* @function
*/
riix.disableScroll = function(){
$(window).bind("mousewheel.disabled-scroll", function(e){ e.preventDefault(); });
};
/**
* window open
* @param theURL 새창의 Url
* @param winName 새창의 name
* @param features 새창의 세부 설정
* @return
*/
riix.openWin = function(theURL,winName,features) {
var win = window.open(theURL,winName,features);
if (win) {
win.focus();
} else {
alert('팝업이 차단되었습니다.\n브라우저 팝업 설정을 확인해주세요.');
}
};
riix.openWinCenter = function(theURL, winName, width, height, fstate ) {
var features = "width=" + width ;
features += ",height=" + height ;
var state = "";
if (fstate === "") {
state = features + ", left=" + (screen.width-width)/2 + ",top=" + (screen.height-height)/2;
} else {
state = fstate + ", " + features + ", left=" + (screen.width-width)/2 + ",top=" + (screen.height-height)/2;
}
popupWin = window.open(theURL,winName,state+",resizable=1 ");
if (popupWin) {
popupWin.focus();
} else {
alert('팝업이 차단되었습니다.\n브라우저 팝업 설정을 확인해주세요.');
}
};
/**
* Focus Object Then Alert
* @function
*/
riix.alertFocus = function(objId, message) {
if (message) alert(message);
$('#'+objId).focus();
return null;
};
/* Document Ready ------------------------------ */
$(function(){
riix();
});
$(window).on('load scroll resize', function(){
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment