Add multi message capability to Qr view for market info

ui/app/actions.js

@@ -692,13 +692,14 @@ function shapeShiftSubview (network) {
   }
 }
 
-function coinShiftRquest (data) {
+function coinShiftRquest (data, marketData) {
   return (dispatch) => {
     dispatch(actions.showLoadingIndication())
     shapeShiftRequest('shift', { method: 'POST', data}, (response) => {
       if (response.error) return dispatch(actions.showWarning(response.error))
-      var message = `Deposit your ${response.depositType} to the address bellow:`
-      dispatch(actions.getQr(response.deposit, '125x125', message))
+      var message = `
+        Deposit your ${response.depositType} to the address bellow:`
+      dispatch(actions.getQr(response.deposit, '125x125', [message].concat(marketData)))
     })
   }
 }

ui/app/components/qr-code.js

@@ -29,7 +29,7 @@ QrCodeView.prototype.render = function () {
       alignItems: 'center',
     },
   }, [
-    h('h3', Qr.message),
+    Array.isArray(Qr.message) ? h('.message-container', this.renderMultiMessage()) : h('h3', Qr.message),
     h('#qr-container.flex-column', {
       key: 'qr',
       style: {
@@ -48,3 +48,9 @@ QrCodeView.prototype.render = function () {
     ]),
   ])
 }
+
+QrCodeView.prototype.renderMultiMessage = function () {
+  var Qr = this.props.Qr
+  var multiMessage = Qr.message.map((message) => h('.qr-message', message))
+  return multiMessage
+}

ui/app/components/shapeshift-form.js

@@ -194,6 +194,7 @@ ShapeshiftForm.prototype.renderMain = function () {
 }
 
 ShapeshiftForm.prototype.shift = function () {
+  var props = this.props
   var withdrawal = this.props.buyView.buyAddress
   var returnAddress = document.getElementById('fromCoinAddress').value
   var pair = this.props.buyView.formView.marketinfo.pair
@@ -202,9 +203,12 @@ ShapeshiftForm.prototype.shift = function () {
     'pair': pair,
     'returnAddress': returnAddress,
   }
-
+  var message = [
+    `Deposit Limit: ${props.buyView.formView.marketinfo.limit}`,
+    `Deposit Minimum:${props.buyView.formView.marketinfo.minimum}`,
+  ]
   if (isValidAddress(withdrawal)) {
-    this.props.dispatch(actions.coinShiftRquest(data))
+    this.props.dispatch(actions.coinShiftRquest(data, message))
   }
 }
 

ui/app/css/index.css

@@ -582,3 +582,13 @@ input.large-input {
   font-family: "Montserrat Light";
   margin-left: 5px;
 }
+
+.qr-message {
+  font-size: 12px;
+  color: #F7861C;
+}
+
+div.message-container > div:first-child {
+  font-size: 15px;
+  color: #4D4D4D;
+}