script_msg.js 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. //jQuery time
  2. var current_fs, next_fs, previous_fs; //fieldsets
  3. var left, opacity, scale; //fieldset properties which we will animate
  4. var animating; //flag to prevent quick multi-click glitasdaches
  5. $(".next").click(function(){
  6. if( !validate() ){
  7. return false;
  8. }
  9. name_title = $('.title_new').val();
  10. txtARR=[];
  11. imgARR=[];
  12. var step;
  13. for (step = 1; step <= 10; step++) {
  14. if($(".txtsrc"+step).val()!=""){
  15. txtARR.push($(".txtsrc"+step).val())
  16. }
  17. }
  18. var step2;
  19. for (step2 = 1; step2 <= 10; step2++) {
  20. if($(".imgsrc"+step2).val()!=""){
  21. imgARR.push($(".imgsrc"+step2).val())
  22. }
  23. }
  24. dataOBJ = {"name":name_title,"text_content":txtARR,"image_urls":imgARR}
  25. objstr = JSON.stringify(dataOBJ);
  26. obj2 = JSON.parse(objstr)
  27. obj3 = JSON.stringify(obj2)
  28. console.log(txtARR);
  29. console.log(obj3);
  30. $.ajax({
  31. url: 'http://www.choozmo.com:8888/make_anchor_video_v2',
  32. //url: 'http://www.choozmo.com:8888/qqreq',
  33. dataType : 'json', // 預期從server接收的資料型態
  34. contentType : 'application/json; charset=utf-8', // 要送到server的資料型態
  35. type: 'post',
  36. data: obj3,
  37. success: function(suc_data) {
  38. // data.redirect contains the string URL to redirect to
  39. window.location.href = suc_data.redirect;
  40. },
  41. //data:JSON.stringify({n1:"12",n2:"22"}),
  42. error: function (error) {
  43. console.error(error)
  44. }
  45. });
  46. if(animating) return false;
  47. animating = true;
  48. current_fs = $(this).parent();
  49. next_fs = $(this).parent().next();
  50. $("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
  51. //show the next fieldset
  52. next_fs.show();
  53. //hide the current fieldset with style
  54. current_fs.animate({opacity: 0}, {
  55. step: function(now, mx) {
  56. //as the opacity of current_fs reduces to 0 - stored in "now"
  57. //1. scale current_fs down to 80%
  58. scale = 1 - (1 - now) * 0.2;
  59. //2. bring next_fs from the right(50%)
  60. left = (now * 50)+"%";
  61. //3. increase opacity of next_fs to 1 as it moves in
  62. opacity = 1 - now;
  63. current_fs.css({
  64. 'transform': 'scale('+scale+')',
  65. 'position': 'absolute'
  66. });
  67. next_fs.css({'left': left, 'opacity': opacity});
  68. },
  69. duration: 800,
  70. complete: function(){
  71. current_fs.hide();
  72. animating = false;
  73. },
  74. //this comes from the custom easing plugin
  75. easing: 'easeInOutBack'
  76. });
  77. });
  78. $(".previous").click(function(){
  79. if(animating) return false;
  80. animating = true;
  81. current_fs = $(this).parent();
  82. previous_fs = $(this).parent().prev();
  83. //de-activate current step on progressbar
  84. $("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");
  85. //show the previous fieldset
  86. previous_fs.show();
  87. //hide the current fieldset with style
  88. current_fs.animate({opacity: 0}, {
  89. step: function(now, mx) {
  90. //as the opacity of current_fs reduces to 0 - stored in "now"
  91. //1. scale previous_fs from 80% to 100%
  92. scale = 0.8 + (1 - now) * 0.2;
  93. //2. take current_fs to the right(50%) - from 0%
  94. left = ((1-now) * 50)+"%";
  95. //3. increase opacity of previous_fs to 1 as it moves in
  96. opacity = 1 - now;
  97. current_fs.css({'left': left});
  98. previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity});
  99. },
  100. duration: 800,
  101. complete: function(){
  102. current_fs.hide();
  103. animating = false;
  104. },
  105. //this comes from the custom easing plugin
  106. easing: 'easeInOutBack'
  107. });
  108. });
  109. $("input[name=submit]").click(function(){
  110. let stop;
  111. console.log($("#msform").serialize());
  112. if( $('input[name="q9"]:visible').val() !== undefined && !$('input[name="q9"]:visible').prop('checked') ) {
  113. stop = 1;
  114. $('#term-error').text('必須同意免責聲明與隱私使用政策');
  115. }else {
  116. stop = 0;
  117. $('#term-error').text('');
  118. }
  119. if(stop == 0) {
  120. /* $.ajax({
  121. url: '/step_questions/submit',
  122. type: 'post',
  123. dataType: 'json',
  124. data: $("#msform").serialize(),
  125. success: function(data) {
  126. showThankyou();
  127. },
  128. error: function (error) {
  129. console.error(error)
  130. }
  131. }); */
  132. showThankyou();
  133. }
  134. });
  135. // 依據管道導頁
  136. function showThankyou() {
  137. document.location = '/a1/index_complete_msg.html';
  138. // document.location = '/a1/index_complete_line.html';
  139. }
  140. // 跳離頁面
  141. $('.btn-exit').click(function() {
  142. document.location = 'https://hhh.com.tw/';
  143. })
  144. $('.btn-term-exit').click(function () {
  145. self.opener = null;
  146. self.close();
  147. })
  148. function show_input_text(checkbox_id, input_id) {
  149. var checkBox = document.getElementById(checkbox_id);
  150. var inp = document.getElementById(input_id);
  151. if (checkBox.checked == true){
  152. inp.style.display = "block";
  153. } else {
  154. inp.style.display = "none";
  155. }
  156. }
  157. function validate() {
  158. function q2_validate() {
  159. let phoneno = /^\d{10}$/;
  160. if( $('input[name="q2"]:visible').val() !== undefined && $('input[name="q2"]:visible').val().length <= 0) {
  161. $('input[name="q2"]:visible').addClass('error');
  162. if( !$('.error-text').length )
  163. $('input.error').after('<p class="error-text">請輸入正確手機號碼</p>');
  164. return false;
  165. } else if($('input[name="q2"]:visible').val() !== undefined && !phoneno.test($('input[name="q2"]:visible').val())){
  166. $('input[name="q2"]:visible').addClass('error');
  167. if( !$('.error-text').length )
  168. $('input.error').after('<p class="error-text">請輸入正確手機號碼</p>');
  169. return false;
  170. }else {
  171. $('input[name="q2"]:visible').removeClass('error');
  172. $('.error-text').remove();
  173. return true;
  174. }
  175. }
  176. function q3_validate() {
  177. let emailPattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  178. if( $('input[name="q3"]:visible').val() !== undefined && $('input[name="q3"]:visible').val().length <= 0) {
  179. $('input[name="q3"]:visible').addClass('error');
  180. if( !$('.error-text').length )
  181. $('input.error').after('<p class="error-text">請輸入E-mail</p>');
  182. return false;
  183. } else if ( $('input[name="q3"]:visible').val() !== undefined && !emailPattern.test($('input[name="q3"]:visible').val()) ){
  184. $('input[name="q3"]:visible').addClass('error');
  185. if( !$('.error-text').length )
  186. $('input.error').after('<p class="error-text">請輸入正確email格式</p>');
  187. return false;
  188. }
  189. else {
  190. $('input[name="q3"]:visible').removeClass('error');
  191. $('.error-text').remove();
  192. return true;
  193. }
  194. }
  195. function q4_validate() {
  196. if( $('input[name="q4"]:visible').val() !== undefined && $('input[name="q4"]:visible').val().length <= 0 ) {
  197. $('input[name="q4"]:visible').addClass('error');
  198. if( !$('.error-text').length )
  199. $('input.error').after('<p class="error-text">請輸入建案名稱</p>');
  200. return false;
  201. }
  202. else {
  203. $('input[name="q4"]:visible').removeClass('error');
  204. $('.error-text').remove();
  205. return true;
  206. }
  207. }
  208. return q2_validate() && q3_validate() && q4_validate();
  209. }