Advertisement
Guest User

Untitled

a guest
Jul 31st, 2016
68
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.93 KB | None | 0 0
  1. <script>
  2. /* Корзина товарів початок*/
  3. $(document).ready(function() {
  4. function setWidhtTdTableCart() {
  5. var wid = 0, wid_ = 0;
  6. $(".cr_am").each(function(i){
  7. wid_ = $(this).width();
  8. if(wid_>wid) wid = wid_;
  9. });
  10. $(".cr_am").width(wid);
  11. $("#cr_am_all").width(wid);
  12.  
  13. wid = 0; wid_ = 0;
  14. $(".cr_pr").each(function(i){
  15. wid_ = $(this).width();
  16. if(wid_>wid) wid = wid_;
  17. });
  18. $(".cr_pr").width(wid);
  19. $("#cr_number").width($(".number").width());
  20. }
  21. setWidhtTdTableCart();
  22. $(window).resize(function(e) {
  23. setWidhtTdTableCart();
  24. })
  25. });
  26.  
  27.  
  28. var productCart = {
  29.  
  30. 'updCount' : function(component_id, product_id, el){
  31. var count = $(el).val();
  32. var tr = $(el).closest("tr"),
  33. price = parseFloat((tr.find(".price").text()).replace(/\s+/g, ''));
  34. var amount = price * count;
  35. // $("#shop_cart #preload div").show();
  36. tr.find(".amount").text(fn.number_format(amount, 2, ".", " "));
  37.  
  38. addProductCart(component_id, product_id, count, 1, el, function(el, count){
  39. productCart.updAmount();
  40. });
  41. },
  42.  
  43. 'addCount' : function (component_id, product_id, el){
  44. var tr = $(el).parents(".line");
  45. var count = +tr.find("input.count").val();
  46. var price = parseFloat((tr.find(".price").text()).replace(/\s+/g, ''));
  47. count += 1;
  48. var amount = price * count;
  49.  
  50. // $("#shop_cart #preload div").show();
  51. tr.find("input.count").val(count);
  52. tr.find(".amount").text(fn.number_format(amount, 2, ".", " "));
  53.  
  54. addProductCart(component_id, product_id, 1, 0, el, function(el, count){
  55. productCart.updAmount();
  56. });
  57. },
  58.  
  59. 'delCount' : function (component_id, product_id, el){
  60.  
  61. var tr = $(el).parents(".line"),
  62. price = parseFloat((tr.find(".price").text()).replace(/\s+/g, ''));
  63. var count = +tr.find("input.count").val();
  64. count -= 1;
  65. var amount = price * count;
  66. if(count == 0) tr.remove();
  67. // $("#shop_cart #preload div#p1").show();
  68. tr.find(".amount").text(fn.number_format(amount, 2, ".", " "));
  69. tr.find("input.count").val(count);
  70.  
  71. delProductCart(component_id, product_id, 1, el, function(el){
  72. productCart.updAmount();
  73. });
  74. },
  75.  
  76. 'delProduct' : function (component_id, product_id, el){
  77. delProductCart(component_id, product_id, "all", el, function(el){
  78. $(el).closest(".line").remove();
  79. productCart.updAmount();
  80. });
  81. },
  82.  
  83. 'clear' : function(){
  84. if(confirm(DO_YOU_WANT_TO_EMPTY_THE_TRASH+"?")){
  85. clearProductCart();
  86. $("#shop_cart").html('<p class="cart_is_empty">'+CART_IS_EMPTY+'</p>');
  87. $(".line_1__in .cart_1").html('<p>'+CART_IS_EMPTY+'</p>');
  88. $(".line_1__in .count").text('0');
  89. }
  90. },
  91. 'add' : function(component_id, product_id, ev){
  92. ev.stopPropagation ? ev.stopPropagation() : (ev.cancelBubble=true)
  93.  
  94. addProductCart(component_id, product_id, 1, 0, 0, function(el, count){
  95. var html = '<p>'+ITEM_SUCCESSFULLY_ADDED_TO_CART+'</p><div class="buttons"><button onclick="modal.hide()" class="one_click">'+CONTINUE_SHOPPING+'</button><a href="/'+LANG+'/cart/"><button class="in_cart">'+GO_TO_BASKET+'</button></a></div>';
  96. modal.show(html, "addToCart");
  97. });
  98. },
  99. 'updAmount' : function (){
  100. var cartCount = 0, cartAmount = 0, count;
  101. $("#shop_cart div.line").each(function(i){
  102. count = +$(this).find("input.count").val();
  103. cartCount += count;
  104. cartAmount += parseFloat(($(this).find(".price").text()).replace(/\s+/g, '')) * count;
  105. });
  106.  
  107. $("#shop_cart #countProducts, .line_1__in .count").text(cartCount);
  108. $("#shop_cart #amountProducts, .line_1__in .amount").text(fn.number_format(cartAmount, 2, ".", " "));
  109. // $("#shop_cart #preload div#p1").hide();
  110. }
  111. }
  112. /* Корзина товарів кінець */
  113. </script>
  114. <style>
  115. /* Корзина товарів початок */
  116. .cart_wrap{
  117. margin-top: 80px;
  118. margin-left: 15px;
  119. margin-right: 15px;
  120. }
  121. .cart_wrap .line{
  122. border: 1px solid #ebebeb;
  123. background-color: #fff;
  124. width: 100%;
  125. padding: 5px;
  126. margin-bottom: 5px;
  127. }
  128. .cart_wrap .line:after{
  129. content: '';
  130. display: block;
  131. clear: both;
  132. }
  133. .cart_wrap .line .left{
  134. display: table;
  135. width: 50%;
  136. min-width: 278px;
  137. float: left;
  138. }
  139. .cart_wrap .number{
  140. max-width: 120px;
  141. }
  142. .cart_wrap .line .right{
  143. display: table;
  144. width: 50%;
  145. min-width: 278px;
  146. float: right;
  147. }
  148. .cart_wrap .line .left > div,
  149. .cart_wrap .line .right > div{
  150. display: table-cell;
  151. vertical-align: middle;
  152. }
  153. .cart_wrap .line .right table{
  154. width: 100%;
  155. }
  156. .cart_wrap .line .right table td{
  157. text-align: center;
  158. padding: 5px 0;
  159. }
  160. .cart_wrap .title_row{
  161. display: none;
  162. }
  163. .title_row td{
  164. border-bottom: 1px solid #a09d9d;
  165. }
  166. .cart_wrap .right_wr{
  167. width: calc(100% - 30px);
  168. }
  169. .cart_wrap .del{
  170. width: 24px;
  171. }
  172. .cart_wrap #del_1{
  173. display: none;
  174. }
  175. .cart_wrap .img{
  176. width: 80px;
  177. text-align: center;
  178. }
  179. .cart_wrap .img img{
  180. max-width: 80px;
  181. max-height: 80px;
  182. }
  183. .cart_wrap .name{
  184. width: calc(100% - 80px);
  185. padding: 5px;
  186. line-height: 1.3;
  187. }
  188. .num_w{
  189. display: table;
  190. margin: 0 auto;
  191. }
  192. .num_w div{
  193. display: table-cell;
  194. vertical-align: middle;
  195. }
  196. .num_w input{
  197. border: 1px solid #a09d9d;
  198. width: 40px;
  199. text-align: center;
  200. height: 36px;
  201. }
  202. .num_but{
  203. display: block;
  204. cursor: pointer;
  205. margin: 0 5px;
  206. font-size: 30px;
  207. color: #cdcdcd;
  208. transition: all 0.3s;
  209. }
  210. .num_but:hover{
  211. color: #00bff3;
  212. }
  213. .num_but.del:hover{
  214. color: #ff0000;
  215. }
  216. .cart_wrap__tit{
  217. padding: 6px;
  218. }
  219. .cart_wrap__tit .l{
  220. float: left;
  221. width: 50%;
  222. }
  223. .cart_wrap__tit .r{
  224. float: right;
  225. width: 50%;
  226. }
  227. .cart_wrap__tit:after{
  228. content: '';
  229. display: block;
  230. clear: both;
  231. }
  232. .cart_wrap__tit .r table{
  233. width: calc(100% - 34px);
  234. }
  235. .cart_wrap__tit .r table td{
  236. text-align: center;
  237.  
  238. }
  239. .cart_butons{
  240. text-align: center;
  241. margin: 30px 0;
  242. }
  243. .cart_butons button{
  244. width: 240px;
  245. height: 36px;
  246. margin: 10px 20px;
  247. }
  248. .cart_butons button.one_click:hover{
  249. border-color: #ff0000;
  250. color: #ff0000;
  251. }
  252. .cart_wrap__tit.bott{
  253. padding-right: 25px;
  254. }
  255. .cart_wrap__tit.bott table{
  256. width: 100%;
  257. }
  258. .cart_wrap__tit.bott td{
  259. text-align: center;
  260.  
  261. }
  262. .cart_wrap__tit.bott td:nth-child(1){
  263. text-align: right;
  264.  
  265. }
  266. #line_cart{
  267. height: 60px;
  268. line-height: 60px;
  269. padding-left: 15px;
  270. }
  271.  
  272. /***** Медіа */
  273. @media only screen and (max-width : 1050px) {
  274. .cart_wrap .line div.left{
  275. width: 40%;
  276. }
  277. .cart_wrap .line div.right{
  278. width: 60%;
  279. }
  280. .cart_wrap__tit .r{
  281. width: 60%;
  282. }
  283. .cart_wrap__tit .l {
  284. width: 40%;
  285. }
  286. }
  287. @media only screen and (max-width : 742px) {
  288. .cart_wrap .title_row{
  289. display: table-row;
  290. }
  291. .cart_wrap .line div.left, .cart_wrap .line div.right{
  292. width: 100%;
  293. }
  294. #cart_wrap__tit{
  295. display: none;
  296. }
  297. }
  298.  
  299. @media only screen and (max-width : 400px) {
  300. .cart_wrap__tit.bott{
  301. font-size: 16px;
  302. }
  303. .cart_wrap{
  304. margin-left: 0;
  305. margin-right: 0;
  306. }
  307. }
  308. /* Корзина товарів кінець */
  309. </style>
  310. <!-- Корзина товарів початок -->
  311. <div class="cart_wrap">
  312. <div class="cart_wrap__tit" id="cart_wrap__tit">
  313. <div class="l">
  314. Найменування
  315. </div>
  316. <div class="r">
  317. <table id-"cart_tit_b">
  318. <tr>
  319. <td class="cr_pr">Ціна</td>
  320. <td>Кількість</td>
  321. <td class="cr_am">Сума</td>
  322. </tr>
  323. </table>
  324. </div>
  325. </div>
  326.  
  327. <div class="line ">
  328. <div class="left">
  329. <div class="img">
  330. <img src="___1780.jpg" alt="">
  331. </div>
  332. <div class="name">
  333. Шина BRIDGESTONE, модель BLIZZAK DM-V1, 225/55R18
  334. </div>
  335.  
  336. </div>
  337. <div class="right">
  338. <div class="right_wr">
  339. <table cellspacing="0" cellpadding="5">
  340. <tr class="title_row">
  341. <td class="cr_pr">
  342. Ціна
  343. </td>
  344. <td>
  345. Кількість
  346. </td>
  347. <td class="cr_am">
  348. Сума
  349. </td>
  350. </tr>
  351. <tr>
  352. <td class="cr_pr">
  353. 67858.55
  354. </td>
  355. <td class="number">
  356. <div class="num_w">
  357. <div class="b"><i class="fa fa-minus-square num_but"></i>
  358. </div>
  359. <div class="inp">
  360. <input type="text" value="3">
  361. </div>
  362. <div class="b"><i onclick="" class="fa fa-plus-square num_but"></i>
  363. </div>
  364. </div>
  365. </td>
  366. <td class="cr_am">
  367. 86758.55
  368. </td>
  369. </tr>
  370. </table>
  371. </div>
  372. <div class="del" id="del_2">
  373. <i class="fa fa-times num_but del"></i>
  374. </div>
  375. </div>
  376. </div>
  377. <div class="line ">
  378. <div class="left">
  379. <div class="img">
  380. <img src="___1780.jpg" alt="">
  381. </div>
  382. <div class="name">
  383. Шина BRIDGESTONE, модель BLIZZAK DM-V1, 225/55R18
  384. </div>
  385.  
  386. </div>
  387. <div class="right">
  388. <div class="right_wr">
  389. <table cellspacing="0" cellpadding="5">
  390. <tr class="title_row">
  391. <td class="cr_pr">
  392. Ціна
  393. </td>
  394. <td>
  395. Кількість
  396. </td>
  397. <td class="cr_am">
  398. Сума
  399. </td>
  400. </tr>
  401. <tr>
  402. <td class="cr_pr">
  403. 67858.55
  404. </td>
  405. <td class="number">
  406. <div class="num_w">
  407. <div class="b"><i class="fa fa-minus-square num_but"></i>
  408. </div>
  409. <div class="inp">
  410. <input type="text" value="3">
  411. </div>
  412. <div class="b"><i onclick="" class="fa fa-plus-square num_but"></i>
  413. </div>
  414. </div>
  415. </td>
  416. <td class="cr_am">
  417. 58.55
  418. </td>
  419. </tr>
  420. </table>
  421. </div>
  422. <div class="del" id="del_2">
  423. <i class="fa fa-times num_but del"></i>
  424. </div>
  425. </div>
  426. </div>
  427. <div class="line ">
  428. <div class="left">
  429. <div class="img">
  430. <img src="___1780.jpg" alt="">
  431. </div>
  432. <div class="name">
  433. Шина BRIDGESTONE, модель BLIZZAK DM-V1, 225/55R18
  434. </div>
  435.  
  436. </div>
  437. <div class="right">
  438. <div class="right_wr">
  439. <table cellspacing="0" cellpadding="5">
  440. <tr class="title_row">
  441. <td class="cr_pr">
  442. Ціна
  443. </td>
  444. <td>
  445. Кількість
  446. </td>
  447. <td class="cr_am">
  448. Сума
  449. </td>
  450. </tr>
  451. <tr>
  452. <td class="cr_pr">
  453. 858.55
  454. </td>
  455. <td class="number">
  456. <div class="num_w">
  457. <div class="b"><i class="fa fa-minus-square num_but"></i>
  458. </div>
  459. <div class="inp">
  460. <input type="text" value="3">
  461. </div>
  462. <div class="b"><i onclick="" class="fa fa-plus-square num_but"></i>
  463. </div>
  464. </div>
  465. </td>
  466. <td class="cr_am">
  467. 4586758.55
  468. </td>
  469. </tr>
  470. </table>
  471. </div>
  472. <div class="del" id="del_2">
  473. <i class="fa fa-times num_but del"></i>
  474. </div>
  475. </div>
  476. </div>
  477.  
  478. <div class="cart_wrap__tit bott">
  479. <table id="cart_tit_b">
  480. <tr>
  481. <td>Всього:</td>
  482. <td id="cr_number">12</td>
  483. <td id="cr_am_all">269462.56</td>
  484. </tr>
  485. </table>
  486. </div>
  487.  
  488. </div>
  489. <div class="cart_butons">
  490. <button class="one_click" onclick="productCart.clear()">Очистити корзину
  491. </button>
  492. <button class="in_cart">
  493. Оформити замовлення
  494. </button>
  495. <!--
  496. <a href="/cart/checkout/" class="in_cart">
  497. Оформити замовлення </a>
  498. -->
  499. </div>
  500. <!-- Корзина товарів кнець -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement