irina_bolbat
/
homework


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142
							<!DOCTYPE HTML>
<html>
    <head>
        <title>
            Static File Index.HTML
        </title>
        <script src='https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js'></script>
    </head>
    <body>
        <div id='formContainer'>
            <input id="nick" placeholder="nick" value="nick">
            <input id="message" placeholder="text" value="msg">
            <button id="btn">Send</button>
        </div>
        <script>
            const socket = io()
            socket.on('msg', msg => {
                let p = document.createElement('p');
                p.innerHTML = `${msg.nick} : ${msg.message}`; 
                document.body.appendChild(p);
                console.log(p);
                getyoutubeRegex(msg.message);
            });

            function getyoutubeRegex(adressVideo){
                const youtubeRegex = /http(?:s?):\/\/(?:www\.)?youtu(?:be\.com\/watch\?v=|\.be\/)([\w\-\_]*)(&(amp;)?‌[\w\?‌=]*)?/;
                const matchStr  = adressVideo.match(youtubeRegex);
                if(matchStr){
                    const iframeNew = document.createElement("iframe");
                    iframeNew.setAttribute("src", `https://www.youtube.com/embed/${matchStr[1]}`);
                    iframeNew.style.width = "300px";
                    iframeNew.style.height = "250px";
                    document.body.appendChild(iframeNew);
                }
            }

            btn.onclick = () => {
                socket.emit('msg', {nick: nick.value, message: message.value});
            } ; 
        </script>
    </body>
</html>