diff --git a/css/colorpicker.css b/css/colorpicker.css new file mode 100644 index 0000000..05b02b4 --- /dev/null +++ b/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/css/sharebar.css b/css/sharebar.css old mode 100755 new mode 100644 index 02aec31..aeeb466 --- a/css/sharebar.css +++ b/css/sharebar.css @@ -1,9 +1,16 @@ -#sharebar { display: none; position: absolute; width: 60px; float: left; background: #fff; padding: 0; text-align: center; border: 1px solid #ccc; list-style: none; margin: 0; z-index: 99; } -#sharebar li { display: block; margin: 5px; padding: 0;} -#sharebarx { display: none; list-style: none; width: 100%; float: left; margin: 0 0 10px; padding: 0; } -#sharebarx a { line-height: 14px; text-decoration: none; } -#sharebarx li { float: left; margin-right: 20px; line-height: 18px; } +body ul#sharebar { display: none; position: absolute; width: 65px; float: left; background: #fff; padding: 0; text-align: center; border: 1px solid #ccc; list-style: none; margin: 0; z-index: 99; } +body ul#sharebar li { display: block; margin: 5px; padding: 0; overflow: hidden; text-align: center; } +body ul#sharebarx { display: none; list-style: none; width: 100%; float: left; margin: 0 0 10px; padding: 0; } +body ul#sharebarx a { line-height: 14px; text-decoration: none; } +body ul#sharebarx li { float: left; margin-right: 20px; line-height: 18px; } +body ul#sharebarx li .st_email { margin: 0 15px !important; } .sharebar-button { font-size: 11px; font-family: Verdana, Arial; padding: 2px 4px; background: #f7f7f7; color: #444; border: 1px solid #ddd; display: block;margin: 0 0 5px; } .sharebar-button:hover { border-color: #aaa; } +.credit { margin: 0; padding: 0; line-height: 9px; } +.credit a { font-size: 8px; color: #ccc; text-transform: uppercase; text-decoration: none; font-family: Verdana; line-height: 9px; } .FBConnectButton_Small{background-position:-5px -232px !important;border-left:1px solid #1A356E;} -.FBConnectButton_Text{margin-left:12px !important ;padding:2px 3px 3px !important;} \ No newline at end of file +.FBConnectButton_Text{margin-left:12px !important ;padding:2px 5px 3px !important;} +.stButton{margin:0 0 6px !important;} +.stButton:last-child{margin:0 !important;} +.stButton .stFb_vbubble { width:53px !important; } +.stButton .stFb_text { padding: 2px 5px 3px !important; margin: 1px 1px 0 14px !important; } \ No newline at end of file diff --git a/images/blank.gif b/images/blank.gif new file mode 100644 index 0000000..75b945d Binary files /dev/null and b/images/blank.gif differ diff --git a/images/colorpicker_background.png b/images/colorpicker_background.png new file mode 100644 index 0000000..8401572 Binary files /dev/null and b/images/colorpicker_background.png differ diff --git a/images/colorpicker_hex.png b/images/colorpicker_hex.png new file mode 100644 index 0000000..4e532d7 Binary files /dev/null and b/images/colorpicker_hex.png differ diff --git a/images/colorpicker_hsb_b.png b/images/colorpicker_hsb_b.png new file mode 100644 index 0000000..dfac595 Binary files /dev/null and b/images/colorpicker_hsb_b.png differ diff --git a/images/colorpicker_hsb_h.png b/images/colorpicker_hsb_h.png new file mode 100644 index 0000000..3977ed9 Binary files /dev/null and b/images/colorpicker_hsb_h.png differ diff --git a/images/colorpicker_hsb_s.png b/images/colorpicker_hsb_s.png new file mode 100644 index 0000000..a2a6997 Binary files /dev/null and b/images/colorpicker_hsb_s.png differ diff --git a/images/colorpicker_indic.gif b/images/colorpicker_indic.gif new file mode 100644 index 0000000..f9fa95e Binary files /dev/null and b/images/colorpicker_indic.gif differ diff --git a/images/colorpicker_overlay.png b/images/colorpicker_overlay.png new file mode 100644 index 0000000..561cdd9 Binary files /dev/null and b/images/colorpicker_overlay.png differ diff --git a/images/colorpicker_rgb_b.png b/images/colorpicker_rgb_b.png new file mode 100644 index 0000000..dfac595 Binary files /dev/null and b/images/colorpicker_rgb_b.png differ diff --git a/images/colorpicker_rgb_g.png b/images/colorpicker_rgb_g.png new file mode 100644 index 0000000..72b3276 Binary files /dev/null and b/images/colorpicker_rgb_g.png differ diff --git a/images/colorpicker_rgb_r.png b/images/colorpicker_rgb_r.png new file mode 100644 index 0000000..4855fe0 Binary files /dev/null and b/images/colorpicker_rgb_r.png differ diff --git a/images/colorpicker_select.gif b/images/colorpicker_select.gif new file mode 100644 index 0000000..599f7f1 Binary files /dev/null and b/images/colorpicker_select.gif differ diff --git a/images/colorpicker_submit.png b/images/colorpicker_submit.png new file mode 100644 index 0000000..7f4c082 Binary files /dev/null and b/images/colorpicker_submit.png differ diff --git a/images/custom_background.png b/images/custom_background.png new file mode 100644 index 0000000..cf55ffd Binary files /dev/null and b/images/custom_background.png differ diff --git a/images/custom_hex.png b/images/custom_hex.png new file mode 100644 index 0000000..888f444 Binary files /dev/null and b/images/custom_hex.png differ diff --git a/images/custom_hsb_b.png b/images/custom_hsb_b.png new file mode 100644 index 0000000..2f99dae Binary files /dev/null and b/images/custom_hsb_b.png differ diff --git a/images/custom_hsb_h.png b/images/custom_hsb_h.png new file mode 100644 index 0000000..a217e92 Binary files /dev/null and b/images/custom_hsb_h.png differ diff --git a/images/custom_hsb_s.png b/images/custom_hsb_s.png new file mode 100644 index 0000000..7826b41 Binary files /dev/null and b/images/custom_hsb_s.png differ diff --git a/images/custom_indic.gif b/images/custom_indic.gif new file mode 100644 index 0000000..222fb94 Binary files /dev/null and b/images/custom_indic.gif differ diff --git a/images/custom_rgb_b.png b/images/custom_rgb_b.png new file mode 100644 index 0000000..80764e5 Binary files /dev/null and b/images/custom_rgb_b.png differ diff --git a/images/custom_rgb_g.png b/images/custom_rgb_g.png new file mode 100644 index 0000000..fc9778b Binary files /dev/null and b/images/custom_rgb_g.png differ diff --git a/images/custom_rgb_r.png b/images/custom_rgb_r.png new file mode 100644 index 0000000..91b0cd4 Binary files /dev/null and b/images/custom_rgb_r.png differ diff --git a/images/custom_submit.png b/images/custom_submit.png new file mode 100644 index 0000000..cd202cd Binary files /dev/null and b/images/custom_submit.png differ diff --git a/images/down.gif b/images/down.gif old mode 100755 new mode 100644 diff --git a/images/select.png b/images/select.png new file mode 100644 index 0000000..21213bf Binary files /dev/null and b/images/select.png differ diff --git a/images/select2.png b/images/select2.png new file mode 100644 index 0000000..2cd2cab Binary files /dev/null and b/images/select2.png differ diff --git a/images/slider.png b/images/slider.png new file mode 100644 index 0000000..8b03da9 Binary files /dev/null and b/images/slider.png differ diff --git a/images/up.gif b/images/up.gif old mode 100755 new mode 100644 diff --git a/js/colorpicker.js b/js/colorpicker.js new file mode 100644 index 0000000..10a2b22 --- /dev/null +++ b/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/js/sharebar-admin.js b/js/sharebar-admin.js new file mode 100644 index 0000000..e69de29 diff --git a/js/sharebar.js b/js/sharebar.js old mode 100755 new mode 100644 index b5e16ec..4e38048 --- a/js/sharebar.js +++ b/js/sharebar.js @@ -5,22 +5,22 @@ * More information: http://devgrow.com/sharebar */ jQuery.fn.sharebar = function(options) { - var defaults = {horizontal: true, minwidth: 1000, position: 'left', leftOffset: 20, rightOffset: 10}; + var defaults = {horizontal: true, swidth: 65, minwidth: 1000, position: 'left', leftOffset: 20, rightOffset: 10}; var opts = jQuery.extend(defaults, options); var o = jQuery.meta ? jQuery.extend({}, opts, jQueryjQuery.data()) : opts; var w = jQuery(window).width(); var sharebar = jQuery('#sharebar'); var sharebarx = jQuery('#sharebarx'); var parent = jQuery(sharebar).parent().width(); - var sw = jQuery(sharebar).width(); var start = sharebar_init(); function sharebar_init(){ - if (o.position == 'left') jQuery(sharebar).css('marginLeft',(0-sw-o.leftOffset)); + jQuery(sharebar).css('width',o.swidth+'px'); + if (o.position == 'left') jQuery(sharebar).css('marginLeft',(0-o.swidth-o.leftOffset)); else { jQuery(sharebar).css('marginLeft',(parent+o.rightOffset)); } - if(w < o.width && o.horizontal) jQuery(sharebarx).slideDown(); + if(w < o.minwidth && o.horizontal) jQuery(sharebarx).slideDown(); else jQuery(sharebar).fadeIn(); jQuery.event.add(window, "scroll", sharebar_scroll); jQuery.event.add(window, "resize", sharebar_resize); diff --git a/readme.txt b/readme.txt new file mode 100644 index 0000000..a323597 --- /dev/null +++ b/readme.txt @@ -0,0 +1,102 @@ +=== Sharebar === +Contributors: mdolon +Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=2G5ZENMCH62CN +Tags: sharing, social networks, marketing, social media, sharebar, sharebox +Requires at least: 2.0 +Tested up to: 3.0 +Stable tag: 2.2.9 + +Sharebar adds a dynamic and fully customizable vertical box to the left of a blog post that contains links/buttons to popular social networking sites. + + +== Description == + +Sharebar adds a dynamic and fully customizable vertical box to the left of a blog post that contains links/buttons to popular social networking sites. For wide blogs, a vertical bar with popular sharing icons appears on the left of your post. If the page is resized below 1000px (default), the vertical bar disappears and a horizontal sharebar appears under the post title. + +Big Buttons are used in the vertical Sharebar to the left of the post, while the Small Buttons are used in the horizontal Sharebar that appears under the post title (by default) if the width of the page is less than 1000px (or whatever value you set). + +When Auto mode (enabled in settings) is ON, the Sharebars are added automatically. When Auto mode is off, you must manually add the sharebar code to your template files: + +* Vertical (next to post) Sharebar: `` +* Horizontal Sharebar: `` + +You can also call an individual button in any template by using the following code (where size is either big or small): `` + +Full instructions and example can be found at: http://devgrow.com/sharebar-wordpress-plugin/ + +Follow me on Twitter: http://twitter.com/ThinkDevGrow + +**Also, if you use and like the plugin, please rate it! ->** + + +== Installation == + +Upload the Sharebar plugin to your plugins directory, activate it and it should work out of the box. Then tweak the buttons and settings to your likings! + + +== Screenshots == + +1. The plugin in action (vertical bar). If page is resized to less than 1000px, a vertical share bar appears under title. +2. Main Plugin Page +3. Plugin Settings Page +4. Edit button page + + +== Frequently Asked Questions == + += Why doesn't the vertical sharebar (next to post) work? = + +First, make sure the plugin is properly installed and if you're using manual mode, the sharebar code has been added to your single.php template. If you're using auto mode, verify that the sharebar list is being added to your post in the source code (look for `