base.js 경로 수정
parent
22645ee5af
commit
c27bd4d7ae
@ -1,867 +0,0 @@
|
||||
var wctx = {
|
||||
path:"",
|
||||
url:function(path) {
|
||||
return this.path + path;
|
||||
},
|
||||
home:function() {
|
||||
top.location.href = wctx.url("/");
|
||||
},
|
||||
current:function() {
|
||||
let str = top.location.href.replace(top.location.origin + wctx.path, "");
|
||||
let pos = str.indexOf("?");
|
||||
return pos < 0 ? str : str.substr(0, pos);
|
||||
},
|
||||
trace:true
|
||||
};
|
||||
|
||||
function log(msg) {
|
||||
console.log.apply(console, arguments);
|
||||
}
|
||||
|
||||
function debug(msg) {
|
||||
if (wctx && wctx.trace)
|
||||
console.log.apply(console, arguments);
|
||||
}
|
||||
|
||||
function trim(s) {
|
||||
if (null == s || undefined == s) return "";
|
||||
if ("string" != typeof(s)) return s;
|
||||
return s.replace(/^\s+/, "").replace(/\s+$/, "");
|
||||
}
|
||||
|
||||
function isEmpty(v) {
|
||||
if (v == undefined
|
||||
|| v == "undefined"
|
||||
|| v == null
|
||||
|| v == "null"
|
||||
) return true;
|
||||
|
||||
switch (typeof(v)) {
|
||||
case "string": return "" == trim(v);
|
||||
case "boolean": if (false == v) return false;
|
||||
case "number": if (0 == v) return false;
|
||||
default: return false;
|
||||
}
|
||||
}
|
||||
|
||||
function ifEmpty(v, nv) {
|
||||
if (!isEmpty(v)) return v;
|
||||
if (typeof(nv) == "function")
|
||||
return nv.apply();
|
||||
else
|
||||
return nv;
|
||||
}
|
||||
|
||||
function notEmpty(obj, msg) {
|
||||
if (isEmpty(obj))
|
||||
throw msg;
|
||||
return obj;
|
||||
}
|
||||
|
||||
function toQuery(map, encode) {
|
||||
if (isEmpty(map)) return "";
|
||||
|
||||
var query = [];
|
||||
for (var key in map) {
|
||||
var v = map[key];
|
||||
if (v != null && v == undefined) continue;
|
||||
if (v != null)
|
||||
switch (typeof(v)) {
|
||||
case "object":
|
||||
case "function": continue;
|
||||
}
|
||||
if (isEmpty(v))
|
||||
query.push(key);
|
||||
else
|
||||
query.push(key + "=" + (encode != false ? encodeURIComponent(v) : v));
|
||||
}
|
||||
return query.join("&");
|
||||
}
|
||||
|
||||
function uuid() {
|
||||
var hexDigits = "0123456789abcde",
|
||||
result = [];
|
||||
|
||||
for (var i = 0; i < 36; ++i)
|
||||
result[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
|
||||
result[14] = "4";
|
||||
result[19] = hexDigits.substr((result[19] & 0x3) | 0x8, 1);
|
||||
result[8] = result[13] = result[18] = result[23] = "-";
|
||||
|
||||
return result.join("");
|
||||
}
|
||||
|
||||
function wait(show) {
|
||||
if (show == false)
|
||||
$(".wait").attr("hidden","hidden");
|
||||
else
|
||||
$(".wait").removeAttr("hidden");
|
||||
}
|
||||
|
||||
var dialog = {
|
||||
title:"XIT",
|
||||
template:null,
|
||||
open:function(conf) {
|
||||
if (this.template)
|
||||
this.create(conf);
|
||||
else {
|
||||
var self = this;
|
||||
ajax.get({
|
||||
url:wctx.url("/webjars/html/dialog.html"),
|
||||
success:function(resp) {
|
||||
self.template = resp;
|
||||
self.create(conf);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
close:function(id) {
|
||||
$("#close" + id).click();
|
||||
},
|
||||
create:function(conf) {
|
||||
let last = {
|
||||
dlg: $("div.modal.show").last()[0],
|
||||
setZIndex: (obj, offset) => {
|
||||
if (!last.dlg) return;
|
||||
|
||||
let zIndex = Number($(last.dlg).css("z-index"));
|
||||
obj.css("z-index", zIndex + offset);
|
||||
}
|
||||
};
|
||||
|
||||
conf = conf || {};
|
||||
let id = conf.id || "dlg-" + uuid(),
|
||||
backdropID = id + "-backdrop",
|
||||
size = conf.size || "",
|
||||
tmpl = this.template
|
||||
.replace(/{id}/g, id)
|
||||
.replace(/{title}/g, conf.title || dialog.title);
|
||||
if (size)
|
||||
size = " modal-" + size;
|
||||
tmpl = tmpl.replace(/{size}/, size);
|
||||
dlg = $(tmpl).appendTo("body");
|
||||
|
||||
dlg.find(".modal-body").html(conf.content || "").fadeIn();
|
||||
|
||||
dlg.on("hidden.bs.modal", function() {// on dialog close
|
||||
$("#" + id +",#" + backdropID).remove(); // removes the dialog and its backdrop
|
||||
if (conf.onClose)
|
||||
conf.onClose();
|
||||
});
|
||||
|
||||
if (conf.onOK) {
|
||||
let footer = dlg.find(".modal-footer");
|
||||
footer.removeClass("hidden");
|
||||
footer.show();
|
||||
footer.find("button").unbind("click").click(function() {
|
||||
if (conf.getData) {
|
||||
var selected = conf.getData.apply();
|
||||
if (!selected) return;
|
||||
|
||||
conf.onOK(selected);
|
||||
dialog.close(id);
|
||||
} else {
|
||||
conf.onOK();
|
||||
dialog.close(id);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
if (conf.timeout)
|
||||
setTimeout(function(){dialog.close(id);}, conf.timeout);
|
||||
}
|
||||
|
||||
last.setZIndex(dlg, 10);
|
||||
dlg.draggable({handle: ".modal-header"}).modal("show");
|
||||
$(".modal-backdrop").each(function() { // gives id to its backdrop
|
||||
let backdrop = $(this);
|
||||
if (!backdrop.prop("id"))
|
||||
backdrop.prop("id", backdropID);
|
||||
});
|
||||
|
||||
if (conf.init)
|
||||
conf.init();
|
||||
},
|
||||
alert:function(conf) {
|
||||
var container = "<div class='container-fluid text-center' style='font-size:1.4em;'>{content}</div>";
|
||||
if ("string" == typeof(conf)) {
|
||||
conf = {
|
||||
content:container.replace(/{content}/g, conf)
|
||||
};
|
||||
} else {
|
||||
conf.content = container.replace(/{content}/g, conf.content);
|
||||
}
|
||||
conf.timeout = ifEmpty(conf.timeout, dialog.timeout);
|
||||
this.open(conf);
|
||||
}
|
||||
};
|
||||
|
||||
function onError(xhr, options, error) {
|
||||
if (xhr.readyState == 0)
|
||||
return dialog.alert("서버에 접근할 수 없습니다.");
|
||||
|
||||
var resp = JSON.parse(xhr.responseText);
|
||||
if (resp.handler)
|
||||
return eval(resp.handler);
|
||||
|
||||
var msgs = [];
|
||||
for (key in resp)
|
||||
msgs.push(resp[key])
|
||||
msgs = msgs.join("<br />");
|
||||
if (msgs)
|
||||
dialog.alert(msgs);
|
||||
}
|
||||
|
||||
var ajax = {
|
||||
request:function(options) {
|
||||
options.beforeSend = function(xhr) {
|
||||
if (wctx.csrf)
|
||||
xhr.setRequestHeader(wctx.csrf.header, wctx.csrf.token);
|
||||
if (!options.silent)
|
||||
wait();
|
||||
}
|
||||
if (!options.type) {
|
||||
if (options.data)
|
||||
options.type = "POST";
|
||||
}
|
||||
|
||||
var success = options.success;
|
||||
options.success = function(resp) {
|
||||
if ("string" == typeof resp)
|
||||
resp = trim(resp);
|
||||
|
||||
var stacktrace = resp.stacktrace;
|
||||
delete resp.stacktrace;
|
||||
|
||||
debug("response", resp);
|
||||
|
||||
if (!resp.failed)
|
||||
return success(resp);
|
||||
|
||||
dialog.alert({
|
||||
title:resp.title,
|
||||
content:[resp.description, resp.message].join("<br />")
|
||||
});
|
||||
|
||||
debug("stacktrace", stacktrace);
|
||||
};
|
||||
var handleError = options.error || onError;
|
||||
options.error = function(xhr, options, error) {
|
||||
wait(false);
|
||||
|
||||
debug("error", xhr, options, error);
|
||||
handleError(xhr, options, error);
|
||||
}
|
||||
|
||||
var handleComplete = options.complete || function(){};
|
||||
options.complete = function() {
|
||||
wait(false);
|
||||
handleComplete();
|
||||
};
|
||||
debug("request", options);
|
||||
$.ajax(options);
|
||||
},
|
||||
get:function(options) {
|
||||
options.type = "GET";
|
||||
ajax.request(options);
|
||||
},
|
||||
post:function(options) {
|
||||
options.type = "POST";
|
||||
ajax.request(options);
|
||||
}
|
||||
};
|
||||
|
||||
var json = {
|
||||
with:function(options) {
|
||||
options.dataType = "json";
|
||||
if (typeof(options.data) == "string") {
|
||||
options.contentType = "application/json; charset=UTF-8";
|
||||
}
|
||||
return options;
|
||||
},
|
||||
get:function(options) {
|
||||
ajax.get(json.with(options));
|
||||
},
|
||||
post:function(options) {
|
||||
ajax.post(json.with(options));
|
||||
}
|
||||
};
|
||||
|
||||
function upload(options) {
|
||||
options.enctype = "multipart/form-data";
|
||||
options.processData = options.contentType = false;
|
||||
var data = options.data,
|
||||
formData = new FormData();
|
||||
for (var key in data) {
|
||||
var val = data[key];
|
||||
if (!Array.isArray(val))
|
||||
formData.append(key, val);
|
||||
else {
|
||||
for (var i = 0; i < val.length; ++i)
|
||||
formData.append(key, val[i]);
|
||||
}
|
||||
}
|
||||
options.data = formData;
|
||||
ajax.post(options);
|
||||
}
|
||||
|
||||
$.fn.onEnterPress = function(handler) {
|
||||
return this.each(function(){
|
||||
$(this).keypress(function(evt){
|
||||
if (!handler || evt.which != 13) return;
|
||||
handler.apply();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function labelFor(input) {
|
||||
let selector = "label[for='{id}']",
|
||||
str = "string" == typeof(input),
|
||||
obj = $(input),
|
||||
key = str ? input
|
||||
: obj.attr("id") || obj.attr("name");
|
||||
if (!key) return "";
|
||||
|
||||
selector = selector.replace(/{id}/gi, key);
|
||||
return $(selector).text()
|
||||
|| obj.attr("title")
|
||||
|| obj.attr("placeholder");
|
||||
}
|
||||
|
||||
function validationFailureHandler() {
|
||||
var handler = {
|
||||
notice:function(msg, input) {
|
||||
dialog.alert({
|
||||
content:msg,
|
||||
onClose:function(){input.focus();}
|
||||
});
|
||||
},
|
||||
valueMissing: function(input) {
|
||||
handler.notice(labelFor(input) + "를(을) 입력하십시오.", input);
|
||||
},
|
||||
typeMismatch: function(input) {
|
||||
handler.notice(input.value + "는 " + labelFor(input) + "의 형식에 맞지 않습니다.", input);
|
||||
},
|
||||
tooLong: function(input) {
|
||||
handler.notice(input.value + " 값이 너무 깁니다.", input);
|
||||
},
|
||||
patternMismatch: function(input) {
|
||||
handler.notice(input.value + "는 " + labelFor(input) + "의 형식에 맞지 않습니다.", input);
|
||||
},
|
||||
rangeOverflow: function(input) {
|
||||
handler.notice(labelFor(input) + "의 값은 " + input.max + "보다 작아야 합니다.", input);
|
||||
},
|
||||
rangeUnderflow: function(input) {
|
||||
handler.notice(labelFor(input) + "의 값은 " + input.min + "보다 커야 합니다.", input);
|
||||
},
|
||||
stepMismatch: function(input) {
|
||||
handler.notice(labelFor(input) + "의 값은 " + input.step + "씩 증가 또는 감소해야 합니다.", input);
|
||||
}
|
||||
};
|
||||
return handler;
|
||||
}
|
||||
|
||||
/**Returns the result of validation on the input object.<br />
|
||||
* The types of validation checks are those defined by input objects' basic validity property, which are
|
||||
* <ul><li>valueMissing</li>
|
||||
* <li>typeMismatch</li>
|
||||
* <li>tooLong</li>
|
||||
* <li>patternMismatch</li>
|
||||
* <li>rangeOverflow</li>
|
||||
* <li>rangeUnderflow</li>
|
||||
* <li>stepMismatch</li>
|
||||
* </ul>
|
||||
* To be effective, the input object must be set with attributes
|
||||
* <ul><li>required</li>
|
||||
* <li>type</li>
|
||||
* <li>maxLength</li>
|
||||
* <li>pattern</li>
|
||||
* <li>max</li>
|
||||
* <li>min</li>
|
||||
* <li>step</li>
|
||||
* </ul>
|
||||
* On failure, failureHandler takes over.<br />
|
||||
* The default handler from <code>validationFailureHandler()</code> displays a message
|
||||
* and puts the focus back to the input object.<br />
|
||||
* For the handler to display a message appropriate for the failure,
|
||||
* it is recommended to have a label associated with the input object.
|
||||
* @param input input object
|
||||
* @param failureHandler object that handles validation failure.<br />
|
||||
* If not provided, the default handler from <code>validationFailureHandler()</code> is used.
|
||||
* @returns
|
||||
* <ul><li>true if the value of the input object is valid</li>
|
||||
* <li>false otherwise</li>
|
||||
* </ul>
|
||||
*/
|
||||
function validInput(input, failureHandler) {
|
||||
var validity = input.validity;
|
||||
if (!validity || validity.valid) return true;
|
||||
|
||||
for (var key in validity) {
|
||||
if (!validity[key]) continue;
|
||||
|
||||
if (!failureHandler)
|
||||
failureHandler = validationFailureHandler();
|
||||
var handler = failureHandler[key];
|
||||
if (handler)
|
||||
handler(input);
|
||||
else {
|
||||
log("Handler not found for validation failure of " + key);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**Returns the result of input validation on the selected input objects.<br />
|
||||
* The types of validation checks are those defined by input objects' basic validity property, which are
|
||||
* <ul><li>valueMissing</li>
|
||||
* <li>typeMismatch</li>
|
||||
* <li>tooLong</li>
|
||||
* <li>patternMismatch</li>
|
||||
* <li>rangeOverflow</li>
|
||||
* <li>rangeUnderflow</li>
|
||||
* <li>stepMismatch</li>
|
||||
* </ul>
|
||||
* To be effective, the input objects must be set with attributes
|
||||
* <ul><li>required</li>
|
||||
* <li>type</li>
|
||||
* <li>maxLength</li>
|
||||
* <li>pattern</li>
|
||||
* <li>max</li>
|
||||
* <li>min</li>
|
||||
* <li>step</li>
|
||||
* </ul>
|
||||
* On failure, failureHandler takes over.<br />
|
||||
* The default handler from <code>validationFailureHandler()</code> displays a message
|
||||
* and puts the focus back to the offending input object.<br />
|
||||
* For the handler to display a message appropriate for the failure,
|
||||
* it is recommended to have labels associated with input objects.
|
||||
* @param failureHandler object that handles validation failure.<br />
|
||||
* If not provided, the default handler from <code>validationFailureHandler()</code> is used.
|
||||
* @returns
|
||||
* <ul><li>true if the input values of the selected objects are valid</li>
|
||||
* <li>false otherwise</li>
|
||||
* </ul>
|
||||
*/
|
||||
$.fn.validInputs = function(failureHandler) {
|
||||
var valid = true;
|
||||
this.each(function(){
|
||||
var input = $(this);
|
||||
if (!(valid = validInput(input[0], failureHandler))) {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return valid;
|
||||
}
|
||||
|
||||
$.fn.getValues = function(propertyMapper) {
|
||||
var inputValues = {};
|
||||
this.each(function() {
|
||||
var input = $(this),
|
||||
key = input.prop("id") || input.prop("name"),
|
||||
value = input.val();
|
||||
if (isEmpty(key) || value === undefined) return;
|
||||
|
||||
var type = input.prop("type");
|
||||
if ("file" == type) {
|
||||
value = input.get(0).files;
|
||||
} else if (["checkbox", "radio"].indexOf(type) > -1) {
|
||||
if (!input.is(":checked")) return;
|
||||
}
|
||||
|
||||
var stored = inputValues[key];
|
||||
if (stored === undefined) {
|
||||
inputValues[key] = value;
|
||||
return;
|
||||
}
|
||||
|
||||
if (Array.isArray(stored)) {
|
||||
if (!Array.isArray(value))
|
||||
stored.push(value);
|
||||
else
|
||||
stored = stored.concat(value);
|
||||
} else {
|
||||
var array = [stored];
|
||||
if (!Array.isArray(value))
|
||||
array.push(value);
|
||||
else
|
||||
array = array.concat(value);
|
||||
inputValues[key] = array;
|
||||
}
|
||||
});
|
||||
|
||||
if (propertyMapper) { // propertyMapper = {property:valueProvider, ...}
|
||||
for (var property in propertyMapper) {
|
||||
var valueProvider = propertyMapper[property],
|
||||
value = undefined;
|
||||
switch (typeof(valueProvider)) {
|
||||
case "string":
|
||||
value = inputValues[valueProvider];
|
||||
break;
|
||||
case "function":
|
||||
value = valueProvider(inputValues);
|
||||
break;
|
||||
}
|
||||
if (value === undefined) continue;
|
||||
|
||||
delete inputValues[valueProvider];
|
||||
inputValues[property] = value;
|
||||
}
|
||||
}
|
||||
|
||||
return inputValues;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param config
|
||||
* {start:0,
|
||||
* fetchSize:10,
|
||||
* totalSize:135,
|
||||
* links:3,
|
||||
* first:function(index, label){return "..."},
|
||||
* previous:function(index, label){return "..."},
|
||||
* link:function(index, label){return "..."},
|
||||
* current:function(index, label){return "..."},
|
||||
* next:function(index, label){return "..."},
|
||||
* last:function(index, label){return "..."}
|
||||
* }
|
||||
* @returns {String}
|
||||
*/
|
||||
function paginate(config) {
|
||||
var rc = config.totalSize || 0;
|
||||
// if (!rc) return "";
|
||||
|
||||
var fetchCount = config.fetchSize || 0;
|
||||
// if (!fetchCount) return "";
|
||||
|
||||
var fetch = {
|
||||
all:0,
|
||||
none:-1,
|
||||
count:function(elementCount, size) {
|
||||
if (!elementCount || size == fetch.all) return 1;
|
||||
return parseInt((elementCount / size) + ((elementCount % size) == 0 ? 0 : 1));
|
||||
},
|
||||
end:function(elementCount, size, start) {
|
||||
if (size < fetch.all) throw "Invalid size: " + size;
|
||||
if (elementCount < 0) throw "Invalid elementCount: " + elementCount;
|
||||
var last = elementCount - 1;
|
||||
if (size == fetch.all) return last;
|
||||
return Math.min(last, start + size -1);
|
||||
},
|
||||
page:function(current, count) {
|
||||
return parseInt(count < 1 ? 0 : current / count);
|
||||
},
|
||||
band:function(page, visibleLinks) {
|
||||
return parseInt(visibleLinks < 1 ? 0 : page / visibleLinks);
|
||||
}
|
||||
};
|
||||
var lc = fetch.count(rc, fetchCount);
|
||||
if (lc < 2) return "";
|
||||
|
||||
var links = ifEmpty(config.links, fetch.all),
|
||||
page = fetch.page(ifEmpty(config.start, 0), fetchCount),
|
||||
band = fetch.band(page, links),
|
||||
tags = {
|
||||
link:function(tag, index, label) {
|
||||
return !tag ? "" : tag(index, label);
|
||||
},
|
||||
first:function() {
|
||||
return band < 2 ? "" : tags.link(config.first, 0, 1);
|
||||
},
|
||||
previous:function() {
|
||||
if (band < 1) return "";
|
||||
var prevBand = band - 1,
|
||||
prevPage = (prevBand * links) + (links - 1),
|
||||
fromRec = prevPage * fetchCount;
|
||||
return tags.link(config.previous, fromRec, prevPage + 1);
|
||||
},
|
||||
visibleLinks:function() {
|
||||
var s = "",
|
||||
fromPage = links == fetch.all ? 0 : band * links,
|
||||
toPage = links == fetch.all ? lc : Math.min(lc, fromPage + links);
|
||||
for (var i = fromPage; i < toPage; ++i) {
|
||||
var fromRec = i * fetchCount,
|
||||
label = i + 1;
|
||||
s += tags.link(i == page ? config.current : config.link, fromRec, label);
|
||||
}
|
||||
return s;
|
||||
},
|
||||
next:function(bandCount) {
|
||||
bandCount = parseInt(bandCount);
|
||||
if (bandCount - band < 2) return "";
|
||||
|
||||
var nextBand = band + 1,
|
||||
page = nextBand * links,
|
||||
fromRec = page * fetchCount;
|
||||
return tags.link(config.next, fromRec, page + 1);
|
||||
},
|
||||
last:function(bandCount) {
|
||||
bandCount = parseInt(bandCount);
|
||||
var lastBand = bandCount - 1;
|
||||
if (lastBand - band < 2) return "";
|
||||
|
||||
var pages = lastBand * links,
|
||||
fromRec = pages * fetchCount;
|
||||
return tags.link(config.last, fromRec, pages + 1);
|
||||
}
|
||||
},
|
||||
tag = "";
|
||||
if (links != fetch.all) {
|
||||
tag += tags.first();
|
||||
tag += tags.previous();
|
||||
}
|
||||
tag += tags.visibleLinks();
|
||||
if (links != fetch.all) {
|
||||
var bandCount = parseInt(lc / links);
|
||||
bandCount += lc % links == 0 ? 0 : 1;
|
||||
tag += tags.next(bandCount);
|
||||
tag += tags.last(bandCount);
|
||||
}
|
||||
return tag;
|
||||
}
|
||||
|
||||
$.fn.paginate = function(config) {
|
||||
return this.each(function(){
|
||||
var tag = paginate(config),
|
||||
container = $(this);
|
||||
if (tag)
|
||||
container.html(tag).show();
|
||||
else {
|
||||
if (config.hideIfEmpty != false)
|
||||
container.hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$.fn.setPaging = function(config) {
|
||||
config.links = 5;
|
||||
config.first = function(index, label) {return '<li onclick="{func};" class="page-item first"><a class="page-link"><i class="tf-icon bx bx-chevrons-left"></i></a></li>'.replace(/{func}/, config.func.replace(/{index}/, label));};
|
||||
config.previous = function(index, label) {return '<li onclick="{func}" class="page-item prev"><a class="page-link"><i class="tf-icon bx bx-chevron-left"></i></a></li>'.replace(/{func}/, config.func.replace(/{index}/, label));};
|
||||
config.link = function(index, label) {return '<li onclick="{func}" class="page-item"><a class="page-link">{label}</a></li>'.replace(/{func}/, config.func.replace(/{index}/, label)).replace(/{label}/, label);};
|
||||
config.current = function(index, label) {return '<li class="page-item active"><a class="page-link">{label}</a></li>'.replace(/{label}/, label);};
|
||||
config.next = function(index, label) {return '<li onclick="{func}" class="page-item next"><a class="page-link"><i class="tf-icon bx bx-chevron-right"></i></a></li>'.replace(/{func}/, config.func.replace(/{index}/, label));};
|
||||
config.last = function(index, label) {return '<li onclick="{func}" class="page-item last"><a class="page-link"><i class="tf-icon bx bx-chevrons-right"></i></a></li>'.replace(/{func}/, config.func.replace(/{index}/, label));};
|
||||
|
||||
return this.each(function(){
|
||||
let list = config.list,
|
||||
start = list.empty ? 0 : config.start + 1,
|
||||
end = list.empty ? 0 : config.start + list.length,
|
||||
pagingInfo = list.empty ? "" : start + " ~ " + numberFormat.format(end) + " / " + numberFormat.format(config.totalSize);
|
||||
$("#"+ config.prefix + "PagingInfo").html(pagingInfo);
|
||||
|
||||
let tag = paginate(config),
|
||||
container = $(this);
|
||||
if (tag)
|
||||
container.html(tag.replace(/{func}/g, config.func)).show();
|
||||
else {
|
||||
if (config.hideIfEmpty != false)
|
||||
container.hide();
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
$.fn.setPagingInfo = function(config) {
|
||||
return this.each(function(){
|
||||
let list = config.list;
|
||||
let pagingInfo = list.empty ? "" : 1
|
||||
+ " ~ "
|
||||
+ numberFormat.format(list.length)
|
||||
+ " / " + numberFormat.format(config.totalSize);
|
||||
$("#"+ config.prefix + "PagingInfo").html(pagingInfo);
|
||||
});
|
||||
}
|
||||
|
||||
$.fn.setCurrentRow = function(val) {
|
||||
if (!val) return;
|
||||
|
||||
return this.each(function() {
|
||||
var e = $(this);
|
||||
e.find("tr").each(function(){
|
||||
var tr = $(this),
|
||||
current = val == tr.attr("data-key");
|
||||
if (current)
|
||||
tr.addClass("current-row");
|
||||
else
|
||||
tr.removeClass("current-row");
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
class FormFields {
|
||||
constructor(selector) {
|
||||
this.form = document.querySelector(this.selector = selector);
|
||||
this.children = ["input", "select", "textarea"].map(tag => this.selector + " " + tag).join(",");
|
||||
this.datamap = [];
|
||||
}
|
||||
|
||||
set(ctrl, obj) {
|
||||
let setChanged = evt => {
|
||||
let input = evt.target,
|
||||
name = input.getAttribute("data-map"),
|
||||
val = input.value;
|
||||
ctrl.setValue(name, val);
|
||||
};
|
||||
document.querySelectorAll(this.children).forEach(input => {
|
||||
let prop = input.getAttribute("data-map")
|
||||
|| input.name
|
||||
|| input.id;
|
||||
if (!prop) return;
|
||||
|
||||
input.removeEventListener("change", setChanged);
|
||||
|
||||
let dataItem = obj instanceof DataItem,
|
||||
value = dataItem ? obj.getValue(prop) : obj[prop],
|
||||
inputType = (input.type || input.tagName || "").toLowerCase();
|
||||
|
||||
switch (inputType) {
|
||||
case "radio": input.checked = value && value == input.value; break;
|
||||
case "checkbox": input.checked = value && value == input.value; break;
|
||||
case "select":
|
||||
for(let option of input.options) {
|
||||
option.selected = option.value == value;
|
||||
}
|
||||
break;
|
||||
default: input.value = ifEmpty(value, ""); break;
|
||||
}
|
||||
input.addEventListener("change", setChanged);
|
||||
});
|
||||
}
|
||||
|
||||
get() {
|
||||
let obj = {};
|
||||
document.querySelectorAll(this.children).forEach(input => {
|
||||
let property = input.name || input.id;
|
||||
let value = input.value;
|
||||
if ("radio" == input.type) {
|
||||
if (input.checked)
|
||||
obj[property] = value;
|
||||
} else {
|
||||
obj[property] = value;
|
||||
}
|
||||
// log(property, value, "radio" == input.type ? "radio" : "", input.checked ? "checked" : "");
|
||||
});
|
||||
return obj;
|
||||
//return Object.fromEntries(new FormData(this.form).entries());
|
||||
}
|
||||
};
|
||||
|
||||
$.fn.datePicker = function(selector) {
|
||||
return this.each(function() {
|
||||
$(this)
|
||||
.datepicker()
|
||||
.attr("maxlength", "10")
|
||||
.on("input",function(e) {
|
||||
if (this.value.length <= 0
|
||||
|| this.value.length != this.selectionStart
|
||||
)
|
||||
return;
|
||||
|
||||
var value = this.value.replaceAll("-","");
|
||||
if (value.length > 7) {
|
||||
this.value = value.substring(0,4)+"-"+value.substring(4,6)+"-"+value.substring(6);
|
||||
} else if (value.length > 5) {
|
||||
this.value = value.substring(0,4)+"-"+value.substring(4);
|
||||
}
|
||||
})
|
||||
.on("paste", function(e) {
|
||||
var value = e.originalEvent.clipboardData.getData('text');
|
||||
if (value.length == 8)
|
||||
this.value = value.substring(0,4)+"-"+value.substring(4,6)+"-"+value.substring(6);
|
||||
});
|
||||
|
||||
var calendarIcon = $(this).next("button.bx-calendar");
|
||||
if (calendarIcon.length > 0) {
|
||||
$(calendarIcon).on("click", function() {
|
||||
$(this).prev().focus();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @param fromSource 시작값을 갖는 input의 selector
|
||||
* @param toSource 종료값을 갖는 input의 selector
|
||||
*/
|
||||
function inputsInRange(fromSource, toSource) {
|
||||
var from = $(fromSource),
|
||||
to = $(toSource),
|
||||
compare = function() {
|
||||
var fromVal = from.val() || "",
|
||||
toVal = to.val() || "",
|
||||
ok = toVal >= fromVal;
|
||||
if (ok) return;
|
||||
|
||||
if ($(this)[0] == from[0])
|
||||
to.val(from.val())
|
||||
else
|
||||
from.val(to.val());
|
||||
};
|
||||
from.change(compare);
|
||||
to.change(compare);
|
||||
}
|
||||
|
||||
function ignore() {
|
||||
console.log.apply(console, arguments);
|
||||
}
|
||||
|
||||
function fileInput(conf) {
|
||||
conf = conf || {};
|
||||
var name = conf.name || "upload",
|
||||
tag = "<input type='file' name='{name}'{multiple}{accept} style='display:none;'>"
|
||||
.replace(/{name}/, name)
|
||||
.replace(/{multiple}/, conf.multiple ? " multiple" : "")
|
||||
.replace(/{accept}/, conf.accept ? " accept='" + conf.accept + "'" : ""),
|
||||
obj = {
|
||||
name:name,
|
||||
input:null,
|
||||
files:[],
|
||||
|
||||
select:function(onSelect) {
|
||||
if (!obj.input) {
|
||||
var input = obj.input = $(tag);
|
||||
$("body").append(input);
|
||||
input.change(function() {
|
||||
var files = $(this).get(0).files,
|
||||
length = files.length,
|
||||
selected = [];
|
||||
for (var i = 0; i < length; ++i) {
|
||||
var file = files[i];
|
||||
file.id = name + (obj.files.length);
|
||||
selected.push(file);
|
||||
obj.files.push(file);
|
||||
}
|
||||
onSelect(selected);
|
||||
})
|
||||
}
|
||||
obj.input.click();
|
||||
},
|
||||
|
||||
getFiles:function() {
|
||||
return obj.files;
|
||||
},
|
||||
|
||||
remove:function(id) {
|
||||
if (!id) return;
|
||||
|
||||
var files = obj.files;
|
||||
for (var i = 0; i < files.length; ++i) {
|
||||
var file = files[i];
|
||||
if (id == file.id) {
|
||||
files.splice(i, 1);
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
clear:function() {
|
||||
if (obj.input)
|
||||
$(obj.input).remove();
|
||||
obj.input = null;
|
||||
obj.files.forEach(function(file) {delete file;});
|
||||
obj.files = [];
|
||||
}
|
||||
};
|
||||
return obj;
|
||||
}
|
||||
Loading…
Reference in New Issue