diff --git a/airtime_mvc/application/Bootstrap.php b/airtime_mvc/application/Bootstrap.php index df1ab8475..62679c8b0 100644 --- a/airtime_mvc/application/Bootstrap.php +++ b/airtime_mvc/application/Bootstrap.php @@ -117,7 +117,7 @@ class Bootstrap extends Zend_Application_Bootstrap_Bootstrap $view->headScript()->appendFile($baseUrl.'/js/airtime/dashboard/helperfunctions.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $view->headScript()->appendFile($baseUrl.'/js/airtime/dashboard/dashboard.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $view->headScript()->appendFile($baseUrl.'/js/airtime/dashboard/versiontooltip.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); - $view->headScript()->appendFile($baseUrl.'/js/tipsy/jquery.tipsy.min.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); + $view->headScript()->appendFile($baseUrl.'/js/tipsy/jquery.tipsy.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $view->headScript()->appendFile($baseUrl.'/js/airtime/common/common.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); $view->headScript()->appendFile($baseUrl.'/js/airtime/common/audioplaytest.js?'.$CC_CONFIG['airtime_version'],'text/javascript'); diff --git a/airtime_mvc/public/css/tipsy/jquery.tipsy.css b/airtime_mvc/public/css/tipsy/jquery.tipsy.css index 836b6e69d..35136464b 100644 --- a/airtime_mvc/public/css/tipsy/jquery.tipsy.css +++ b/airtime_mvc/public/css/tipsy/jquery.tipsy.css @@ -1,4 +1,4 @@ -.tipsy { font-size: 10px; position: absolute; padding: 5px; z-index: 100000; width: auto } +.tipsy { font-size: 11px; position: absolute; padding: 5px; z-index: 100000; width: auto } .tipsy-inner { background-color: #000; color: #FFF; max-width: 300px; padding: 5px 8px 4px 5px; } /* Rounded corners */ diff --git a/airtime_mvc/public/js/airtime/user/user.js b/airtime_mvc/public/js/airtime/user/user.js index 35d4e16dd..3fff79ef6 100644 --- a/airtime_mvc/public/js/airtime/user/user.js +++ b/airtime_mvc/public/js/airtime/user/user.js @@ -94,8 +94,82 @@ function populateUserTable() { $(document).ready(function() { populateUserTable(); + + //assign user-rights and id to each user type option so we can + //display user rights for each with tipsy tooltip + $.each($('#type').children(), function(i, opt) { + switch ($(this).val()) { + case 'G': + $(this).attr('id', 'user-type-G'); + $(this).attr('user-rights', + $.i18n._('Guests can do the following:')+'

'+ + $.i18n._('View schedule')+'
'+ + $.i18n._('View current playing tracks') + ); + break; + case 'H': + $(this).attr('id', 'user-type-H'); + $(this).attr('user-rights', + $.i18n._('DJs can do the following:')+'

'+ + $.i18n._('View schedule')+'
'+ + $.i18n._('View current playing tracks')+'
'+ + $.i18n._('Manage assigned show content')+'
'+ + $.i18n._('Import media files')+'
'+ + $.i18n._('Manage their own library content')+'
'+ + $.i18n._('Create playlists, smart blocks, and webstreams') + ); + break; + case 'P': + $(this).attr('id', 'user-type-P'); + $(this).attr('user-rights', + $.i18n._('Progam Managers can do the following:')+'

'+ + $.i18n._('View schedule')+'
'+ + $.i18n._('Schedule shows')+'
'+ + $.i18n._('Import media files')+'
'+ + $.i18n._('Manage all library content')+'
'+ + $.i18n._('Create playlists, smart blocks, and webstreams')+'
'+ + $.i18n._('Manage show content') + ); + break; + case 'A': + $(this).attr('id', 'user-type-A'); + $(this).attr('user-rights', + $.i18n._('Admins can do the following:')+'

'+ + $.i18n._('Manage preferences')+'
'+ + $.i18n._('Manage users')+'
'+ + $.i18n._('Manage watched folders')+'
'+ + $.i18n._('Send support feedback')+'
'+ + $.i18n._('View system status')+'
'+ + $.i18n._('Access playout history')+'
'+ + $.i18n._('View listener stats')+'
'+ + $.i18n._('View schedule')+'
'+ + $.i18n._('Schedule shows')+'
'+ + $.i18n._('Import media files')+'
'+ + $.i18n._('Manage all library content')+'
'+ + $.i18n._('Create playlists, smart blocks, and webstreams')+'
'+ + $.i18n._('Manage show content') + ); + break; + } + }); + + $('#type').live("change", function(){ + //when the title changes on live tipsy tooltips the changes take + //affect the next time tipsy is shown so we need to hide and re-show it + $(this).tipsy('hide').tipsy('show'); + }); - //$('#user_details').hide(); + $('#type').tipsy({ + gravity: 'w', + html: true, + trigger: 'manual', + live: true, + title: function() { + return $('#user-type-'+$(this).val()).attr('user-rights'); + } + }); + + $('#type').tipsy('show'); var newUser = {login:"", first_name:"", last_name:"", type:"G", id:""}; diff --git a/airtime_mvc/public/js/tipsy/AIRTIME_DEV_README b/airtime_mvc/public/js/tipsy/AIRTIME_DEV_README new file mode 100644 index 000000000..72ec196c4 --- /dev/null +++ b/airtime_mvc/public/js/tipsy/AIRTIME_DEV_README @@ -0,0 +1,23 @@ +Before overwriting jquery.tipsy.js, please note we have changed a few lines to +support manual triggering with live tipsy tooltips + + +denise@denise-DX4860:~/airtime/airtime_mvc/public/js/tipsy$ diff -u jquery.tipsy_orig.js jquery.tipsy.js +--- jquery.tipsy_orig.js 2012-12-13 12:03:48.780751104 -0500 ++++ jquery.tipsy.js 2012-12-13 12:08:15.564761493 -0500 +@@ -173,12 +173,10 @@ + + if (!options.live) this.each(function() { get(this); }); + +- if (options.trigger != 'manual') { +- var binder = options.live ? 'live' : 'bind', +- eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus', +- eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'; +- this[binder](eventIn, enter)[binder](eventOut, leave); +- } ++ var binder = options.live ? 'live' : 'bind', ++ eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus', ++ eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'; ++ this[binder](eventIn, enter)[binder](eventOut, leave); + + return this; diff --git a/airtime_mvc/public/js/tipsy/jquery.tipsy.js b/airtime_mvc/public/js/tipsy/jquery.tipsy.js index e0643f82e..0aeadb65f 100644 --- a/airtime_mvc/public/js/tipsy/jquery.tipsy.js +++ b/airtime_mvc/public/js/tipsy/jquery.tipsy.js @@ -173,12 +173,10 @@ if (!options.live) this.each(function() { get(this); }); - if (options.trigger != 'manual') { - var binder = options.live ? 'live' : 'bind', - eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus', - eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'; - this[binder](eventIn, enter)[binder](eventOut, leave); - } + var binder = options.live ? 'live' : 'bind', + eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus', + eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'; + this[binder](eventIn, enter)[binder](eventOut, leave); return this; diff --git a/airtime_mvc/public/js/tipsy/jquery.tipsy.min.js b/airtime_mvc/public/js/tipsy/jquery.tipsy.min.js deleted file mode 100644 index 0cf2b2598..000000000 --- a/airtime_mvc/public/js/tipsy/jquery.tipsy.min.js +++ /dev/null @@ -1 +0,0 @@ -(function(e){function t(e,t){return typeof e=="function"?e.call(t):e}function n(e){while(e=e.parentNode){if(e==document)return true}return false}function r(t,n){this.$element=e(t);this.options=n;this.enabled=true;this.fixTitle()}r.prototype={show:function(){var n=this.getTitle();if(n&&this.enabled){var r=this.tip();r.find(".tipsy-inner")[this.options.html?"html":"text"](n);r[0].className="tipsy";r.remove().css({top:0,left:0,visibility:"hidden",display:"block"}).prependTo(document.body);var i=e.extend({},this.$element.offset(),{width:this.$element[0].offsetWidth,height:this.$element[0].offsetHeight});var s=r[0].offsetWidth,o=r[0].offsetHeight,u=t(this.options.gravity,this.$element[0]);var a;switch(u.charAt(0)){case"n":a={top:i.top+i.height+this.options.offset,left:i.left+i.width/2-s/2};break;case"s":a={top:i.top-o-this.options.offset,left:i.left+i.width/2-s/2};break;case"e":a={top:i.top+i.height/2-o/2,left:i.left-s-this.options.offset};break;case"w":a={top:i.top+i.height/2-o/2,left:i.left+i.width+this.options.offset};break}if(u.length==2){if(u.charAt(1)=="w"){a.left=i.left+i.width/2-15}else{a.left=i.left+i.width/2-s+15}}r.css(a).addClass("tipsy-"+u);r.find(".tipsy-arrow")[0].className="tipsy-arrow tipsy-arrow-"+u.charAt(0);if(this.options.className){r.addClass(t(this.options.className,this.$element[0]))}if(this.options.fade){r.stop().css({opacity:0,display:"block",visibility:"visible"}).animate({opacity:this.options.opacity})}else{r.css({visibility:"visible",opacity:this.options.opacity})}}},hide:function(){if(this.options.fade){this.tip().stop().fadeOut(function(){e(this).remove()})}else{this.tip().remove()}},fixTitle:function(){var e=this.$element;if(e.attr("title")||typeof e.attr("original-title")!="string"){e.attr("original-title",e.attr("title")||"").removeAttr("title")}},getTitle:function(){var e,t=this.$element,n=this.options;this.fixTitle();var e,n=this.options;if(typeof n.title=="string"){e=t.attr(n.title=="title"?"original-title":n.title)}else if(typeof n.title=="function"){e=n.title.call(t[0])}e=(""+e).replace(/(^\s*|\s*$)/,"");return e||n.fallback},tip:function(){if(!this.$tip){this.$tip=e('
').html('
');this.$tip.data("tipsy-pointee",this.$element[0])}return this.$tip},validate:function(){if(!this.$element[0].parentNode){this.hide();this.$element=null;this.options=null}},enable:function(){this.enabled=true},disable:function(){this.enabled=false},toggleEnabled:function(){this.enabled=!this.enabled}};e.fn.tipsy=function(t){function i(n){var i=e.data(n,"tipsy");if(!i){i=new r(n,e.fn.tipsy.elementOptions(n,t));e.data(n,"tipsy",i)}return i}function s(){var e=i(this);e.hoverState="in";if(t.delayIn==0){e.show()}else{e.fixTitle();setTimeout(function(){if(e.hoverState=="in")e.show()},t.delayIn)}}function o(){var e=i(this);e.hoverState="out";if(t.delayOut==0){e.hide()}else{setTimeout(function(){if(e.hoverState=="out")e.hide()},t.delayOut)}}if(t===true){return this.data("tipsy")}else if(typeof t=="string"){var n=this.data("tipsy");if(n)n[t]();return this}t=e.extend({},e.fn.tipsy.defaults,t);if(!t.live)this.each(function(){i(this)});if(t.trigger!="manual"){var u=t.live?"live":"bind",a=t.trigger=="hover"?"mouseenter":"focus",f=t.trigger=="hover"?"mouseleave":"blur";this[u](a,s)[u](f,o)}return this};e.fn.tipsy.defaults={className:null,delayIn:0,delayOut:0,fade:false,fallback:"",gravity:"n",html:false,live:false,offset:0,opacity:.8,title:"title",trigger:"hover"};e.fn.tipsy.revalidate=function(){e(".tipsy").each(function(){var t=e.data(this,"tipsy-pointee");if(!t||!n(t)){e(this).remove()}})};e.fn.tipsy.elementOptions=function(t,n){return e.metadata?e.extend({},n,e(t).metadata()):n};e.fn.tipsy.autoNS=function(){return e(this).offset().top>e(document).scrollTop()+e(window).height()/2?"s":"n"};e.fn.tipsy.autoWE=function(){return e(this).offset().left>e(document).scrollLeft()+e(window).width()/2?"e":"w"};e.fn.tipsy.autoBounds=function(t,n){return function(){var r={ns:n[0],ew:n.length>1?n[1]:false},i=e(document).scrollTop()+t,s=e(document).scrollLeft()+t,o=e(this);if(o.offset().top').html('
'); + this.$tip.data('tipsy-pointee', this.$element[0]); + } + return this.$tip; + }, + + validate: function() { + if (!this.$element[0].parentNode) { + this.hide(); + this.$element = null; + this.options = null; + } + }, + + enable: function() { this.enabled = true; }, + disable: function() { this.enabled = false; }, + toggleEnabled: function() { this.enabled = !this.enabled; } + }; + + $.fn.tipsy = function(options) { + + if (options === true) { + return this.data('tipsy'); + } else if (typeof options == 'string') { + var tipsy = this.data('tipsy'); + if (tipsy) tipsy[options](); + return this; + } + + options = $.extend({}, $.fn.tipsy.defaults, options); + + function get(ele) { + var tipsy = $.data(ele, 'tipsy'); + if (!tipsy) { + tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options)); + $.data(ele, 'tipsy', tipsy); + } + return tipsy; + } + + function enter() { + var tipsy = get(this); + tipsy.hoverState = 'in'; + if (options.delayIn == 0) { + tipsy.show(); + } else { + tipsy.fixTitle(); + setTimeout(function() { if (tipsy.hoverState == 'in') tipsy.show(); }, options.delayIn); + } + }; + + function leave() { + var tipsy = get(this); + tipsy.hoverState = 'out'; + if (options.delayOut == 0) { + tipsy.hide(); + } else { + setTimeout(function() { if (tipsy.hoverState == 'out') tipsy.hide(); }, options.delayOut); + } + }; + + if (!options.live) this.each(function() { get(this); }); + + if (options.trigger != 'manual') { + var binder = options.live ? 'live' : 'bind', + eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus', + eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur'; + this[binder](eventIn, enter)[binder](eventOut, leave); + } + + return this; + + }; + + $.fn.tipsy.defaults = { + className: null, + delayIn: 0, + delayOut: 0, + fade: false, + fallback: '', + gravity: 'n', + html: false, + live: false, + offset: 0, + opacity: 0.8, + title: 'title', + trigger: 'hover' + }; + + $.fn.tipsy.revalidate = function() { + $('.tipsy').each(function() { + var pointee = $.data(this, 'tipsy-pointee'); + if (!pointee || !isElementInDOM(pointee)) { + $(this).remove(); + } + }); + }; + + // Overwrite this method to provide options on a per-element basis. + // For example, you could store the gravity in a 'tipsy-gravity' attribute: + // return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' }); + // (remember - do not modify 'options' in place!) + $.fn.tipsy.elementOptions = function(ele, options) { + return $.metadata ? $.extend({}, options, $(ele).metadata()) : options; + }; + + $.fn.tipsy.autoNS = function() { + return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n'; + }; + + $.fn.tipsy.autoWE = function() { + return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w'; + }; + + /** + * yields a closure of the supplied parameters, producing a function that takes + * no arguments and is suitable for use as an autogravity function like so: + * + * @param margin (int) - distance from the viewable region edge that an + * element should be before setting its tooltip's gravity to be away + * from that edge. + * @param prefer (string, e.g. 'n', 'sw', 'w') - the direction to prefer + * if there are no viewable region edges effecting the tooltip's + * gravity. It will try to vary from this minimally, for example, + * if 'sw' is preferred and an element is near the right viewable + * region edge, but not the top edge, it will set the gravity for + * that element's tooltip to be 'se', preserving the southern + * component. + */ + $.fn.tipsy.autoBounds = function(margin, prefer) { + return function() { + var dir = {ns: prefer[0], ew: (prefer.length > 1 ? prefer[1] : false)}, + boundTop = $(document).scrollTop() + margin, + boundLeft = $(document).scrollLeft() + margin, + $this = $(this); + + if ($this.offset().top < boundTop) dir.ns = 'n'; + if ($this.offset().left < boundLeft) dir.ew = 'w'; + if ($(window).width() + $(document).scrollLeft() - $this.offset().left < margin) dir.ew = 'e'; + if ($(window).height() + $(document).scrollTop() - $this.offset().top < margin) dir.ns = 's'; + + return dir.ns + (dir.ew ? dir.ew : ''); + } + }; + +})(jQuery); \ No newline at end of file