[05/12] incubator-weex git commit: * [html5] support image.save method.

[ta...@apache.org]

* [html5] support image.save method.


Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/2d62abd0
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/2d62abd0
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/2d62abd0

Branch: refs/heads/0.16-dev
Commit: 2d62abd0789078b9dc2f75eb5cccdeb5ee63b6f5
Parents: c45b53c
Author: MrRaindrop <te...@gmail.com>
Authored: Fri Aug 4 16:40:07 2017 +0800
Committer: MrRaindrop <te...@gmail.com>
Committed: Fri Aug 4 16:40:07 2017 +0800

----------------------------------------------------------------------
 html5/render/vue/components/image.js | 58 ++++++++++++++++++++++++++++---
 1 file changed, 53 insertions(+), 5 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/2d62abd0/html5/render/vue/components/image.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/components/image.js b/html5/render/vue/components/image.js
index d1fe664..754725b 100644
--- a/html5/render/vue/components/image.js
+++ b/html5/render/vue/components/image.js
@@ -19,6 +19,8 @@
 
 let extractComponentStyle, createEventMap, extend
 
+const IMG_NAME_BITS = 15
+
 const _css = `
 .weex-image, .weex-img {
   background-repeat: no-repeat;
@@ -52,6 +54,51 @@ function preProcessSrc (context, url, mergedStyle) {
   }) || url
 }
 
+function download (url, callback) {
+  function success () {
+    callback && callback({
+      success: true
+    })
+  }
+  function fail (err) {
+    callback && callback({
+      success: false,
+      errorDesc: err + ''
+    })
+  }
+  try {
+    let isDataUrl = false
+    let parts
+    let name
+    if (url.match(/data:image\/[^;]+;base64,/)) {
+      isDataUrl = true
+      parts = url.split(',')
+    }
+    if (!isDataUrl) {
+      name = url
+        .replace(/\?[^?]+/, '')
+        .replace(/#[^#]+/, '')
+        .match(/([^/]+)$/)
+    }
+    else {
+      name = parts[1].substr(0, IMG_NAME_BITS)
+    }
+    const aEl = document.createElement('a')
+    aEl.href = url
+    /**
+     * Not all browser support this 'download' attribute. In these browsers it'll jump
+     * to the photo url page and user have to longpress the photo to save it.
+     */
+    aEl.download = name
+    const clickEvt = new Event('click', { bubbles: false })
+    aEl.dispatchEvent(clickEvt)
+    success()
+  }
+  catch (err) {
+    fail(err)
+  }
+}
+
 const image = {
   name: 'weex-image',
   props: {
@@ -71,12 +118,13 @@ const image = {
     this._fireLazyload()
   },
 
+  methods: {
+    save (callback) {
+      download(this.src, callback)
+    }
+  },
+
   render (createElement) {
-    /* istanbul ignore next */
-    // if (process.env.NODE_ENV === 'development') {
-    //   validateStyles('image', this.$vnode.data && this.$vnode.data.staticStyle)
-    // }
-    // const style = this._normalizeInlineStyles(this.$vnode.data)
     const resizeStyle = getResizeStyle(this)
     const style = extractComponentStyle(this)
     return createElement('figure', {