diff --git a/lib/gollum/frontend/public/javascript/gollum-editor/gollum.editor.js b/lib/gollum/frontend/public/javascript/gollum-editor/gollum.editor.js index 1a14b6ac..749d1d97 100644 --- a/lib/gollum/frontend/public/javascript/gollum-editor/gollum.editor.js +++ b/lib/gollum/frontend/public/javascript/gollum-editor/gollum.editor.js @@ -102,6 +102,11 @@ } ); } + if ( EditorHas.help() ) { + $('#gollum-editor-help').hide(); + $('#gollum-editor-help').removeClass('jaws'); + } + } // EditorHas.functionBar } @@ -174,6 +179,8 @@ } else { LanguageDefinition._ACTIVE_LANG = name; } + // tell help we switched languages + Help.setActiveHelp(name); }, @@ -298,6 +305,16 @@ return ( $('input#gollum-editor-message-field').length > 0 ); }, + help: function() { + return ( $('#gollum-editor #gollum-editor-help').length && + $('#gollum-editor #function-help').length ); + }, + + mathJax: function() { + //TODO + return false; + }, + previewButton: function() { return ( $('#gollum-editor #gollum-editor-preview').length ); }, @@ -511,6 +528,174 @@ FormatSelector.$_SELECTOR.change( FormatSelector.evtChangeFormat ); } + }; + + + + var Help = { + + _ACTIVE_HELP: '', + _LOADED_HELP_LANGS: [], + _HELP: {}, + + define: function( name, definitionObject ) { + if ( Help.isValidHelpFormat( definitionObject ) ) { + debug('help is a valid format'); + + Help._ACTIVE_HELP_LANG = name; + Help._LOADED_HELP_LANGS.push( name ); + Help._HELP[name] = definitionObject; + + if ( $("#function-help").length ) { + if ( $('#function-help').hasClass('disabled') ) { + $('#function-help').removeClass('disabled'); + } + $('#function-help').unbind('click'); + $('#function-help').click( Help.evtHelpButtonClick ); + } + } else { + if ( $('#function-help').length ) { + $('#function-help').addClass('disabled'); + } + } + }, + + generateHelpMenuFor: function( name ) { + if ( !Help._HELP[name] ) { + debug('Help is not defined for ' + name.toString()); + return false; + } + var helpData = Help._HELP[name]; + + // add MathJax Help if we have it + // TODO + if ( EditorHas.mathJax() && Help.isLoadedFor('mathjax') ) { + debug('Adding MathJax support to help'); + // TODO + } + + // clear this shiz out + $('#gollum-editor-help-parent').html(''); + $('#gollum-editor-help-list').html(''); + $('#gollum-editor-help-content').html(''); + + // go go inefficient algorithm + for ( var i=0; i < helpData.length; i++ ) { + if ( typeof helpData[i] != 'object' ) break; + + var $newLi = $('
  • ' + + helpData[i].menuName + '
  • '); + $('#gollum-editor-help-parent').append( $newLi ); + if ( i == 0 ) { + // select on first run + $newLi.children('a').addClass('selected'); + } + $newLi.children('a').click( Help.evtParentMenuClick ); + } + + // generate parent submenu on first run + Help.generateSubMenu( helpData[0] ); + + }, + + generateSubMenu: function( subData ) { + $('#gollum-editor-help-list').html(''); + $('#gollum-editor-help-content').html(''); + for ( var i=0; i < subData.content.length; i++ ) { + if ( typeof subData.content[i] != 'object' ) break; + + var $subLi = $('
  • ' + + helpData[i].content[j].menuName + '
  • '); + + $('#gollum-editor-help-list').append( $subLi ); + $subLi.children('a').click( Help.evtSubMenuClick ); + } + }, + + showHelp: function( index1, index2 ) { + var html = Help._HELP[_ACTIVE_HELP_LANG][index1].content[index2].data; + $('#gollum-editor-help-content').html(html); + }, + + isLoadedFor: function( name ) { + for ( var i=0; i < Help._LOADED_HELP_LANGS.length; i++ ) { + if ( name == Help._LOADED_HELP_LANGS[i] ) { + return true; + } + } + return false; + }, + + isValidHelpFormat: function( helpArr ) { + return ( typeof helpArr == 'object' && + helpArr.length && + typeof helpArr[0].menuName == 'string' && + typeof helpArr[0].content == 'object' && + helpArr[0].content.length ); + }, + + setActiveHelp: function( name ) { + if ( !Help.isLoadedFor( name ) ) { + if ( $('#function-help').length ) { + $('#function-help').addClass('disabled'); + } + } else { + Help._ACTIVE_HELP_LANG = name; + if ( $("#function-help").length ) { + if ( $('#function-help').hasClass('disabled') ) { + $('#function-help').removeClass('disabled'); + } + $('#function-help').unbind('click'); + $('#function-help').click( Help.evtHelpButtonClick ); + } + } + }, + + evtHelpButtonClick: function( e ) { + e.preventDefault(); + + // cascaded animations are prettier + if ( $('#gollum-editor-help').is(':visible') ) { + $('#gollum-editor-help').animate({ + opacity: 0 + }, 200, + function() { + $('#gollum-editor-help') + .animate({ height: 'hide' }, 200); + }); + } else { + $('#gollum-editor-help').animate({ + height: 'show' + }, 200, + function() { + $('#gollum-editor-help') + .animate({ opacity: 1 }, 300); + }); + } + }, + + evtParentMenuClick: function( e ) { + // short circuit if we've selected this already + if ( $(this).hasClass('selected') ) return; + + // populate from help data for this + var helpIndex = $(this).attr('rel'); + var subData = Help._HELP[Help._ACTIVE_HELP][helpIndex]; + + $('#gollum-editor-help-content li a').removeClass('selected'); + $(this).addClass('selected'); + Help.generateSubMenu( subData ); + }, + + evtSubMenuClick: function( e ) { + if ( $(this).hasClass('selected') ) return; + + // split index rel data + var rawIndex = $(this).attr('rel').split(':'); + $('#gollum-editor-help-list li a').removeClass('selected'); + $(this).addClass('selected'); + Help.showHelpFor( rawIndex[0], rawIndex[1] ); + } }; @@ -520,6 +705,7 @@ * Used in exec() to display dialogs with dynamic fields. * */ + $.GollumEditor.defineHelp = Help.define; $.GollumEditor.Dialog = $.GollumDialog; $.GollumEditor.replaceSelection = function( repText ) { FunctionBar.replaceFieldSelection( $('#gollum-editor-body'), repText ); diff --git a/lib/gollum/frontend/public/javascript/gollum-editor/langs/markdown.js b/lib/gollum/frontend/public/javascript/gollum-editor/langs/markdown.js index cd8975f9..d44e3b19 100644 --- a/lib/gollum/frontend/public/javascript/gollum-editor/langs/markdown.js +++ b/lib/gollum/frontend/public/javascript/gollum-editor/langs/markdown.js @@ -131,6 +131,32 @@ var MarkDown = { }; +var MarkDownHelp = [ + + { + menuName: 'Formatting', + content: [ + { + menuName: 'Inline Text', + data: '

    Inline Text goes here

    ;' + } + ] + }, + + { + menuName: 'Links and Images', + content: [ + { + menuName: 'Links and Images', + data: '

    Links and Images go here

    ' + } + ] + } + +]; + + jQuery.GollumEditor.defineLanguage('markdown', MarkDown); +jQuery.GollumEditor.defineHelp('markdown', MarkDownHelp); })();