extension/packages/help.coffee

   1 utils = require 'utils'
   2 prefs = require 'prefs'
   3
   4 CONTAINER_ID = 'VimFxHelpDialogContainer'
   5
   6 removeHelp = (document) ->
   7   if div = document.getElementById(CONTAINER_ID)
   8     div.parentNode.removeChild(div)
   9
  10 injectHelp = (document, commandsHelp) ->
  11   if document.documentElement
  12     if div = document.getElementById(CONTAINER_ID)
  13       div.parentNode.removeChild(div)
  14     div = document.createElement 'div'
  15     div.id = CONTAINER_ID
  16     div.className = 'VimFxReset'
  17
  18     div.appendChild(utils.parseHTML(document, helpDialogHtml(commandsHelp)))
  19
  20     document.documentElement.appendChild(div)
  21
  22     installCheckboxHandlers(document)
  23
  24     if button = document.getElementById('VimFxClose')
  25       clickHandler = (event) ->
  26         event.stopPropagation()
  27         event.preventDefault()
  28         removeHelp(document)
  29       button.addEventListener('click', clickHandler, false)
  30
  31 installCheckboxHandlers = (document) ->
  32   cbs = document.getElementsByClassName("VimFxKeyCheckbox")
  33   for cb in cbs
  34     cb.addEventListener "change", (event)->
  35       key = event.target.getAttribute("data-key")
  36
  37       # Checkbox if checked => command is in use
  38       if event.target.checked
  39         prefs.enableCommand(key)
  40       else
  41         prefs.disableCommand(key)
  42
  43 td = (text, klass='') ->
  44   """<td class="VimFxReset #{ klass }">#{ text }</td>"""
  45
  46 tr = (key, text) ->
  47   disabled = prefs.isCommandDisabled(key)
  48   checked = if disabled then null else "checked"
  49   key = """
  50     #{ key.replace(/,/g, '').replace('|', ', ') }
  51     <span class="VimFxReset VimFxDot">&#8729;</span>
  52     <input type="checkbox" class="VimFxReset VimFxKeyCheckbox" data-key="#{ key }" #{ checked }></input>
  53   """
  54
  55   return """<tr class="VimFxReset">#{ td(key, 'VimFxSequence') }#{ td(text) }</tr>"""
  56
  57 table = (commands) ->
  58   """
  59   <table class="VimFxReset">
  60     #{ (tr(cmd, text) for cmd, text of commands).join('') }
  61   </table>
  62   """
  63
  64 section = (title, commands) ->
  65   """
  66   <div class="VimFxReset VimFxSectionTitle">#{ title }</div>
  67   #{ table(commands) }
  68   """
  69
  70 helpDialogHtml = (help) ->
  71   return """
  72   <div id="VimFxHelpDialog" class="VimFxReset">
  73     <div class="VimFxReset VimFxHeader">
  74       <div class="VimFxReset VimFxTitle">
  75         <span class="VimFxReset VimFxTitleVim">Vim</span><span class="VimFxReset VimFxTitleFx">Fx</span>
  76         <span class="VimFxReset">#{ _('help') }</span>
  77       </div>
  78       <span class="VimFxReset VimFxVersion">#{ _('help_version') } #{ utils.getVersion() }</span>
  79       <a class="VimFxReset VimFxClose" id="VimFxClose" href="#">&#10006;</a>
  80       <div class="VimFxReset VimFxClearFix"></div>
  81     </div>
  82
  83     <div class="VimFxReset VimFxBody">
  84       <div class="VimFxReset VimFxColumn">
  85         #{ section(_('help_section_urls'),    help['urls']) }
  86         #{ section(_('help_section_nav'),     help['nav']) }
  87       </div>
  88       <div class="VimFxReset VimFxColumn">
  89         #{ section(_('help_section_tabs'),    help['tabs']) }
  90         #{ section(_('help_section_browse'),  help['browse']) }
  91         #{ section(_('help_section_misc'),    help['misc']) }
  92       </div>
  93       <div class="VimFxReset VimFxClearFix"></div>
  94     </div>
  95
  96     <div class="VimFxReset VimFxFooter">
  97       <div class="VimFxReset VimFxSocial">
  98         <p class="VimFxReset">
  99           #{ _('help_found_bug') }
 100           <a class="VimFxReset" target="_blank" href="https://github.com/akhodakivskiy/VimFx/issues">
 101             #{ _('help_report_bug') }
 102           </a>
 103         </p>
 104         <p class="VimFxReset">
 105           #{ _('help_enjoying') }
 106           <a class="VimFxReset" target="_blank" href="https://addons.mozilla.org/en-US/firefox/addon/vimfx/">
 107             #{ _('help_feedback') }
 108           </a>
 109         </p>
 110       </div>
 111     </div>
 112   </div>
 113   """
 114
 115 exports.injectHelp = injectHelp
 116 exports.removeHelp = removeHelp