marketplace_info.twig (20990B)
1 {{ header }}{{ column_left }} 2 <div id="content"> 3 <div class="page-header"> 4 <div class="container-fluid"> 5 <div class="pull-right">{% if not error_signature %} 6 <button type="button" id="button-opencart" data-toggle="tooltip" title="{{ button_opencart }}" class="btn btn-info"><i class="fa fa-cog"></i></button> 7 {% else %} 8 <button type="button" id="button-opencart" data-toggle="tooltip" title="{{ error_signature }}" data-placement="left" class="btn btn-danger"><i class="fa fa-exclamation-triangle"></i></button> 9 {% endif %} <a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a></div> 10 <h1>{{ heading_title }}</h1> 11 <ul class="breadcrumb"> 12 {% for breadcrumb in breadcrumbs %} 13 <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li> 14 {% endfor %} 15 </ul> 16 </div> 17 </div> 18 <div id="marketplace-extension-info" class="container-fluid">{% if error_warning %} 19 <div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> {{ error_warning }} 20 <button type="button" class="close" data-dismiss="alert">×</button> 21 </div> 22 {% endif %} 23 <div class="panel panel-default"> 24 <div class="panel-heading"> 25 <h3 class="panel-title"><i class="fa fa-puzzle-piece"></i> {{ name }}</h3> 26 </div> 27 <div class="panel-body"> 28 <div class="row extension-info"> 29 <div class="col-sm-8">{% if banner %} 30 <div id="banner" class="text-center thumbnail"><img src="{{ banner }}" title="{{ name }}" alt="{{ name }}" class="img-responsive" /></div> 31 {% endif %} 32 <div class="row thumbnails">{% for image in images %} 33 <div class="col-xs-4 col-sm-2"><a href="{{ image.popup }}" class="thumbnail"><img src="{{ image.thumb }}" alt="{{ image.name }}" title="{{ image.name }}" class="img-responsive" /></a></div> 34 {% endfor %} </div> 35 <ul class="nav nav-tabs"> 36 <li class="active"><a href="#tab-description" data-toggle="tab">{{ tab_general }}</a></li> 37 <li><a href="#tab-documentation" data-toggle="tab">{{ tab_documentation }}</a></li> 38 <li><a href="#tab-download" data-toggle="tab">{{ tab_download }}</a></li> 39 <li><a href="#tab-comment" data-toggle="tab">{{ tab_comment }} ({{ comment_total }})</a></li> 40 </ul> 41 <div class="tab-content"> 42 <div id="tab-description" class="tab-pane active">{{ description }}</div> 43 <div id="tab-documentation" class="tab-pane">{{ documentation }}</div> 44 <div id="tab-download" class="tab-pane"> 45 <fieldset> 46 <legend>{{ text_progress }}</legend> 47 <div id="progress"> 48 <div class="progress"> 49 <div id="progress-bar" class="progress-bar" style="width: 0%;"></div> 50 </div> 51 <div id="progress-text"></div> 52 </div> 53 <hr /> 54 </fieldset> 55 <fieldset> 56 <legend>{{ text_available }}</legend> 57 <table class="table table-bordered"> 58 <thead> 59 <th>{{ text_name }}</th> 60 <th>{{ text_date_added }}</th> 61 <th class="text-right">{{ text_action }}</th> 62 </thead> 63 <tbody> 64 65 {% if downloads %} 66 {% for download in downloads %} 67 <tr> 68 <td>{{ download.name }}</td> 69 <td>{{ download.date_added }}</td> 70 <td class="text-right">{% if download.extension_install_id %} 71 <button type="button" data-install="{{ download.extension_download_id }}" data-uninstall="{{ download.extension_install_id }}" data-loading="{{ text_loading }}" class="btn btn-danger"><i class="fa fa-trash-o"></i> {{ button_uninstall }}</button> 72 {% elseif download.filename|slice(-10) == '.ocmod.zip' %} 73 <button type="button" data-install="{{ download.extension_download_id }}" data-uninstall="" data-loading="{{ text_loading }}" class="btn btn-primary"{% if not download.status %} disabled{% endif %}><i class="fa fa-download"></i> {{ button_install }}</button> 74 {% else %} 75 <button type="button" data-install="{{ download.extension_download_id }}" data-uninstall="" data-loading="{{ text_loading }}" class="btn btn-primary"{% if not download.status %} disabled{% endif %}><i class="fa fa-download"></i> {{ button_download }}</button> 76 {% endif %}</td> 77 </tr> 78 {% endfor %} 79 {% else %} 80 <tr> 81 <td colspan="3" class="text-center">{{ text_no_results }}</td> 82 </tr> 83 {% endif %} 84 </tbody> 85 86 </table> 87 </fieldset> 88 </div> 89 <div id="tab-comment" class="tab-pane"> 90 <fieldset> 91 <legend>{{ text_comment_add }}</legend> 92 <div class="form-group"> 93 <textarea name="comment" rows="5" placeholder="{{ text_write }}" id="input-comment" class="form-control"></textarea> 94 </div> 95 <div class="text-right"> 96 <button type="button" id="button-comment" class="btn btn-primary">{{ button_comment }}</button> 97 </div> 98 </fieldset> 99 <br /> 100 <fieldset> 101 <legend>{{ text_comment }}</legend> 102 <div id="comment"></div> 103 </fieldset> 104 </div> 105 </div> 106 </div> 107 <div class="col-sm-4"> 108 <div id="buy" class="well">{% if license == '1' and not purchased %} 109 <button id="button-buy" class="btn btn-success btn-lg btn-block">{{ button_purchase }}</button> 110 {% endif %} 111 <div id="price" class="row"> 112 <div class="col-xs-5"><strong>{{ text_price }}</strong></div> 113 <div class="col-xs-7 text-right">{% if license %} 114 {{ price }} 115 {% else %} 116 {{ text_free }} 117 {% endif %}</div> 118 </div> 119 <hr> 120 <ul class="list-check"> 121 <li>{{ text_partner }}</li> 122 <li>{{ text_support }}</li> 123 <li>{{ text_documentation }}</li> 124 </ul> 125 <hr> 126 <div class="row"> 127 <div class="col-xs-5"><strong>{{ text_rating }}</strong></div> 128 <div class="col-xs-7 text-right">{% for i in 1..5 %} 129 {% if rating >= i %}<i class="fa fa-star"></i>{% else %}<i class="fa fa-star-o"></i>{% endif %} 130 {% endfor %} ({{ rating_total }})</div> 131 </div> 132 <hr> 133 <div class="row"> 134 <div class="col-xs-5"><strong>{{ text_date_modified }}</strong></div> 135 <div class="col-xs-7 text-right">{{ date_modified }}</div> 136 </div> 137 <hr> 138 <div class="row"> 139 <div class="col-xs-5"><strong>{{ text_date_added }}</strong></div> 140 <div class="col-xs-7 text-right">{{ date_added }}</div> 141 </div> 142 </div> 143 <div id="sales" class="well"><i class="opencart-icon-cart-mini"></i> <strong>{{ sales }}</strong> {{ text_sales }}</div> 144 <div id="sales" class="well"><i class="opencart-icon-cart-mini"></i> <strong>{{ downloaded }}</strong> {{ text_downloaded }}</div> 145 <div class="well"> 146 <div class="media"> 147 <div class="media-left media-middle"><img src="{{ member_image }}" alt="{{ member_username }}" title="{{ member_username }}" class="media-object img-circle"></div> 148 <div class="media-body"> <span><a href="{{ filter_member }}">{{ member_username }}</a></span><br> 149 <small>{{ text_member_since }} {{ member_date_added }}</small></div> 150 </div> 151 <br /> 152 <a href="{{ filter_member }}" class="btn btn-primary btn-lg btn-block">{{ button_view_all }}</a> <a href="https://www.opencart.com/index.php?route=support/seller&extension_id={{ extension_id }}" target="_blank" class="btn btn-ghost-dark btn-lg btn-block">{{ button_get_support }}</a></div> 153 </div> 154 </div> 155 </div> 156 </div> 157 </div> 158 <script type="text/javascript"><!-- 159 $('#button-opencart').on('click', function(e) { 160 $('#modal-opencart').remove(); 161 162 $.ajax({ 163 url: 'index.php?route=marketplace/api&user_token={{ user_token }}', 164 dataType: 'html', 165 beforeSend: function() { 166 $('#button-opencart').button('loading'); 167 }, 168 complete: function() { 169 $('#button-opencart').button('reset'); 170 }, 171 success: function(html) { 172 $('body').append('<div id="modal-opencart" class="modal">' + html + '</div>'); 173 174 $('#modal-opencart').modal('show'); 175 }, 176 error: function(xhr, ajaxOptions, thrownError) { 177 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 178 } 179 }); 180 }); 181 //--></script> 182 <script type="text/javascript"><!-- 183 $('#button-buy').on('click', function(e) { 184 e.preventDefault(); 185 186 $('#modal-purchase').remove(); 187 188 html = '<div id="modal-purchase" class="modal">'; 189 html += ' <div class="modal-dialog">'; 190 html += ' <div class="modal-content">'; 191 html += ' <div class="modal-header">'; 192 html += ' <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>'; 193 html += ' <h4 class="modal-title">{{ text_purchase }}</h4>'; 194 html += ' </div>'; 195 html += ' <div class="modal-body">'; 196 html += ' <p>{{ text_pin }}</p>'; 197 html += ' <p>{{ text_secure }}</p>'; 198 html += ' <div class="form-group">'; 199 html += ' <label for="input-pin">{{ entry_pin }}</label>'; 200 html += ' <input type="password" name="pin" value="" placeholder="{{ entry_pin }}" id="input-pin" class="form-control" />'; 201 html += ' </div>'; 202 html += ' <div class="form-group text-right">'; 203 html += ' <button type="button" id="button-purchase" data-loading-text="{{ text_loading }}" class="btn btn-primary btn-lg">{{ button_purchase }}</button>'; 204 html += ' </div>'; 205 html += ' </div>'; 206 html += ' </div>'; 207 html += ' </div>'; 208 html += '</div>'; 209 210 $('body').append(html); 211 212 $('#modal-purchase').modal('show'); 213 }); 214 215 $('body').on('click', '#modal-purchase #button-purchase', function(e) { 216 e.preventDefault(); 217 218 var element = this; 219 220 $.ajax({ 221 url: 'index.php?route=marketplace/marketplace/purchase&user_token={{ user_token }}&extension_id={{ extension_id }}', 222 type: 'post', 223 data: $('input[name=\'pin\']'), 224 dataType: 'json', 225 beforeSend: function() { 226 $(element).button('loading'); 227 }, 228 complete: function() { 229 $(element).button('reset'); 230 }, 231 success: function(json) { 232 $('.alert-dismissible').remove(); 233 234 if (json['error']) { 235 $('#modal-purchase .modal-body').prepend('<div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 236 } 237 238 if (json['success']) { 239 $('#content > .container-fluid').prepend('<div class="alert alert-success alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 240 241 $('#modal-purchase').modal('hide'); 242 243 $('#tab-download .btn-primary').prop('disabled', false); 244 } 245 }, 246 error: function(xhr, ajaxOptions, thrownError) { 247 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 248 } 249 }); 250 }); 251 252 // Install 253 $('#tab-download').on('click', '.btn-primary', function(e) { 254 e.preventDefault(); 255 256 var element = this; 257 258 // Reset everything 259 $('#progress-bar').css('width', '0%'); 260 $('#progress-bar').removeClass('progress-bar-success'); 261 $('#progress-text').html(''); 262 263 $.ajax({ 264 url: 'index.php?route=marketplace/marketplace/download&user_token={{ user_token }}&extension_id={{ extension_id }}&extension_download_id=' + $(this).attr('data-install'), 265 dataType: 'json', 266 beforeSend: function() { 267 $(element).button('loading'); 268 }, 269 complete: function() { 270 $(element).button('reset'); 271 }, 272 success: function(json) { 273 $('.alert-dismissible').remove(); 274 275 if (json['error']) { 276 $('#tab-download').prepend('<div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + ' <button type="button" class="close" data-dismiss="alert">×</button</div>'); 277 } 278 279 if (json['redirect']) { 280 location = json['redirect']; 281 } 282 283 if (json['text']) { 284 $('#progress-bar').css('width', '20%'); 285 $('#progress-text').html(json['text']); 286 } 287 288 if (json['extension_install_id']) { 289 $(element).replaceWith('<button type="button" data-install="' + $(element).attr('data-install') + '" data-uninstall="' + json['extension_install_id'] + '" data-loading="{{ text_loading }}" class="btn btn-danger"><i class="fa fa-trash-o"></i> {{ button_uninstall }}</button>'); 290 } 291 292 if (json['next']) { 293 next(json['next'], element, 1); 294 } 295 }, 296 error: function(xhr, ajaxOptions, thrownError) { 297 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 298 } 299 }); 300 }); 301 302 function next(url, element, i) { 303 i = i + 1; 304 305 $.ajax({ 306 url: url, 307 dataType: 'json', 308 success: function(json) { 309 $('#progress-bar').css('width', (i * 20) + '%'); 310 311 if (json['error']) { 312 $('#progress-bar').addClass('progress-bar-danger'); 313 $('#progress-text').html('<div class="text-danger">' + json['error'] + '</div>'); 314 } 315 316 if (json['success']) { 317 $('#progress-bar').addClass('progress-bar-success'); 318 $('#progress-text').html('<span class="text-success">' + json['success'] + '</span>'); 319 } 320 321 if (json['text']) { 322 $('#progress-text').html(json['text']); 323 } 324 325 if (json['next']) { 326 next(json['next'], element, i); 327 } 328 }, 329 error: function(xhr, ajaxOptions, thrownError) { 330 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 331 } 332 }); 333 } 334 335 // Uninstall 336 $('#tab-download').on('click', ' .btn-danger', function(e) { 337 e.preventDefault(); 338 339 var element = this; 340 341 $('#progress-bar').css('width', '0%'); 342 $('#progress-bar').removeClass('progress-bar-danger progress-bar-success'); 343 $('#progress-text').html(''); 344 345 $.ajax({ 346 url: 'index.php?route=marketplace/install/uninstall&user_token={{ user_token }}&extension_install_id=' + $(this).attr('data-uninstall'), 347 dataType: 'json', 348 beforeSend: function() { 349 $(element).button('loading'); 350 }, 351 complete: function() { 352 $(element).button('reset'); 353 }, 354 success: function(json) { 355 if (json['error']) { 356 $('#progress-bar').addClass('progress-bar-danger'); 357 $('#progress-text').html(json['error']); 358 } 359 360 if (json['success']) { 361 $('#progress-bar').css('width', '100%'); 362 $('#progress-bar').addClass('progress-bar-success'); 363 $('#progress-text').html(json['success']); 364 365 $(element).replaceWith('<button type="button" data-install="' + $(element).attr('data-install') + '" data-uninstall="" data-loading="{{ text_loading }}" class="btn btn-primary"><i class="fa fa-download"></i> {{ button_install }}</button>'); 366 } 367 }, 368 error: function(xhr, ajaxOptions, thrownError) { 369 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 370 } 371 }); 372 }); 373 374 $('#comment').delegate('.pagination a', 'click', function(e) { 375 e.preventDefault(); 376 377 $('#comment').load(this.href); 378 }); 379 380 // Comment 381 $('#comment').load('index.php?route=marketplace/marketplace/comment&user_token={{ user_token }}&extension_id={{ extension_id }}'); 382 383 // Add comment 384 $('#button-comment').on('click', function() { 385 $.ajax({ 386 url: 'index.php?route=marketplace/marketplace/addcomment&user_token={{ user_token }}&extension_id={{ extension_id }}', 387 type: 'post', 388 dataType: 'json', 389 data: 'comment=' + encodeURIComponent($('textarea[name=\'comment\']').val()), 390 beforeSend: function() { 391 $('#button-comment').button('loading'); 392 }, 393 complete: function() { 394 $('#button-comment').button('reset'); 395 }, 396 success: function(json) { 397 $('.alert-dismissible').remove(); 398 399 if (json['error']) { 400 $('#tab-comment').prepend('<div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 401 } 402 403 if (json['success']) { 404 $('#tab-comment').prepend('<div class="alert alert-success alert-dismissible"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 405 406 $('#comment').load('index.php?route=marketplace/marketplace/comment&user_token={{ user_token }}&extension_id={{ extension_id }}'); 407 408 $('textarea[name=\'comment\']').val(''); 409 } 410 }, 411 error: function(xhr, ajaxOptions, thrownError) { 412 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 413 } 414 }); 415 }); 416 417 // Next replies 418 $('#comment').on('click', '.btn-block', function(e) { 419 e.preventDefault(); 420 421 var element = this; 422 423 $.ajax({ 424 url: $(element).attr('href'), 425 dataType: 'html', 426 beforeSend: function() { 427 $(element).button('loading'); 428 }, 429 complete: function() { 430 $(element).button('reset'); 431 }, 432 success: function(html) { 433 $(element).parent().parent().parent().append(html); 434 435 $(element).parent().remove(); 436 }, 437 error: function(xhr, ajaxOptions, thrownError) { 438 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 439 } 440 }); 441 }); 442 443 // Reply 444 $('#comment').on('click', '.btn-link', function(e) { 445 e.preventDefault(); 446 447 $(this).parent().parent().find('.reply-input-box').toggle(); 448 }); 449 450 // Add reply 451 $('#comment').on('click', '.btn-primary', function(e) { 452 e.preventDefault(); 453 454 var element = this; 455 456 $.ajax({ 457 url: $(element).attr('href'), 458 type: 'post', 459 dataType: 'json', 460 data: 'comment=' + encodeURIComponent($(element).parents('.reply-input-box').find('textarea[name=\'comment\']').val()), 461 beforeSend: function() { 462 $(element).button('loading'); 463 }, 464 complete: function() { 465 $(element).button('reset'); 466 }, 467 success: function(json) { 468 $('.alert-dismissible').remove(); 469 470 if (json['error']) { 471 $(element).parents('.reply-input-box').before('<div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 472 } 473 474 if (json['success']) { 475 $(element).parents('.reply-input-box').before('<div class="alert alert-success alert-dismissible"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>'); 476 477 $(element).parents('.reply-input-box').parents('.media').find('.reply-refresh').last().trigger('click'); 478 479 $(element).parents('.reply-input-box').find('textarea[name=\'comment\']').val(''); 480 } 481 }, 482 error: function(xhr, ajaxOptions, thrownError) { 483 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 484 } 485 }); 486 }); 487 488 // Refresh 489 $('#comment').on('click', '.reply-refresh', function(e) { 490 e.preventDefault(); 491 492 var element = this; 493 494 $.ajax({ 495 url: $(element).attr('href'), 496 dataType: 'html', 497 beforeSend: function() { 498 $(element).button('loading'); 499 }, 500 complete: function() { 501 $(element).button('reset'); 502 }, 503 success: function(html) { 504 $(element).parent().replaceWith(html); 505 }, 506 error: function(xhr, ajaxOptions, thrownError) { 507 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 508 } 509 }); 510 }); 511 //--></script> 512 <script type="text/javascript"><!-- 513 $(document).ready(function() { 514 $('.thumbnails').magnificPopup({ 515 type:'image', 516 delegate: 'a', 517 gallery: { 518 enabled:true 519 } 520 }); 521 }); 522 //--></script> 523 </div> 524 {{ footer }}