shisama

<h1>Picture in Picture Web</h1>
supports Chrome 68+, Safari
<div>
<video id="video" style="width: 700px; height: 400px; left: 0px; top: 0px;" src="./sample.mp4" controls></video>
</div>
<div>
<button id="pipButton">Enter Picture in Picture</button>
<p id="windowSize"></p>
</div>

shisama

<input type="text" id="min" value="0"/>
<input type="text" id="sec" value="0"/>
<button id="reset">reset</button>
<div id="time" style="font-size: 400px; text-align: center;">00:00</div>

<script>
function countdown(min, sec, cb) {
	const end = new Date(new Date().getTime() + (min * 60 * 1000) + (sec * 1000));
	let endTime = end.getTime();
	return setInterval(function() {

shisama

<p>abc</p>
<script src="https://nowhere/jquery.js"></script>

<script type="module">
(async() => {
	window.$ = window.jquery || (await import('https://dev.jspm.io/jquery')).default;
	
	$("p").text("def");
})();
</script>

shisama

setTimeout(() => {
    const h1 = document.createElement('h1');
    h1.textContent = 'Hello World!';
    document.getElementById('waiting').remove();
    document.body.appendChild(h1);
}, 3000);

shisama

var arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);

shisama

var arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]); 
// [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]

// only one level is flattened
arr1.flatMap(x => [[x * 2]]);

shisama

class IncreasingCounter {
  #count = 0;
  get value() {
    console.log('Getting the current value!');
    return this.#count;
  }
  increment() {
    this.#count++;
  }
}

shisama

const getGlobal = () => { 
  if (typeof self !== 'undefined') { return self; } 
  if (typeof window !== 'undefined') { return window; } 
  if (typeof global !== 'undefined') { return global; } 
  throw new Error('unable to locate global object'); 
};
const globals = getGlobal();

shisama

const vehicles = ['Motorcycle', 'Bus', 'Car'];
{
  const formatter = new Intl.ListFormat('ja', { style: 'long', type: 'conjunction' });
  console.log(formatter.format(vehicles));
  // expected output: "Motorcycle、Bus、Car"
}
{
  const formatter = new Intl.ListFormat('en', { style: 'long', type: 'conjunction' });
  console.log(formatter.format(vehicles));
  // expected output: "Motorcycle, Bus, and Car"

shisama

let loc = new Intl.Locale("pl-u-hc-h12", {
  calendar: 'gregory'
});

console.log(loc.language); // "pl"
console.log(loc.hourCycle); // "h12"
console.log(loc.calendar); // "gregory"
console.log(loc.toString()); // "pl-u-ca-gregory-hc-h12"