events_turntable.html 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. <{include file="header.html"}>
  2. <{include file="nav.html"}>
  3. <!--公用标题居中显示-->
  4. <{include file="common_header.html"}>
  5. <{include file="events_top.html"}>
  6. <{include file="events_infos.html"}>
  7. <!--遮罩层-->
  8. <div class="a_cover"></div>
  9. <!--====================提示层样式5种,分别选择使用 begin===========================-->
  10. <!--通用文字提示层-->
  11. <div class="v_tips_box" id="vtips_1">
  12. <div class="v_close_btn"></div>
  13. <p>{{message}}</p>
  14. </div>
  15. <!--通用文字提示层+按钮-->
  16. <div class="v_tips_box v_tips_box2" id="vtips_2">
  17. <div class="v_close_btn"></div>
  18. <p>{{message}}</p>
  19. <p><a href="<{$listUrl}>" class="submit_btn_style">返回列表</a></p>
  20. </div>
  21. <!--活动结束提示+按钮-->
  22. <div class="v_tips_box v_tips_box2" id="vtips_3">
  23. <div class="v_close_btn"></div>
  24. <p>活动已结束!</p>
  25. <p><a href="<{$listUrl}>" class="submit_btn_style">其它活动</a></p>
  26. </div>
  27. <!--领取奖品提示层+按钮-->
  28. <div class="v_tips_box v_tips_box3" id="vtips_4">
  29. <div class="v_close_btn close_btn_href" url="<{$giftsUrl}>"></div>
  30. <div class="pro_list_box pro_list_box2 pro_list_box3">
  31. <dl>
  32. <dt>
  33. <img src="<{$web_cfg.cdn}>/public/static/img/item_img.jpg">
  34. <p class="img_cover" style="background-image:url({{img_url}});"></p>
  35. </dt>
  36. <dd>
  37. <p class="pro_name">{{prize_name}}</p>
  38. </dd>
  39. </dl>
  40. </div>
  41. <p class="v_gray">请点击领取奖品,并填写配送地址</p>
  42. <p><a class="submit_btn_style" href="<{$web_cfg.domain}>/?c=Express&lottery_data_id={{lottery_data_id}}">领取奖品</a></p>
  43. </div>
  44. <!--查看奖品提示层+按钮-->
  45. <div class="v_tips_box v_tips_box3" id="vtips_5">
  46. <div class="v_close_btn close_btn_href" url="<{$giftsUrl}>"></div>
  47. <div class="pro_list_box tips_list_box pro_list_box3">
  48. <dl>
  49. <dt><img src="{{img_url}}"></dt>
  50. <dd>
  51. <p class="pro_name">{{prize_name}}</p>
  52. <p class="pro_num">{{virtual_data}}</p>
  53. </dd>
  54. </dl>
  55. </div>
  56. <p><a class="submit_btn_style" href="<{$giftsUrl}>">查看奖品</a></p>
  57. </div>
  58. <!--====================提示层样式5种,分别选择使用 end===========================-->
  59. <!-- 显示 -->
  60. <div class="v_tips_box v_tips_box3" id="ks-tips"></div>
  61. <script>
  62. var goUrl = '';
  63. function go_page(){
  64. location.href = goUrl;
  65. }
  66. function showErrorMsg(data_msg){
  67. $('.v_close_btn').show();
  68. $('#error_msg').html(data_msg);
  69. $('#error_tips_box').fadeIn(200);
  70. $('.a_cover').fadeIn(200);
  71. }
  72. function showErrorMsgGoPage(data_msg){
  73. $('.v_close_btn').show();
  74. $('#error_msg').html(data_msg);
  75. $('#error_tips_box').fadeIn();
  76. $('.a_cover').fadeIn();
  77. setInterval("go_page();",seconds+100);
  78. }
  79. $("#award_btn").on('click', function(){
  80. var time = 2000;//设置抽奖loading时间
  81. $("#luck_show").hide();
  82. $("#luck_loading").show()/*.delay(time).fadeOut(0)*/;
  83. //$(".loading_img").css({height:"0px"}).animate({height:"70px"},time);
  84. });
  85. //通用弹出提示层
  86. function v_tips_show(){
  87. $(".v_tips_box").fadeIn(200);
  88. $(".a_cover").fadeIn(200);
  89. }
  90. //点击关闭提示层---通用
  91. $(".v_close_btn").live('click', function() {
  92. $(".v_tips_box").fadeOut(.2);
  93. $(".a_cover").fadeOut(.2);
  94. });
  95. // 点击关闭按钮
  96. $(".close_btn_href").live('click', function() {
  97. var url = $(this).attr('url');
  98. location.href = url;
  99. });
  100. KISSY.use('node, io, xtemplate, anim', function (S, Node, IO, XTemplate, Anim) {
  101. var $ = S.all;
  102. //视频自适应
  103. var screenWidth = $(window).width();
  104. var baseWidth = 510;
  105. var video_scale = screenWidth / baseWidth;
  106. $(".video_iframe").each(function () {
  107. var new_width = $(this).width() * video_scale;
  108. $(this).width(new_width - 20);
  109. var new_height = $(this).height() * video_scale;
  110. $(this).height(new_height - 20);
  111. });
  112. var drawResult = {};
  113. var drawAnim = new Anim(".loading_img", {'height':'70px'}, {
  114. duration: 2,
  115. complete: function () {
  116. var id = setInterval(function () {
  117. if (!S.isUndefined(drawResult.ok)) {
  118. run_result_anim(drawResult);
  119. clearInterval(id);
  120. }
  121. }, 100);
  122. }
  123. });
  124. //点击抽奖按钮切换抽奖效果
  125. $("#award_btn").on('click', function () {
  126. drawAnim.run();
  127. new IO({
  128. type: "get"
  129. , url: '<{$web_cfg.domain}>/?c=EventsTurntable&a=Rotation'
  130. , data: {events_id: '<{$turntableData.events.id}>'}
  131. , success: function (data) {
  132. if (data.ok) {
  133. drawResult = data;
  134. return false;
  135. } else {
  136. if(data.msg.url){
  137. loadLogin();
  138. //goUrl = '<{$loginUrl}>';
  139. //showErrorMsgGoPage('本活动需登录后才可以参与');
  140. return;
  141. } else {
  142. $("#luck_loading").hide();
  143. $("#luck_result").show();
  144. }
  145. }
  146. }
  147. , error: function (NULL, textStatus) {
  148. alert("请求服务器失败,原因:"+textStatus);
  149. }
  150. , dataType: "json"
  151. });
  152. });
  153. function run_result_anim(data) {
  154. if (data.ok) { //ok
  155. if(data.msg == 'NoPrize'){
  156. $("#luck_loading").hide();
  157. $("#luck_result").show();
  158. } else {
  159. if(data.msg.express == 1){//领奖
  160. var tpl = $("#vtips_4").html();
  161. } else {//查看奖品
  162. var tpl = $("#vtips_5").html();
  163. }
  164. var render = new XTemplate(tpl).render(data.msg);
  165. $("#ks-tips").html(render).fadeIn(.2);
  166. $(".a_cover").fadeIn(.2);
  167. }
  168. } else {
  169. if(data.msg == 'NoPrize'){
  170. $("#luck_loading").hide();
  171. $("#luck_result").show();
  172. } else {
  173. var tpl = $("#vtips_2").html();
  174. var render = new XTemplate(tpl).render({'message':data.msg});
  175. $("#ks-tips").html(render).fadeIn(.2);
  176. $(".a_cover").fadeIn(.2);
  177. $(".v_close_btn").on('click', function() {
  178. $(".v_tips_box").hide();
  179. $(".a_cover").hide();
  180. });
  181. }
  182. }
  183. }
  184. });
  185. //有产品列表时添加整体body背景色
  186. $(body).addClass("bg_white");
  187. </script>
  188. <{include file="bottom.html"}>