1 utils = require 'utils'
3 CONTAINER_ID = 'VimFxHelpDialogContainer'
5 showHelp = (document, commandsHelp) ->
6 if body = document.body
7 if div = document.getElementById CONTAINER_ID
8 div.parentNode.removeChild div
9 div = document.createElement 'div'
11 div.className = 'VimFxReset'
13 div.innerHTML = helpDialogHtml(commandsHelp)
17 if button = document.getElementById('VimFxClose')
18 clickHandler = (event) ->
19 event.stopPropagation()
20 event.preventDefault()
22 button.addEventListener 'click', clickHandler, false
24 hideHelp = (document) ->
25 if div = document.getElementById CONTAINER_ID
26 div.parentNode.removeChild div
28 td = (text, klass='') ->
29 """<td class="VimFxReset #{ klass }">#{ text }</td>"""
32 key = """#{ key } <span class="VimFxReset VimFxDot">∙</span>"""
33 """<tr class="VimFxReset">#{ td(key, 'VimFxSequence') }#{ td(text) }</tr>"""
37 <table class="VimFxReset">
38 #{ (tr(cmd, text) for cmd, text of commands).join('') }
42 section = (title, commands) ->
44 <div class="VimFxReset VimFxSectionTitle">#{ title }</div>
48 helpDialogHtml = (help) ->
51 <div id="VimFxHelpDialog" class="VimFxReset">
52 <div class="VimFxReset VimFxHeader">
53 <div class="VimFxReset VimFxTitle">
54 <span class="VimFxReset VimFxTitleVim">Vim</span><span class="VimFxReset VimFxTitleFx">Fx</span>
55 <span class="VimFxReset">#{ _('help') }</span>
57 <span class="VimFxReset VimFxVersion">#{ _('help_version') } #{ utils.getVersion() }</span>
58 <a class="VimFxReset VimFxClose" id="VimFxClose" href="#">✖</a>
59 <div class="VimFxReset VimFxClearFix"></div>
62 <div class="VimFxReset VimFxBody">
63 <div class="VimFxReset VimFxColumn">
64 #{ section(_('help_section_urls'), help['urls']) }
65 #{ section(_('help_section_nav'), help['nav']) }
67 <div class="VimFxReset VimFxColumn">
68 #{ section(_('help_section_tabs'), help['tabs']) }
69 #{ section(_('help_section_browse'), help['browse']) }
70 #{ section(_('help_section_misc'), help['misc']) }
72 <div class="VimFxReset VimFxClearFix"></div>
75 <div class="VimFxReset VimFxFooter">
76 <div class="VimFxReset VimFxSocial">
77 <p class="VimFxReset">
78 #{ _('help_found_bug') }
79 <a class="VimFxReset" target="_blank" href="https://github.com/akhodakivskiy/VimFx/issues">
80 #{ _('help_report_bug') }
83 <p class="VimFxReset">
84 #{ _('help_enjoying') }
85 <a class="VimFxReset" target="_blank" href="https://addons.mozilla.org/en-US/firefox/addon/vimfx/">
86 #{ _('help_feedback') }
95 exports.showHelp = showHelp
96 exports.hideHelp = hideHelp