diff --git a/bueditor.css b/bueditor.css index bd73fd8..1076b4b 100644 --- a/bueditor.css +++ b/bueditor.css @@ -106,6 +106,15 @@ min-width: 200px; max-width: 400px; } +.bue-discoverable-help a { + width:90%; + border-radius: 5px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + padding: 5px; + background:rgba(40,34,227,0.1); + display:block; +} /*Imce popup*/ #bue-imce-pop iframe { width: 720px; diff --git a/bueditor.js b/bueditor.js index 38121c6..e174329 100644 --- a/bueditor.js +++ b/bueditor.js @@ -90,6 +90,11 @@ BUE.buttonClick = function (eindex, bindex) { try { // Return html for editor templates. BUE.theme = function (tplid) { var tpl = BUE.templates[tplid] || {html: ''}, html = '', sprite; + + // Add a discoverable pop-up for keyboard only users. + var explanation = '', explanation_count = 0; + explanation = 'BUEditor commands: Use (Shift + Alt + COMMAND CHARACTER). Available commands: '; + if (typeof tpl.html == 'string') return tpl.html; // Load sprite if (sprite = tpl.sprite) { @@ -134,11 +139,25 @@ BUE.theme = function (tplid) { btype = 'image', attr = 'src="'+ tpl.iconpath +'/'+ icon +'"'; } } - alt = title + (key ? '('+ key +')' : ''); + if (key) { + // Add list of available command keys for explanation. + if (explanation_count == 0) { + explanation += title + ' (' + key + ')'; + explanation_count++; + } + else { + explanation += ', ' + title + ' (' + key + ')'; + } + // Provide alt text with instructive access key information. + alt = (access) ? title + ' (Access Key: '+ access +' + '+ key +')' : title + '('+ key +')'; + } + else { + alt = title; + } title += access && key ? ' ('+ access +' + '+ key +')' : ''; html += ''; } - return tpl.html = ''; + return tpl.html = ''; }; // Cross browser selection handling. 0-1=All, 2=IE, 3=Opera