support avif for image encode/decode

Merge pull request #533 from eight04/dev-update-tag-name
Fix: make updateTag work with tag name
2024-06-14 23:09:53 +09:00 · 2021-12-05 00:38:44 +09:00 · 2021-12-04 22:28:25 +08:00 · 2021-12-04 00:23:16 +08:00 · 2021-09-30 23:47:58 +09:00 · 2021-09-30 19:26:28 +05:00
24 changed files with 3649 additions and 654 deletions
@@ -0,0 +1,8 @@
+# These are supported funding model platforms
+
+github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]
+patreon: mattn # Replace with a single Patreon username
+open_collective: mattn # Replace with a single Open Collective username
+ko_fi: # Replace with a single Ko-fi username
+tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
+custom: # Replace with a single custom sponsorship URL
@@ -0,0 +1,11 @@
+language: generic
+sudo: false
+dist: xenial
+git:
+  depth: 10
+
+script:
+  - uname -a
+  - which -a vim
+  - vim --cmd version --cmd quit
+  - make test
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2019 Yasuhiro Matsumoto
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
@@ -9,3 +9,7 @@ emmet-vim.zip: remove-zip

 release: emmet-vim.zip
 	vimup update-script emmet.vim
+
+test:
+	@-rm -f test.log 2> /dev/null
+	@vim -N -c "let &rtp .= ',' . getcwd()" -c "so unittest.vim" -c EmmetUnitTest! || cat test.log || exit 1
@@ -1,47 +1,68 @@
 # Emmet-vim

