Untitled

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <style>
        h1,p,h3 {
            font-family: "Tahoma";
        }
        a {
            font-size: 10px;
            font-family: "tahoma";
            color: #000;
            padding: none;
            text-decoration: none;
        }
		h3{
			font-size: 15px;
			padding: none;
			width:150px;
		}
        a:hover {
            color: blue;
            text-decoration: none;
        }

        .volume {
            left: 15%;
            width: 100px;
            bottom: 2px;
            height: 10px;
        }

        .p2pFailed {
            background: red;
            width: 55px;
        }

        .p2pDisconnected {
            background: orange;
            width: 55px;
        }

        .p2pCompleted,.p2pConnected {
            background: green;
            width: 55px;
        }

        table,th,tr {
            border: 3px solid black;
        }

        button {
            border: none;
            background: none;
        }
		#lgsm {
			height:10%;
			width:10%;
		}
    </style>
    <a href="index.html"><img src="dux.png" id="lgsm"></a>
    <a href="sci.htm">  Science  </a>
    <a href="tec.htm">  Technology  </a>
    <a href="biz.htm">  Business  </a>
    <a href="pol.htm">  Politics  </a>
    <a href="mus.htm">  Music  </a>
    <a href="tv.htm">  Tv  </a>
    <a href="com.htm">  Comedy  </a>
    <a href="drw.htm">  Drawing(idle board)  </a>
    <a href="vdg.htm">  Video Games(idle board)  </a>
    <a href="cod.htm">  Coding(idle board)  </a>
    <a href="qna.htm">  QnA  </a>
    <a href="his.htm">  History  </a>
    <a href="hob.htm">  Hobbies  </a>
    <a href="rnd.htm">  Random  </a>
    <a href="bob.htm">  Battle Of the Boards  </a>
    <hr>
    <table>
        <tr>
            <th><button onclick="mute()"><img width="50%" height="50%" src="speaker.png" id="urimg"></button><meter width="10" id="localVolume" class="volume" min="-45" max="-20" high="-25" low="-40" value="-45"></meter></th>
        </tr>
    </table>
    <div id="remotes"></div>
    <div id="remotesVideos"></div>
    <video height="300" id="localVideo"></video>
    <script src="https://webrtc.github.io/adapter/adapter-4.2.2.js"></script>
    <script src="https://simplewebrtc.com/latest-v2.js"></script>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    <script type="text/javascript">
    	var rm="drw";
    </script>
    <script type="text/javascript">
        var webrtc = new SimpleWebRTC({
            remoteVideosEl: 'remotesVideos',
            localVideoEl: 'localVideo',
            autoRequestMedia: true,
			detectSpeakingEvents: true,
            autoAdjustMic: false,
            media: {
                video: false,
                audio: true
            },
            debug: false
        });
        webrtc.on('readyToCall', function() {
            webrtc.joinRoom(rm);
        });
        if (location.protocol == "http:") {
            alert("Please use https://www. on our page, otherwise RTC will not function.");
        }

        function showVolume(el, volume) {
            if (!el) return;
            if (volume < -45) volume = -45;
            if (volume > -20) volume = -20;
            el.value = volume;
        }

        function track(name, info) {
            if (webrtc && webrtc.connection) {
                webrtc.connection.emit('metrics', name, info || {});
            }
        }
var thisNumRand;
        webrtc.on('createdPeer', function(peer) {
        	var pyd =peer.id.substring(0,6);
			for(var i=0; i<6; i++){
				var strout=0;
				var alphabet = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","1","2","3","4","5","6","7","8","9","0","-"];
				var letter = pyd[i];
				var letterPosition = alphabet.indexOf(letter)+1;
				strout=strout+letterPosition;
				if (i==0){
					thisNumRand=strout*26291;
				}
			}
            var remotes = document.getElementById('remotes');
            if (!remotes) return;
            var container = document.createElement('div');
            container.className = 'peerContainer';
            container.id = 'container_' + webrtc.getDomId(peer);
            var tri = document.createElement('tr');
			var th = document.createElement('th');
			var name = document.createElement('h3');
			name.style.color="#"+thisNumRand;
			txn = document.createTextNode("Anon "+thisNumRand);
			name.appendChild(txn);
			th.appendChild(name);
			var thi = document.createElement('th');
            var thii = document.createElement('th');
            var img = document.createElement('img');
            img.src = "speaker.png";
            img.height = 50;
            img.width = 50;
            var mute = document.createElement('a');
            var vol = document.createElement('meter');
            vol.id = 'volume_' + peer.id;
            vol.className = 'volume';
            vol.min = -45;
            vol.max = -20;
            vol.low = -40;
            vol.high = -25;
            thi.appendChild(mute);
            mute.appendChild(img);
            thii.appendChild(vol);
            tri.appendChild(thi);
			tri.appendChild(th);
            tri.appendChild(thii);
            container.appendChild(tri);
            remotes.appendChild(container);
			/*if(pmu==clientson){
				webrtc.leaveRoom();
			}saving it for when i get my errors otw*/
			var xnte=0;
            mute.onclick = function() {
            	var cli ="#"+webrtc.getDomId(peer) + '_video_incoming';
            	console.log("bp1");
                xnte = xnte + 1;
            	if (xnte % 2 == 0) {// unmute
                    $(cli).prop('muted', true);
                    img.src = 'muted.png';
                    console.log("bp2");
                } else { // mute
                    $(cli).prop('muted', false);
                    img.src = 'speaker.png';
                    console.log("bp3");
                }
            };

            if (peer && peer.pc) {
                peer.firsttime = true;
                peer.pc.on('iceConnectionStateChange', function(event) {
                    var state = peer.pc.iceConnectionState;
                    container.className = 'peerContainer p2p' +
                        state.substr(0, 1).toUpperCase() +
                        state.substr(1);
                    switch (state) {
                        case 'connected':
                        case 'completed':
                            mute.style.visibility = 'visible';
                            if (peer.firsttime) {
                                peer.firsttime = false;
                                track('iceSuccess', {
                                    session: peer.sid,
                                    peerprefix: peer.browserPrefix,
                                    prefix: webrtc.capabilities.prefix,
                                    version: webrtc.capabilities.browserVersion
                                });
                            }
                            break;
                        case 'closed':
                            container.remove();
                            break;
                    }
                });
            }
            remotes.appendChild(container);
        });
        webrtc.on('volumeChange', function(volume, threshold) {
            showVolume(document.getElementById('localVolume'), volume);
        });
        webrtc.on('remoteVolumeChange', function(peer, volume) {
            showVolume(document.getElementById('volume_' + peer.id), volume);
        });
        var totalSeconds = 0;
        setInterval(setTime, 1000);
        function setTime() {
            ++totalSeconds;
            if (totalSeconds > 300) {
                webrtc.leaveRoom();
                document.write("Disconnected due to inactivity");
                window.location = "index.html";
            }
        }
        var px = 0;
        function mute() {
            px = px + 1;
            if (px % 2 == 0) {
                webrtc.unmute();
                $("#urimg").attr("src", "speaker.png");
            } else {
                webrtc.mute();
                $("#urimg").attr("src", "muted.png");
            }
        }
    </script>
</body>
</html>