앱 권한 화면 추가 및 코칭 화면 추가

src/main/webapp/WEB-INF/views/mob/common/fragments/FooterMob.html

@@ -132,6 +132,59 @@
 		<div class="btPopAuto_body"></div>
 	</div>
 
+	<!-- 210623_ 추가 : 최근본상품 -->
+	<div id="hstrFull">
+		<div class="fullHead">
+			<h1 id="htopTitle" >최근 본 상품</h1>
+			<a href="javascript:hstr_cls();" class="hstr_cls">close</a>
+		</div>
+		<div class="fullBody">
+			<div class="inner">
+
+				<div class="list_content" id="hstArea">  <!-- 데이터 없을시 클래스 nodata 추가 -->
+					<div class="count_wrap">
+						<div>
+							<p><span id="quickMenuTodayCount">0</span>개의 상품</p>
+						</div>
+					</div>
+					<div class="list_defult"> <!-- 210722_ 추가 : nodata 멘트 영역 -->
+						<div>
+							<p>최근 본 상품이 없습니다.</p>
+						</div>
+					</div>
+					<div class="itemsGrp" id="quickMenuTodayGoods"> <!-- itemsGrp rank hot deal -->
+
+					</div>
+				</div>
+			</div>
+
+		</div>
+	</div>
+	<!-- // 210623_ 추가 : 최근본상품 -->
+	
+	<!-- 앱 접근 권한 안내 -->
+	<aside class="etcApp" id="accHide" style="display: none;">
+		<div class="accWrap">
+			<div class="inner">
+				<div class="titWrap">
+					<h2>앱 접근 권한 안내</h2>
+				</div>
+			</div>
+			<div class="inner">
+				<div>
+					<img src="/images/mo/page_accessApp.jpg" alt="스타일24앱 사용을 위해서는 기기 및 앱 기록, 알림, 카메라, 사진/갤러리, 전화의 선택적 접근 허용이 필요합니다.">
+				</div>
+			</div>
+			<div class="inner">
+				<div class="btn_group btn_group_flex">
+					<div>
+						<button type="button" class="btn btn_dark" id="accBtn"><span>확인</span></button>
+					</div>
+				</div>
+			</div>
+		</div>
+	</aside>
+
 	<!--앱 마케팅 수신동의-->
 	<aside class="etcApp" id="alramHide" style="display: none;">
 		<!-- 마케팅 알람 수신 동의 -->
@@ -154,43 +207,9 @@
 			</div>
 		</div>
 	</aside>
-
-
-<!-- 210623_ 추가 : 최근본상품 -->
-<div id="hstrFull">
-	<div class="fullHead">
-		<h1 id="htopTitle" >최근 본 상품</h1>
-		<a href="javascript:hstr_cls();" class="hstr_cls">close</a>
-	</div>
-	<div class="fullBody">
-		<div class="inner">
-
-			<div class="list_content" id="hstArea">  <!-- 데이터 없을시 클래스 nodata 추가 -->
-				<div class="count_wrap">
-					<div>
-						<p><span id="quickMenuTodayCount">0</span>개의 상품</p>
-					</div>
-				</div>
-				<div class="list_defult"> <!-- 210722_ 추가 : nodata 멘트 영역 -->
-					<div>
-						<p>최근 본 상품이 없습니다.</p>
-					</div>
-				</div>
-				<div class="itemsGrp" id="quickMenuTodayGoods"> <!-- itemsGrp rank hot deal -->
-					
-				</div>
-			</div>
-		</div>
-
-	</div>
-</div>
-<!-- // 210623_ 추가 : 최근본상품 -->
-	
-
-	<div id="backBtn" class="guidance ontoast" style=" display: none;">
-		<p>'뒤로'버튼을 한번 더 누르시면 종료됩니다.</p>
-	</div>
-
+	<style>
+		.guidance.ontoast {animation: onpop 2s .2s forwards; -webkit-animation: onpop 2s .2s forwards;}
+	</style>
 	<div id="mkPushAgree" class="guidance ontoast" style="display: none;">
 		<p class="tit">마케팅 PUSH 수신동의</p>
 		<p class="date"></p>
@@ -203,6 +222,13 @@
 		<p>광고성 정보 PUSH 알림 수신을 거부하셨습니다.<br>앱 설정에서 변경 가능합니다.</p>
 	</div>
 
+	<aside class="etcApp" id="coachHide" style="display: none;">
+		<div class="coach">
+			<span id="coachmask01"><em></em></span>
+			<span id="coachmask02"><em></em></span>
+			<span id="coachmask03"><em></em></span>
+		</div>
+	</aside>
 <script th:inline="javascript">
 /*<![CDATA[*/
 	function menu() {
@@ -504,20 +530,27 @@
 
 	});
 
-	// 앱 최초기동시
+	// 앱 최초기동시 -> 접근권한 안내
 	var agreeMarketingPush = function () {
-		$('#alramHide').show();
+		$('#accHide').show();
 		let today = new Date().format('YYYY.MM.DD');
 		$('#mkPushAgree > .date').text(today);
 		$('#mkPushDisAgree > .date').text(today);
 	}
 
+	// 접근권한 확인 -> 앱 마케팅 푸시
+	$(document).on('click','#accBtn',function() {
+		$('#accHide').hide();
+		$('#alramHide').show();
+	});
+
 	// 앱마케팅 푸시 수신동의
 	$(document).on('click','#btnMkPushAgree',function() {
 		$('#alramHide').hide();
 		fnSetPush('ON', 'ON');
 		$('#mkPushAgree').show();
 		guidancepop();
+		fnCoach();
 	});
 
 	// 앱마케팅푸시 수신거부
@@ -526,6 +559,7 @@
 		fnSetPush('ON', 'OFF');
 		$('#mkPushDisAgree').show();
 		guidancepop();
+		fnCoach();
 	});
 
 	var fnSetPush = function(appPushOnOff, mkPushOnOff) {
@@ -538,13 +572,33 @@
 		}
 	}
 
+	// 앱푸시여부 얼럿 메시지 내용
 	var guidancepop = function() {
 		if(!$(".guidance").hasClass("ontoast")){
 			$(".guidance").addClass("ontoast");
-			setTimeout(function(){$(".guidance").removeClass("ontoast");}, 5000);
+			setTimeout(function() {
+					$(".guidance").removeClass("ontoast");
+				}, 2000);
 		}
 	}
 
+	var fnCoach = function () {
+		setTimeout(function() {
+					$('#coachHide').show();
+				}, 2000);
+	}
+
+	// 앱코치
+	$('.coach').click(function() {
+		var jbTime = 450;
+		$( '.coach' ).animate( {
+			opacity: '0',
+		}, jbTime, function() {
+			$( '.coach' ).remove();
+			$('#coachHide').hide();
+		});
+	});
+
 	if($(".popup_main_notice").hasClass("active")){
 		$("body").css({"overflow":"hidden"});
 	}else{