Vue & Gravatar

Using Vue.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.js"></script>
<script src="http://www.myersdaily.org/joseph/javascript/md5.js"></script>
<script src="https://www.myersdaily.org/joseph/javascript/md5.js"></script>
<div>
  <input type="text" v-model="email" debounce="1000" />
  <img src="{{ gravatarImage }}" alt="{{ name }}" />
</div>

JavaScript

// Vue.use(VueResource);

new Vue({
	el: 'body',
  data: {
  	email: null,
  },
  computed: {
  	gravatarImage: function() {
    	return 'https://www.gravatar.com/avatar/' + md5(this.email.toLowerCase().trim());
    }
  }
});