1  import { md5hex } from "../../../impl/utils";
  2  import Code from "../../Code";
  3  import Output from "../../Output";
  4  
  5  const AudioCodecsExtendedHashDemo = () => {
  6    return (
  7      <div>
  8        <Code
  9          snippet={`
 10  () => {
 11    const AUDIO_EXTRA_CODECS = [
 12      'audio/mp4; codecs="mp4a.40"',
 13      'audio/mp4; codecs="mp4a.40.1"',
 14      'audio/mp4; codecs="mp4a.40.2"',
 15      'audio/mp4; codecs="mp4a.40.3"',
 16      'audio/mp4; codecs="mp4a.40.4"',
 17      'audio/mp4; codecs="mp4a.40.5"',
 18      'audio/mp4; codecs="mp4a.40.6"',
 19      'audio/mp4; codecs="mp4a.40.7"',
 20      'audio/mp4; codecs="mp4a.40.8"',
 21      'audio/mp4; codecs="mp4a.40.9"',
 22      'audio/mp4; codecs="mp4a.40.12"',
 23      'audio/mp4; codecs="mp4a.40.13"',
 24      'audio/mp4; codecs="mp4a.40.14"',
 25      'audio/mp4; codecs="mp4a.40.15"',
 26      'audio/mp4; codecs="mp4a.40.16"',
 27      'audio/mp4; codecs="mp4a.40.17"',
 28      'audio/mp4; codecs="mp4a.40.19"',
 29      'audio/mp4; codecs="mp4a.40.20"',
 30      'audio/mp4; codecs="mp4a.40.21"',
 31      'audio/mp4; codecs="mp4a.40.22"',
 32      'audio/mp4; codecs="mp4a.40.23"',
 33      'audio/mp4; codecs="mp4a.40.24"',
 34      'audio/mp4; codecs="mp4a.40.25"',
 35      'audio/mp4; codecs="mp4a.40.26"',
 36      'audio/mp4; codecs="mp4a.40.27"',
 37      'audio/mp4; codecs="mp4a.40.28"',
 38      'audio/mp4; codecs="mp4a.40.29"',
 39      'audio/mp4; codecs="mp4a.40.32"',
 40      'audio/mp4; codecs="mp4a.40.33"',
 41      'audio/mp4; codecs="mp4a.40.34"',
 42      'audio/mp4; codecs="mp4a.40.35"',
 43      'audio/mp4; codecs="mp4a.40.36"',
 44      'audio/mp4; codecs="mp4a.66"',
 45      'audio/mp4; codecs="mp4a.67"',
 46      'audio/mp4; codecs="mp4a.68"',
 47      'audio/mp4; codecs="mp4a.69"',
 48      'audio/mp4; codecs="mp4a.6B"',
 49      'audio/mp4; codecs="mp3"',
 50      'audio/mp4; codecs="flac"',
 51      'audio/mp4; codecs="bogus"',
 52      'audio/mp4; codecs="aac"',
 53      'audio/mp4; codecs="ac3"',
 54      'audio/mp4; codecs="A52"',
 55      'audio/mpeg; codecs="mp3"',
 56      'audio/wav; codecs="0"',
 57      'audio/wav; codecs="2"',
 58      'audio/wave; codecs="0"',
 59      'audio/wave; codecs="1"',
 60      'audio/wave; codecs="2"',
 61      'audio/x-wav; codecs="0"',
 62      'audio/x-wav; codecs="1"',
 63      'audio/x-wav; codecs="2"',
 64      'audio/x-pn-wav; codecs="0"',
 65      'audio/x-pn-wav; codecs="1"',
 66      'audio/x-pn-wav; codecs="2"',
 67    ];
 68  
 69    const audio = document.createElement("audio");
 70    const codecs = {};
 71  
 72    AUDIO_EXTRA_CODECS.forEach((codec) => {
 73      let canPlay = null;
 74      let mediaSource = null;
 75  
 76      if (audio.canPlayType) canPlay = audio.canPlayType(codec);
 77  
 78      if (window.MediaSource && window.MediaSource.isTypeSupported)
 79        mediaSource = window.MediaSource.isTypeSupported(codec);
 80  
 81      codecs[codec] = {
 82        canPlay: canPlay,
 83        mediaSource: mediaSource,
 84      };
 85    });
 86  
 87    return md5hex(JSON.stringify(codecs));
 88  }
 89          `.trim()}
 90        />
 91  
 92        <Output
 93          generator={() => {
 94            const AUDIO_EXTRA_CODECS = [
 95              'audio/mp4; codecs="mp4a.40"',
 96              'audio/mp4; codecs="mp4a.40.1"',
 97              'audio/mp4; codecs="mp4a.40.2"',
 98              'audio/mp4; codecs="mp4a.40.3"',
 99              'audio/mp4; codecs="mp4a.40.4"',
100              'audio/mp4; codecs="mp4a.40.5"',
101              'audio/mp4; codecs="mp4a.40.6"',
102              'audio/mp4; codecs="mp4a.40.7"',
103              'audio/mp4; codecs="mp4a.40.8"',
104              'audio/mp4; codecs="mp4a.40.9"',
105              'audio/mp4; codecs="mp4a.40.12"',
106              'audio/mp4; codecs="mp4a.40.13"',
107              'audio/mp4; codecs="mp4a.40.14"',
108              'audio/mp4; codecs="mp4a.40.15"',
109              'audio/mp4; codecs="mp4a.40.16"',
110              'audio/mp4; codecs="mp4a.40.17"',
111              'audio/mp4; codecs="mp4a.40.19"',
112              'audio/mp4; codecs="mp4a.40.20"',
113              'audio/mp4; codecs="mp4a.40.21"',
114              'audio/mp4; codecs="mp4a.40.22"',
115              'audio/mp4; codecs="mp4a.40.23"',
116              'audio/mp4; codecs="mp4a.40.24"',
117              'audio/mp4; codecs="mp4a.40.25"',
118              'audio/mp4; codecs="mp4a.40.26"',
119              'audio/mp4; codecs="mp4a.40.27"',
120              'audio/mp4; codecs="mp4a.40.28"',
121              'audio/mp4; codecs="mp4a.40.29"',
122              'audio/mp4; codecs="mp4a.40.32"',
123              'audio/mp4; codecs="mp4a.40.33"',
124              'audio/mp4; codecs="mp4a.40.34"',
125              'audio/mp4; codecs="mp4a.40.35"',
126              'audio/mp4; codecs="mp4a.40.36"',
127              'audio/mp4; codecs="mp4a.66"',
128              'audio/mp4; codecs="mp4a.67"',
129              'audio/mp4; codecs="mp4a.68"',
130              'audio/mp4; codecs="mp4a.69"',
131              'audio/mp4; codecs="mp4a.6B"',
132              'audio/mp4; codecs="mp3"',
133              'audio/mp4; codecs="flac"',
134              'audio/mp4; codecs="bogus"',
135              'audio/mp4; codecs="aac"',
136              'audio/mp4; codecs="ac3"',
137              'audio/mp4; codecs="A52"',
138              'audio/mpeg; codecs="mp3"',
139              'audio/wav; codecs="0"',
140              'audio/wav; codecs="2"',
141              'audio/wave; codecs="0"',
142              'audio/wave; codecs="1"',
143              'audio/wave; codecs="2"',
144              'audio/x-wav; codecs="0"',
145              'audio/x-wav; codecs="1"',
146              'audio/x-wav; codecs="2"',
147              'audio/x-pn-wav; codecs="0"',
148              'audio/x-pn-wav; codecs="1"',
149              'audio/x-pn-wav; codecs="2"',
150            ];
151  
152            const audio = document.createElement("audio");
153            const codecs = {};
154  
155            AUDIO_EXTRA_CODECS.forEach((codec) => {
156              let canPlay = null;
157              let mediaSource = null;
158  
159              if (audio.canPlayType) canPlay = audio.canPlayType(codec);
160  
161              if (window.MediaSource && window.MediaSource.isTypeSupported)
162                mediaSource = window.MediaSource.isTypeSupported(codec);
163  
164              // @ts-expect-error
165              codecs[codec] = {
166                canPlay: canPlay,
167                mediaSource: mediaSource,
168              };
169            });
170  
171            return md5hex(JSON.stringify(codecs));
172          }}
173        />
174      </div>
175    );
176  };
177  
178  export default AudioCodecsExtendedHashDemo;