-[emmet-vim](http://mattn.github.com/emmet-vim) is a vim plug-in
+
+[![Build Status](https://travis-ci.org/mattn/emmet-vim.svg?branch=master)](https://travis-ci.org/mattn/emmet-vim)
+
+[emmet-vim](https://mattn.github.io/emmet-vim/) is a vim plug-in
 which provides support for expanding abbreviations similar to
 [emmet](http://emmet.io/).

-[![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/mattn/emmet-vim/trend.png)](https://bitdeli.com/free "Bitdeli Badge")
+![screenshot](https://raw.githubusercontent.com/mattn/emmet-vim/master/doc/screenshot.gif)

 ## Installation

 [Download zip file](http://www.vim.org/scripts/script.php?script_id=2981):

-    cd ~/.vim
-    unzip emmet-vim.zip
+```sh
+cd ~/.vim
+unzip emmet-vim.zip
+```

-To install using pathogen.vim:
+To install using [pathogen.vim](https://github.com/tpope/vim-pathogen):
+
+```sh
+git clone https://github.com/mattn/emmet-vim.git ~/.vim/bundle/emmet-vim
+```

-    cd ~/.vim/bundle
-    git clone https://github.com/mattn/emmet-vim.git
-    
 To install using [Vundle](https://github.com/gmarik/vundle):

-    " add this line to your .vimrc file
-    Plugin 'mattn/emmet-vim'
+```vim
+" add this line to your .vimrc file
+Plugin 'mattn/emmet-vim'
+```
+
+To install using [Vim-Plug](https://github.com/junegunn/vim-plug):
+
+```vim
+" add this line to your .vimrc file
+Plug 'mattn/emmet-vim'
+```

 To checkout the source from repository:

-    cd ~/.vim/bundle
-    git clone https://github.com/mattn/emmet-vim.git
+```sh
+cd ~/.vim/bundle
+git clone https://github.com/mattn/emmet-vim.git
+```

 or:

-    git clone https://github.com/mattn/emmet-vim.git
-    cd emmet-vim
-    cp plugin/emmet.vim ~/.vim/plugin/
-    cp autoload/emmet.vim ~/.vim/autoload/
-    cp -a autoload/emmet ~/.vim/autoload/
+```sh
+git clone https://github.com/mattn/emmet-vim.git
+cd emmet-vim
+cp plugin/emmet.vim ~/.vim/plugin/
+cp autoload/emmet.vim ~/.vim/autoload/
+cp -a autoload/emmet ~/.vim/autoload/
+```


 ## Quick Tutorial

 Open or create a New File:

-    vim index.html
+```sh
+vim index.html
+```

 Type ("\_" is the cursor position):

@@ -62,7 +83,7 @@ Then type `<c-y>,` (<kbd>Ctrl</kbd><kbd>y</kbd><kbd>,</kbd>), and you should see
 </html>
 ```

-[More Tutorials](https://raw.github.com/mattn/emmet-vim/master/TUTORIAL)
+[More Tutorials](https://raw.githubusercontent.com/mattn/emmet-vim/master/TUTORIAL)


 ## Enable in different mode
@@ -103,10 +124,42 @@ You can change the **path** to your **snippets_custom.json** according to your p

 [Here](http://docs.emmet.io/customization/snippets/) you can find instructions about creating your customized **snippets.json** file.

+## Snippet to add meta tag for responsiveness
+Update this in your .vimrc file.
+
+
+	let g:user_emmet_settings = {
+	\  'variables': {'lang': 'ja'},
+	\  'html': {
+	\    'default_attributes': {
+	\      'option': {'value': v:null},
+	\      'textarea': {'id': v:null, 'name': v:null, 'cols': 10, 'rows': 10},
+	\    },
+	\    'snippets': {
+	\      'html:5': "<!DOCTYPE html>\n"
+	\              ."<html lang=\"${lang}\">\n"
+	\              ."<head>\n"
+	\              ."\t<meta charset=\"${charset}\">\n"
+	\              ."\t<title></title>\n"
+	\              ."\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n"
+	\              ."</head>\n"
+	\              ."<body>\n\t${child}|\n</body>\n"
+	\              ."</html>",
+	\    },
+	\  },
+	\}
+
+
 ## Project Authors

 [Yasuhiro Matsumoto](http://mattn.kaoriya.net/)

+## FAQ
+
+* Pressing ctrl+y+, doesn't work
+
+  Probably you set `timeoutlen=0`. Most of Vim plugins which using key-mappings does not work with `timeoutlen=0`.
+
 ## Links

 ### Emmet official site:
@@ -119,7 +172,7 @@ You can change the **path** to your **snippets_custom.json** according to your p

 ### emmet.vim:

-* <http://mattn.github.com/emmet-vim>
+* <https://mattn.github.io/emmet-vim/>

 ### development repository:

@@ -0,0 +1,247 @@
+# Tutorial for Emmet.vim
+
+mattn <mattn.jp@gmail.com>
+
+
+
+## Expand an Abbreviation
+
+Type the abbreviation as `div>p#foo$*3>a` and type `<c-y>,`
+
+```html
+  <div>
+      <p id="foo1">
+          <a href=""></a>
+      </p>
+      <p id="foo2">
+          <a href=""></a>
+      </p>
+      <p id="foo3">
+          <a href=""></a>
+      </p>
+  </div>
+```
+
+## Wrap with an Abbreviation
+
+Write as below: 
+
+```html	
+ test1
+ test2
+ test3
+```
+
+  Then do visual select(line wise) and type `<c-y>,`. Once you get to the 'Tag:' prompt, type `ul>li*`.
+
+```html
+  <ul>
+      <li>test1</li>
+      <li>test2</li>
+      <li>test3</li>
+  </ul>
+```
+
+If you type a tag, such as `blockquote`, then you'll see the following:
+
+```html
+ <blockquote>
+      test1
+      test2
+      test3
+  </blockquote>
+```
+
+## Balance a Tag Inward
+
+Just type `<c-y>d` in insert mode.
+
+## Balance a Tag Outward
+
+Just type `<c-y>D` in insert mode.
+
+## Go to the Next Edit Point
+
+Just type `<c-y>n` in insert mode.
+
+## Go to the Previous Edit Point
+
+Just type `<c-y>N` in insert mode.
+
+## Update an <img>’s Size
+
+  Move cursor to the img tag.
+
+```html
+<img src="foo.png" />
+```
+
+ Type `<c-y>i` on img tag
+
+## Merge Lines
+
+select the lines, which include `<li>`
+
+```html
+<ul>
+  	<li class="list1"></li>
+  	<li class="list2"></li>
+  	<li class="list3"></li>
+</ul>
+```
+
+and then type `<c-y>m`
+
+```html
+<ul>
+  	<li class="list1"></li><li class="list2"></li><li class="list3"></li>
+</ul>
+```
+
+## Remove the tag
+
+Move cursor in block
+
+```html
+<div class="foo">
+  	<a>cursor is here</a>
+  </div>
+```
+
+Type '<c-y>k' in insert mode.
+
+```html
+<div class="foo">
+
+  </div>
+```
+
+And type '<c-y>k' in there again.
+
+```html
+
+```
+
+## Split/Join Tag
+
+Move the cursor inside block
+
+```html
+ <div class="foo">
+  	cursor is here
+  </div>
+```
+
+Type '<c-y>j' in insert mode.
+
+```html
+<div class="foo"/>
+```
+
+And then type '<c-y>j' in there again.
+
+```html
+ <div class="foo">
+  	cursor is here
+  </div>
+```
+
+## Toggle Comment
+
+Move cursor inside the block
+
+```html
+<div>
+  	hello world
+</div>
+```
+
+Type '<c-y>/' in insert mode.
+
+```html
+<!-- <div>
+  	hello world
+  </div> -->
+```
+
+Type '<c-y>/' in there again.
+
+```html
+  <div>
+  	hello world
+  </div>
+```
+
+## Make an anchor from a URL
+
+Move cursor to URL
+
+```http
+http://www.google.com/
+```
+
+Type '<c-y>a'
+
+```html
+<a href="http://www.google.com/">Google</a>
+```
+
+## Make some quoted text from a URL
+
+Move cursor to the URL
+
+```http
+ http://github.com/
+```
+
+Type '<c-y>A'
+
+```html
+<blockquote class="quote">
+  	<a href="http://github.com/">Secure source code hosting and collaborative development - GitHub</a><br />
+  	<p>How does it work? Get up and running in seconds by forking a project, pushing an existing repository...</p>
+  	<cite>http://github.com/</cite>
+  </blockquote>
+```
+
+## Installing emmet.vim for the language you are using:
+
+```sh
+cd ~/.vim
+unzip emmet-vim.zip
+```
+
+Or if you are using pathogen.vim:
+
+```shell
+cd ~/.vim/bundle # or make directory
+unzip /path/to/emmet-vim.zip
+```
+
+Or if you get the sources from the repository:
+
+```sh
+cd ~/.vim/bundle # or make directory
+git clone http://github.com/mattn/emmet-vim.git
+```
+
+## Enable emmet.vim for the language you using.
+
+You can customize the behavior of the languages you are using.
+
+```sh
+cat >> ~/.vimrc
+  let g:user_emmet_settings = {
+  \  'php' : {
+  \    'extends' : 'html',
+  \    'filters' : 'c',
+  \  },
+  \  'xml' : {
+  \    'extends' : 'html',
+  \  },
+  \  'haml' : {
+  \    'extends' : 'html',
+  \  },
+  \}
+```
+
@@ -9,3 +9,44 @@ function! emmet#lang#exists(type) abort
  return s:exists[a:type]
 endfunction

+function! emmet#lang#type(type) abort
+  let type = a:type
+  let base = type
+  let settings = emmet#getSettings()
+  while base != ''
+    for b in split(base, '\.')
+      if emmet#lang#exists(b)
+        return b
+      endif
+      if has_key(settings, b) && has_key(settings[b], 'extends')
+        let base = settings[b].extends
+        break
+      else
+        let base = ''
+      endif
+    endfor
+  endwhile
+  return 'html'
+endfunction
+
+" get all extends for a type recursively
+function! emmet#lang#getExtends(type) abort
+  let settings = emmet#getSettings()
+
+  if !has_key(settings[a:type], 'extends')
+    return []
+  endif
+
+  let extends = settings[a:type].extends
+  if type(extends) ==# 1
+    let tmp = split(extends, '\s*,\s*')
+    unlet! extends
+    let extends = tmp
+  endif
+
+  for ext in extends
+    let extends = extends + emmet#lang#getExtends(ext)
+  endfor
+
+  return extends
+endfunction
@@ -1,4 +1,9 @@
 function! emmet#lang#css#findTokens(str) abort
+  let tmp = substitute(substitute(a:str, '^.*[;{]\s*', '', ''), '}\s*$', '', '')
+  if tmp =~ '/' && tmp =~ '^[a-zA-Z0-9/_.]\+$'
+    " maybe path or something
+    return ''
+  endif
  return substitute(substitute(a:str, '^.*[;{]\s*', '', ''), '}\s*$', '', '')
 endfunction

@@ -18,15 +23,15 @@ function! emmet#lang#css#parseIntoTree(abbr, type) abort
  " emmet
  let tokens = split(abbr, '+\ze[^+)!]')
  let block = emmet#util#searchRegion('{', '}')
-  if abbr !~# '^@' && emmet#getBaseType(type) ==# 'css' && type !=# 'sass' && block[0] ==# [0,0] && block[1] ==# [0,0]
+  if abbr !~# '^@' && emmet#getBaseType(type) ==# 'css' && type !=# 'sass' && type !=# 'styled' && block[0] ==# [0,0] && block[1] ==# [0,0]
    let current = emmet#newNode()
-    let current.snippet = abbr . " {\n" . indent . "${cursor}\n}"
+    let current.snippet = substitute(abbr, '\s\+$', '', '') . " {\n" . indent . "${cursor}\n}"
    let current.name = ''
    call add(root.child, deepcopy(current))
  else
    for n in range(len(tokens))
      let token = tokens[n]
-      let prop = matchlist(token, '^\(-\{0,1}[a-zA-Z]\+\|[a-zA-Z0-9]\++\{0,1}\|([a-zA-Z0-9]\++\{0,1})\)\(\%([0-9.-]\+[pe]\{0,1}-\{0,1}\|-auto\)*\)$')
+      let prop = matchlist(token, '^\(-\{0,1}[a-zA-Z]\+\|[a-zA-Z0-9]\++\{0,1}\|([a-zA-Z0-9]\++\{0,1})\)\(\%([0-9.-]\+\%(p\|e\|em\|x\|vh\|vw\|re\|rem\|%\)\{0,}-\{0,1}\|-auto\)*\)$')
      if len(prop)
        let token = substitute(prop[1], '^(\(.*\))', '\1', '')
        if token =~# '^-'
@@ -34,26 +39,51 @@ function! emmet#lang#css#parseIntoTree(abbr, type) abort
          let token = token[1:]
        endif
        let value = ''
-        for v in split(prop[2], '\d\zs-')
-          if len(value) > 0
-            let value .= ' '
-          endif
-          if token =~# '^[z]'
-            " TODO
-            let value .= substitute(v, '[^0-9.]*$', '', '')
-          elseif v =~# 'p$'
-            let value .= substitute(v, 'p$', '%', '')
-          elseif v =~# 'e$'
-            let value .= substitute(v, 'e$', 'em', '')
-          elseif v =~# '\.'
-            let value .= v . 'em'
-          elseif v ==# 'auto'
-            let value .= v
-          elseif v ==# '0'
-            let value .= '0'
-          else
-            let value .= v . 'px'
+        for vt in split(prop[2], '\a\+\zs')
+          let ut = matchstr(vt, '[a-z]\+$')
+          if ut == 'auto'
+            let ut = ''
          endif
+          for v in split(vt, '\d\zs-')
+            if len(value) > 0
+              let value .= ' '
+            endif
+            if v !~ '[a-z]\+$'
+              let v .= ut
+            endif
+            if token =~# '^[z]'
+              " TODO
+              let value .= substitute(v, '[^0-9.]*$', '', '')
+            elseif v =~# 'em$'
+              let value .= v
+            elseif v =~# 'ex$'
+              let value .= v
+            elseif v =~# 'vh$'
+              let value .= v
+            elseif v =~# 'vw$'
+              let value .= v
+            elseif v =~# 'rem$'
+              let value .= v
+            elseif v ==# 'auto'
+              let value .= v
+            elseif v =~# 'p$'
+              let value .= substitute(v, 'p$', '%', '')
+            elseif v =~# '%$'
+              let value .= v
+            elseif v =~# 'e$'
+              let value .= substitute(v, 'e$', 'em', '')
+            elseif v =~# 'x$'
+              let value .= substitute(v, 'x$', 'ex', '')
+            elseif v =~# 're$'
+              let value .= substitute(v, 're$', 'rem', '')
+            elseif v =~# '\.'
+              let value .= v . 'em'
+            elseif v ==# '0'
+              let value .= '0'
+            else
+              let value .= v . 'px'
+            endif
+          endfor
        endfor
      endif

@@ -80,6 +110,9 @@ function! emmet#lang#css#parseIntoTree(abbr, type) abort
        if !has_key(snippets, snippet_name)
          let pat = '^' . join(split(tag_name, '\zs'), '\%(\|[^:-]\+-\)')
          let vv = filter(sort(keys(snippets)), 'snippets[v:val] =~ pat')
+          if len(vv) == 0
+            let vv = filter(sort(keys(snippets)), 'substitute(v:val, ":", "", "g") == snippet_name')
+          endif
          if len(vv) > 0
            let snippet_name = vv[0]
          else
@@ -148,6 +181,10 @@ function! emmet#lang#css#parseIntoTree(abbr, type) abort
        call add(root.child, deepcopy(current))
        let current.snippet = '-moz-' . snippet . "\n"
        call add(root.child, deepcopy(current))
+        let current.snippet = '-o-' . snippet . "\n"
+        call add(root.child, deepcopy(current))
+        let current.snippet = '-ms-' . snippet . "\n"
+        call add(root.child, deepcopy(current))
        let current.snippet = snippet
        call add(root.child, current)
      elseif token =~# '^c#\([0-9a-fA-F]\{3}\|[0-9a-fA-F]\{6}\)\(\.[0-9]\+\)\?'
@@ -186,13 +223,16 @@ endfunction
 function! emmet#lang#css#toString(settings, current, type, inline, filters, itemno, indent) abort
  let current = a:current
  let value = current.value[1:-2]
-  if emmet#useFilter(a:filters, 'fc')
-    let value = substitute(value, '\([^:]\+\):\([^;]*\)', '\1: \2', 'g')
-  else
-    let value = substitute(value, '\([^:]\+\):\([^;]*\)', '\1:\2', 'g')
-  endif
-  if current.important
-    let value = substitute(value, ';', ' !important;', '')
+  let tmp = substitute(value, '\${cursor}', '', 'g')
+  if tmp !~ '.*{[ \t\r\n]*}$'
+    if emmet#useFilter(a:filters, 'fc')
+      let value = substitute(value, '\([^:]\+\):\([^;]*\)', '\1: \2', 'g')
+    else
+      let value = substitute(value, '\([^:]\+\):\([^;]*\)', '\1:\2', 'g')
+    endif
+    if current.important
+      let value = substitute(value, ';', ' !important;', '')
+    endif
  endif
  return value
 endfunction
@@ -228,7 +268,21 @@ function! emmet#lang#css#imageSize() abort
  call emmet#util#setContent(img_region, content)
 endfunction

-function! emmet#lang#css#encodeImage() abort
+function! emmet#lang#css#imageEncode() abort
+  let img_region = emmet#util#searchRegion('url(', ')')
+  if !emmet#util#regionIsValid(img_region) || !emmet#util#cursorInRegion(img_region)
+    return
+  endif
+  let content = emmet#util#getContent(img_region)
+  let fn = matchstr(content, '\<url(\zs[^)]\+\ze)')
+  let fn = substitute(fn, '[''" \t]', '', 'g')
+  if fn =~# '^\s*$'
+    return
+  elseif fn !~# '^\(/\|http\)'
+    let fn = simplify(expand('%:h') . '/' . fn)
+  endif
+  let encoded = emmet#util#imageEncodeDecode(fn, 0)
+  call emmet#util#setContent(img_region, 'url(' . encoded . ')')
 endfunction

 function! emmet#lang#css#parseTag(tag) abort
@@ -256,7 +310,9 @@ function! emmet#lang#css#toggleComment() abort
      let line = substitute(matchstr(line, mx), mx, '\2', '')
      let line = space . substitute(line, '^\s*\|\s*$', '\1', 'g')
    else
-      let mx = '^\(\s*\)\(.*\)\s*$'
+      let mx = '^\(\s*\)\(''[^'']*''\|[^'']*\|;\)\s*$'
+      " TODO multi-property
+      "let mx = '^\(\s*\)\(\%(''[^'']*''\|[^'';]\+\)*;\{0,1}\)'
      let line = substitute(line, mx, '\1/* \2 */', '')
    endif
    call setline('.', line)
@@ -312,13 +368,8 @@ function! emmet#lang#css#moveNextPrevItem(flag) abort
 endfunction

 function! emmet#lang#css#moveNextPrev(flag) abort
-  let pos = search('""\|()\|\(:\s*\zs$\)', a:flag ? 'Wbp' : 'Wp')
-  if pos == 2
-    startinsert!
-  else
-    silent! normal! l
-    startinsert
-  endif
+  call search('""\|()\|\(:\s*\zs;\{1,0}$\)', a:flag ? 'Wbp' : 'Wp')
+  return ''
 endfunction

 function! emmet#lang#css#splitJoinTag() abort
@@ -328,3 +379,7 @@ endfunction
 function! emmet#lang#css#removeTag() abort
  " nothing to do
 endfunction
+
+function! emmet#lang#css#mergeLines() abort
+  " nothing to do
+endfunction
@@ -0,0 +1,241 @@
+function! emmet#lang#elm#findTokens(str) abort
+  return emmet#lang#html#findTokens(a:str)
+endfunction
+
+function! emmet#lang#elm#parseIntoTree(abbr, type) abort
+  let tree = emmet#lang#html#parseIntoTree(a:abbr, a:type)
+  if len(tree.child) < 2 | return tree | endif
+
+  " Add ',' nodes between root elements.
+  let new_children = []
+  for child in tree.child[0:-2]
+    let comma = emmet#newNode()
+    let comma.name = ','
+    call add(new_children, child)
+    call add(new_children, comma)
+  endfor
+  call add(new_children, tree.child[-1])
+  let tree.child = new_children
+  return tree
+endfunction
+
+function! emmet#lang#elm#renderNode(node)
+  let elm_nodes = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'
+        \, 'div', 'p', 'hr', 'pre', 'blockquote'
+        \, 'span', 'a', 'code', 'em', 'strong', 'i', 'b', 'u', 'sub', 'sup', 'br'
+        \, 'ol', 'ul', 'li', 'dl', 'dt', 'dd'
+        \, 'img', 'iframe', 'canvas', 'math'
+        \, 'form', 'input', 'textarea', 'button', 'select', 'option'
+        \, 'section', 'nav', 'article', 'aside', 'header', 'footer', 'address', 'main_', 'body'
+        \, 'figure', 'figcaption'
+        \, 'table', 'caption', 'colgroup', 'col', 'tbody', 'thead', 'tfoot', 'tr', 'td', 'th'
+        \, 'fieldset', 'legend', 'label', 'datalist', 'optgroup', 'keygen', 'output', 'progress', 'meter'
+        \, 'audio', 'video', 'source', 'track'
+        \, 'embed', 'object', 'param'
+        \, 'ins', 'del'
+        \, 'small', 'cite', 'dfn', 'abbr', 'time', 'var', 'samp', 'kbd', 's', 'q'
+        \, 'mark', 'ruby', 'rt', 'rp', 'bdi', 'bdo', 'wbr'
+        \, 'details', 'summary', 'menuitem', 'menu']
+
+  if index(elm_nodes, a:node) >= 0
+    return a:node
+  endif
+  return 'node "' . a:node . '"'
+endfunction
+
+function! emmet#lang#elm#renderParam(param)
+  let elm_events = ["onClick", "onDoubleClick"
+        \, "onMouseDown", "onMouseUp"
+        \, "onMouseEnter", "onMouseLeave"
+        \, "onMouseOver", "onMouseOut"
+        \, "onInput", "onCheck", "onSubmit"
+        \, "onBlur", "onFocus"
+        \, "on", "onWithOptions", "Options", "defaultOptions"
+        \, "targetValue", "targetChecked", "keyCode"]
+  if index(elm_events, a:param) >= 0
+    return a:param
+  endif
+  let elm_attributes = ["style", "map" , "class", "id", "title", "hidden"
+        \, "type", "type_", "value", "defaultValue", "checked", "placeholder", "selected"
+        \, "accept", "acceptCharset", "action", "autocomplete", "autofocus"
+        \, "disabled", "enctype", "formaction", "list", "maxlength", "minlength", "method", "multiple"
+        \, "name", "novalidate", "pattern", "readonly", "required", "size", "for", "form"
+        \, "max", "min", "step"
+        \, "cols", "rows", "wrap"
+        \, "href", "target", "download", "downloadAs", "hreflang", "media", "ping", "rel"
+        \, "ismap", "usemap", "shape", "coords"
+        \, "src", "height", "width", "alt"
+        \, "autoplay", "controls", "loop", "preload", "poster", "default", "kind", "srclang"
+        \, "sandbox", "seamless", "srcdoc"
+        \, "reversed", "start"
+        \, "align", "colspan", "rowspan", "headers", "scope"
+        \, "async", "charset", "content", "defer", "httpEquiv", "language", "scoped"
+        \, "accesskey", "contenteditable", "contextmenu", "dir", "draggable", "dropzone"
+        \, "itemprop", "lang", "spellcheck", "tabindex"
+        \, "challenge", "keytype"
+        \, "cite", "datetime", "pubdate", "manifest"]
+
+  if index(elm_attributes, a:param) >= 0
+    if a:param == 'type'
+      return 'type_'
+    endif
+    return a:param
+  endif
+  return 'attribute "' . a:param . '"'
+endfunction
+
+function! emmet#lang#elm#toString(settings, current, type, inline, filters, itemno, indent) abort
+  let settings = a:settings
+  let current = a:current
+  let type = a:type
+  let inline = a:inline
+  let filters = a:filters
+  let itemno = a:itemno
+  let indent = emmet#getIndentation(type)
+  let dollar_expr = emmet#getResource(type, 'dollar_expr', 1)
+  let str = ''
+
+  " comma between items with *, eg. li*3
+  if itemno > 0
+    let str = ", "
+  endif
+
+  let current_name = current.name
+  if dollar_expr
+    let current_name = substitute(current.name, '\$$', itemno+1, '')
+  endif
+
+  if len(current.name) > 0
+    " inserted root comma nodes
+    if current_name == ','
+      return "\n, "
+    endif
+    let str .= emmet#lang#elm#renderNode(current_name)
+    let tmp = ''
+    for attr in emmet#util#unique(current.attrs_order + keys(current.attr))
+      if !has_key(current.attr, attr)
+        continue
+      endif
+      let Val = current.attr[attr]
+
+      let attr = emmet#lang#elm#renderParam(attr)
+
+      if type(Val) == 2 && Val == function('emmet#types#true')
+        let tmp .= ', ' . attr . ' True'
+      else
+        if dollar_expr
+          while Val =~# '\$\([^#{]\|$\)'
+            let Val = substitute(Val, '\(\$\+\)\([^{]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+          endwhile
+          let attr = substitute(attr, '\$$', itemno+1, '')
+        endif
+        let valtmp = substitute(Val, '\${cursor}', '', '')
+        if attr ==# 'id' && len(valtmp) > 0
+          let tmp .=', id "' . Val . '"'
+        elseif attr ==# 'class' && len(valtmp) > 0
+          let tmp .= ', class "' . substitute(Val, '\.', ' ', 'g') . '"'
+        else
+          let tmp .= ', ' . attr . ' "' . Val . '"'
+        endif
+      endif
+    endfor
+
+    if ! len(tmp)
+      let str .= ' []'
+    else
+      let tmp = strpart(tmp, 2)
+      let str .= ' [ ' . tmp . ' ]'
+    endif
+
+    " No children quit early
+    if len(current.child) == 0 && len(current.value) == 0
+      "Place cursor in node with no value or children
+      let str .= ' [${cursor}]'
+      return str
+    endif
+
+    let inner = ''
+
+    " Parent contex text
+    if len(current.value) > 0
+      let text = current.value[1:-2]
+      if dollar_expr
+        let text = substitute(text, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+        let text = substitute(text, '\${nr}', "\n", 'g')
+        let text = substitute(text, '\\\$', '$', 'g')
+        " let str = substitute(str, '\$#', text, 'g')
+        let inner .= ', text "' . text . '"'
+      endif
+    endif
+
+
+    " Has children
+    for child in current.child
+      if len(child.name) == 0 && len(child.value) > 0
+        "  Text node
+        let text = child.value[1:-2]
+        if dollar_expr
+          let text = substitute(text, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+          let text = substitute(text, '\${nr}', "\n", 'g')
+          let text = substitute(text, '\\\$', '$', 'g')
+        endif
+        let inner .= ', text "' . text . '"'
+      else
+        " Other nodes
+        let inner .= ', ' . emmet#toString(child, type, inline, filters, 0, indent)
+      endif
+    endfor
+
+    let inner = substitute(inner, "\n", "\n" . escape(indent, '\'), 'g')
+    let inner = substitute(inner, "\n" . escape(indent, '\') . '$', '', 'g')
+    let inner = strpart(inner, 2)
+
+    let inner = substitute(inner, '  ', '', 'g')
+
+    if ! len(inner)
+      let str .= ' []'
+    else
+      let str .= ' [ ' . inner . ' ]'
+    endif
+
+  else
+    let str = current.value[1:-2]
+    if dollar_expr
+      let str = substitute(str, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+      let str = substitute(str, '\${nr}', "\n", 'g')
+      let str = substitute(str, '\\\$', '$', 'g')
+    endif
+  endif
+
+  let str .= "\n"
+  return str
+endfunction
+
+function! emmet#lang#elm#imageEncode() abort
+endfunction
+
+function! emmet#lang#elm#parseTag(tag) abort
+  return {}
+endfunction
+
+function! emmet#lang#elm#toggleComment() abort
+endfunction
+
+function! emmet#lang#elm#balanceTag(flag) range abort
+endfunction
+
+function! emmet#lang#elm#moveNextPrevItem(flag) abort
+  return emmet#lang#elm#moveNextPrev(a:flag)
+endfunction
+
+function! emmet#lang#elm#moveNextPrev(flag) abort
+endfunction
+
+function! emmet#lang#elm#splitJoinTag() abort
+endfunction
+
+function! emmet#lang#elm#removeTag() abort
+endfunction
+
+function! emmet#lang#elm#mergeLines() abort
+endfunction
@@ -56,7 +56,6 @@ function! emmet#lang#haml#toString(settings, current, type, inline, filters, ite
              let tmp .= ' ' 
            endif
          endif
-          let Val = substitute(Val, '\${cursor}', '', '')
          if attribute_style ==# 'hash'
            let tmp .= ' :' . attr . ' => "' . Val . '"'
          elseif attribute_style ==# 'html'
@@ -156,7 +155,7 @@ function! emmet#lang#haml#imageSize() abort
  call setline('.', substitute(matchstr(line, '^\s*') . haml, "\n", '', 'g'))
 endfunction

-function! emmet#lang#haml#encodeImage() abort
+function! emmet#lang#haml#imageEncode() abort
 endfunction

 function! emmet#lang#haml#parseTag(tag) abort
@@ -333,3 +332,6 @@ function! emmet#lang#haml#removeTag() abort
    exe sn ',' (n-1) 'delete'
  endif
 endfunction
+
+function! emmet#lang#haml#mergeLines() abort
+endfunction
@@ -1,14 +1,15 @@
-let s:mx = '\([+>]\|[<^]\+\)\{-}\s*'
-\     .'\((*\)\{-}\s*'
-\       .'\([@#.]\{-}[a-zA-Z_\!][a-zA-Z0-9:_\!\-$]*\|{\%([^$}]\+\|\$#\|\${\w\+}\|\$\+\)*}*[ \t\r\n}]*\|\[[^\]]\+\]\)'
+let s:bx = '{\%("[^"]*"\|''[^'']*''\|\$#\|\${\w\+}\|\$\+\|{[^{]\+\|[^{}]\)\{-}}'
+let s:mx = '\([+>]\|[<^]\+\)\{-}'
+\     .'\((*\)\{-}'
+\       .'\([@#.]\{-}[a-zA-Z_\!][a-zA-Z0-9:_\!\-$]*\|' . s:bx . '\|\[[^\]]\+\]\)'
 \       .'\('
 \         .'\%('
 \           .'\%(#{[{}a-zA-Z0-9_\-\$]\+\|#[a-zA-Z0-9_\-\$]\+\)'
-\           .'\|\%(\[\%("[^"]*"\|[^"\]]*\)\+\]\)'
-\           .'\|\%(\.{[{}a-zA-Z0-9_\-\$]\+\|\.[a-zA-Z0-9_\-\$]\+\)'
+\           .'\|\%(\[\%(\[[^\]]*\]\|"[^"]*"\|[^"\[\]]*\)\+\]\)'
+\           .'\|\%(\.{[{}a-zA-Z0-9_\-\$\.]\+\|\.[a-zA-Z0-9_\-\$]\+\)'
 \         .'\)*'
 \       .'\)'
-\       .'\%(\({\%([^$}]\+\|\$#\|\${\w\+}\|\$\+\)*}\+\)\)\{0,1}'
+\       .'\%(\(' . s:bx . '\+\)\)\{0,1}'
 \         .'\%(\(@-\{0,1}[0-9]*\)\{0,1}\*\([0-9]\+\)\)\{0,1}'
 \     .'\(\%()\%(\(@-\{0,1}[0-9]*\)\{0,1}\*[0-9]\+\)\{0,1}\)*\)'

@@ -22,16 +23,24 @@ function! emmet#lang#html#findTokens(str) abort
    endif
    let pos = stridx(str, tag, pos) + len(tag)
  endwhile
+  while 1
+    let tag = matchstr(str, '{%[^%]\{-}%}', pos)
+    if len(tag) == 0
+      break
+    endif
+    let pos = stridx(str, tag, pos) + len(tag)
+  endwhile
  let last_pos = pos
  while len(str) > 0
+    let white = matchstr(str, '^\s\+', pos)
+    if white != ''
+      let last_pos = pos + len(white)
+	  let pos = last_pos
+    endif
    let token = matchstr(str, s:mx, pos)
    if token ==# ''
      break
    endif
-    if token =~# '^\s'
-      let token = matchstr(token, '^\s*\zs.*')
-      let last_pos = stridx(str, token, pos)
-    endif
    let pos = stridx(str, token, pos) + len(token)
  endwhile
  let str = a:str[last_pos :-1]
@@ -51,8 +60,31 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
  endif
  if len(type) == 0 | let type = 'html' | endif

-  let settings = emmet#getSettings()
  let indent = emmet#getIndentation(type)
+  let pmap = {
+  \'p': 'span',
+  \'ul': 'li',
+  \'ol': 'li',
+  \'table': 'tr',
+  \'tr': 'td',
+  \'tbody': 'tr',
+  \'thead': 'tr',
+  \'tfoot': 'tr',
+  \'colgroup': 'col',
+  \'select': 'option',
+  \'optgroup': 'option',
+  \'audio': 'source',
+  \'video': 'source',
+  \'object': 'param',
+  \'map': 'area'
+  \}
+
+  let inlineLevel = split('a,abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,code,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,select,small,span,strike,strong,sub,sup,textarea,tt,u,var',',')
+
+  let custom_expands = emmet#getResource(type, 'custom_expands', {})
+  if empty(custom_expands) && has_key(settings, 'custom_expands')
+    let custom_expands = settings['custom_expands']
+  endif

  " try 'foo' to (foo-x)
  let rabbr = emmet#getExpandos(type, abbr)
@@ -63,6 +95,7 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
  let abbr = rabbr

  let root = emmet#newNode()
+  let root['variables'] = {}
  let parent = root
  let last = root
  let pos = []
@@ -78,13 +111,14 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
    let basevalue = substitute(match, s:mx, '\6', 'ig')
    let multiplier = 0 + substitute(match, s:mx, '\7', 'ig')
    let block_end = substitute(match, s:mx, '\8', 'ig')
+    let custom = ''
    let important = 0
    if len(str) == 0
      break
    endif
    if tag_name =~# '^#'
      let attributes = tag_name . attributes
-      let tag_name = 'div'
+      let tag_name = ''
    endif
    if tag_name =~# '[^!]!$'
      let tag_name = tag_name[:-2]
@@ -92,20 +126,48 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
    endif
    if tag_name =~# '^\.'
      let attributes = tag_name . attributes
-      let tag_name = 'div'
+      let tag_name = ''
    endif
    if tag_name =~# '^\[.*\]$'
      let attributes = tag_name . attributes
-      let tag_name = 'div'
+      let tag_name = ''
    endif
+
+    for k in keys(custom_expands)
+      if tag_name =~ k
+        let custom = tag_name
+        let tag_name = ''
+        break
+      endif
+    endfor
+
+    if empty(tag_name)
+      let pname = len(parent.child) > 0 ? parent.child[0].name : ''
+      if !empty(pname) && has_key(pmap, pname) && custom == ''
+        let tag_name = pmap[pname]
+      elseif !empty(pname) && index(inlineLevel, pname) > -1
+        let tag_name = 'span'
+      elseif len(custom) == 0
+        let tag_name = 'div'
+      elseif len(custom) != 0 && multiplier > 1	
+        let tag_name = 'div'
+      else
+        let tag_name = custom
+      endif
+    endif
+
    let basedirect = basevalue[1] ==# '-' ? -1 : 1
-    let basevalue = 0 + abs(basevalue[1:])
+    if basevalue != ''
+      let basevalue = 0 + abs(basevalue[1:])
+    else
+      let basevalue = 1
+    endif
    if multiplier <= 0 | let multiplier = 1 | endif

    " make default node
    let current = emmet#newNode()
-    let current.name = tag_name

+    let current.name = tag_name
    let current.important = important

    " aliases
@@ -128,6 +190,10 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
        if use_pipe_for_cursor
          let snippet = substitute(snippet, '|', '${cursor}', 'g')
        endif
+        " just redirect to expanding
+        if type == 'html' && snippet !~ '^\s*[{\[<]'
+           return emmet#lang#html#parseIntoTree(snippet, a:type)
+        endif
        let lines = split(snippet, "\n", 1)
        call map(lines, 'substitute(v:val, "\\(    \\|\\t\\)", escape(indent, "\\\\"), "g")')
        let current.snippet = join(lines, "\n")
@@ -135,14 +201,23 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
      endif
    endif

-    let custom_expands = emmet#getResource(type, 'custom_expands', {})
-    if empty(custom_expands) && has_key(settings, 'custom_expands')
-      let custom_expands = settings['custom_expands']
-    endif
    for k in keys(custom_expands)
      if tag_name =~# k
-        let current.snippet = '${' . tag_name . '}'
+        let snippet = '${' . (empty(custom) ? tag_name : custom) . '}'
        let current.name = ''
+        let current.snippet = snippet
+        break
+      elseif custom =~# k
+        let snippet = '${' . custom . '}'
+        let current.snippet = '${' . custom . '}'
+        if current.name != ''
+          let snode = emmet#newNode()
+          let snode.snippet = snippet
+          let snode.parent = current
+          call add(current.child, snode)
+        else
+          let current.snippet = snippet
+        endif
        break
      endif
    endfor
@@ -157,10 +232,18 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
            let current.attrs_order += keys(a)
            if use_pipe_for_cursor
              for k in keys(a)
+                if type(a[k]) == 7
+                  call remove(current.attr, k)
+                  continue
+                endif
                let current.attr[k] = len(a[k]) ? substitute(a[k], '|', '${cursor}', 'g') : '${cursor}'
              endfor
            else
              for k in keys(a)
+                if type(a[k]) == 7
+                  call remove(current.attr, k)
+                  continue
+                endif
                let current.attr[k] = a[k]
              endfor
            endif
@@ -169,10 +252,18 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
              let current.attrs_order += keys(a)
              if use_pipe_for_cursor
                for k in keys(a)
+                  if type(a[k]) == 7
+                    call remove(current.attr, k)
+                    continue
+                  endif
                  let current.attr[k] = len(a[k]) ? substitute(a[k], '|', '${cursor}', 'g') : '${cursor}'
                endfor
              else
                for k in keys(a)
+                  if type(a[k]) == 7
+                    call remove(current.attr, k)
+                    continue
+                  endif
                  let current.attr[k] = a[k]
                endfor
              endif
@@ -190,7 +281,7 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
    if len(attributes)
      let attr = attributes
      while len(attr)
-        let item = matchstr(attr, '\(\%(\%(#[{}a-zA-Z0-9_\-\$]\+\)\|\%(\[\%("[^"]*"\|[^"\]]*\)\+\]\)\|\%(\.[{}a-zA-Z0-9_\-\$]\+\)*\)\)')
+        let item = matchstr(attr, '\(\%(\%(#[{}a-zA-Z0-9_\-\$]\+\)\|\%(\[\%(\[[^\]]*\]\|"[^"]*"\|[^"\[\]]*\)\+\]\)\|\%(\.[{}a-zA-Z0-9_\-\$]\+\)*\)\)')
        if g:emmet_debug > 1
          echomsg 'attr=' . item
        endif
@@ -199,29 +290,34 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
        endif
        if item[0] ==# '#'
          let current.attr.id = item[1:]
+          let root['variables']['id'] = current.attr.id
        endif
        if item[0] ==# '.'
          let current.attr.class = substitute(item[1:], '\.', ' ', 'g')
+          let root['variables']['class'] = current.attr.class
        endif
        if item[0] ==# '['
          let atts = item[1:-2]
-          if matchstr(atts, '^\s*\zs[0-9a-zA-Z-:]\+\(="[^"]*"\|=''[^'']*''\|=[^ ''"]\+\)') ==# ''
+          if matchstr(atts, '^\s*\zs[0-9a-zA-Z_\-:]\+\(="[^"]*"\|=''[^'']*''\|=[^ ''"]\+\)') ==# ''
            let ks = []
 			if has_key(default_attributes, current.name)
              let dfa = default_attributes[current.name]
-              let ks = type(dfa) == 3 ? keys(dfa[0]) : keys(dfa)
+              let ks = type(dfa) == 3 ? len(dfa) > 0 ? keys(dfa[0]) : [] : keys(dfa)
            endif
            if len(ks) == 0 && has_key(default_attributes, current.name . ':src')
-              let ks = keys(default_attributes[current.name . ':src'])
+              let dfa = default_attributes[current.name . ':src']
+              let ks = type(dfa) == 3 ? len(dfa) > 0 ? keys(dfa[0]) : [] : keys(dfa)
            endif
            if len(ks) > 0
              let current.attr[ks[0]] = atts
+            elseif atts =~# '\.$'
+              let current.attr[atts[:-2]] = function('emmet#types#true')
            else
              let current.attr[atts] = ''
            endif
          else
            while len(atts)
-              let amat = matchstr(atts, '^\s*\zs\([0-9a-zA-Z-:]\+\%(="[^"]*"\|=''[^'']*''\|=[^ ''"]\+\|[^ ''"\]]*\)\{0,1}\)')
+              let amat = matchstr(atts, '^\s*\zs\([0-9a-zA-Z-:]\+\%(={{.\{-}}}\|="[^"]*"\|=''[^'']*''\|=[^ ''"]\+\|[^ ''"\]]*\)\{0,1}\)')
              if len(amat) == 0
                break
              endif
@@ -292,6 +388,7 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
      if operator =~# '>'
        let last.pos += 1
      endif
+      let last.block = 1
      for n in range(len(block_start))
        let pos += [last.pos]
      endfor
@@ -314,7 +411,14 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
            let last.pos += 1
          endif
        elseif len(n)
-          let cl = last.child
+          let st = 0
+          for nc in range(len(last.child))
+            if last.child[nc].block
+              let st = nc
+              break
+            endif
+          endfor
+          let cl = last.child[st :]
          let cls = []
          for c in range(n[1:])
            for cc in cl
@@ -326,11 +430,18 @@ function! emmet#lang#html#parseIntoTree(abbr, type) abort
            endfor
            let cls += deepcopy(cl)
          endfor
-          let last.child = cls
+          if st > 0
+            let last.child = last.child[:st-1] + cls
+          else
+            let last.child = cls
+          endif
        endif
      endfor
    endif
    let abbr = abbr[stridx(abbr, match) + len(match):]
+    if abbr == '/'
+      let current.empty = 1
+    endif

    if g:emmet_debug > 1
      echomsg 'str='.str
@@ -371,6 +482,9 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
  let dollar_expr = emmet#getResource(type, 'dollar_expr', 1)
  let q = emmet#getResource(type, 'quote_char', '"')
  let ct = emmet#getResource(type, 'comment_type', 'both')
+  let an = emmet#getResource(type, 'attribute_name', {})
+  let empty_elements = emmet#getResource(type, 'empty_elements', settings.html.empty_elements)
+  let empty_element_suffix = emmet#getResource(type, 'empty_element_suffix', settings.html.empty_element_suffix)

  if emmet#useFilter(filters, 'haml')
    return emmet#lang#haml#toString(settings, current, type, inline, filters, itemno, indent)
@@ -441,23 +555,46 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
          if len(Val) > 0
            let Val .= ' '
          endif
-          if _val =~# '^\a_'
-            let lead = _val[0]
-            let Val .= lead . ' ' .  _val
-          elseif _val =~# '^_'
-            if len(lead) == 0
-              let pattr = current.parent.attr
-              if has_key(pattr, 'class')
-                let lead = pattr['class']
+          if _val =~# '^_'
+            if has_key(current.parent.attr, 'class')
+              let lead = current.parent.attr["class"]
+              if _val =~# '^__'
+                let Val .= lead . _val
+              else
+                let Val .= lead . ' ' . lead . _val
              endif
+            else
+              let lead = split(vals[0], '_')[0]
+              let Val .= lead . _val
            endif
-            let Val .= lead . ' ' . lead . _val
+          elseif _val =~# '^-'
+            for l in split(_val, '_')
+              if len(Val) > 0
+                let Val .= ' '
+              endif
+              let l = substitute(l, '^-', '__', '')
+              if len(lead) == 0
+                let pattr = current.parent.attr
+                if has_key(pattr, 'class')
+                  let lead = split(pattr['class'], '\s\+')[0]
+                endif
+              endif
+              let Val .= lead . l
+              let lead .= l . '_'
+            endfor
          else
            let Val .= _val
          endif
        endfor
      endif
-      let str .= ' ' . attr . '=' . q . Val . q
+      if has_key(an, attr)
+        let attr = an[attr]
+      endif
+      if emmet#isExtends(type, 'jsx') && Val =~ '^{.*}$'
+        let str .= ' ' . attr . '=' . Val
+      else
+        let str .= ' ' . attr . '=' . q . Val . q
+      endif
      if emmet#useFilter(filters, 'c')
        if attr ==# 'id' | let comment .= '#' . Val | endif
        if attr ==# 'class' | let comment .= '.' . Val | endif
@@ -468,8 +605,10 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
  if len(comment) > 0 && ct ==# 'both'
    let str = '<!-- ' . comment . " -->\n" . str
  endif
-  if stridx(','.settings.html.empty_elements.',', ','.current_name.',') != -1
-    let str .= settings.html.empty_element_suffix
+  if current.empty
+    let str .= ' />'
+  elseif stridx(','.empty_elements.',', ','.current_name.',') != -1
+    let str .= empty_element_suffix
  else
    let str .= '>'
    let text = current.value[1:-2]
@@ -483,7 +622,9 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
      endif
      let text = substitute(text, '\${nr}', "\n", 'g')
      let text = substitute(text, '\\\$', '$', 'g')
-      let str = substitute(str, '\("\zs$#\ze"\|\s\zs\$#"\|"\$#\ze\s\)', text, 'g')
+      if text != ''
+        let str = substitute(str, '\("\zs$#\ze"\|\s\zs\$#"\|"\$#\ze\s\)', text, 'g')
+      endif
    endif
    let str .= text
    let nc = len(current.child)
@@ -491,7 +632,7 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
    if nc > 0
      for n in range(nc)
        let child = current.child[n]
-        if child.multiplier > 1
+        if child.multiplier > 1 || (child.multiplier == 1 && len(child.child) > 0 && stridx(','.settings.html.inline_elements.',', ','.current_name.',') == -1) || settings.html.block_all_childless
          let str .= "\n" . indent
          let dr = 1
        elseif len(current_name) > 0 && stridx(','.settings.html.inline_elements.',', ','.current_name.',') == -1
@@ -510,7 +651,11 @@ function! emmet#lang#html#toString(settings, current, type, inline, filters, ite
        let str .= inner
      endfor
    else
-      let str .= '${cursor}'
+      if settings.html.indent_blockelement && len(current_name) > 0 && stridx(','.settings.html.inline_elements.',', ','.current_name.',') == -1 || settings.html.block_all_childless
+        let str .= "\n" . indent . '${cursor}' . "\n"
+      else
+        let str .= '${cursor}'
+      endif
    endif
    if dr
      let str .= "\n"
@@ -562,7 +707,7 @@ function! emmet#lang#html#imageSize() abort
  call emmet#util#setContent(img_region, html)
 endfunction

-function! emmet#lang#html#encodeImage() abort
+function! emmet#lang#html#imageEncode() abort
  let img_region = emmet#util#searchRegion('<img\s', '>')
  if !emmet#util#regionIsValid(img_region) || !emmet#util#cursorInRegion(img_region)
    return
@@ -576,27 +721,26 @@ function! emmet#lang#html#encodeImage() abort
    return
  endif
  let fn = current.attr.src
-  if fn !~# '^\(/\|http\)'
+  if fn =~# '^\s*$'
+    return
+  elseif fn !~# '^\(/\|http\)'
    let fn = simplify(expand('%:h') . '/' . fn)
  endif

-  let [width, height] = emmet#util#getImageSize(fn)
-  if width == -1 && height == -1
-    return
-  endif
-  let current.attr.width = width
-  let current.attr.height = height
-  let html = emmet#toString(current, 'html', 1)
-  call emmet#util#setContent(img_region, html)
+  let encoded = emmet#util#imageEncodeDecode(fn, 0)
+  let current.attr.src = encoded
+  let content = substitute(emmet#toString(current, 'html', 1), '\n', '', '')
+  let content = substitute(content, '\${cursor}', '', '')
+  call emmet#util#setContent(img_region, content)
 endfunction

 function! emmet#lang#html#parseTag(tag) abort
  let current = emmet#newNode()
-  let mx = '<\([a-zA-Z][a-zA-Z0-9]*\)\(\%(\s[a-zA-Z][a-zA-Z0-9]\+=\%([^"'' \t]\+\|"[^"]\{-}"\|''[^'']\{-}''\)\s*\)*\)\(/\{0,1}\)>'
+  let mx = '<\([a-zA-Z][a-zA-Z0-9-]*\)\(\%(\s[a-zA-Z][a-zA-Z0-9-]\+=\?\%([^"'' \t]\+\|"[^"]\{-}"\|''[^'']\{-}''\)\s*\)*\)\(/\{0,1}\)>'
  let match = matchstr(a:tag, mx)
  let current.name = substitute(match, mx, '\1', 'i')
  let attrs = substitute(match, mx, '\2', 'i')
-  let mx = '\([a-zA-Z0-9]\+\)=\%(\([^"'' \t]\+\)\|"\([^"]\{-}\)"\|''\([^'']\{-}\)''\)'
+  let mx = '\([a-zA-Z0-9-]\+\)\(\(=[^"'' \t]\+\)\|="\([^"]\{-}\)"\|=''\([^'']\{-}\)''\)\?'
  while len(attrs) > 0
    let match = matchstr(attrs, mx)
    if len(match) == 0
@@ -604,8 +748,12 @@ function! emmet#lang#html#parseTag(tag) abort
    endif
    let attr_match = matchlist(match, mx)
    let name = attr_match[1]
-    let value = len(attr_match[2]) ? attr_match[2] : attr_match[3]
-    let current.attr[name] = value
+    if len(attr_match[2])
+      let Val = len(attr_match[3]) ? attr_match[3] : attr_match[4]
+    else
+      let Val = function('emmet#types#true')
+    endif
+    let current.attr[name] = Val
    let current.attrs_order += [name]
    let attrs = attrs[stridx(attrs, match) + len(match):]
  endwhile
@@ -613,8 +761,8 @@ function! emmet#lang#html#parseTag(tag) abort
 endfunction

 function! emmet#lang#html#toggleComment() abort
-  let orgpos = emmet#util#getcurpos()
-  let curpos = emmet#util#getcurpos()
+  let orgpos = getpos('.')
+  let curpos = getpos('.')
  let mx = '<\%#[^>]*>'
  while 1
    let block = emmet#util#searchRegion('<!--', '-->')
@@ -632,7 +780,7 @@ function! emmet#lang#html#toggleComment() abort
      if pos1[0] == 0 && pos1[1] == 0
        return
      endif
-      let curpos = emmet#util#getcurpos()
+      let curpos = getpos('.')
      continue
    endif
    let pos1 = block[0]
@@ -641,7 +789,7 @@ function! emmet#lang#html#toggleComment() abort
    let tag_name = matchstr(content, '^<\zs/\{0,1}[^ \r\n>]\+')
    if tag_name[0] ==# '/'
      call setpos('.', [0, pos1[0], pos1[1], 0])
-      let pos2 = searchpairpos('<'. tag_name[1:] . '\>[^>]*>', '', '</' . tag_name[1:] . '>', 'bnW')
+      let pos2 = searchpairpos('<'. tag_name[1:] . '\>[^/>]*>', '', '</' . tag_name[1:] . '>', 'bnW')
      let pos1 = searchpos('>', 'cneW')
      let block = [pos2, pos1]
    elseif tag_name =~# '/$'
@@ -656,7 +804,7 @@ function! emmet#lang#html#toggleComment() abort
      endif
    else
      call setpos('.', [0, pos2[0], pos2[1], 0])
-      let pos3 = searchpairpos('<'. tag_name . '\>[^>]*>', '', '</' . tag_name . '>', 'nW')
+      let pos3 = searchpairpos('<'. tag_name . '\>[^/>]*>', '', '</' . tag_name . '>', 'nW')
      if pos3 == [0, 0]
        let block = [pos1, pos2]
      else
@@ -680,11 +828,7 @@ endfunction

 function! emmet#lang#html#balanceTag(flag) range abort
  let vblock = emmet#util#getVisualBlock()
-  if a:flag == -2 || a:flag == 2
-    let curpos = [0, line("'<"), col("'<"), 0]
-  else
-    let curpos = emmet#util#getcurpos()
-  endif
+  let curpos = emmet#util#getcurpos()
  let settings = emmet#getSettings()

  if a:flag > 0
@@ -700,7 +844,7 @@ function! emmet#lang#html#balanceTag(flag) range abort
        let pos2 = searchpairpos('<' . tag_name . '[^>]*>', '', '</'. tag_name . '\zs>', 'nW')
      endif
      let block = [pos1, pos2]
-      if pos1[0] == 0 && pos1[1] == 0
+      if pos1 == [0, 0]
        break
      endif
      if emmet#util#pointInRegion(last, block) && emmet#util#regionIsValid(block)
@@ -716,8 +860,8 @@ function! emmet#lang#html#balanceTag(flag) range abort
    let mx = '<\([a-zA-Z][a-zA-Z0-9:_\-]*\)[^>]*>'
    while 1
      let pos1 = searchpos(mx, 'W')
-      if pos1 == curpos[1:2]
-        let pos1 = searchpos(mx . '\zs', 'W')
+      if pos1 == [0, 0] || pos1 == curpos[1:2]
+        let pos1 = searchpos('>\zs', 'W')
        let pos2 = searchpos('.\ze<', 'W')
        let block = [pos1, pos2]
        if emmet#util#regionIsValid(block)
@@ -733,7 +877,7 @@ function! emmet#lang#html#balanceTag(flag) range abort
        let pos2 = searchpairpos('<' . tag_name . '[^>]*>', '', '</'. tag_name . '\zs>', 'nW')
      endif
      let block = [pos1, pos2]
-      if pos1[0] == 0 && pos1[1] == 0
+      if pos1 == [0, 0]
        break
      endif
      if emmet#util#regionIsValid(block)
@@ -742,11 +886,7 @@ function! emmet#lang#html#balanceTag(flag) range abort
      endif
    endwhile
  endif
-  if a:flag == -2 || a:flag == 2
-    silent! exe 'normal! gv'
-  else
-    call setpos('.', curpos)
-  endif
+  call setpos('.', curpos)
 endfunction

 function! emmet#lang#html#moveNextPrevItem(flag) abort
@@ -756,6 +896,7 @@ function! emmet#lang#html#moveNextPrevItem(flag) abort
  if pos != [0,0]
    call feedkeys('v?\s\zs'.mx."\<cr>", '')
  endif
+  return ''
 endfunction

 function! emmet#lang#html#moveNextPrev(flag) abort
@@ -766,82 +907,130 @@ function! emmet#lang#html#moveNextPrev(flag) abort
    silent! normal! l
    startinsert
  endif
+  return ''
 endfunction

 function! emmet#lang#html#splitJoinTag() abort
  let curpos = emmet#util#getcurpos()
+  let mx = '<\(/\{0,1}[a-zA-Z][-a-zA-Z0-9:_\-]*\)\%(\%(\s[a-zA-Z][a-zA-Z0-9]\+=\%([^"'' \t]\+\|"[^"]\{-}"\|''[^'']\{-}''\)\s*\)*\)\s*\%(/\{0,1}\)>'
  while 1
-    let mx = '<\(/\{0,1}[a-zA-Z][a-zA-Z0-9:_\-]*\)[^>]*>'
+    let old = getpos('.')[1:2]
    let pos1 = searchpos(mx, 'bcnW')
    let content = matchstr(getline(pos1[0])[pos1[1]-1:], mx)
    let tag_name = substitute(content, '^<\(/\{0,1}[a-zA-Z][a-zA-Z0-9:_\-]*\).*$', '\1', '')
    let block = [pos1, [pos1[0], pos1[1] + len(content) - 1]]
    if content[-2:] ==# '/>' && emmet#util#cursorInRegion(block)
-      let content = content[:-3] . '></' . tag_name . '>'
+      let content = substitute(content[:-3], '\s*$', '', '')  . '></' . tag_name . '>'
      call emmet#util#setContent(block, content)
      call setpos('.', [0, block[0][0], block[0][1], 0])
      return
+    endif
+    if tag_name[0] ==# '/'
+      let pos1 = searchpos('<' . tag_name[1:] . '[^a-zA-Z0-9]', 'bcnW')
+      call setpos('.', [0, pos1[0], pos1[1], 0])
+      let pos2 = searchpairpos('<'. tag_name[1:] . '\>[^/>]*>', '', '</' . tag_name[1:] . '>', 'W')
    else
-      if tag_name[0] ==# '/'
-        let pos1 = searchpos('<' . tag_name[1:] . '[^a-zA-Z0-9]', 'bcnW')
-        call setpos('.', [0, pos1[0], pos1[1], 0])
-        let pos2 = searchpos('</' . tag_name[1:] . '>', 'cneW')
-      else
-        let pos2 = searchpos('</' . tag_name . '>', 'cneW')
-      endif
-      let block = [pos1, pos2]
-      let content = emmet#util#getContent(block)
-      if emmet#util#pointInRegion(curpos[1:2], block) && content[1:] !~# '<' . tag_name . '[^a-zA-Z0-9]*[^>]*>'
-        let content = matchstr(content, mx)[:-2] . '/>'
-        call emmet#util#setContent(block, content)
-        call setpos('.', [0, block[0][0], block[0][1], 0])
-        return
-      else
-        if block[0][0] > 0
-          call setpos('.', [0, block[0][0]-1, block[0][1], 0])
-        else
-          call setpos('.', curpos)
-          return
-        endif
-      endif
+      let pos2 = searchpairpos('<'. tag_name . '[^/>]*>', '', '</' . tag_name . '>', 'W')
+    endif
+    if pos2 == [0, 0]
+      return
+    endif
+    let pos2 = searchpos('>', 'neW')
+    let block = [pos1, pos2]
+    if emmet#util#pointInRegion(curpos[1:2], block)
+      let content = matchstr(content, mx)[:-2] . ' />'
+      call emmet#util#setContent(block, content)
+      call setpos('.', [0, block[0][0], block[0][1], 0])
+      return
+    endif
+    if block[0][0] > 0
+      call setpos('.', [0, block[0][0]-1, block[0][1], 0])
+    else
+      call setpos('.', curpos)
+      return
+    endif
+    if pos1 == old
+      call setpos('.', curpos)
+      return
    endif
  endwhile
 endfunction

 function! emmet#lang#html#removeTag() abort
  let curpos = emmet#util#getcurpos()
-  while 1
-    let mx = '<\(/\{0,1}[a-zA-Z][a-zA-Z0-9:_\-]*\)[^>]*'
-    let pos1 = searchpos(mx, 'bcnW')
-    let content = matchstr(getline(pos1[0])[pos1[1]-1:], mx)
-    let tag_name = matchstr(content, '^<\zs/\{0,1}[a-zA-Z0-9:_\-]*')
-    let block = [pos1, [pos1[0], pos1[1] + len(content) - 1]]
-    if content[-2:] ==# '/>' && emmet#util#cursorInRegion(block)
-      call emmet#util#setContent(block, '')
-      call setpos('.', [0, block[0][0], block[0][1], 0])
-      return
-    else
-      if tag_name[0] ==# '/'
-        let pos1 = searchpos('<' . tag_name[1:] . '[^a-zA-Z0-9]', 'bcnW')
-        call setpos('.', [0, pos1[0], pos1[1], 0])
-        let pos2 = searchpos('</' . tag_name[1:] . '>', 'cneW')
-      else
-        let pos2 = searchpos('</' . tag_name . '>', 'cneW')
-      endif
-      let block = [pos1, pos2]
-      let content = emmet#util#getContent(block)
-      if emmet#util#pointInRegion(curpos[1:2], block) && content[1:] !~# '^<' . tag_name . '[^a-zA-Z0-9]'
-        call emmet#util#setContent(block, '')
-        call setpos('.', [0, block[0][0], block[0][1], 0])
-        return
-      else
-        if block[0][0] > 0
-          call setpos('.', [0, block[0][0]-1, block[0][1], 0])
-        else
-          call setpos('.', curpos)
-          return
-        endif
-      endif
-    endif
-  endwhile
+  let mx = '<\(/\{0,1}[a-zA-Z][-a-zA-Z0-9:_\-]*\)\%(\%(\s[a-zA-Z][a-zA-Z0-9]\+=\%([^"'' \t]\+\|"[^"]\{-}"\|''[^'']\{-}''\)\s*\)*\)\s*\%(/\{0,1}\)>'
+
+  let pos1 = searchpos(mx, 'bcnW')
+  let content = matchstr(getline(pos1[0])[pos1[1]-1:], mx)
+  let tag_name = substitute(content, '^<\(/\{0,1}[a-zA-Z][a-zA-Z0-9:_\-]*\).*$', '\1', '')
+  let block = [pos1, [pos1[0], pos1[1] + len(content) - 1]]
+  if content[-2:] ==# '/>' && emmet#util#cursorInRegion(block)
+    call emmet#util#setContent(block, '')
+    call setpos('.', [0, block[0][0], block[0][1], 0])
+    return
+  endif
+  if tag_name[0] ==# '/'
+    let pos1 = searchpos('<' . tag_name[1:] . '[^a-zA-Z0-9]', 'bcnW')
+    call setpos('.', [0, pos1[0], pos1[1], 0])
+    let pos2 = searchpairpos('<'. tag_name[1:] . '\>[^/>]*>', '', '</' . tag_name[1:] . '>', 'W')
+  else
+    let pos2 = searchpairpos('<'. tag_name . '[^/>]*>', '', '</' . tag_name . '>', 'W')
+  endif
+  if pos2 == [0, 0]
+    return
+  endif
+  let pos2 = searchpos('>', 'neW')
+  let block = [pos1, pos2]
+  if emmet#util#pointInRegion(curpos[1:2], block)
+    call emmet#util#setContent(block, '')
+    call setpos('.', [0, block[0][0], block[0][1], 0])
+    return
+  endif
+  if block[0][0] > 0
+    call setpos('.', [0, block[0][0]-1, block[0][1], 0])
+  else
+    call setpos('.', curpos)
+  endif
+endfunction
+
+function! emmet#lang#html#mergeLines() abort
+  let curpos = emmet#util#getcurpos()
+  let settings = emmet#getSettings()
+
+  let mx = '<\([a-zA-Z][a-zA-Z0-9:_\-]*\)[^>]*>'
+  let last = curpos[1:2]
+  while 1
+    let pos1 = searchpos(mx, 'bcW')
+    let content = matchstr(getline(pos1[0])[pos1[1]-1:], mx)
+	echomsg string(content)
+    let tag_name = matchstr(content, '^<\zs[a-zA-Z0-9:_\-]*\ze')
+    if stridx(','.settings.html.empty_elements.',', ','.tag_name.',') != -1
+      let pos2 = searchpos('>', 'nW')
+    else
+      let pos2 = searchpairpos('<' . tag_name . '[^>]*>', '', '</'. tag_name . '\zs>', 'nW')
+    endif
+    if pos1 == [0, 0] || pos2 == [0, 0]
+      call setpos('.', curpos)
+      return
+    endif
+    let block = [pos1, pos2]
+    if emmet#util#pointInRegion(last, block) && emmet#util#regionIsValid(block)
+      break
+    endif
+    if pos1 == last
+      call setpos('.', curpos)
+      return
+    endif
+    let last = pos1
+  endwhile
+
+  let content = emmet#util#getContent(block)
+  let mx = '<\(/\{0,1}[a-zA-Z][-a-zA-Z0-9:_\-]*\)\%(\%(\s[a-zA-Z][a-zA-Z0-9]\+=\%([^"'' \t]\+\|"[^"]\{-}"\|''[^'']\{-}''\)\s*\)*\)\s*\%(/\{0,1}\)>'
+  let content = join(map(split(content, mx . '\zs\s*'), 'trim(v:val)'), '')
+  call emmet#util#setContent(block, content)
+  if block[0][0] > 0
+    call setpos('.', [0, block[0][0], block[0][1], 0])
+  else
+    call setpos('.', curpos)
+  endif
 endfunction
@@ -0,0 +1,335 @@
+function! emmet#lang#jade#findTokens(str) abort
+  return emmet#lang#html#findTokens(a:str)
+endfunction
+
+function! emmet#lang#jade#parseIntoTree(abbr, type) abort
+  return emmet#lang#html#parseIntoTree(a:abbr, a:type)
+endfunction
+
+function! emmet#lang#jade#toString(settings, current, type, inline, filters, itemno, indent) abort
+  let settings = a:settings
+  let current = a:current
+  let type = a:type
+  let inline = a:inline
+  let filters = a:filters
+  let itemno = a:itemno
+  let indent = emmet#getIndentation(type)
+  let dollar_expr = emmet#getResource(type, 'dollar_expr', 1)
+  let attribute_style = emmet#getResource('jade', 'attribute_style', 'hash')
+  let str = ''
+
+  let current_name = current.name
+  if dollar_expr
+    let current_name = substitute(current.name, '\$$', itemno+1, '')
+  endif
+  if len(current.name) > 0
+    let str .= '' . current_name
+    let tmp = ''
+    for attr in emmet#util#unique(current.attrs_order + keys(current.attr))
+      if !has_key(current.attr, attr)
+        continue
+      endif
+      let Val = current.attr[attr]
+      if type(Val) == 2 && Val == function('emmet#types#true')
+        if attribute_style ==# 'hash'
+          let tmp .= ' ' . attr . ' = true'
+        elseif attribute_style ==# 'html'
+          let tmp .= attr . '=true'
+        end
+      else
+        if dollar_expr
+          while Val =~# '\$\([^#{]\|$\)'
+            let Val = substitute(Val, '\(\$\+\)\([^{]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+          endwhile
+          let attr = substitute(attr, '\$$', itemno+1, '')
+        endif
+        let valtmp = substitute(Val, '\${cursor}', '', '')
+        if attr ==# 'id' && len(valtmp) > 0
+          let str .= '#' . Val
+        elseif attr ==# 'class' && len(valtmp) > 0
+          let str .= '.' . substitute(Val, ' ', '.', 'g')
+        else
+          if len(tmp) > 0
+            if attribute_style ==# 'hash'
+              let tmp .= ', '
+            elseif attribute_style ==# 'html'
+              let tmp .= ' '
+            endif
+          endif
+          if attribute_style ==# 'hash'
+            let tmp .= '' . attr . '="' . Val . '"'
+          elseif attribute_style ==# 'html'
+            let tmp .= attr . '="' . Val . '"'
+          end
+        endif
+      endif
+    endfor
+    if len(tmp)
+      if attribute_style ==# 'hash'
+        let str .= '(' . tmp . ')'
+      elseif attribute_style ==# 'html'
+        let str .= '(' . tmp . ')'
+      end
+    endif
+
+    let inner = ''
+    if len(current.value) > 0
+      let text = current.value[1:-2]
+      if dollar_expr
+        let text = substitute(text, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+        let text = substitute(text, '\${nr}', "\n", 'g')
+        let text = substitute(text, '\\\$', '$', 'g')
+        let str = substitute(str, '\$#', text, 'g')
+      endif
+      let lines = split(text, "\n")
+      if len(lines) == 1
+        let str .= ' ' . text
+      else
+        for line in lines
+          let str .= "\n" . indent . line . ' |'
+        endfor
+      endif
+    elseif len(current.child) == 0
+      let str .= '${cursor}'
+    endif
+    if len(current.child) == 1 && len(current.child[0].name) == 0
+      let text = current.child[0].value[1:-2]
+      if dollar_expr
+        let text = substitute(text, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+        let text = substitute(text, '\${nr}', "\n", 'g')
+        let text = substitute(text, '\\\$', '$', 'g')
+      endif
+      let lines = split(text, "\n")
+      if len(lines) == 1
+        let str .= ' ' . text
+      else
+        for line in lines
+          let str .= "\n" . indent . line . ' |'
+        endfor
+      endif
+    elseif len(current.child) > 0
+      for child in current.child
+        let inner .= emmet#toString(child, type, inline, filters, itemno, indent)
+      endfor
+      let inner = substitute(inner, "\n", "\n" . escape(indent, '\'), 'g')
+      let inner = substitute(inner, "\n" . escape(indent, '\') . '$', '', 'g')
+      let str .= "\n" . indent . inner
+    endif
+  else
+    let str = current.value[1:-2]
+    if dollar_expr
+      let str = substitute(str, '\%(\\\)\@\<!\(\$\+\)\([^{#]\|$\)', '\=printf("%0".len(submatch(1))."d", itemno+1).submatch(2)', 'g')
+      let str = substitute(str, '\${nr}', "\n", 'g')
+      let str = substitute(str, '\\\$', '$', 'g')
+    endif
+  endif
+  let str .= "\n"
+  return str
+endfunction
+
+function! emmet#lang#jade#imageSize() abort
+  let line = getline('.')
+  let current = emmet#lang#jade#parseTag(line)
+  if empty(current) || !has_key(current.attr, 'src')
+    return
+  endif
+  let fn = current.attr.src
+  if fn =~# '^\s*$'
+    return
+  elseif fn !~# '^\(/\|http\)'
+    let fn = simplify(expand('%:h') . '/' . fn)
+  endif
+
+  let [width, height] = emmet#util#getImageSize(fn)
+  if width == -1 && height == -1
+    return
+  endif
+  let current.attr.width = width
+  let current.attr.height = height
+  let current.attrs_order += ['width', 'height']
+  let jade = emmet#toString(current, 'jade', 1)
+  let jade = substitute(jade, '\${cursor}', '', '')
+  call setline('.', substitute(matchstr(line, '^\s*') . jade, "\n", '', 'g'))
+endfunction
+
+function! emmet#lang#jade#imageEncode() abort
+endfunction
+
+function! emmet#lang#jade#parseTag(tag) abort
+  let current = emmet#newNode()
+  let mx = '%\([a-zA-Z][a-zA-Z0-9]*\)\s*\%({\(.*\)}\)'
+  let match = matchstr(a:tag, mx)
+  let current.name = substitute(match, mx, '\1', '')
+  let attrs = substitute(match, mx, '\2', '')
+  let mx = '\([a-zA-Z0-9]\+\)\s*=>\s*\%(\([^"'' \t]\+\)\|"\([^"]\{-}\)"\|''\([^'']\{-}\)''\)'
+  while len(attrs) > 0
+    let match = matchstr(attrs, mx)
+    if len(match) ==# 0
+      break
+    endif
+    let attr_match = matchlist(match, mx)
+    let name = attr_match[1]
+    let value = len(attr_match[2]) ? attr_match[2] : attr_match[3]
+    let current.attr[name] = value
+    let current.attrs_order += [name]
+    let attrs = attrs[stridx(attrs, match) + len(match):]
+  endwhile
+  return current
+endfunction
+
+function! emmet#lang#jade#toggleComment() abort
+  let line = getline('.')
+  let space = matchstr(line, '^\s*')
+  if line =~# '^\s*-#'
+    call setline('.', space . matchstr(line[len(space)+2:], '^\s*\zs.*'))
+  elseif line =~# '^\s*%[a-z]'
+    call setline('.', space . '-# ' . line[len(space):])
+  endif
+endfunction
+
+function! emmet#lang#jade#balanceTag(flag) range abort
+  let block = emmet#util#getVisualBlock()
+  if a:flag == -2 || a:flag == 2
+    let curpos = [0, line("'<"), col("'<"), 0]
+  else
+    let curpos = emmet#util#getcurpos()
+  endif
+  let n = curpos[1]
+  let ml = len(matchstr(getline(n), '^\s*'))
+
+  if a:flag > 0
+    if a:flag == 1 || !emmet#util#regionIsValid(block)
+      let n = line('.')
+    else
+      while n > 0
+        let l = len(matchstr(getline(n), '^\s*\ze%[a-z]'))
+        if l > 0 && l < ml
+          let ml = l
+          break
+        endif
+        let n -= 1
+      endwhile
+    endif
+    let sn = n
+    if n == 0
+      let ml = 0
+    endif
+    while n < line('$')
+      let l = len(matchstr(getline(n), '^\s*%[a-z]'))
+      if l > 0 && l <= ml
+        let n -= 1
+        break
+      endif
+      let n += 1
+    endwhile
+    call setpos('.', [0, n, 1, 0])
+    normal! V
+    call setpos('.', [0, sn, 1, 0])
+  else
+    while n > 0
+      let l = len(matchstr(getline(n), '^\s*\ze[a-z]'))
+      if l > 0 && l > ml
+        let ml = l
+        break
+      endif
+      let n += 1
+    endwhile
+    let sn = n
+    if n == 0
+      let ml = 0
+    endif
+    while n < line('$')
+      let l = len(matchstr(getline(n), '^\s*%[a-z]'))
+      if l > 0 && l <= ml
+        let n -= 1
+        break
+      endif
+      let n += 1
+    endwhile
+    call setpos('.', [0, n, 1, 0])
+    normal! V
+    call setpos('.', [0, sn, 1, 0])
+  endif
+endfunction
+
+function! emmet#lang#jade#moveNextPrevItem(flag) abort
+  return emmet#lang#jade#moveNextPrev(a:flag)
+endfunction
+
+function! emmet#lang#jade#moveNextPrev(flag) abort
+  let pos = search('""', a:flag ? 'Wb' : 'W')
+  if pos != 0
+    silent! normal! l
+    startinsert
+  endif
+endfunction
+
+function! emmet#lang#jade#splitJoinTag() abort
+  let n = line('.')
+  let sml = len(matchstr(getline(n), '^\s*%[a-z]'))
+  while n > 0
+    if getline(n) =~# '^\s*\ze%[a-z]'
+      if len(matchstr(getline(n), '^\s*%[a-z]')) < sml
+        break
+      endif
+      let line = getline(n)
+      call setline(n, substitute(line, '^\s*%\w\+\%(\s*{[^}]*}\|\s\)\zs.*', '', ''))
+      let sn = n
+      let n += 1
+      let ml = len(matchstr(getline(n), '^\s*%[a-z]'))
+      if len(matchstr(getline(n), '^\s*')) > ml
+        while n <= line('$')
+          let l = len(matchstr(getline(n), '^\s*'))
+          if l <= ml
+            break
+          endif
+          exe n 'delete'
+        endwhile
+        call setpos('.', [0, sn, 1, 0])
+      else
+        let tag = matchstr(getline(sn), '^\s*%\zs\(\w\+\)')
+        let spaces = matchstr(getline(sn), '^\s*')
+        let settings = emmet#getSettings()
+        if stridx(','.settings.html.inline_elements.',', ','.tag.',') == -1
+          call append(sn, spaces . '   ')
+          call setpos('.', [0, sn+1, 1, 0])
+        else
+          call setpos('.', [0, sn, 1, 0])
+        endif
+        startinsert!
+      endif
+      break
+    endif
+    let n -= 1
+  endwhile
+endfunction
+
+function! emmet#lang#jade#removeTag() abort
+  let n = line('.')
+  let ml = 0
+  while n > 0
+    if getline(n) =~# '^\s*\ze[a-z]'
+      let ml = len(matchstr(getline(n), '^\s*%[a-z]'))
+      break
+    endif
+    let n -= 1
+  endwhile
+  let sn = n
+  while n < line('$')
+    let l = len(matchstr(getline(n), '^\s*%[a-z]'))
+    if l > 0 && l <= ml
+      let n -= 1
+      break
+    endif
+    let n += 1
+  endwhile
+  if sn == n
+    exe 'delete'
+  else
+    exe sn ',' (n-1) 'delete'
+  endif
+endfunction
+
+function! emmet#lang#jade#mergeLines() abort
+  " nothing to do
+endfunction
@@ -14,8 +14,8 @@ function! emmet#lang#less#imageSize() abort
  call emmet#lang#css#imageSize()
 endfunction

-function! emmet#lang#less#encodeImage() abort
-  return emmet#lang#css#encodeImage()
+function! emmet#lang#less#imageEncode() abort
+  return emmet#lang#css#imageEncode()
 endfunction

 function! emmet#lang#less#parseTag(tag) abort
@@ -45,3 +45,7 @@ endfunction
 function! emmet#lang#less#removeTag() abort
  call emmet#lang#css#removeTag()
 endfunction
+
+function! emmet#lang#less#mergeLines() abort
+  call emmet#lang#css#mergeLines()
+endfunction
@@ -3,7 +3,7 @@ function! emmet#lang#sass#findTokens(str) abort
 endfunction

 function! emmet#lang#sass#parseIntoTree(abbr, type) abort
-    return emmet#lang#html#parseIntoTree(a:abbr, a:type)
+    return emmet#lang#css#parseIntoTree(a:abbr, a:type)
 endfunction

 function! emmet#lang#sass#toString(settings, current, type, inline, filters, itemno, indent) abort
@@ -65,7 +65,7 @@ endfunction
 function! emmet#lang#sass#imageSize() abort
 endfunction

-function! emmet#lang#sass#encodeImage() abort
+function! emmet#lang#sass#imageEncode() abort
 endfunction

 function! emmet#lang#sass#parseTag(tag) abort
@@ -158,3 +158,6 @@ endfunction

 function! emmet#lang#sass#removeTag() abort
 endfunction
+
+function! emmet#lang#sass#mergeLines() abort
+endfunction
@@ -53,7 +53,7 @@ function! emmet#lang#scss#toString(settings, current, type, inline, filters, ite
    endfor
    let inner = substitute(inner, "\n", "\n" . escape(indent, '\'), 'g')
    let inner = substitute(inner, "\n" . escape(indent, '\') . '$', '', 'g')
-    let str .= indent . inner . "\n}\n"
+    let str .= indent . inner . "${cursor}\n}\n"
  else
    return emmet#lang#css#toString(settings, current, type, inline, filters, itemno, indent)
  endif
@@ -64,8 +64,8 @@ function! emmet#lang#scss#imageSize() abort
  call emmet#lang#css#imageSize()
 endfunction

-function! emmet#lang#scss#encodeImage() abort
-  return emmet#lang#css#encodeImage()
+function! emmet#lang#scss#imageEncode() abort
+  return emmet#lang#css#imageEncode()
 endfunction

 function! emmet#lang#scss#parseTag(tag) abort
@@ -123,3 +123,7 @@ endfunction
 function! emmet#lang#scss#removeTag() abort
  call emmet#lang#css#removeTag()
 endfunction
+
+function! emmet#lang#scss#mergeLines() abort
+  call emmet#lang#css#mergeLines()
+endfunction
@@ -114,7 +114,7 @@ function! emmet#lang#slim#imageSize() abort
  call setline('.', substitute(matchstr(line, '^\s*') . slim, "\n", '', 'g'))
 endfunction

-function! emmet#lang#slim#encodeImage() abort
+function! emmet#lang#slim#imageEncode() abort
 endfunction

 function! emmet#lang#slim#parseTag(tag) abort
@@ -279,3 +279,6 @@ function! emmet#lang#slim#removeTag() abort
    exe sn ',' (n-1) 'delete'
  endif
 endfunction
+
+function! emmet#lang#slim#mergeLines() abort
+endfunction
@@ -233,12 +233,12 @@ function! emmet#util#getImageSize(fn) abort
  else
    if fn !~# '^\w\+://'
      let path = fnamemodify(expand('%'), ':p:gs?\\?/?')
-      if has('win32') || has('win64') | 
+      if has('win32') || has('win64') |
        let path = tolower(path)
      endif
      for k in keys(g:emmet_docroot)
        let root = fnamemodify(k, ':p:gs?\\?/?')
-        if has('win32') || has('win64') | 
+        if has('win32') || has('win64') |
          let root = tolower(root)
        endif
        if stridx(path, root) == 0
@@ -292,12 +292,75 @@ function! emmet#util#imageSizeWithImageMagick(fn) abort
 endfunction

 function! emmet#util#isImageMagickInstalled() abort
-  if !get(s:, 'emmet_use_identify', 1)
+  if !get(g:, 'emmet_use_identify', 1)
    return 0
  endif
  return executable('identify')
 endfunction

+function! s:b64encode(bytes, table, pad)
+  let b64 = []
+  for i in range(0, len(a:bytes) - 1, 3)
+    let n = a:bytes[i] * 0x10000
+          \ + get(a:bytes, i + 1, 0) * 0x100
+          \ + get(a:bytes, i + 2, 0)
+    call add(b64, a:table[n / 0x40000])
+    call add(b64, a:table[n / 0x1000 % 0x40])
+    call add(b64, a:table[n / 0x40 % 0x40])
+    call add(b64, a:table[n % 0x40])
+  endfor
+  if len(a:bytes) % 3 == 2
+    let b64[-1] = a:pad
+  elseif len(a:bytes) % 3 == 1
+    let b64[-1] = a:pad
+    let b64[-2] = a:pad
+  endif
+  return b64
+endfunction
+
+function! emmet#util#imageEncodeDecode(fn, flag) abort
+  let fn = a:fn
+
+  if filereadable(fn)
+    let hex = substitute(system('xxd -p "'.fn.'"'), '\n', '', 'g')
+  else
+    if fn !~# '^\w\+://'
+      let path = fnamemodify(expand('%'), ':p:gs?\\?/?')
+      if has('win32') || has('win64') |
+        let path = tolower(path)
+      endif
+      for k in keys(g:emmet_docroot)
+        let root = fnamemodify(k, ':p:gs?\\?/?')
+        if has('win32') || has('win64') |
+          let root = tolower(root)
+        endif
+        if stridx(path, root) == 0
+          let v = g:emmet_docroot[k]
+          let fn = (len(v) == 0 ? k : v) . fn
+          break
+        endif
+      endfor
+    endif
+    let hex = substitute(system(g:emmet_curl_command.' "'.fn.'" | xxd -p'), '\n', '', 'g')
+  endif
+
+  let bin = map(split(hex, '..\zs'), 'eval("0x" . v:val)')
+  let table = split('ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/', '\zs')
+  let ret = 'data:image/'
+  if hex =~# '^89504e470d0a1a0a'
+    let ret .= 'png'
+  elseif hex =~# '^ffd8'
+    let ret .= 'jpeg'
+  elseif hex =~# '^47494638'
+    let ret .= 'gif'
+  elseif hex =~# '^00000020667479706176696600000000'
+    let ret .= 'avif'
+  else
+    let ret .= 'unknown'
+  endif
+  return ret . ';base64,' . join(s:b64encode(bin, table, '='), '')
+endfunction
+
 function! emmet#util#unique(arr) abort
  let m = {}
  let r = []
@@ -2,7 +2,7 @@ script_name: Emmet.vim
 script_id: '2981'
 script_type: utility
 script_package: emmet-vim.zip
-script_version: '0.85'
+script_version: '0.86'
 required_vim_version: '7.0'
 summary: vim plugins for HTML and CSS hi-speed coding.

@@ -98,6 +98,8 @@ install_details: |
  # git clone http://github.com/mattn/emmet-vim.git

 versions:
+- '0.86': |
+   This is an upgrade for Emmet.vim: lot of bug fixes.
 - '0.85': |
   This is an upgrade for Emmet.vim: lot of bug fixes.
 - '0.84': |
@@ -1,8 +1,8 @@
 "=============================================================================
 " File: emmet.vim
 " Author: Yasuhiro Matsumoto <mattn.jp@gmail.com>
-" Last Change: 17-Dec-2014.
-" Version: 0.85
+" Last Change: 26-Jul-2015.
+" Version: 0.86
 " WebPage: http://github.com/mattn/emmet-vim
 " Description: vim plugins for HTML and CSS hi-speed coding.
 " SeeAlso: http://emmet.io/
@@ -23,6 +23,7 @@
 "      | <head>
 "      |     <title></title>
 "      |     <meta charset="UTF-8">
+"      |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 "      | </head>
 "      | <body>
 "      |      _
@@ -46,7 +47,7 @@
 " Tips:
 "
 "   You can customize behavior of expanding with overriding config.
-"   This configuration will be marged at loading plugin.
+"   This configuration will be merged at loading plugin.
 "
 "     let g:user_emmet_settings = {
 "     \  'indentation' : '  ',
@@ -90,10 +91,6 @@ if !exists('g:emmet_curl_command')
  let g:emmet_curl_command = 'curl -s -L -A Mozilla/5.0'
 endif

-if exists('g:user_emmet_complete_tag') && g:user_emmet_complete_tag
-  setlocal omnifunc=emmet#completeTag
-endif
-
 if !exists('g:user_emmet_leader_key')
  let g:user_emmet_leader_key = '<c-y>'
 endif
@@ -110,18 +107,24 @@ function! s:install_plugin(mode, buffer)
  \ {'mode': 'n', 'var': 'user_emmet_update_tag', 'key': 'u', 'plug': 'emmet-update-tag', 'func': ':call emmet#updateTag()<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_balancetaginward_key', 'key': 'd', 'plug': 'emmet-balance-tag-inward', 'func': '<esc>:call emmet#balanceTag(1)<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_balancetaginward_key', 'key': 'd', 'plug': 'emmet-balance-tag-inward', 'func': ':call emmet#balanceTag(1)<cr>'},
-  \ {'mode': 'v', 'var': 'user_emmet_balancetaginward_key', 'key': 'd', 'plug': 'emmet-balance-tag-inward', 'func': ':call emmet#balanceTag(2)<cr>'},
+  \ {'mode': 'v', 'var': 'user_emmet_balancetaginward_key', 'key': 'd', 'plug': 'emmet-balance-tag-inward', 'func': '<esc>:call emmet#balanceTag(1)<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_balancetagoutward_key', 'key': 'D', 'plug': 'emmet-balance-tag-outword', 'func': '<esc>:call emmet#balanceTag(-1)<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_balancetagoutward_key', 'key': 'D', 'plug': 'emmet-balance-tag-outword', 'func': ':call emmet#balanceTag(-1)<cr>'},
-  \ {'mode': 'v', 'var': 'user_emmet_balancetagoutward_key', 'key': 'D', 'plug': 'emmet-balance-tag-outword', 'func': ':call emmet#balanceTag(-2)<cr>'},
-  \ {'mode': 'i', 'var': 'user_emmet_next_key', 'key': 'n', 'plug': 'emmet-move-next', 'func': '<esc>:call emmet#moveNextPrev(0)<cr>'},
+  \ {'mode': 'v', 'var': 'user_emmet_balancetagoutward_key', 'key': 'D', 'plug': 'emmet-balance-tag-outword', 'func': '<esc>:call emmet#balanceTag(-1)<cr>'},
+  \ {'mode': 'i', 'var': 'user_emmet_next_key', 'key': 'n', 'plug': 'emmet-move-next', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#moveNextPrev(0)<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_next_key', 'key': 'n', 'plug': 'emmet-move-next', 'func': ':call emmet#moveNextPrev(0)<cr>'},
-  \ {'mode': 'i', 'var': 'user_emmet_prev_key', 'key': 'N', 'plug': 'emmet-move-prev', 'func': '<esc>:call emmet#moveNextPrev(1)<cr>'},
+  \ {'mode': 'i', 'var': 'user_emmet_prev_key', 'key': 'N', 'plug': 'emmet-move-prev', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#moveNextPrev(1)<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_prev_key', 'key': 'N', 'plug': 'emmet-move-prev', 'func': ':call emmet#moveNextPrev(1)<cr>'},
+  \ {'mode': 'i', 'var': '', 'key': '', 'plug': 'emmet-move-next-item', 'func': '<esc>:call emmet#moveNextPrevItem(0)<cr>'},
+  \ {'mode': 'n', 'var': '', 'key': '', 'plug': 'emmet-move-next-item', 'func': ':call emmet#moveNextPrevItem(0)<cr>'},
+  \ {'mode': 'i', 'var': '', 'key': '', 'plug': 'emmet-move-prev-item', 'func': '<esc>:call emmet#moveNextPrevItem(1)<cr>'},
+  \ {'mode': 'n', 'var': '', 'key': '', 'plug': 'emmet-move-prev-item', 'func': ':call emmet#moveNextPrevItem(1)<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_imagesize_key', 'key': 'i', 'plug': 'emmet-image-size', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#imageSize()<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_imagesize_key', 'key': 'i', 'plug': 'emmet-image-size', 'func': ':call emmet#imageSize()<cr>'},
-  \ {'mode': 'i', 'var': 'user_emmet_togglecomment_key', 'key': '/', 'plug': 'emmet-toogle-comment', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#toggleComment()<cr>'},
-  \ {'mode': 'n', 'var': 'user_emmet_togglecomment_key', 'key': '/', 'plug': 'emmet-toogle-comment', 'func': ':call emmet#toggleComment()<cr>'},
+  \ {'mode': 'i', 'var': 'user_emmet_imageencode_key', 'key': 'I', 'plug': 'emmet-image-encode', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#imageEncode()<cr>'},
+  \ {'mode': 'n', 'var': 'user_emmet_imageencode_key', 'key': 'I', 'plug': 'emmet-image-encode', 'func': ':call emmet#imageEncode()<cr>'},
+  \ {'mode': 'i', 'var': 'user_emmet_togglecomment_key', 'key': '/', 'plug': 'emmet-toggle-comment', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#toggleComment()<cr>'},
+  \ {'mode': 'n', 'var': 'user_emmet_togglecomment_key', 'key': '/', 'plug': 'emmet-toggle-comment', 'func': ':call emmet#toggleComment()<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_splitjointag_key', 'key': 'j', 'plug': 'emmet-split-join-tag', 'func': '<esc>:call emmet#splitJoinTag()<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_splitjointag_key', 'key': 'j', 'plug': 'emmet-split-join-tag', 'func': ':call emmet#splitJoinTag()<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_removetag_key', 'key': 'k', 'plug': 'emmet-remove-tag', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#removeTag()<cr>'},
@@ -130,27 +133,39 @@ function! s:install_plugin(mode, buffer)
  \ {'mode': 'n', 'var': 'user_emmet_anchorizeurl_key', 'key': 'a', 'plug': 'emmet-anchorize-url', 'func': ':call emmet#anchorizeURL(0)<cr>'},
  \ {'mode': 'i', 'var': 'user_emmet_anchorizesummary_key', 'key': 'A', 'plug': 'emmet-anchorize-summary', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#anchorizeURL(1)<cr>'},
  \ {'mode': 'n', 'var': 'user_emmet_anchorizesummary_key', 'key': 'A', 'plug': 'emmet-anchorize-summary', 'func': ':call emmet#anchorizeURL(1)<cr>'},
-  \ {'mode': 'v', 'var': 'user_emmet_mergelines_key', 'key': 'm', 'plug': 'emmet-merge-lines', 'func': ':call emmet#mergeLines()<cr>'},
+  \ {'mode': 'i', 'var': 'user_emmet_mergelines_key', 'key': 'm', 'plug': 'emmet-merge-lines', 'func': '<c-r>=emmet#util#closePopup()<cr><c-r>=emmet#mergeLines()<cr>'},
+  \ {'mode': 'n', 'var': 'user_emmet_mergelines_key', 'key': 'm', 'plug': 'emmet-merge-lines', 'func': ':call emmet#mergeLines()<cr>'},
  \ {'mode': 'v', 'var': 'user_emmet_codepretty_key', 'key': 'c', 'plug': 'emmet-code-pretty', 'func': ':call emmet#codePretty()<cr>'},
  \]

+  let only_plug = get(g:, 'emmet_install_only_plug', 0)
  for item in items
    if a:mode !=# 'a' && stridx(a:mode, item.mode) == -1
      continue
    endif
    exe item.mode . 'noremap '. buffer .' <plug>(' . item.plug . ') ' . item.func
-    if exists('g:' . item.var)
-      let key = eval('g:' . item.var)
-    else
-      let key = g:user_emmet_leader_key . item.key
-    endif
-    if !hasmapto('<plug>(' . item.plug . ')', item.mode) && !len(maparg(key, item.mode))
-      exe item.mode . 'map ' . buffer . ' <unique> ' . key . ' <plug>(' . item.plug . ')'
+    if item.var != '' && !only_plug
+      if exists('g:' . item.var)
+        let key = eval('g:' . item.var)
+      else
+        let key = g:user_emmet_leader_key . item.key
+      endif
+      if !hasmapto('<plug>(' . item.plug . ')', item.mode) && !len(maparg(key, item.mode))
+        exe item.mode . 'map ' . buffer . ' <unique> <silent>' . key . ' <plug>(' . item.plug . ')'
+      endif
    endif
  endfor
+
+  if exists('g:user_emmet_complete_tag') && g:user_emmet_complete_tag
+    if get(g:, 'user_emmet_install_global', 1)
+      set omnifunc=emmet#completeTag
+    else
+      setlocal omnifunc=emmet#completeTag
+    endif
+  endif
 endfunction

-command! -nargs=0 EmmetInstall call <SID>install_plugin(get(g:, 'user_emmet_mode', 'a'), 1)
+command! -nargs=0 -bar EmmetInstall call <SID>install_plugin(get(g:, 'user_emmet_mode', 'a'), 1)

 if get(g:, 'user_emmet_install_global', 1)
  call s:install_plugin(get(g:, 'user_emmet_mode', 'a'), 0)
@@ -160,6 +175,17 @@ if get(g:, 'user_emmet_install_command', 1)
  command! -nargs=1 Emmet call emmet#expandAbbr(4, <q-args>)
 endif

+function! s:setup_styledEmmetAbbreviation() abort
+  if index(['javascript', 'javascriptreact', 'typescript', 'typescriptreact'], &filetype) != -1
+    syntax match styledEmmetAbbreviation "[a-z0-9#+!%]\+" containedin=styledDefinition contained
+  endif
+endfunction
+
+augroup ___emmet_setup___
+  au!
+  autocmd Syntax * call s:setup_styledEmmetAbbreviation()
+augroup END
+
 let &cpoptions = s:save_cpo
 unlet s:save_cpo

@@ -1,5 +1,6 @@
 " {{{
 let s:sfile = expand('<sfile>')
+let s:logging = 0

 function! s:reload(d)
  exe 'so' a:d.'/plugin/emmet.vim'
@@ -8,22 +9,32 @@ function! s:reload(d)
  endfor
 endfunction

+function! s:logn(msg)
+  echon a:msg
+  call writefile([a:msg, ''], "test.log", "ab")
+endfunction
+
+function! s:log(msg)
+  echo a:msg
+  call writefile(split(a:msg, "\n"), "test.log", "ab")
+endfunction
+
 function! s:show_type(type)
-  echohl Search | echon '[' a:type "]\n" | echohl None
+  echohl Search | call s:log('['.a:type.']') | echohl None
  echo "\r"
 endfunction

 function! s:show_category(category)
-  echohl MatchParen | echon '[' a:category "]\n" | echohl None
+  echohl MatchParen | call s:log('['.a:category.']') | echohl None
  echo "\r"
 endfunction

 function! s:show_pass(pass)
-  echohl Title | echo 'pass'.a:pass."\n" | echohl None
+  echohl Title | call s:log('pass '.substitute(a:pass, '\s', '', 'g')) | echohl None
 endfunction

 function! s:show_done()
-  echohl IncSearch | echo 'done' | echohl None
+  echohl IncSearch | call s:log('done') | echohl None
 endfunction

 function! s:escape(str)
@@ -36,37 +47,39 @@ endfunction
 function! s:show_title(no, title)
  let title = s:escape(a:title)
  let width = &columns - 23
-  echohl MoreMsg | echon "\rtesting #".printf('%03d', a:no)
-  echohl None | echon ': ' . (len(title) < width ? (title.repeat(' ', width-len(title))) : strpart(title, 0, width)) . ' ... '
+  echon "\r"
+  echohl MoreMsg | call s:logn('testing #'.printf('%03d', a:no))
+  echohl None | call s:logn(': '.(len(title) < width ? (title.' '.repeat('.', width-len(title)+1)) : strpart(title, 0, width+2)).'... ')
 endfunction

 function! s:show_skip(no, title)
  let title = s:escape(a:title)
  let width = &columns - 23
-  echohl WarningMsg | echon "\rskipped #".printf('%03d', a:no)
-  echohl None | echon ': ' . (len(title) < width ? (title.repeat(' ', width-len(title))) : strpart(title, 0, width)) . ' ... '
+  echon "\r"
+  echohl WarningMsg | call s:logn('skipped #'.printf('%03d', a:no))
+  echohl None | call s:logn(': '.(len(title) < width ? (title.' '.repeat('.', width-len(title)+1)) : strpart(title, 0, width+2)).'... ')
  echo ''
 endfunction

 function! s:show_ok()
-  echohl Title | echon "ok\n" | echohl None
+  echohl Title | call s:logn('ok') | echohl None
  echo ''
 endfunction

 function! s:show_ng(no, expect, got)
-  echohl WarningMsg | echon "ng\n" | echohl None
-  echohl ErrorMsg | echo 'failed test #'.a:no | echohl None
+  echohl WarningMsg | call s:logn('ng') | echohl None
+  echohl ErrorMsg | call s:log('failed test #'.a:no) | echohl None
  set more
-  echohl WarningMsg | echo printf('expect(%d):', len(a:expect)) | echohl None
+  echohl WarningMsg | call s:log(printf('expect(%d):', len(a:expect))) | echohl None
  echo join(split(a:expect, "\n", 1), "|\n")
-  echohl WarningMsg | echo printf('got(%d):', len(a:got)) | echohl None
-  echo join(split(a:got, "\n", 1), "|\n")
+  echohl WarningMsg | call s:log(printf('got(%d):', len(a:got))) | echohl None
+  call s:log(join(split(a:got, "\n", 1), "|\n"))
  let cs = split(a:expect, '\zs')
  for c in range(len(cs))
    if c < len(a:got)
      if a:expect[c] != a:got[c]
-        echohl WarningMsg | echo 'differ at:' | echohl None
-        echo a:expect[c :-1]
+        echohl WarningMsg | call s:log('differ at:') | echohl None
+        call s:log(a:expect[c :-1])
        break
      endif
    endif
@@ -91,6 +104,7 @@ function! s:test(...)
      let start = reltime()
      for n in range(len(tests))
        if len(index) > 0 && n != index | continue | endif
+        if has_key(tests[n], 'ignore') && tests[n].ignore | continue | endif
        let query = tests[n].query
        let options = has_key(tests[n], 'options') ? tests[n].options : {}
        let result = tests[n].result
@@ -108,6 +122,7 @@ function! s:test(...)
        if stridx(query, '$$$$') != -1
          silent! 1new
          silent! exe 'setlocal ft='.testgroup.type
+          EmmetInstall
          silent! let key = matchstr(query, '.*\$\$\$\$\zs.*\ze\$\$\$\$')
          if len(key) > 0
            exe printf('let key = "%s"', key)
@@ -154,8 +169,9 @@ function! s:test(...)
  endfor
 endfunction

-function! s:do_tests(...)
+function! s:do_tests(bang, ...)
  try
+    let s:logging = a:bang
    if exists('g:user_emmet_settings')
      let s:old_user_emmet_settings = g:user_emmet_settings
    endif
@@ -165,13 +181,22 @@ function! s:do_tests(...)
    let &more = 0
    call call('s:test', a:000)
    call s:show_done()
+    if a:bang == '!'
+      qall!
+    endif
  catch
    echohl ErrorMsg | echomsg v:exception | echohl None
+    if a:bang == '!'
+      cquit!
+    endif
  finally
    let &more=oldmore
    if exists('s:old_user_emmet_settings')
      let g:user_emmet_settings = s:old_user_emmet_settings
    endif
+    if exists('s:old_user_emmet_install_global')
+      let g:user_emmet_install_global = s:old_user_emmet_install_global
+    endif
  endtry
 endfunction

@@ -189,7 +214,7 @@ function! s:emmet_unittest_complete(arglead, cmdline, cmdpos)
  return []
 endfunction

-command! -nargs=* -complete=customlist,<SID>emmet_unittest_complete EmmetUnitTest call s:do_tests(<f-args>)
+command! -bang -nargs=* -complete=customlist,<SID>emmet_unittest_complete EmmetUnitTest call s:do_tests("<bang>", <f-args>)
 if s:sfile == expand('%:p')
  EmmetUnitTest
 endif
@@ -297,11 +322,11 @@ finish
        },
        {
          'query': "blockquote>b>i<<b",
-          'result': "<blockquote><b><i></i></b></blockquote>\n<b></b>\n",
+          'result': "<blockquote>\n\t<b><i></i></b>\n</blockquote>\n<b></b>\n",
        },
        {
          'query': "blockquote>b>i^^b",
-          'result': "<blockquote><b><i></i></b></blockquote>\n<b></b>\n",
+          'result': "<blockquote>\n\t<b><i></i></b>\n</blockquote>\n<b></b>\n",
        },
        {
          'query': "a[href=foo][class=bar]",
@@ -332,19 +357,19 @@ finish
          'result': "<table>\n\t<tr>\n\t\t<td id=\"foo\" class=\"name\"></td>\n\t\t<td></td>\n\t\t<td></td>\n\t\t<td></td>\n\t</tr>\n</table>\n",
        },
        {
-          'query': "div#header + div#footer",
+          'query': "div#header+div#footer",
          'result': "<div id=\"header\"></div>\n<div id=\"footer\"></div>\n",
        },
        {
-          'query': "#header + div#footer",
+          'query': "#header+div#footer",
          'result': "<div id=\"header\"></div>\n<div id=\"footer\"></div>\n",
        },
        {
-          'query': "#header > ul > li < p{Footer}",
+          'query': "#header>ul>li<p{Footer}",
          'result': "<div id=\"header\">\n\t<ul>\n\t\t<li></li>\n\t</ul>\n\t<p>Footer</p>\n</div>\n",
        },
        {
-          'query': "#header > ul > li ^ p{Footer}",
+          'query': "#header>ul>li^p{Footer}",
          'result': "<div id=\"header\">\n\t<ul>\n\t\t<li></li>\n\t</ul>\n\t<p>Footer</p>\n</div>\n",
        },
        {
@@ -491,6 +516,10 @@ finish
          'query': "test1\ntest2\ntest3$$$$\\<esc>ggVG\\<c-y>,input[type=input value=$#]*\\<cr>$$$$",
          'result': "<input type=\"input\" value=\"test1\">\n<input type=\"input\" value=\"test2\">\n<input type=\"input\" value=\"test3\">",
        },
+        {
+          'query': "test1\ntest2\ntest3$$$$\\<esc>ggVG\\<c-y>,div[id=$#]*\\<cr>$$$$",
+          'result': "<div id=\"test1\"></div>\n<div id=\"test2\"></div>\n<div id=\"test3\"></div>",
+        },
        {
          'query': "div#id-$*5>div#id2-$",
          'result': "<div id=\"id-1\">\n\t<div id=\"id2-1\"></div>\n</div>\n<div id=\"id-2\">\n\t<div id=\"id2-2\"></div>\n</div>\n<div id=\"id-3\">\n\t<div id=\"id2-3\"></div>\n</div>\n<div id=\"id-4\">\n\t<div id=\"id2-4\"></div>\n</div>\n<div id=\"id-5\">\n\t<div id=\"id2-5\"></div>\n</div>\n",
@@ -531,6 +560,14 @@ finish
          'query': "<small>a$$$$</small>",
          'result': "<small><a href=\"\"></a></small>",
        },
+        {
+          'query': "form.search-form._wide>input.-query-string+input:s.-btn_large|bem",
+          'result': "<form class=\"search-form search-form_wide\" action=\"\">\n\t<input class=\"search-form__query-string\" type=\"\">\n\t<input class=\"search-form__btn search-form__btn_large\" type=\"submit\" value=\"\">\n</form>\n",
+        },
+        {
+          'query': "form>fieldset>legend+(label>input[type=\"checkbox\"])*3",
+          'result': "<form action=\"\">\n\t<fieldset>\n\t\t<legend></legend>\n\t\t<label for=\"\"><input type=\"checkbox\"></label>\n\t\t<label for=\"\"><input type=\"checkbox\"></label>\n\t\t<label for=\"\"><input type=\"checkbox\"></label>\n\t</fieldset>\n</form>\n",
+        },
      ],
    },
    {
@@ -538,12 +575,20 @@ finish
      'tests': [
        {
          'query': "<div>\n\t<span>$$$$\\<c-y>j$$$$</span>\n</div>",
-          'result': "<div>\n\t<span/>\n</div>",
+          'result': "<div>\n\t<span />\n</div>",
        },
        {
          'query': "<div>\n\t<span$$$$\\<c-y>j$$$$/>\n</div>",
          'result': "<div>\n\t<span></span>\n</div>",
        },
+        {
+          'query': "<div onclick=\"javascript:console.log(Date.now() % 1000 > 500)\">test$$$$\\<c-y>j$$$$/>\n</div>",
+          'result': "<div onclick=\"javascript:console.log(Date.now() % 1000 > 500)\" />",
+        },
+        {
+          'query': "<div>\n\t<some-tag$$$$\\<c-y>j$$$$/>\n</div>",
+          'result': "<div>\n\t<some-tag></some-tag>\n</div>",
+        },
      ],
    },
    {
@@ -636,6 +681,19 @@ finish
          'query': "<h$$$$\\<c-y>u.global\\<cr>$$$$3></h3>",
          'result': "<h3 class=\"global\"></h3>",
        },
+        {
+          'query': "<button$$$$\\<c-y>u.btn\\<cr>$$$$ disabled></button>",
+          'result': "<button class=\"btn\" disabled></button>",
+        },
+      ],
+    },
+    {
+      'name': 'base value',
+      'tests': [
+        {
+          'query': "ul>li#id$@0*3",
+          'result': "<ul>\n\t<li id=\"id0\"></li>\n\t<li id=\"id1\"></li>\n\t<li id=\"id2\"></li>\n</ul>\n",
+        },
      ],
    },
  ],
@@ -684,7 +742,7 @@ finish
        },
        {
          'query': "{-bdrs20$$$$}",
-          'result': "{-webkit-border-radius: 20px;\n-moz-border-radius: 20px;\nborder-radius: 20px;}",
+          'result': "{-webkit-border-radius: 20px;\n-moz-border-radius: 20px;\n-o-border-radius: 20px;\n-ms-border-radius: 20px;\nborder-radius: 20px;}",
        },
        {
          'query': "{lg(top,#fff,#000)$$$$}",
@@ -734,6 +792,30 @@ finish
          'query': "{dn$$$$}",
          'result': "{display: none;}",
        },
+        {
+          'query': "{p10%$$$$}",
+          'result': "{padding: 10%;}",
+        },
+        {
+          'query': "{p10p$$$$}",
+          'result': "{padding: 10%;}",
+        },
+        {
+          'query': "{p10e$$$$}",
+          'result': "{padding: 10em;}",
+        },
+        {
+          'query': "{p10em$$$$}",
+          'result': "{padding: 10em;}",
+        },
+        {
+          'query': "{p10re$$$$}",
+          'result': "{padding: 10rem;}",
+        },
+        {
+          'query': "{p10rem$$$$}",
+          'result': "{padding: 10rem;}",
+        },
      ],
    },
  ],
@@ -767,7 +849,7 @@ finish
      ],
    },
    {
-      'name': 'expand abbreviation',
+      'name': 'split join',
      'tests': [
        {
          'query': "%a foo\n  bar$$$$\\<c-y>j$$$$",
@@ -948,7 +1030,7 @@ finish
        },
        {
          'query': "{-bdrs20$$$$}",
-          'result': "{-webkit-border-radius: 20px;\n-moz-border-radius: 20px;\nborder-radius: 20px;}",
+          'result': "{-webkit-border-radius: 20px;\n-moz-border-radius: 20px;\n-o-border-radius: 20px;\n-ms-border-radius: 20px;\nborder-radius: 20px;}",
        },
        {
          'query': "{lg(top,#fff,#000)$$$$}",
@@ -982,5 +1064,67 @@ finish
    },
  ],
  'dummy': "}}}"},
+{ 'test-jade': "{{{",
+  'type': 'jade',
+  'categories': [
+    {
+      'name': 'expand abbreviation',
+      'tests': [
+        {
+          'query': "!!!$$$$\\<c-y>,$$$$",
+          'result': "doctype html\n\n",
+        },
+        {
+          'query': "span.my-span$$$$\\<c-y>,$$$$",
+          'result': "span.my-span",
+        },
+      ],
+    },
+  ],
+  'dummy': "}}}"},
+{ 'test-pug': "{{{",
+  'type': 'pug',
+  'categories': [
+    {
+      'name': 'expand abbreviation',
+      'tests': [
+        {
+          'query': "!!!$$$$\\<c-y>,$$$$",
+          'result': "doctype html\n\n",
+        },
+        {
+          'query': "span.my-span$$$$\\<c-y>,$$$$",
+          'result': "span.my-span",
+        },
+        {
+          'query': "input$$$$\\<c-y>,text$$$$",
+          'result': "input(type=\"text\")",
+        },
+      ],
+    },
+  ],
+  'dummy': "}}}"},
+{ 'test-jsx': "{{{",
+  'type': 'javascript.jsx',
+  'categories': [
+    {
+      'name': 'expand abbreviation',
+      'tests': [
+        {
+          'query': "img$$$$\\<c-y>,$$$$",
+          'result': "<img src=\"\" alt=\"\" />",
+        },
+        {
+          'query': "span.my-span$$$$\\<c-y>,$$$$",
+          'result': "<span className=\"my-span\"></span>",
+        },
+        {
+          'query': "function() { return span.my-span$$$$\\<c-y>,$$$$; }",
+          'result': "function() { return <span className=\"my-span\"></span>; }",
+        },
+      ],
+    },
+  ],
+  'dummy': "}}}"},
 ]
 " vim:set et fdm=marker: