firstapp/index.html at main · craftment/firstapp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<body>
  <h1>영상 녹화 및 관리 시스템</h1>

  <button id="startRecording" onclick="startRecording()">녹화 시작</button>

  <div>
    <button class="button" id="premiumService" onclick="activatePremium()">프리미엄 서비스</button>
    <button class="button" id="secretGalleryButton" onclick="showSecurityKeyPrompt()">비밀 갤러리</button>
  </div>

  <div id="secretGallery">
    <h2>비밀 갤러리</h2>
    <div id="videoGallery"></div>
    <div id="noVideosMessage">
      <p>촬영한 동영상이 없습니다.</p>
    </div>
  </div>

  <!-- 보안키 입력창 -->
  <div id="securityKeyPrompt">
    <h2>보안키 입력</h2>
    <input type="password" id="securityKeyInput" placeholder="보안키를 입력하세요">
    <button id="enterKeyButton" onclick="verifySecurityKey()">입력</button>
  </div>

  <script>
    let user = {
      isPremium: false,
      isDeveloper: false,
      videos: [],
      securityKey: 'dev1234'  // 개발자만 접근 가능한 보안키
    };

    if (!user.isDeveloper) {
      document.getElementById("secretGalleryButton").style.display = "none";
    }

    function activatePremium() {
      user.isPremium = true;
      alert('프리미엄 서비스가 활성화되었습니다!');
      updateUIForPremiumUser();
    }

    function updateUIForPremiumUser() {
      document.getElementById('startRecording').innerText = '무제한 녹화 시작';
    }

    function showSecurityKeyPrompt() {
      document.getElementById('securityKeyPrompt').style.display = 'block';
    }

    function verifySecurityKey() {
      const inputKey = document.getElementById('securityKeyInput').value;
      if (inputKey === user.securityKey) {
        document.getElementById('securityKeyPrompt').style.display = 'none';
        viewSecretGallery();
      } else {
        alert('보안키가 잘못되었습니다. 다시 시도해주세요.');
      }
    }

    function viewSecretGallery() {
      if (user.videos.length === 0) {
        document.getElementById('noVideosMessage').style.display = 'block';
      } else {
        document.getElementById('noVideosMessage').style.display = 'none';
        showVideos(user);
      }
    }

    function showVideos(user) {
      const videoGallery = document.getElementById('videoGallery');
      user.videos.forEach(video => {
        const videoElement = document.createElement('video');
        videoElement.src = video.url;
        videoGallery.appendChild(videoElement);
      });
    }

    function startRecording() {
      alert('녹화가 시작되었습니다.');
    }
  </script>
</body>