/**
 * @fileoverview Helper object to make easy tree elements
 * @author NHN Ent. FE dev team.<dl_javascript@nhnent.com>
 */
'use strict';
var util = {
    /**
     * Remove first specified item from array, if it exists
     * @param {Array} arr Array to query
     * @param {*} item Item to look for
     */
    removeItemFromArray: function(arr, item) {
        var index = tui.util.inArray(arr, item);
        arr.splice(index, 1);
    },

    /**
     * Add event to element
     * @param {Object} element A target element
     * @param {String} eventName A name of event 
     * @param {Function} handler A callback function to add
     */
    addEventListener: function(element, eventName, handler) {
        if (element.addEventListener) {
            element.addEventListener(eventName, handler, false);
        } else {
            element.attachEvent('on' + eventName, handler);
        }
    },

    /**
     * Remove event from element
     * @param {Object} element A target element
     * @param {String} eventName A name of event
     * @param {Function} handler A callback function to remove
     */
    removeEventListener: function(element, eventName, handler) {
        if (element.removeEventListener) {
            element.removeEventListener(eventName, handler, false);
        } else {
            element.detachEvent('on' + eventName, handler);
        }
    },

    /**
     * Get target element
     * @param {event} e Event object
     * @return {HTMLElement} Event target
     */
    getTarget: function(e) {
        var target;
        e = e || window.event;
        target = e.target || e.srcElement;
        return target;
    },

    /**
     * Get class name
     * @param {HTMLElement} element HTMLElement
     * @returns {string} Class name
     */
    getClass: function(element) {
        return element && element.getAttribute && (element.getAttribute('class') || '');
    },

    /**
     * Check the element has specific class or not
     * @param {HTMLElement} element A target element
     * @param {string} className A name of class to find
     * @return {boolean} Whether the element has the class
     */
    hasClass: function(element, className) {
        var elClassName = util.getClass(element);

        return elClassName.indexOf(className) > -1;
    },

    /**
     * Find element by class name
     * @param {HTMLElement} target A target element
     * @param {string} className A name of class
     * @return {Array.<HTMLElement>} Elements
     */
    getElementsByClass: function(target, className) {
        var all, filtered;

        if (target.querySelectorAll) {
            filtered = target.querySelectorAll('.' + className);
        } else {
            all = target.getElementsByTagName('*');
            filtered = tui.util.filter(all, function(el) {
                var classNames = el.className || '';
                return (classNames.indexOf(className) !== -1)
            });
        }

        return tui.util.toArray(filtered);
    },

    /**
     * Check whether the click event by right button
     * @param {MouseEvent} event Event object
     * @return {boolean} Whether the click event by right button
     */
    isRightButton: function(event) {
        return util._getButton(event) === 2;
    },

    /**
     * Whether the property exist or not
     * @param {Array} props A property
     * @return {string|boolean} Property name or false
     * @example
     * var userSelectProperty = util.testProp([
     *     'userSelect',
     *     'WebkitUserSelect',
     *     'OUserSelect',
     *     'MozUserSelect',
     *     'msUserSelect'
     * ]);
     */
    testProp: function(props) {
        var style = document.documentElement.style,
            propertyName = false;

        tui.util.forEach(props, function(prop) {
            if (prop in style) {
                propertyName = prop;
                return false;
            }
        });
        return propertyName;
    },

    /**
     * Prevent default event 
     * @param {Event} event Event object
     */
    preventDefault: function(event) {
        if (event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },

    /**
     * Normalization for event button property 
     * 0: First mouse button, 2: Second mouse button, 1: Center button
     * @param {MouseEvent} event Event object
     * @return {number|undefined} button type
     * @private
     */
    _getButton: function(event) {
        var button,
            primary = '0,1,3,5,7',
            secondary = '2,6',
            wheel = '4';

        if (document.implementation.hasFeature('MouseEvents', '2.0')) {
            return event.button;
        }

        button = event.button + '';
        if (primary.indexOf(button) > -1) {
            return 0;
        } else if (secondary.indexOf(button) > -1) {
            return 2;
        } else if (wheel.indexOf(button) > -1) {
            return 1;
        }
    }
};

module.exports = util;

@@ -132,16 +132,58 @@
 trict';%0A
+var div = document.createElement('div');%0A%0A
 var util
@@ -274,73 +274,73 @@
 am %7B
-Array%7D arr Array to query%0A     * @param %7B*%7D item Item to look for
+*%7D item Item to look for%0A     * @param %7BArray%7D arr Array to query
 %0A   
@@ -378,25 +378,25 @@
 unction(
-arr, item
+item, arr
 ) %7B%0A    
@@ -432,20 +432,51 @@
 ray(
-arr, item);%0A
+item, arr);%0A%0A        if (index %3E -1) %7B%0A    
     
@@ -501,16 +501,26 @@
 ex, 1);%0A
+        %7D%0A
     %7D,%0A%0A
@@ -4313,32 +4313,748 @@
       %7D%0A    %7D,%0A%0A
+    /**%0A     * Make html from template%0A     * @param %7Bstring%7D source - Template html%0A     * @param %7BObject%7D props - Template data%0A     * @returns %7Bstring%7D html%0A     */%0A    template: function(source, props) %7B%0A        return source.replace(/%5C%7B%5C%7B(%5Cw+)%7D%7D/gi, function(match, name) %7B%0A            var value = props%5Bname%5D;%0A            if (tui.util.isFalsy(value)) %7B%0A                return '';%0A            %7D%0A            return value;%0A        %7D);%0A    %7D,%0A%0A    /**%0A     * Create element from html%0A     * @param %7Bstring%7D html - Html%0A     * @returns %7BArray.%3CHTMLElement%3E%7D HTMLElements list%0A     */%0A    createElementFromHTML: function(html) %7B%0A        div.innerHTML = html;%0A        return tui.util.toArray(div.childNodes);%0A    %7D,%0A%0A
     /**%0A     * N

add util methods