d_validator.twig (8623B)
1 <div id="d_validator" class="container-fluid"> 2 <style> 3 .claim-purchase .small { 4 color: #000; 5 } 6 7 #remind_later { 8 font-size: 14px; 9 text-align: right; 10 float: right; 11 margin-right: 25px; 12 color: rgb(49, 112, 143); 13 } 14 15 #remind_later > .fa { 16 color: #f0b840; 17 font-size: 16px; 18 margin-left: 10px; 19 } 20 21 .wrapper-info { 22 width: 100%; 23 padding: 20px 0 0 0; 24 display: flex; 25 align-items: center; 26 } 27 28 .image-lock { 29 display: flex; 30 align-items: center; 31 justify-content: center; 32 width: 80px; 33 height: 72px; 34 } 35 36 .image-lock .fa { 37 font-size: 50px; 38 } 39 40 .claim-purchase { 41 display: flex; 42 align-items: flex-start; 43 justify-content: space-between; 44 } 45 46 .table thead td span[data-toggle="tooltip"]:after, label.control-label span:after { 47 color: #f0b840; 48 font-size: 16px; 49 margin-left: 10px; 50 } 51 52 #d_validator_submit { 53 width: 100%; 54 height: 42px; 55 margin-top: 27px; 56 box-shadow: none; 57 background: #4fb5e7; 58 border: 2px solid #3aa5da; 59 color: #fff; 60 font-size: 15px; 61 border-radius: 4px; 62 } 63 64 .wrapper-response { 65 color: #e3503e; 66 font-size: 14px; 67 } 68 69 @media all and (max-width: 991px) { 70 .claim-purchase { 71 display: block; 72 } 73 74 #d_validator_submit { 75 margin: 0; 76 } 77 } 78 </style> 79 80 <div class="alert alert-info"> 81 <button type="button" class="close" data-dismiss="alert">×</button> 82 83 <a id="remind_later" href="{{ action_remind }}"><i class="fa fa-bell-slash"></i> Remind me later</a> 84 <div class="wrapper-info"> 85 <div class="image-lock"> 86 <i class="fa fa-lock"></i> 87 </div> 88 <div class="description-problem"> 89 <h4>{{ text }}</h4> 90 <p>{{ help }}</p> 91 </div> 92 </div> 93 94 <div class="wrapper-form"> 95 <form class="claim-purchase"> 96 <div class="col-md-3"> 97 <div class="form-group"> 98 <label class="control-label" for="market"> 99 <span data-toggle="tooltip" title="" 100 data-original-title="Select the marketplace where the extension was purchased.">Marketplace</span> 101 </label> 102 103 <select name="market" id="d_validation_market" class="form-control input-lg" 104 placeholder="Email"> 105 <option value="opencart">Opencart</option> 106 <option value="isenselabs">IsenseLabs</option> 107 <option value="dreamvention">Dreamvention.ee</option> 108 <option value="shopunity">Shopunity</option> 109 </select> 110 </div> 111 </div> 112 <div class="col-md-3"> 113 <div class="form-group"> 114 <label class="control-label" for="email"> 115 <span data-toggle="tooltip" title="" data-original-title="Opencart/IsenseLabs/Dreamvention or other marketplace account Email where the extension was purchased (ex. 116 joe@gmail.com).">Email</span> 117 </label> 118 119 <input name="email" class="form-control input-lg" id="d_validation_email" 120 placeholder="Email"> 121 </div> 122 </div> 123 <div class="col-md-3"> 124 <div class="form-group"> 125 <label class="control-label" for="order_id"> 126 <span data-toggle="tooltip" title="" data-original-title="Opencart/IsenseLabs/Dreamvention or other marketplace Purchase Order Id (ex. 127 9876554)">Order ID</span> 128 </label> 129 130 <input name="order_id" class="form-control input-lg" id="d_validation_order_id" 131 placeholder="Order id"> 132 </div> 133 </div> 134 135 <input type="hidden" name="codename" value="{{ codename }}"> 136 137 <div class="col-md-3"> 138 <div class="form-group"> 139 <button id="d_validator_submit" class="btn btn-primary">Submit</button> 140 </div> 141 </div> 142 </form> 143 144 <div class="col-md-12"> 145 <div class="wrapper-response"></div> 146 </div> 147 </div> 148 </div> 149 150 <div class="clearfix"></div> 151 </div> 152 153 <script> 154 function cleartErrors() { 155 $('.wrapper-response').text(''); 156 $('.wrapper-form').find('div.alert, div.text-danger').remove(); 157 $('.wrapper-form').find('div.form-group').removeClass('has-error'); 158 } 159 160 function showAlertLicence(selector, json) { 161 if (json['error']) { 162 for (i in json['error']) { 163 var element = $('#d_validation_' + i); 164 console.log(element); 165 166 $(element).after('<div class="text-danger">' + json['error'][i] + '</div>'); 167 $(element).parent().addClass('has-error'); 168 } 169 } 170 } 171 172 $(document).ready(function () { 173 $(document).on('change', '#d_validation_market', function (event) { 174 var selected = $( "#d_validation_market option:selected" ).text(); 175 176 if (selected == 'Shopunity'){ 177 $('label[for="order_id"] span').text('Invoice number'); 178 $(".claim-purchase").append('<input type="hidden" class="validateShopunityInput" name="validateShopunity" value="" />'); 179 }else{ 180 $('label[for="order_id"] span').text('Order ID'); 181 $(".validateShopunityInput").remove(); 182 } 183 }); 184 185 $(document).on('click', '#d_validator_submit', function (event) { 186 event.preventDefault(); 187 cleartErrors(); 188 189 $.ajax({ 190 url: '{{ action }}', 191 method: 'post', 192 dataType: 'json', 193 data: $('.claim-purchase').serialize(), 194 beforeSend: function () { 195 $('#content').fadeTo('fast', 0.5); 196 }, 197 complete: function () { 198 $('#content').fadeTo('fast', 1); 199 }, 200 success: function (json) { 201 if (json['error']) { 202 showAlertLicence(".claim-purchase", json); 203 } 204 if (json['warning']) { 205 $('.wrapper-response').text(json['warning']); 206 } 207 208 if (json['success']) { 209 $('#d_validator').prepend('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 210 211 setTimeout(function () { 212 $('#d_validator').fadeOut(300, function () { 213 $(this).remove(); 214 }); 215 }, 5000); 216 } 217 } 218 }); 219 }); 220 221 $(document).on('click', '#remind_later', function (event) { 222 event.preventDefault(); 223 224 $.ajax({ 225 url: $(this).attr("href"), 226 method: 'post', 227 dataType: 'json', 228 data: {module: "{{ codename }}"}, 229 beforeSend: function () { 230 $('#content').fadeTo('fast', 0.5); 231 }, 232 complete: function () { 233 $('#content').fadeTo('fast', 1); 234 }, 235 success: function (json) { 236 if (json['success']) { 237 $('#d_validator').fadeOut(300, function () { 238 $(this).remove(); 239 }); 240 console.log("success"); 241 } 242 } 243 }); 244 }); 245 }); 246 </script>