From 8d417057d38d56510a1d3d2e39381a1df3dd96ee Mon Sep 17 00:00:00 2001 From: Thomas Lenz Date: Wed, 16 Oct 2013 20:09:40 +0200 Subject: @ConfigWebTool --add JS ColorPicker to select colors easier --add BKUSelectionFrom preview --add useMandate checkbox --change position of some checkboxes in OA configuration @MOAID lib --change API of BKUFormCustomization utils --- .../src/main/webapp/css/colorpicker.css | 161 +++++++ id/ConfigWebTool/src/main/webapp/css/index.css | 14 +- id/ConfigWebTool/src/main/webapp/images/blank.gif | Bin 0 -> 49 bytes .../main/webapp/images/colorpicker_background.png | Bin 0 -> 1897 bytes .../src/main/webapp/images/colorpicker_hex.png | Bin 0 -> 532 bytes .../src/main/webapp/images/colorpicker_hsb_b.png | Bin 0 -> 970 bytes .../src/main/webapp/images/colorpicker_hsb_h.png | Bin 0 -> 1012 bytes .../src/main/webapp/images/colorpicker_hsb_s.png | Bin 0 -> 1171 bytes .../src/main/webapp/images/colorpicker_indic.gif | Bin 0 -> 86 bytes .../src/main/webapp/images/colorpicker_overlay.png | Bin 0 -> 10355 bytes .../src/main/webapp/images/colorpicker_rgb_b.png | Bin 0 -> 970 bytes .../src/main/webapp/images/colorpicker_rgb_g.png | Bin 0 -> 1069 bytes .../src/main/webapp/images/colorpicker_rgb_r.png | Bin 0 -> 1066 bytes .../src/main/webapp/images/colorpicker_select.gif | Bin 0 -> 78 bytes .../src/main/webapp/images/colorpicker_submit.png | Bin 0 -> 984 bytes .../src/main/webapp/images/custom_background.png | Bin 0 -> 1916 bytes .../src/main/webapp/images/custom_hex.png | Bin 0 -> 562 bytes .../src/main/webapp/images/custom_hsb_b.png | Bin 0 -> 1097 bytes .../src/main/webapp/images/custom_hsb_h.png | Bin 0 -> 970 bytes .../src/main/webapp/images/custom_hsb_s.png | Bin 0 -> 1168 bytes .../src/main/webapp/images/custom_indic.gif | Bin 0 -> 86 bytes .../src/main/webapp/images/custom_rgb_b.png | Bin 0 -> 1008 bytes .../src/main/webapp/images/custom_rgb_g.png | Bin 0 -> 1069 bytes .../src/main/webapp/images/custom_rgb_r.png | Bin 0 -> 1018 bytes .../src/main/webapp/images/custom_submit.png | Bin 0 -> 997 bytes id/ConfigWebTool/src/main/webapp/images/select.png | Bin 0 -> 506 bytes .../src/main/webapp/images/select2.png | Bin 0 -> 518 bytes id/ConfigWebTool/src/main/webapp/images/slider.png | Bin 0 -> 315 bytes id/ConfigWebTool/src/main/webapp/js/colorpicker.js | 484 +++++++++++++++++++++ id/ConfigWebTool/src/main/webapp/js/common.js | 19 + .../src/main/webapp/jsp/editOAGeneral.jsp | 205 +++++---- 31 files changed, 801 insertions(+), 82 deletions(-) create mode 100644 id/ConfigWebTool/src/main/webapp/css/colorpicker.css create mode 100644 id/ConfigWebTool/src/main/webapp/images/blank.gif create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_background.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_hex.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_b.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_h.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_s.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_indic.gif create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_overlay.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_b.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_g.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_r.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_select.gif create mode 100644 id/ConfigWebTool/src/main/webapp/images/colorpicker_submit.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_background.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_hex.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_hsb_b.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_hsb_h.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_hsb_s.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_indic.gif create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_rgb_b.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_rgb_g.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_rgb_r.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/custom_submit.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/select.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/select2.png create mode 100644 id/ConfigWebTool/src/main/webapp/images/slider.png create mode 100644 id/ConfigWebTool/src/main/webapp/js/colorpicker.js (limited to 'id/ConfigWebTool/src/main/webapp') diff --git a/id/ConfigWebTool/src/main/webapp/css/colorpicker.css b/id/ConfigWebTool/src/main/webapp/css/colorpicker.css new file mode 100644 index 000000000..0b3d5d936 --- /dev/null +++ b/id/ConfigWebTool/src/main/webapp/css/colorpicker.css @@ -0,0 +1,161 @@ +.colorpicker { + width: 356px; + height: 176px; + overflow: hidden; + position: absolute; + background: url(../images/colorpicker_background.png); + font-family: Arial, Helvetica, sans-serif; + display: none; +} +.colorpicker_color { + width: 150px; + height: 150px; + left: 14px; + top: 13px; + position: absolute; + background: #f00; + overflow: hidden; + cursor: crosshair; +} +.colorpicker_color div { + position: absolute; + top: 0; + left: 0; + width: 150px; + height: 150px; + background: url(../images/colorpicker_overlay.png); +} +.colorpicker_color div div { + position: absolute; + top: 0; + left: 0; + width: 11px; + height: 11px; + overflow: hidden; + background: url(../images/colorpicker_select.gif); + margin: -5px 0 0 -5px; +} +.colorpicker_hue { + position: absolute; + top: 13px; + left: 171px; + width: 35px; + height: 150px; + cursor: n-resize; +} +.colorpicker_hue div { + position: absolute; + width: 35px; + height: 9px; + overflow: hidden; + background: url(../images/colorpicker_indic.gif) left top; + margin: -4px 0 0 0; + left: 0px; +} +.colorpicker_new_color { + position: absolute; + width: 60px; + height: 30px; + left: 213px; + top: 13px; + background: #f00; +} +.colorpicker_current_color { + position: absolute; + width: 60px; + height: 30px; + left: 283px; + top: 13px; + background: #f00; +} +.colorpicker input { + background-color: transparent; + border: 1px solid transparent; + position: absolute; + font-size: 10px; + font-family: Arial, Helvetica, sans-serif; + color: #898989; + top: 4px; + right: 11px; + text-align: right; + margin: 0; + padding: 0; + height: 11px; +} +.colorpicker_hex { + position: absolute; + width: 72px; + height: 22px; + background: url(../images/colorpicker_hex.png) top; + left: 212px; + top: 142px; +} +.colorpicker_hex input { + right: 6px; +} +.colorpicker_field { + height: 22px; + width: 62px; + background-position: top; + position: absolute; +} +.colorpicker_field span { + position: absolute; + width: 12px; + height: 22px; + overflow: hidden; + top: 0; + right: 0; + cursor: n-resize; +} +.colorpicker_rgb_r { + background-image: url(../images/colorpicker_rgb_r.png); + top: 52px; + left: 212px; +} +.colorpicker_rgb_g { + background-image: url(../images/colorpicker_rgb_g.png); + top: 82px; + left: 212px; +} +.colorpicker_rgb_b { + background-image: url(../images/colorpicker_rgb_b.png); + top: 112px; + left: 212px; +} +.colorpicker_hsb_h { + background-image: url(../images/colorpicker_hsb_h.png); + top: 52px; + left: 282px; +} +.colorpicker_hsb_s { + background-image: url(../images/colorpicker_hsb_s.png); + top: 82px; + left: 282px; +} +.colorpicker_hsb_b { + background-image: url(../images/colorpicker_hsb_b.png); + top: 112px; + left: 282px; +} +.colorpicker_submit { + position: absolute; + width: 22px; + height: 22px; + background: url(../images/colorpicker_submit.png) top; + left: 322px; + top: 142px; + overflow: hidden; +} +.colorpicker_focus { + background-position: center; +} +.colorpicker_hex.colorpicker_focus { + background-position: bottom; +} +.colorpicker_submit.colorpicker_focus { + background-position: bottom; +} +.colorpicker_slider { + background-position: bottom; +} diff --git a/id/ConfigWebTool/src/main/webapp/css/index.css b/id/ConfigWebTool/src/main/webapp/css/index.css index 911db5334..14591f1dc 100644 --- a/id/ConfigWebTool/src/main/webapp/css/index.css +++ b/id/ConfigWebTool/src/main/webapp/css/index.css @@ -147,6 +147,16 @@ margin-bottom: 50px; } +#formCustomValues { + float: left; +} + +#formCustomPreview { + float: left; + margin-bottom: 25px; + margin-left: 25px; +} + #mail_area input { float: right; } @@ -230,7 +240,7 @@ } .wwgrp { - clear:both; + clear:left; } #oa_saml1_area .wwgrp { @@ -258,7 +268,7 @@ div .wwgrp br { } .textfield_mail { - width: 400px; + width: 300px; } .textfield_long { diff --git a/id/ConfigWebTool/src/main/webapp/images/blank.gif b/id/ConfigWebTool/src/main/webapp/images/blank.gif new file mode 100644 index 000000000..75b945d25 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/blank.gif differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_background.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_background.png new file mode 100644 index 000000000..8401572f1 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_background.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_hex.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hex.png new file mode 100644 index 000000000..4e532d7c6 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hex.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_b.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_b.png new file mode 100644 index 000000000..dfac595d0 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_b.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_h.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_h.png new file mode 100644 index 000000000..3977ed9f2 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_h.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_s.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_s.png new file mode 100644 index 000000000..a2a699736 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_hsb_s.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_indic.gif b/id/ConfigWebTool/src/main/webapp/images/colorpicker_indic.gif new file mode 100644 index 000000000..f9fa95e28 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_indic.gif differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_overlay.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_overlay.png new file mode 100644 index 000000000..561cdd9c5 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_overlay.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_b.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_b.png new file mode 100644 index 000000000..dfac595d0 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_b.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_g.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_g.png new file mode 100644 index 000000000..72b32760a Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_g.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_r.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_r.png new file mode 100644 index 000000000..4855fe03f Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_rgb_r.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_select.gif b/id/ConfigWebTool/src/main/webapp/images/colorpicker_select.gif new file mode 100644 index 000000000..599f7f13a Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_select.gif differ diff --git a/id/ConfigWebTool/src/main/webapp/images/colorpicker_submit.png b/id/ConfigWebTool/src/main/webapp/images/colorpicker_submit.png new file mode 100644 index 000000000..7f4c0825f Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/colorpicker_submit.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_background.png b/id/ConfigWebTool/src/main/webapp/images/custom_background.png new file mode 100644 index 000000000..cf55ffdd6 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_background.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_hex.png b/id/ConfigWebTool/src/main/webapp/images/custom_hex.png new file mode 100644 index 000000000..888f44449 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_hex.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_hsb_b.png b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_b.png new file mode 100644 index 000000000..2f99dae8e Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_b.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_hsb_h.png b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_h.png new file mode 100644 index 000000000..a217e9218 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_h.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_hsb_s.png b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_s.png new file mode 100644 index 000000000..7826b4150 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_hsb_s.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_indic.gif b/id/ConfigWebTool/src/main/webapp/images/custom_indic.gif new file mode 100644 index 000000000..222fb94cf Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_indic.gif differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_rgb_b.png b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_b.png new file mode 100644 index 000000000..80764e5d6 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_b.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_rgb_g.png b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_g.png new file mode 100644 index 000000000..fc9778be1 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_g.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_rgb_r.png b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_r.png new file mode 100644 index 000000000..91b0cd4c5 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_rgb_r.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/custom_submit.png b/id/ConfigWebTool/src/main/webapp/images/custom_submit.png new file mode 100644 index 000000000..cd202cd93 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/custom_submit.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/select.png b/id/ConfigWebTool/src/main/webapp/images/select.png new file mode 100644 index 000000000..21213bfd5 Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/select.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/select2.png b/id/ConfigWebTool/src/main/webapp/images/select2.png new file mode 100644 index 000000000..2cd2cabeb Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/select2.png differ diff --git a/id/ConfigWebTool/src/main/webapp/images/slider.png b/id/ConfigWebTool/src/main/webapp/images/slider.png new file mode 100644 index 000000000..8b03da96e Binary files /dev/null and b/id/ConfigWebTool/src/main/webapp/images/slider.png differ diff --git a/id/ConfigWebTool/src/main/webapp/js/colorpicker.js b/id/ConfigWebTool/src/main/webapp/js/colorpicker.js new file mode 100644 index 000000000..45f56ced7 --- /dev/null +++ b/id/ConfigWebTool/src/main/webapp/js/colorpicker.js @@ -0,0 +1,484 @@ +/** + * + * Color picker + * Author: Stefan Petre www.eyecon.ro + * + * Dual licensed under the MIT and GPL licenses + * + */ +(function ($) { + var ColorPicker = function () { + var + ids = {}, + inAction, + charMin = 65, + visible, + tpl = '
', + defaults = { + eventName: 'click', + onShow: function () {}, + onBeforeShow: function(){}, + onHide: function () {}, + onChange: function () {}, + onSubmit: function () {}, + color: 'ff0000', + livePreview: true, + flat: false + }, + fillRGBFields = function (hsb, cal) { + var rgb = HSBToRGB(hsb); + $(cal).data('colorpicker').fields + .eq(1).val(rgb.r).end() + .eq(2).val(rgb.g).end() + .eq(3).val(rgb.b).end(); + }, + fillHSBFields = function (hsb, cal) { + $(cal).data('colorpicker').fields + .eq(4).val(hsb.h).end() + .eq(5).val(hsb.s).end() + .eq(6).val(hsb.b).end(); + }, + fillHexFields = function (hsb, cal) { + $(cal).data('colorpicker').fields + .eq(0).val(HSBToHex(hsb)).end(); + }, + setSelector = function (hsb, cal) { + $(cal).data('colorpicker').selector.css('backgroundColor', '#' + HSBToHex({h: hsb.h, s: 100, b: 100})); + $(cal).data('colorpicker').selectorIndic.css({ + left: parseInt(150 * hsb.s/100, 10), + top: parseInt(150 * (100-hsb.b)/100, 10) + }); + }, + setHue = function (hsb, cal) { + $(cal).data('colorpicker').hue.css('top', parseInt(150 - 150 * hsb.h/360, 10)); + }, + setCurrentColor = function (hsb, cal) { + $(cal).data('colorpicker').currentColor.css('backgroundColor', '#' + HSBToHex(hsb)); + }, + setNewColor = function (hsb, cal) { + $(cal).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(hsb)); + }, + keyDown = function (ev) { + var pressedKey = ev.charCode || ev.keyCode || -1; + if ((pressedKey > charMin && pressedKey <= 90) || pressedKey == 32) { + return false; + } + var cal = $(this).parent().parent(); + if (cal.data('colorpicker').livePreview === true) { + change.apply(this); + } + }, + change = function (ev) { + var cal = $(this).parent().parent(), col; + if (this.parentNode.className.indexOf('_hex') > 0) { + cal.data('colorpicker').color = col = HexToHSB(fixHex(this.value)); + } else if (this.parentNode.className.indexOf('_hsb') > 0) { + cal.data('colorpicker').color = col = fixHSB({ + h: parseInt(cal.data('colorpicker').fields.eq(4).val(), 10), + s: parseInt(cal.data('colorpicker').fields.eq(5).val(), 10), + b: parseInt(cal.data('colorpicker').fields.eq(6).val(), 10) + }); + } else { + cal.data('colorpicker').color = col = RGBToHSB(fixRGB({ + r: parseInt(cal.data('colorpicker').fields.eq(1).val(), 10), + g: parseInt(cal.data('colorpicker').fields.eq(2).val(), 10), + b: parseInt(cal.data('colorpicker').fields.eq(3).val(), 10) + })); + } + if (ev) { + fillRGBFields(col, cal.get(0)); + fillHexFields(col, cal.get(0)); + fillHSBFields(col, cal.get(0)); + } + setSelector(col, cal.get(0)); + setHue(col, cal.get(0)); + setNewColor(col, cal.get(0)); + cal.data('colorpicker').onChange.apply(cal, [col, HSBToHex(col), HSBToRGB(col)]); + }, + blur = function (ev) { + var cal = $(this).parent().parent(); + cal.data('colorpicker').fields.parent().removeClass('colorpicker_focus'); + }, + focus = function () { + charMin = this.parentNode.className.indexOf('_hex') > 0 ? 70 : 65; + $(this).parent().parent().data('colorpicker').fields.parent().removeClass('colorpicker_focus'); + $(this).parent().addClass('colorpicker_focus'); + }, + downIncrement = function (ev) { + var field = $(this).parent().find('input').focus(); + var current = { + el: $(this).parent().addClass('colorpicker_slider'), + max: this.parentNode.className.indexOf('_hsb_h') > 0 ? 360 : (this.parentNode.className.indexOf('_hsb') > 0 ? 100 : 255), + y: ev.pageY, + field: field, + val: parseInt(field.val(), 10), + preview: $(this).parent().parent().data('colorpicker').livePreview + }; + $(document).bind('mouseup', current, upIncrement); + $(document).bind('mousemove', current, moveIncrement); + }, + moveIncrement = function (ev) { + ev.data.field.val(Math.max(0, Math.min(ev.data.max, parseInt(ev.data.val + ev.pageY - ev.data.y, 10)))); + if (ev.data.preview) { + change.apply(ev.data.field.get(0), [true]); + } + return false; + }, + upIncrement = function (ev) { + change.apply(ev.data.field.get(0), [true]); + ev.data.el.removeClass('colorpicker_slider').find('input').focus(); + $(document).unbind('mouseup', upIncrement); + $(document).unbind('mousemove', moveIncrement); + return false; + }, + downHue = function (ev) { + var current = { + cal: $(this).parent(), + y: $(this).offset().top + }; + current.preview = current.cal.data('colorpicker').livePreview; + $(document).bind('mouseup', current, upHue); + $(document).bind('mousemove', current, moveHue); + }, + moveHue = function (ev) { + change.apply( + ev.data.cal.data('colorpicker') + .fields + .eq(4) + .val(parseInt(360*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.y))))/150, 10)) + .get(0), + [ev.data.preview] + ); + return false; + }, + upHue = function (ev) { + fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0)); + fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0)); + $(document).unbind('mouseup', upHue); + $(document).unbind('mousemove', moveHue); + return false; + }, + downSelector = function (ev) { + var current = { + cal: $(this).parent(), + pos: $(this).offset() + }; + current.preview = current.cal.data('colorpicker').livePreview; + $(document).bind('mouseup', current, upSelector); + $(document).bind('mousemove', current, moveSelector); + }, + moveSelector = function (ev) { + change.apply( + ev.data.cal.data('colorpicker') + .fields + .eq(6) + .val(parseInt(100*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.pos.top))))/150, 10)) + .end() + .eq(5) + .val(parseInt(100*(Math.max(0,Math.min(150,(ev.pageX - ev.data.pos.left))))/150, 10)) + .get(0), + [ev.data.preview] + ); + return false; + }, + upSelector = function (ev) { + fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0)); + fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0)); + $(document).unbind('mouseup', upSelector); + $(document).unbind('mousemove', moveSelector); + return false; + }, + enterSubmit = function (ev) { + $(this).addClass('colorpicker_focus'); + }, + leaveSubmit = function (ev) { + $(this).removeClass('colorpicker_focus'); + }, + clickSubmit = function (ev) { + var cal = $(this).parent(); + var col = cal.data('colorpicker').color; + cal.data('colorpicker').origColor = col; + setCurrentColor(col, cal.get(0)); + cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el); + }, + show = function (ev) { + var cal = $('#' + $(this).data('colorpickerId')); + cal.data('colorpicker').onBeforeShow.apply(this, [cal.get(0)]); + var pos = $(this).offset(); + var viewPort = getViewport(); + var top = pos.top + this.offsetHeight; + var left = pos.left; + if (top + 176 > viewPort.t + viewPort.h) { + top -= this.offsetHeight + 176; + } + if (left + 356 > viewPort.l + viewPort.w) { + left -= 356; + } + cal.css({left: left + 'px', top: top + 'px'}); + if (cal.data('colorpicker').onShow.apply(this, [cal.get(0)]) != false) { + cal.show(); + } + $(document).bind('mousedown', {cal: cal}, hide); + return false; + }, + hide = function (ev) { + if (!isChildOf(ev.data.cal.get(0), ev.target, ev.data.cal.get(0))) { + if (ev.data.cal.data('colorpicker').onHide.apply(this, [ev.data.cal.get(0)]) != false) { + ev.data.cal.hide(); + } + $(document).unbind('mousedown', hide); + } + }, + isChildOf = function(parentEl, el, container) { + if (parentEl == el) { + return true; + } + if (parentEl.contains) { + return parentEl.contains(el); + } + if ( parentEl.compareDocumentPosition ) { + return !!(parentEl.compareDocumentPosition(el) & 16); + } + var prEl = el.parentNode; + while(prEl && prEl != container) { + if (prEl == parentEl) + return true; + prEl = prEl.parentNode; + } + return false; + }, + getViewport = function () { + var m = document.compatMode == 'CSS1Compat'; + return { + l : window.pageXOffset || (m ? document.documentElement.scrollLeft : document.body.scrollLeft), + t : window.pageYOffset || (m ? document.documentElement.scrollTop : document.body.scrollTop), + w : window.innerWidth || (m ? document.documentElement.clientWidth : document.body.clientWidth), + h : window.innerHeight || (m ? document.documentElement.clientHeight : document.body.clientHeight) + }; + }, + fixHSB = function (hsb) { + return { + h: Math.min(360, Math.max(0, hsb.h)), + s: Math.min(100, Math.max(0, hsb.s)), + b: Math.min(100, Math.max(0, hsb.b)) + }; + }, + fixRGB = function (rgb) { + return { + r: Math.min(255, Math.max(0, rgb.r)), + g: Math.min(255, Math.max(0, rgb.g)), + b: Math.min(255, Math.max(0, rgb.b)) + }; + }, + fixHex = function (hex) { + var len = 6 - hex.length; + if (len > 0) { + var o = []; + for (var i=0; i -1) ? hex.substring(1) : hex), 16); + return {r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF)}; + }, + HexToHSB = function (hex) { + return RGBToHSB(HexToRGB(hex)); + }, + RGBToHSB = function (rgb) { + var hsb = { + h: 0, + s: 0, + b: 0 + }; + var min = Math.min(rgb.r, rgb.g, rgb.b); + var max = Math.max(rgb.r, rgb.g, rgb.b); + var delta = max - min; + hsb.b = max; + if (max != 0) { + + } + hsb.s = max != 0 ? 255 * delta / max : 0; + if (hsb.s != 0) { + if (rgb.r == max) { + hsb.h = (rgb.g - rgb.b) / delta; + } else if (rgb.g == max) { + hsb.h = 2 + (rgb.b - rgb.r) / delta; + } else { + hsb.h = 4 + (rgb.r - rgb.g) / delta; + } + } else { + hsb.h = -1; + } + hsb.h *= 60; + if (hsb.h < 0) { + hsb.h += 360; + } + hsb.s *= 100/255; + hsb.b *= 100/255; + return hsb; + }, + HSBToRGB = function (hsb) { + var rgb = {}; + var h = Math.round(hsb.h); + var s = Math.round(hsb.s*255/100); + var v = Math.round(hsb.b*255/100); + if(s == 0) { + rgb.r = rgb.g = rgb.b = v; + } else { + var t1 = v; + var t2 = (255-s)*v/255; + var t3 = (t1-t2)*(h%60)/60; + if(h==360) h = 0; + if(h<60) {rgb.r=t1; rgb.b=t2; rgb.g=t2+t3} + else if(h<120) {rgb.g=t1; rgb.b=t2; rgb.r=t1-t3} + else if(h<180) {rgb.g=t1; rgb.r=t2; rgb.b=t2+t3} + else if(h<240) {rgb.b=t1; rgb.r=t2; rgb.g=t1-t3} + else if(h<300) {rgb.b=t1; rgb.g=t2; rgb.r=t2+t3} + else if(h<360) {rgb.r=t1; rgb.g=t2; rgb.b=t1-t3} + else {rgb.r=0; rgb.g=0; rgb.b=0} + } + return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)}; + }, + RGBToHex = function (rgb) { + var hex = [ + rgb.r.toString(16), + rgb.g.toString(16), + rgb.b.toString(16) + ]; + $.each(hex, function (nr, val) { + if (val.length == 1) { + hex[nr] = '0' + val; + } + }); + return hex.join(''); + }, + HSBToHex = function (hsb) { + return RGBToHex(HSBToRGB(hsb)); + }, + restoreOriginal = function () { + var cal = $(this).parent(); + var col = cal.data('colorpicker').origColor; + cal.data('colorpicker').color = col; + fillRGBFields(col, cal.get(0)); + fillHexFields(col, cal.get(0)); + fillHSBFields(col, cal.get(0)); + setSelector(col, cal.get(0)); + setHue(col, cal.get(0)); + setNewColor(col, cal.get(0)); + }; + return { + init: function (opt) { + opt = $.extend({}, defaults, opt||{}); + if (typeof opt.color == 'string') { + opt.color = HexToHSB(opt.color); + } else if (opt.color.r != undefined && opt.color.g != undefined && opt.color.b != undefined) { + opt.color = RGBToHSB(opt.color); + } else if (opt.color.h != undefined && opt.color.s != undefined && opt.color.b != undefined) { + opt.color = fixHSB(opt.color); + } else { + return this; + } + return this.each(function () { + if (!$(this).data('colorpickerId')) { + var options = $.extend({}, opt); + options.origColor = opt.color; + var id = 'collorpicker_' + parseInt(Math.random() * 1000); + $(this).data('colorpickerId', id); + var cal = $(tpl).attr('id', id); + if (options.flat) { + cal.appendTo(this).show(); + } else { + cal.appendTo(document.body); + } + options.fields = cal + .find('input') + .bind('keyup', keyDown) + .bind('change', change) + .bind('blur', blur) + .bind('focus', focus); + cal + .find('span').bind('mousedown', downIncrement).end() + .find('>div.colorpicker_current_color').bind('click', restoreOriginal); + options.selector = cal.find('div.colorpicker_color').bind('mousedown', downSelector); + options.selectorIndic = options.selector.find('div div'); + options.el = this; + options.hue = cal.find('div.colorpicker_hue div'); + cal.find('div.colorpicker_hue').bind('mousedown', downHue); + options.newColor = cal.find('div.colorpicker_new_color'); + options.currentColor = cal.find('div.colorpicker_current_color'); + cal.data('colorpicker', options); + cal.find('div.colorpicker_submit') + .bind('mouseenter', enterSubmit) + .bind('mouseleave', leaveSubmit) + .bind('click', clickSubmit); + fillRGBFields(options.color, cal.get(0)); + fillHSBFields(options.color, cal.get(0)); + fillHexFields(options.color, cal.get(0)); + setHue(options.color, cal.get(0)); + setSelector(options.color, cal.get(0)); + setCurrentColor(options.color, cal.get(0)); + setNewColor(options.color, cal.get(0)); + if (options.flat) { + cal.css({ + position: 'relative', + display: 'block' + }); + } else { + $(this).bind(options.eventName, show); + } + } + }); + }, + showPicker: function() { + return this.each( function () { + if ($(this).data('colorpickerId')) { + show.apply(this); + } + }); + }, + hidePicker: function() { + return this.each( function () { + if ($(this).data('colorpickerId')) { + $('#' + $(this).data('colorpickerId')).hide(); + } + }); + }, + setColor: function(col) { + if (typeof col == 'string') { + col = HexToHSB(col); + } else if (col.r != undefined && col.g != undefined && col.b != undefined) { + col = RGBToHSB(col); + } else if (col.h != undefined && col.s != undefined && col.b != undefined) { + col = fixHSB(col); + } else { + return this; + } + return this.each(function(){ + if ($(this).data('colorpickerId')) { + var cal = $('#' + $(this).data('colorpickerId')); + cal.data('colorpicker').color = col; + cal.data('colorpicker').origColor = col; + fillRGBFields(col, cal.get(0)); + fillHSBFields(col, cal.get(0)); + fillHexFields(col, cal.get(0)); + setHue(col, cal.get(0)); + setSelector(col, cal.get(0)); + setCurrentColor(col, cal.get(0)); + setNewColor(col, cal.get(0)); + } + }); + } + }; + }(); + $.fn.extend({ + ColorPicker: ColorPicker.init, + ColorPickerHide: ColorPicker.hidePicker, + ColorPickerShow: ColorPicker.showPicker, + ColorPickerSetColor: ColorPicker.setColor + }); +})(jQuery) \ No newline at end of file diff --git a/id/ConfigWebTool/src/main/webapp/js/common.js b/id/ConfigWebTool/src/main/webapp/js/common.js index d32350ce1..305e4d1ee 100644 --- a/id/ConfigWebTool/src/main/webapp/js/common.js +++ b/id/ConfigWebTool/src/main/webapp/js/common.js @@ -53,6 +53,7 @@ function oaFormCustom() { $('#formcustom_area').css('display', "block"); $('#formcustom_button_show').css('display', "none"); $('#formcustom_button_hidden').css('display', "block"); + $("#formCustomPreview>iframe").attr("src", "./bkuFramePreview.action"); } } function editOA(oaid){ @@ -135,6 +136,11 @@ function sendVerificationMail() { }, }); } +function updateBKUFormPreview(module) { + var value = $("#"+module).val(); + + $("#formCustomPreview>iframe").attr("src", "./bkuFramePreview.action?module="+module+"&value="+value.replace("#","")); +} function userOnLoad() { UseUserNamePassword(); return true; @@ -145,5 +151,18 @@ function oaOnLoad() { oaLegacyService(); AdminTarget(); oaTargetSubSector(); + + $(".colorfield").each( + function() { + $(this).ColorPicker({ + color : $(this).val(), + onSubmit : function(hsb, hex, rgb, el) { + $(el).val(hex); + updateBKUFormPreview($(el).attr("id")); + } + }); + } + ); + return true; } \ No newline at end of file diff --git a/id/ConfigWebTool/src/main/webapp/jsp/editOAGeneral.jsp b/id/ConfigWebTool/src/main/webapp/jsp/editOAGeneral.jsp index f7a722893..e8bb346a6 100644 --- a/id/ConfigWebTool/src/main/webapp/jsp/editOAGeneral.jsp +++ b/id/ConfigWebTool/src/main/webapp/jsp/editOAGeneral.jsp @@ -7,9 +7,12 @@ + + <%=LanguageHelper.getGUIString("title", request) %> + @@ -244,12 +247,28 @@

<%=LanguageHelper.getGUIString("webpages.oaconfig.general.mandate.header", request) %>

+ + + + + + + +
@@ -326,13 +345,13 @@ key="webpages.oaconfig.saml1.provideAuthBlock" cssClass="checkbox"> +
- -
+

<%=LanguageHelper.getGUIString("webpages.oaconfig.general.BKUSelection.header", request) %>

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - + +
+ + + + + + + + + + + + + <%-- + + + + + --%> + + + + + + + + + +
+
+ +
+
-- cgit v1.2.3