200 lines
8.4 KiB
JavaScript
200 lines
8.4 KiB
JavaScript
define(['common'], function (Common) {
|
|
var option = function (q, op) {
|
|
this.questionmodule = q;
|
|
this.option = op;
|
|
this.dialog_text = null;
|
|
this.dialog_bgcolor = null;
|
|
this.dialog_severitylevel = null;
|
|
this.holder = null;
|
|
this.texteditable = true;
|
|
this.removable = true;
|
|
if (op) {
|
|
if (op.removable == false)
|
|
this.removable = false;
|
|
else
|
|
this.removable = true;
|
|
}
|
|
this.onremove = null;
|
|
};
|
|
|
|
option.prototype.getOptionValue = function () {
|
|
var option = this.option || {};
|
|
option.Text = this.dialog_text.val();
|
|
var texts = this.dialog_text.data("texts");
|
|
if (texts) {
|
|
option.LocalTexts = texts;
|
|
}
|
|
option.BackgroundColor = this.dialog_bgcolor.val();
|
|
option.SeverityLevel = this.dialog_severitylevel.val();
|
|
return option;
|
|
}
|
|
|
|
option.prototype.removeOption = function () {
|
|
this.holder.remove();
|
|
if (this.onremove)
|
|
this.onremove(this);
|
|
this.onsave();
|
|
}
|
|
|
|
option.prototype.onsave = function () {
|
|
this.questionmodule.onsave();
|
|
}
|
|
|
|
option.prototype.createContent = function () {
|
|
var _this = this;
|
|
var tb = $('<table style="border: 1px solid #a8a8a8; margin-top:2px;line-height:32px;"></table>');
|
|
this.holder = tb;
|
|
var tr = $('<tr></tr>');
|
|
tb.append(tr);
|
|
var optext = $('<input type="text" class="form-control" style="width:226px;margin-left:5px;"/>');
|
|
this.dialog_text = optext;
|
|
var addiText = $('<span class="spanbtn iconmultitext" style="font-size:14px;" title="' + GetTextByKey("P_IPT_XXX", "Language Selection") + '"/>');
|
|
addiText.click(function () {
|
|
Common.createMultiTextDialog(optext);
|
|
});
|
|
var td = $('<td colspan="2"><span class="redasterisk">*</span></td>');
|
|
td.append(this.dialog_text).append(addiText)
|
|
tr.append(td);
|
|
|
|
//tr = $('<tr></tr>');
|
|
//tb.append(tr);
|
|
td = $('<td style="width:76px;"></td>');
|
|
tr.append(td);
|
|
td.append($('<label>' + GetTextByKey("P_IPT_SEVERITYLEVEL", "Severity Level") + '</label>'));
|
|
this.dialog_severitylevel = createSeverityLevel().addClass('form-control');
|
|
this.dialog_severitylevel.css('width', 100);
|
|
tr.append($('<td></td>').append(this.dialog_severitylevel));
|
|
|
|
//tr = $('<tr></tr>');
|
|
//tb.append(tr);
|
|
var bg_label = $('<label>' + GetTextByKey("P_IPT_BACKGROUNDCOLOR", "Background Color") + '</label>');
|
|
td = $('<td style="width:100px;"></td>').append(bg_label);
|
|
tr.append(td);
|
|
this.dialog_bgcolor = $('<input style="width:100px;"/>');
|
|
var bgcolor = $('<div></div>')
|
|
bgcolor.append(this.dialog_bgcolor);
|
|
td = $('<td></td>').append(bgcolor);
|
|
tr.append(td);
|
|
initColorCtrl(this.dialog_bgcolor);
|
|
|
|
if (!this.texteditable) {
|
|
this.dialog_text.attr('disabled', 'disabled');
|
|
}
|
|
if (this.removable) {
|
|
td = $('<td style="width:30px;"></td>');
|
|
tr.append(td);
|
|
var deleteoptionbtn = $('<em class="spanbtn icondelete"></em>');
|
|
td.append(deleteoptionbtn.click(function () {
|
|
_this.removeOption();
|
|
}));
|
|
|
|
if (templatereadonly || !editable)
|
|
deleteoptionbtn.hide();
|
|
}
|
|
|
|
function updateOptionContent() {
|
|
var op = _this.option;
|
|
if (op) {
|
|
_this.dialog_text.val(op.Text).data("texts", op.LocalTexts);
|
|
if (op.BackgroundColor && op.BackgroundColor != '')
|
|
_this.dialog_bgcolor.spectrum("set", op.BackgroundColor);
|
|
_this.dialog_severitylevel.val(op.SeverityLevel);
|
|
}
|
|
}
|
|
|
|
function controlSaveEvent() {
|
|
_this.dialog_text.change(function () {
|
|
_this.onsave();
|
|
});
|
|
_this.dialog_severitylevel.change(function () {
|
|
_this.onsave();
|
|
});
|
|
_this.dialog_bgcolor.change(function () {
|
|
_this.onsave();
|
|
});
|
|
}
|
|
|
|
function setDisabled() {
|
|
_this.dialog_text.prop('disabled', true);
|
|
_this.dialog_bgcolor.prop('disabled', true);
|
|
_this.dialog_severitylevel.prop('disabled', true);
|
|
}
|
|
|
|
updateOptionContent();
|
|
if (templatereadonly || !editable)
|
|
setDisabled();
|
|
controlSaveEvent();
|
|
return tb;
|
|
}
|
|
|
|
function initColorCtrl(ipt_color) {
|
|
ipt_color.spectrum({
|
|
allowEmpty: true,
|
|
color: "#FFF",
|
|
showInput: true,
|
|
containerClassName: "full-spectrum",
|
|
showInitial: true,
|
|
showPalette: true,
|
|
showSelectionPalette: true,
|
|
showAlpha: true,
|
|
maxPaletteSize: 10,
|
|
preferredFormat: "hex",
|
|
localStorageKey: "spectrum.demo",
|
|
chooseText: GetTextByKey("P_IPT_OK", "OK"),
|
|
cancelText: GetTextByKey("P_IPT_CANCEL", "Cancel"),
|
|
clearText: GetTextByKey("P_SPECTRUM_CLEARCOLORSELECTION", "Clear Color Selection"),
|
|
noColorSelectedText: GetTextByKey("P_SPECTRUM_NOCOLORSELECTED", "No Color Selected"),
|
|
disabled: (templatereadonly && !editable),
|
|
move: function (color) {
|
|
if (color)
|
|
ipt_color.val(color.toHexString().toUpperCase()); // #ff0000
|
|
},
|
|
show: function () {
|
|
|
|
},
|
|
beforeShow: function () {
|
|
|
|
},
|
|
hide: function (color) {
|
|
if (color) {
|
|
ipt_color.val(color.toHexString().toUpperCase()); // #ff0000
|
|
}
|
|
},
|
|
|
|
palette: [
|
|
["rgb(0, 0, 0)", "rgb(67, 67, 67)", "rgb(102, 102, 102)", /*"rgb(153, 153, 153)","rgb(183, 183, 183)",*/
|
|
"rgb(204, 204, 204)", "rgb(217, 217, 217)", /*"rgb(239, 239, 239)", "rgb(243, 243, 243)",*/ "rgb(255, 255, 255)"],
|
|
["rgb(152, 0, 0)", "rgb(255, 0, 0)", "rgb(255, 153, 0)", "rgb(255, 255, 0)", "rgb(0, 255, 0)",
|
|
"rgb(0, 255, 255)", "rgb(74, 134, 232)", "rgb(0, 0, 255)", "rgb(153, 0, 255)", "rgb(255, 0, 255)"],
|
|
["rgb(230, 184, 175)", "rgb(244, 204, 204)", "rgb(252, 229, 205)", "rgb(255, 242, 204)", "rgb(217, 234, 211)",
|
|
"rgb(208, 224, 227)", "rgb(201, 218, 248)", "rgb(207, 226, 243)", "rgb(217, 210, 233)", "rgb(234, 209, 220)",
|
|
"rgb(221, 126, 107)", "rgb(234, 153, 153)", "rgb(249, 203, 156)", "rgb(255, 229, 153)", "rgb(182, 215, 168)",
|
|
"rgb(162, 196, 201)", "rgb(164, 194, 244)", "rgb(159, 197, 232)", "rgb(180, 167, 214)", "rgb(213, 166, 189)",
|
|
"rgb(204, 65, 37)", "rgb(224, 102, 102)", "rgb(246, 178, 107)", "rgb(255, 217, 102)", "rgb(147, 196, 125)",
|
|
"rgb(118, 165, 175)", "rgb(109, 158, 235)", "rgb(111, 168, 220)", "rgb(142, 124, 195)", "rgb(194, 123, 160)",
|
|
"rgb(166, 28, 0)", "rgb(204, 0, 0)", "rgb(230, 145, 56)", "rgb(241, 194, 50)", "rgb(106, 168, 79)",
|
|
"rgb(69, 129, 142)", "rgb(60, 120, 216)", "rgb(61, 133, 198)", "rgb(103, 78, 167)", "rgb(166, 77, 121)",
|
|
/*"rgb(133, 32, 12)", "rgb(153, 0, 0)", "rgb(180, 95, 6)", "rgb(191, 144, 0)", "rgb(56, 118, 29)",
|
|
"rgb(19, 79, 92)", "rgb(17, 85, 204)", "rgb(11, 83, 148)", "rgb(53, 28, 117)", "rgb(116, 27, 71)",*/
|
|
"rgb(91, 15, 0)", "rgb(102, 0, 0)", "rgb(120, 63, 4)", "rgb(127, 96, 0)", "rgb(39, 78, 19)",
|
|
"rgb(12, 52, 61)", "rgb(28, 69, 135)", "rgb(7, 55, 99)", "rgb(32, 18, 77)", "rgb(76, 17, 48)"]
|
|
]
|
|
});
|
|
}
|
|
|
|
function createSeverityLevel() {
|
|
var items = [];
|
|
items.push({ 'Key': 0, "Value": GetTextByKey("P_IPT_SL_NONE", "None") });
|
|
items.push({ 'Key': 1, "Value": GetTextByKey("P_IPT_SL_LOW", "Low") });
|
|
items.push({ 'Key': 2, "Value": GetTextByKey("P_IPT_SL_MEDIUM", "Medium") });
|
|
items.push({ 'Key': 3, "Value": GetTextByKey("P_IPT_SL_HIGH", "High") });
|
|
var sel = $('<select style="width:324px;height:22px;"></select>');
|
|
for (var i = 0; i < items.length; i++) {
|
|
var item = items[i];
|
|
sel.append('<option value="' + item.Key + '">' + item.Value + '</option>');
|
|
}
|
|
return sel;
|
|
}
|
|
|
|
return option;
|
|
}); |