diff --git a/Capfile b/Capfile
index 638bf1d6..62b53d60 100644
--- a/Capfile
+++ b/Capfile
@@ -22,7 +22,7 @@ require 'capistrano/rails/assets'
 # require 'capistrano/rails/migrations'
 require 'capistrano/puma'
 require 'capistrano/puma/monit'
-#require "airbrussh/capistrano"
+require "airbrussh/capistrano"
 
 # Loads custom tasks from `lib/capistrano/tasks' if you have any defined.
 Dir.glob('lib/capistrano/tasks/*.rake').each { |r| import r }
diff --git a/Gemfile.lock b/Gemfile.lock
index 3b452a34..b0d9e286 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -1,6 +1,6 @@
 GIT
   remote: git://github.com/bterkuile/cmtool.git
-  revision: 6b6a7405bab49a798e38af5e74d52a38de519039
+  revision: 7dc12ca3e8c240261740dd7a59c1e381ffc1c1b0
   specs:
     cmtool (2.0.0)
       ace-rails-ap
@@ -113,7 +113,7 @@ GEM
     bcrypt (3.1.10)
     binding_of_caller (0.7.2)
       debug_inspector (>= 0.0.1)
-    bourbon (4.2.4)
+    bourbon (4.2.5)
       sass (~> 3.4)
       thor (~> 0.19)
     builder (3.2.2)
@@ -274,7 +274,7 @@ GEM
     mimemagic (0.3.0)
     mini_magick (4.3.3)
     mini_portile (0.6.2)
-    minitest (5.8.0)
+    minitest (5.8.1)
     multi_json (1.11.2)
     multi_xml (0.5.5)
     multipart-post (2.0.0)
diff --git a/app/assets/javascripts/admin/application.js.coffee b/app/assets/javascripts/admin/application.js.coffee
index 53ebda4a..fd1914df 100644
--- a/app/assets/javascripts/admin/application.js.coffee
+++ b/app/assets/javascripts/admin/application.js.coffee
@@ -6,6 +6,7 @@
 #= require ace/ace
 #= require ace/theme-monokai
 #= require ace/mode-coffee
+#= require ace/mode-xml
 #= require_tree .
 #= require_self
 #$ ->
