Guides

모아보기 알람 기능

Suggest Edits

📘

모아보기 알람 기능은 API 연동이 필요합니다.

연동 필요시에 모비두 담당자에게 문의해주세요.

📨 메일로 문의하기

🔔 카카오톡 채널로 문의하기

모아보기 알람 기능

브릿지로 세팅가능합니다. (회원 로그인시만 동작합니다.)

알람 버튼 클릭시 아래 함수 선언시 아래의 함수가 실행됩니다. 아래의 정의된 값들을 읽어서 API 연동을 해주시면 됩니다.

// 알람 버튼 클릭시 동작합니다.
// 현재 방송에 대한 알람 데이터 API 등록 완료시에  //dispatchEvent(window.flexCollectApplyCheckNotification(applyBroadcastObj))
// 를 실행해주시면 버튼 UI 가 나누어진 모듈 전체에 반영됩니다.
 function flexCollectApplyForNotification(params){
        console.log('flexCollectApplyForNotification',params:NotificationParams)
        const applyBroadcastObj={ broadcastId:params.broadcastId  }  
        const response = fetch('YOUR_API' ).then()...
        if(response.isOk){
          dispatchEvent(window.flexCollectApplyCheckNotification(applyBroadcastObj))
        }
        
     }
// 알람이 된 버튼 클릭시 동작합니다.
// 현재 방송에 대한 알람 데이터 API 취소 완료시에 
// dispatchEvent(window.flexCollectCancelCheckNotification(applyBroadcastObj))
// 를 실행해주시면 버튼 UI 가 나누어진 모듈 전체에서 취소됩니다.
 function flexCollectCancelForNotification(params){
         console.log('flexCollectCancelForNotification',params)
         const canceledBroadcastObj={ broadcastId:params.broadcastId  }
         const response = fetch('YOUR_API' ).then()...
         if(response.isCancel){
          dispatchEvent(window.flexCollectCancelCheckNotification(applyBroadcastObj))
        }
     }

알람 브릿지의 param 타입 정의

필드명타입설명
memberIdString고객 ID
programmingStartDtString방송 시작 시간 (예: UTC"2022-02-01T06:34:00.000Z")
programmingEndDtString방송 종료 시간 (예: UTC"2022-02-02T06:34:00.000Z")
broadcastIdString방송 ID
accessTokenStringJWT TOKEN

모듈화 방식 알람 예시 코드

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id='sauce_collect'></div>
    <div id='sauce_curation_1'></div>
    <div id='sauce_curation_2'></div>
<script type="text/javascript" src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>

 // 실제 모달을 아래 flexCollectApplyForNotification 로 띄운 이후 확인 버튼에 대한 체크를 확인하면
 // 아래처럼 방송ID 를 Object 로  dispatchEvent(window.flexCollectApplyCheckNotification()) 
 // 으로 보내주시면 전체 모듈에서 알람이 갱신되어 신청으로 변경됩니다.
function flexCollectApplyForNotification(params){
        console.log('flexCollectApplyForNotification',params)
        const applyBroadcastObj={ broadcastId:params.broadcastId  }  
        if( window.confirm('알람신청 하시겠습니까?')){
            dispatchEvent(window.flexCollectApplyCheckNotification(applyBroadcastObj))
        }
    }
 // 실제 모달을 아래 flexCollectApplyForNotification 로 띄운 이후 취소 버튼에 대한 체크를 확인하면
 // 아래처럼 방송ID 를 Object 로  dispatchEvent(window.flexCollectCancelCheckNotification()) 
 // 으로 보내주시면 전체 모듈에서 알람이 취소됩니다.
function flexCollectCancelForNotification(params){
         console.log('flexCollectCancelForNotification',params)
         const canceledBroadcastObj={ broadcastId:params.broadcastId  }
         if( window.confirm('취소 하시겠습니까?')){
            dispatchEvent(window.flexCollectCancelCheckNotification(canceledBroadcastObj))
        }
    }
  
  window.addEventListener('DOMContentLoaded',()=>{   
     window.SauceWebLib.setInit({partnerId:'uiux' , accessToken:'JWT'})
     window.SauceWebLib.loadCalendar({elementId:'sauce_curation_1'})
     window.SauceWebLib.loadSchedule({scheduleType:'feed',elementId:'sauce_curation_2'})
   })
</script>
</body>
</html>

Updated about 1 hour ago