diff --git a/app/assets/javascripts/admin/components/_format_xml.js.coffee b/app/assets/javascripts/admin/components/_format_xml.js.coffee
new file mode 100644
index 00000000..d7bbd7a6
--- /dev/null
+++ b/app/assets/javascripts/admin/components/_format_xml.js.coffee
@@ -0,0 +1,33 @@
+window.formatXml = (xml) ->
+  formatted = ''
+  reg = /(>)(<)(\/*)/g
+  xml = xml.replace(reg, '$1\r\n$2$3')
+  pad = 0
+  jQuery.each xml.split('\r\n'), (index, node) ->
+    indent = 0
+    if node.match(/.+<\/\w[^>]*>$/)
+      indent = 0
+    else if node.match(/^<\/\w/)
+      if pad != 0
+        pad -= 1
+    else if node.match(/^<\w[^>]*[^\/]>.*$/)
+      indent = 1
+    else
+      indent = 0
+    padding = ''
+    i = 0
+    while i < pad
+      padding += '  '
+      i++
+    formatted += padding + node + '\r\n'
+    pad += indent
+    return
+  formatted
+window.squashXml = (xml)->
+  result = xml
+    .trim()
+    .replace(/^\s+/g, '')
+    .replace(/\s+$/g, '')
+    .replace(/>(?:\r\n|\r|\n)/g, '')
+    .replace(/(?:\r\n|\r|\n)/g, ' ')
+  result
diff --git a/app/assets/javascripts/admin/svg_element/svg_element.js.coffee b/app/assets/javascripts/admin/svg_element/svg_element.js.coffee
index 3d287e0d..4dc02bac 100644
--- a/app/assets/javascripts/admin/svg_element/svg_element.js.coffee
+++ b/app/assets/javascripts/admin/svg_element/svg_element.js.coffee
@@ -1,43 +1,76 @@
 class SvgElementClass
-  setup: (container)->
-    if container
-      @text_field = container.find('.snap-code-editor')
-    else
-      @text_field = $('.snap-code-editor')
-    @text_field.change => @compileSource()
-    target = @text_field.data('target')
-    @target = target
+  setup: (context=$(document))->
+    #@setupSnapCode(context)
+    @svg_source = context.find('#svg_element_svg')
+    @preview_target = context.find('#svg-preview').css('border', '1px solid black')
+    @original_svg = @svg_source.val()
     container = @
-    ace_div = $('<div></div>').attr('id', 'ace-div').html @text_field.val()
+    @input_type_select = context.find('#svg_element_input_type').change ->
+      switch $(@).val()
+        when 'snap_code'
+          container.setupSnapCode(context)
+        else
+          container.setupSvgEdit(context)
+    .change()
+  setupSvgEdit: (context)->
+    @svg_source.val @original_svg #reset svg value
+    $('#snap-code-ace-div').remove()
+    container = @
+    ace_div = $('<div></div>').attr('id', 'raw-svg-ace-div')
     ace_div.css
       width: '100%'
       height: '500px'
-    @text_field.after(ace_div)
+    @svg_source.after(ace_div)
+    @editor = ace.edit('raw-svg-ace-div')
+    @editor.setTheme 'ace/theme/monokai'
+    @editor.getSession().setMode 'ace/mode/xml'
+    @editor.setValue formatXml(@svg_source.val())
+    @editor.getSession().on 'change', (e)=>
+      result = @editor.getValue()
+      @preview_target.html result
+      @svg_source.val squashXml(result)
+    #  @svg_source.val(@editor.getValue()).change()
+    #@svg_source.hide()
+    window.editor = @editor
+
+  setupSnapCode: (context)->
+    @snap_code_source = context.find('.snap-code-editor')
+    @snap_code_source.change => @compileSource()
+    #preview_target = @snap_code_source.data('previewTarget')
+    #@preview_target = preview_target
+    container = @
+    ace_div = $('<div></div>').attr('id', 'snap-code-ace-div').html @snap_code_source.val()
+    ace_div.css
+      width: '100%'
+      height: '500px'
+    @snap_code_source.after(ace_div)
 
     #ACE
-    @editor = ace.edit('ace-div')
+    @editor = ace.edit('snap-code-ace-div')
     @editor.setTheme 'ace/theme/monokai'
     @editor.getSession().setMode 'ace/mode/coffee'
     @editor.getSession().on 'change', (e)=>
-      @text_field.val(@editor.getValue()).change()
-    @text_field.hide()
+      @snap_code_source.val(@editor.getValue()).change()
+    @snap_code_source.hide()
 
     @svg_code_field = $('#svg_element_svg')
-    $(target).on "DOMSubtreeModified", =>
-      @svg_code_field.val $(target).html()
+    @preview_target.on "DOMSubtreeModified", => # In image editing in debug mode????
+      @svg_code_field.val @preview_target.html()
 
     @box_width = $('#svg_element_box_width')
     @box_height = $('#svg_element_box_height')
     @dpm = $('#svg_element_dpm')
 
-    @box_width.change(->
-      $(target).attr 'width', $(@).val()
+    @box_width.change ->
+      container.preview_target.attr 'width', $(@).val()
       container.compileSource()
-    ).change()
-    @box_height.change(->
-      $(target).attr 'height', $(@).val()
+    .change()
+
+    @box_height.change ->
+      container.preview_target.attr 'height', $(@).val()
       container.compileSource()
-    ).change()
+    .change()
+
     @dpm.change(->
       return unless dpm = $(@).val()
       if pheight = container.box_height.val()
@@ -49,11 +82,11 @@ class SvgElementClass
         $('.box_width .attribute-info').html "#{width}&nbsp;<i>m</i>"
 
     ).change()
-    $(target).css('border', '1px solid black')
     @compileSource()
   compileSource: ->
-    return unless source = @text_field.val()
-    results = $(@text_field.data('preview'))
+    return unless source = @snap_code_source.val()
+    #results = $(@snap_code_source.data('preview'))
+    results = @preview_target
     window.compiledJS = ''
     try
       window.compiledJS = CoffeeScript.compile source, bare: on
@@ -63,11 +96,11 @@ class SvgElementClass
       else
         results.text(window.compiledJS)
       results.removeClass 'error'
-      window.evaluator = new SnapDsl(window.compiledJS, target: @target, width: @box_width.val(), height: @box_height.val())
+      window.evaluator = new SnapDsl(window.compiledJS, target: @preview_target, width: @box_width.val(), height: @box_height.val())
       evaluator.result()
       $('.minibutton.run').removeClass 'error'
     catch {location, message}
-      if location?
+      if location
         message = "Error on line #{location.first_line + 1}: #{message}"
       results.text(message).addClass 'error'
       $('.minibutton.run').addClass 'error'
@@ -75,12 +108,12 @@ class SnapDsl
   constructor: (code, options = {})->
     @js_code = code
     @options = options
-    @t = $(options.target)
+    @t = options.target
     @width = options.width
     @height = options.height
     $(options.target).html('')
   result: ->
-    @snap = Snap(@options.target)
+    @snap = Snap(@t[0])
     s = @snap
     try
       eval @js_code
diff --git a/app/assets/javascripts/supplier/app/components/qr-codes-link.js.coffee b/app/assets/javascripts/supplier/app/components/qr-codes-link.js.coffee
index 7a6a7ab0..c134edf5 100644
--- a/app/assets/javascripts/supplier/app/components/qr-codes-link.js.coffee
+++ b/app/assets/javascripts/supplier/app/components/qr-codes-link.js.coffee
@@ -5,4 +5,7 @@ App.QrCodesLinkComponent = Ember.Component.extend
   attributeBindings: ['href', 'target']
   href: Ember.computed 'section.id', 'table.id', ->
     Routes.qr_codes_suppliers_tables_path(section_id: @get('section.id'), table_id: @get('table.id'))
+  click: ->
+    # Somehow this is needed for within the actions menu
+    @$().click()
 
diff --git a/app/assets/javascripts/supplier/app/components/section/element.js.coffee b/app/assets/javascripts/supplier/app/components/section/element.js.coffee
index 2356b6ab..1c755575 100644
--- a/app/assets/javascripts/supplier/app/components/section/element.js.coffee
+++ b/app/assets/javascripts/supplier/app/components/section/element.js.coffee
@@ -3,12 +3,9 @@ App.SectionElementComponent = Ember.Component.extend DragNDrop.Draggable,
   classNames: ['section-element-container']
   attributeBindings: ['style']
   show_handles: false
-  classNameBindings: [
-    'uniqueClass'
-  ]
-  uniqueClass: (->
-    "section-element-#{@get('section_element.id')}"
-  ).property('section_element.id')
+  spinning: false
+  classNameBindings: ['uniqueClass', 'spinning:spin-rotate']
+  uniqueClass: Ember.computed 'section_element.id', -> "section-element-#{@get('section_element.id')}"
   draggable: Ember.computed.alias 'section.editmode'
   offsetX: (->
     (@get('dpm') || 0) * (@get('section_element.position_x') || 0)
@@ -30,7 +27,12 @@ App.SectionElementComponent = Ember.Component.extend DragNDrop.Draggable,
     @get('section_element').setProperties
       position_x: position.left / dpm
       position_y: position.top / dpm
-  click: -> @toggleProperty('show_handles') if @get('section.editmode')
+  click: ->
+    if @get('section.editmode')
+      @toggleProperty('show_handles')
+    else
+      @set 'spinning', true
+      Ember.run.later (=> @set('spinning', false)), 2000
   showHandles: Ember.computed.and 'show_handles', 'section.editmode'
   actions:
     rotateLeft: ->
diff --git a/app/assets/stylesheets/admin/_foundation_and_overrides.sass b/app/assets/stylesheets/admin/_foundation_and_overrides.sass
index f50c00d8..26c09ae8 100644
--- a/app/assets/stylesheets/admin/_foundation_and_overrides.sass
+++ b/app/assets/stylesheets/admin/_foundation_and_overrides.sass
@@ -1257,4 +1257,3 @@ $button-edit-color: #ffa
 $button-destroy-color: #faa
 $button-submit-color: $primary-color
 $button-cancel-color: $secondary-color
-
diff --git a/app/assets/stylesheets/supplier/foundation1/components/_animations.sass b/app/assets/stylesheets/supplier/foundation1/components/_animations.sass
new file mode 100644
index 00000000..859b3212
--- /dev/null
+++ b/app/assets/stylesheets/supplier/foundation1/components/_animations.sass
@@ -0,0 +1,7 @@
+.spin-rotate
+  +animation(spinRotate 2s)
++keyframes(spinRotate)
+  from
+    transform: rotate(0deg)
+  to
+    transform: rotate(360deg)
diff --git a/app/models/svg_element.rb b/app/models/svg_element.rb
index 5816fde9..37cf8e23 100644
--- a/app/models/svg_element.rb
+++ b/app/models/svg_element.rb
@@ -4,6 +4,7 @@ class SvgElement
   include SvgElementDefaults
   property :snap_code
   property :active, type: :boolean, default: true
+  property :input_type # %w[raw snap_code]
   has_many :section_elements
 
   def self.active
diff --git a/app/views/admin/svg_elements/_form.html.slim b/app/views/admin/svg_elements/_form.html.slim
index 2101a234..a7c77297 100644
--- a/app/views/admin/svg_elements/_form.html.slim
+++ b/app/views/admin/svg_elements/_form.html.slim
@@ -8,6 +8,9 @@
   = f.row :active
     .form-label= f.label :active
     .form-field= f.check_box :active
+  = f.row :input_type
+    .form-label= f.label :input_type
+    .form-field= f.select :input_type, %w[raw snap_code]
   = f.row :dpm
     .small-3.columns= f.label :dpm
     .small-3.columns= f.number_field :dpm, step: :any
@@ -25,7 +28,7 @@
     .form-field.full= f.text_area :svg
   = f.row :snap_code
     .form-label= f.label :snap_code
-  .row: .small-12.columns= f.text_area :snap_code, rows: 20, class: ['snap-code-editor'], data: {target: '#svg-preview', preview: '#javascript-preview'}
+  .row: .small-12.columns= f.text_area :snap_code, rows: 20, class: ['snap-code-editor'], data: {preview_target: '#svg-preview', preview: '#javascript-preview'}
   .row: .small-12.columns: pre#javascript-preview.hide
   .form-actions
     = f.submit nil, class: 'form-submit-button'
diff --git a/app/views/admin/svg_elements/edit.html.slim b/app/views/admin/svg_elements/edit.html.slim
index 041a9f37..2c4d597f 100644
--- a/app/views/admin/svg_elements/edit.html.slim
+++ b/app/views/admin/svg_elements/edit.html.slim
@@ -1,3 +1,6 @@
 - model_class = SvgElement
 - title :edit, model_class
 = render 'form'
+- content_for :page_links do
+  ul
+    li= link_to link_to_destroy_content(@svg_element), [:admin, @svg_element], method: :delete, confirm: are_you_sure(@svg_element), class: 'record-destroy-button'
diff --git a/app/views/admin/svg_elements/index.html.slim b/app/views/admin/svg_elements/index.html.slim
index a1b0cd0b..ed3b4e05 100644
--- a/app/views/admin/svg_elements/index.html.slim
+++ b/app/views/admin/svg_elements/index.html.slim
@@ -9,11 +9,8 @@
     tbody
       - @svg_elements.each do |svg_element|
         tr
-          td= link_to svg_element.name, [:admin, svg_element]
-          td
-            = link_to t('helpers.links.edit'), [:edit, :admin, svg_element], class: 'table-edit-button'
-            '
-            = link_to t("helpers.links.destroy"), [:admin, svg_element], method: :delete, data: {confirm: are_you_sure? }, class: 'table-destroy-button'
+          td= link_to svg_element.name, [:edit, :admin, svg_element]
+          = edit_td [:admin, svg_element]
 - else
   = no_content_given model_class
 /= link_to t("helpers.links.new"), new_admin_svg_element_path, class: 'record-new-button'
diff --git a/config/deploy.rb b/config/deploy.rb
index 16837f9f..3acec8c0 100644
--- a/config/deploy.rb
+++ b/config/deploy.rb
@@ -16,6 +16,7 @@ set :deploy_via, :remote_cache
 set :branch, :master
 set :user, 'root'
 set :deploy_to, '/var/www/mozo.bar'
+set :bundle_without, %w[development test assets].join(' ')
 # Default value for :scm is :git
 # set :scm, :git
 
@@ -105,7 +106,7 @@ namespace :deploy do
           #end
         #end
         rsync_host = host
-        run_locally { execute "rsync -av --delete ./public/assets/ #{fetch(:user)}@#{rsync_host}:#{shared_path}/public/assets/" }
+        run_locally { execute "rsync -av --delete --ignore-times ./public/assets/ #{fetch(:user)}@#{rsync_host}:#{shared_path}/public/assets/" }
         #run_locally { execute "rsync -av ./public/assets/ #{fetch(:user)}@#{rsync_host}:#{shared_path}/public/assets/" }
         execute :chown, "-R www-data:www-data", shared_path.join('public/assets/')
 
diff --git a/config/user_locales/en.yml b/config/user_locales/en.yml
index df123838..8382798a 100644
--- a/config/user_locales/en.yml
+++ b/config/user_locales/en.yml
@@ -107,6 +107,7 @@ en:
     reload_application: Reload application
   about:
     title: About Mozo
+    version: Version
     body: |
       Mozo is an app that allows you to simply order products using your phone.<br>
       The process is as follows:
diff --git a/config/user_locales/nl.yml b/config/user_locales/nl.yml
index 1eae0bc9..9cf790c7 100644
--- a/config/user_locales/nl.yml
+++ b/config/user_locales/nl.yml
@@ -107,6 +107,7 @@ nl:
     reload_application: Applicatie herstarten
   about:
     title: Over Mozo
+    version: Versie
     body: |
       Mozo is een app waarme je producten kan bestellen met je telefoon.<br>
       Het proces is als volgt: