deploy

i4/lobby.js

@@ -24,7 +24,10 @@ var mod_path ="ign/rf/i4m/"
 var mtx_2 ={	
 	// js:["ign/m/timer/m.js","ign/m/timer/m0.js"],
 	js:[`${mod_path}m0.js`,`${mod_path}m.js`,],
-	css:[`${mod_path}m.css`,`${mod_path}m1.css,`,`${mod_path}m2.css`,],
+	css:[`${mod_path}m.css`,`${mod_path}m1.css,`,
+	// `${mod_path}m2.css`,
+	`${mod_path}m3.css`,
+	],
 	// menu.svg
 // thumb-menu.svg
 	html:[{url:`${mod_path}m.html`,diffH:get_cui_html,success:html_rld_cb4,success_js:"html_js_handler_lobby"},

rf/filmstrip_mod/m.js

@@ -88,6 +88,7 @@ function scroll_timeout_runner(){
 	// scroll_send)
 	var ov_timeout=$("#ov_timeout")[0]
 	var ov_timeout_disable=$("#ov_timeout_disable")[0]
+    clog("scroll_timeout run",ov_timeout_disable.checked)
 	// ov_timeout_disable
 	if (ov_timeout_disable.checked){
 		timeout_scroll_glob.stop = 1
@@ -257,11 +258,11 @@ function init_api6(){
     var n,nt
     n = `<span class="plugin_top pseudo_vid small_vid "><div class="m2 xbox2">ABC</div></span>`
     nt = templates.find(".pseudo_vid_a")
-    if (nt.length && 1){
+    if (nt.length && 0){
         n = $(nt[0].outerHTML)
          
-        // nt = mod_templates.find(".pseudo_vid_avatar.named")
-        nt = templates.find(".pseudo_vid_avatar.named")
+        nt = mod_templates.find(".pseudo_vid_avatar.named")
+        // nt = templates.find(".pseudo_vid_avatar.named")
         // nt = templates.find(".pseudo_vid_avatar.anon")
         add_node(nt,n,"append")
         n = n[0].outerHTML
@@ -464,7 +465,7 @@ function rotate_vids(){
 function scroll_send(){
     // clog("zzzzzzzzzz")
     // scroll_disabled
-    return
+    // return
 
             tmsgx({
                 "type":"event",

rf/filmstrip_mod/m0.js

@@ -766,24 +766,48 @@ timeout_scroll_glob = window.timeout_scroll_glob || {
 }
 timeout_scroll_glob.stop=1
 function timeout_scroll(rid){
+    timeout_scroll_glob.stop =1
     // scroll_disabled
-    return
-    // clog("Tscroll",rid,timeout_scroll_glob)
+    // return
+    clog("Tscroll",rid,timeout_scroll_glob)
     if (timeout_scroll_glob.stop || rid != timeout_scroll_glob.rid){
-        // clog("tscroll stop")
+        clog("tscroll stop")
         return
     }
         // clog("tscroll continue")
         msto.conference.rotate_index = msto.conference.rotate_index || 0
+        msto.conference.rotate_index2 = msto.conference.rotate_index2 || 12
+        var rotate_index2 = msto.conference.rotate_index2
+        var rotate_index = msto.conference.rotate_index
+
+
+
+
+
+
         msto.conference.rotate_index += 1 
+        msto.conference.rotate_index2 += 1 
+
+
         // scroll_send()
         setTimeout(scroll_send,20)
     var t = setTimeout(timeout_scroll,timeout_scroll_glob.timeout,rid)
 
 }
+function timeout_scroll_start_now(){
+    timeout_scroll_glob.stop =1
+    return
+    timeout_scroll_glob.rid += 1
+    clog("tscroll timeout_scroll_start_now")
+    timeout_scroll(timeout_scroll_glob.rid)
+    // setTimeout(timeout_scroll,timeout_scroll_glob.timeout,timeout_scroll_glob.rid)
 
+}
 function timeout_scroll_start(){
+    timeout_scroll_glob.stop =1
+    return
     timeout_scroll_glob.rid += 1
+    clog("tscroll timeout_scroll_start")
     setTimeout(timeout_scroll,timeout_scroll_glob.timeout,timeout_scroll_glob.rid)
 
 }

rf/fs.css

@@ -407,6 +407,20 @@ y
 /*#sharedVideoContainer.focus_test{*/
 	/*outline: 6px solid #0f0;*/
 }
+
+body {
+    /*font-family: 'Montserrat';font-size: 22px !important;*/
+    font-family: 'Montserrat'  !important;
+    font-weight: bold; 
+
+}
+body * {
+    /*font-family: 'Montserrat';font-size: 22px !important;*/
+    font-family: 'Montserrat'  !important;
+    font-weight: bold; 
+    
+}
+
 /*
 .z.small_vid video {
 */

rf/i4m/m.css

@@ -58,7 +58,7 @@ html {
 	/*background-image: linear-gradient(to bottom #0000, #0ff8, #0009);*/
 		/*background-image: linear-gradient( 10% #0000, 30% #0ff0, 60% #0009);*/
 
-	background-image: linear-gradient( #0000 , #0000, #000a);
+	/*background-image: linear-gradient( #0000 , #0000, #000a);*/
 
 }
 

rf/i4m/m.html

@@ -46,31 +46,66 @@
 			<span class="tile_overlay text_input_template_v2 v1">
 				<div class="ti_container_div">
 					
-				<span class="ti_label">room</span><input type="text" class="text_input text_input_v2">
+				<span class="ti_label">room</span><input type="text" class="text_input text_input_v2 room">
 				</div>
 
-				<br>
-				<div class="ti_container_div">
+<!-- 				<div class="ti_container_div">
 				<span class="ti_label">password</span><input type="text" class="text_input text_input_v2">
 				</div>
-				<hr>
-				<div class="hr"></div>
+ -->
+
+
+			</span>
+			
+
+
+			<span class="tile_overlay text_input_template_v2 v1 password">
+<!-- 				<div class="ti_container_div">
+					
+				<span class="ti_label">room</span><input type="text" class="text_input text_input_v2">
+				</div> -->
 
 				<div class="ti_container_div">
-				<span class="ti_label"></span><input type="text" class="text_input text_input_v2">
+				<span class="ti_label">password</span><input type="text" class="text_input text_input_v2">
 				</div>
 
+
+
 			</span>
 				
+
+
 			<div class="tile_title"></div>
 			<div class="tile_button">Join Now</div>
 		</span>
+
+
+
+
+
+
+
+
+
+
+
+
 		</span>
 
 
 
 </span>
+<span>
 
+				<hr>
+				<div class="hr"></div>
+
+				<div class="ti_container_div">
+				<span class="ti_label"></span><input type="text" class="text_input text_input_v2">
+				</div>
+	
+				<br>
+</span>
 
 </span>
 

rf/i4m/m.js

@@ -193,8 +193,15 @@ function tile_button_cb(e){
 	var room_name = rspan[0].dataset["room"]
 
 	// clog("tile_button",rspan[0].dataset["room"],{that:this,e})
+		var rlen
+		rlen = $(".room")
 	// clog("nav",location.pathname + rspan[0].dataset["room"])
 	if (!room_name){
+		if (rlen.length && rlen[0].value){
+		
+	location.assign(location.pathname + rlen[0].value)
+
+		}
 		clog("<>")
 		return 
 
@@ -211,6 +218,21 @@ dj_tiles = [
 ]
 
 // $(".rxt")[0].style.cssText
+function key_up(event){
+	clog("K",event)
+	var rlen
+	if (event.key == "Enter"){
+		// tile_button_cb()
+		rlen = $(".room")
+if (rlen.length && rlen[0].value){
+		
+	location.assign(location.pathname + rlen[0].value)
+
+		}
+
+	}
+
+}
 
 function add_tiles(){
 	// var rtile = mod_templates_4.find(".room_span.rxt")
@@ -225,6 +247,7 @@ function add_tiles(){
 
 	// djtc.push({})
 	while (i < djtc.length ){
+		break
 
 		n = $(rtile2)
 		// djt = dj_tiles[i] ? dj_tiles[i] :{} 
@@ -249,14 +272,17 @@ function add_tiles(){
 		}
 		i+=1
 		// clog("//",i)
-	}
+	}	
+		rtile.find(".room")[0].onkeyup = key_up
+		// rtile.find(".room")[0].onkeypress = key_up
+		// rtile.find(".room").change(key_up
 		add_node(rtile,".rooms_dir_full","prepend")
+
 	resize_tiles()
 	// set_width()
 
 }
 
-
 function set_width(){
 	var rdf = $('.rooms_dir_full')
   // var totalWidth = 20;
@@ -269,7 +295,8 @@ function set_width(){
     // totalWidth += ?  :
     // totalWidth +=  ?  :
   });
-     rdf.css('width', totalWidth + 3);
+     // rdf.css({'width': totalWidth + 3,"--vwidth":window.width});
+     rdf.css({'width': totalWidth + 3});
 }
 
 function px_int(s){

rf/i4m/m2.css

@@ -34,6 +34,7 @@
 
 .rxi{
 	--vback: #111;
+	--vback: #333;
 	/*--vback: #f00;*/
 	--vtxt: #fff;
 	/*--vtxt: #f00;*/
@@ -219,6 +220,7 @@
 	/*margin: 1px;*/
 	/*opacity: 0;*/
 	/*background-color: var(--vback,unset);*/
+
 	background-color: var(--vback,#fff);
 	color: var(--vtxt,#fff);
 	/*color: #fff;*/
@@ -256,6 +258,7 @@
 	/*outline: 2px solid red;*/
 	display: flex;
 	display: inline-flex;
+	display: block;
 	width: 300px; 
 	border: 2px solid var(--vtxt,#fff);
 	/*border: 2px solid #0ff;*/
@@ -349,3 +352,25 @@
 	/*height: 2em;*/
 	/*top: 0px; left: 0px; right: 0px; bottom: 0px;*/
 }
+
+
+.room_span_container {
+/*.rxi.z {*/
+	background-color: var(--vback);
+}
+
+.rooms_dir {
+	/*align-items: center;*/
+	/*padding-left: 0%;*/
+}
+.rooms_dir_full {
+	/*left: calc((var(--innerWidth) - 75px)/2);*/
+	left: calc(((var(--innerWidth) ) - 150px) /2);
+	/*left: calc(((var(--innerWidth) ) - 75px) /2);*/
+	transform: translate(-50%,0%);
+	/*position: relative !important;*/
+	/*align-items: center;*/
+	/*width: 50% !important;*/
+	/*margin: auto;*/
+
+}

rf/i4m/m3.css

@@ -0,0 +1,388 @@
+
+
+
+
+
+
+
+
+ 
+.popup_root {
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	position: absolute;
+	/*background-color: #0ff8;*/
+}
+
+.popup_body {
+	width: 500px;
+	height: 300px;
+	position: relative;
+	top: 50%;
+	left: 50%;
+	z-index: 30;
+	transform: translate(-50%,-50%);
+	align-content: center;
+	/*font-size: 1.6em;*/
+
+
+	background-color: #222;
+	/*background-color: #000;*/
+}
+
+.rxi{
+	--vback: #111;
+	--vback: #333;
+	/*--vback: #f00;*/
+	--vtxt: #fff;
+	/*--vtxt: #f00;*/
+
+	/*--vtxt: #00f;*/
+	/*background-color: #777;*/
+	/*background-color: #fff;*/
+	/*background-color: var(--vback);*/
+	/*background-color: var(--vback,unset);*/
+	/*background-color: var(--vback,initial);*/
+
+}
+
+.popup_txt {
+	/*plese*/
+	/*margin: auto;*/
+	font-size: 1.6em;
+	/*margin: 3px;*/
+	padding-top: 20px;
+	text-align: center;
+	color: #eee;
+	/*font-size: 1.6em;*/
+	/*color: #fff;*/
+	/*background-color: #0ff;*/
+
+}
+.text_input_template{
+	/*width: 100%;*/
+	left: 50%; 
+	transform: translate(-50%,50%);
+	background-color: #0ff;
+	margin: auto;
+
+	/*display: block;*/
+	display: inline-block;
+	/*align-content: center;*/
+	font-size: 1.4em;
+	position: relative;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/*.ti_container {*/
+.text_input_template_v2.z{
+	/*position: relative;*/
+	/*position: absolute;*/
+	/*width: 100%;*/
+	/*background-color: red;*/
+	/*height: 100%;*/
+	/*height: 2em;*/
+
+	left: 50%; 
+	transform: translate(-50%,50%);
+	/*background-color: #0ff;*/
+	margin: auto;
+
+	/*display: block;*/
+	display: inline-block;
+	/*align-content: center;*/
+	font-size: 1.4em;
+	position: relative;
+	/*outline: 2px solid red;*/
+	display: flex;
+	display: inline-flex;
+	width: 306px; 
+	border: 2px solid var(--vtxt,#fff);
+	/*border: 2px solid #0ff;*/
+	/*background-color: #fff;*/
+	/*background-color: #0f0;*/
+	margin:  5px;
+	padding: 4px;
+	border-radius: 50px;
+	overflow: hidden;
+	position: relative;
+	box-sizing: content-box;
+	box-sizing: border-box;
+
+	/*top: 0px; left: 0px; right: 0px; bottom: 0px;*/
+}
+
+
+
+.ti_container.z{
+/*.text_input_template_v2{*/
+	/*width: 100%;*/
+	/*left: 50%; */
+	/*transform: translate(-50%,50%);*/
+	/*background-color: #0ff;*/
+	/*margin: auto;*/
+
+	/*display: block;*/
+	/*display: inline-block;*/
+	/*align-content: center;*/
+	/*font-size: 1.4em;*/
+	/*position: relative;*/
+	/*outline: 2px solid red;*/
+	/*display: flex;*/
+	display: inline-flex;
+	width: 300px; 
+	/*border: 2px solid var(--vtxt,#fff);*/
+	border: 3px solid #fff;
+	/*border: 2px solid #0ff;*/
+	/*margin:  5px;*/
+	/*padding: 1px;*/
+	border-radius: 50px;
+	/*overflow: hidden;*/
+	position: relative;
+	/*background-color: #fff;*/
+	/*background-color: #f00;*/
+	/*background-color: var(--vback,#fff);*/
+
+	/*box-sizing: border-box;*/
+	/*box-sizing: content-box;*/
+}
+
+.text_input_submit {
+	display: inline-block;
+	display: inline-block;
+}
+
+.text_input_v2 {
+	/*left: 20px;*/
+	/*display: inline;*/
+	/*display: inline-flex;*/
+	/*display: block;*/
+	/*max-width: 100%;*/
+	/*left:0px; */
+	/*min-width: 150px;*/
+	flex-grow: 2;
+	/*width: 150px;*/
+
+	/*position: relative;*/
+
+}
+
+.ti_label{
+	/*margin: 1px;*/
+	/*margin: 1px;*/
+	/*padding: 3px;*/
+	width: 5em;
+	text-align: center;
+	/*background-color: #ff0*/
+
+	color: var(--vback,#fff);
+	background-color: var(--vtxt,#fff);
+	background-color: var(--vtxt,#fff);
+	font-weight: bold;
+	position: relative;
+	padding: 0 3px; 
+
+}
+/*.ti_label:before{*/
+.ti_label:after{
+	z-index: -1;
+	/*box-sizing: border-box;*/
+	outline: 4px solid #fff;
+	/*box-sizing: content-box;*/
+
+	position: absolute;
+	top: 2px; left: 2px; right: 4px; bottom: 2px;
+	/*background-color: red;*/
+	/*border: 8px solid var(--vtxt,#fff);*/
+	/*border: 8px solid #0ff;*/
+
+
+	content: "z";
+}
+
+
+.rxi input {
+	
+	/*margin: 1px;*/
+	/*opacity: 0;*/
+	/*background-color: var(--vback,unset);*/
+
+	background-color: var(--vback,#fff);
+	color: var(--vtxt,#fff);
+	/*color: #fff;*/
+	/*background-color: unset;*/
+	border-width: 0px !important;
+}
+
+
+.text_input_template_v2 button {
+	display: none;
+}
+
+
+
+
+
+
+
+
+
+
+
+.text_input_template_v2.v1{
+	/*width: 100%;*/
+	left: 50%; 
+	transform: translate(-50%,50%);
+	/*background-color: #0ff;*/
+	margin: auto;
+
+	/*display: block;*/
+	display: inline-block;
+	/*align-content: center;*/
+	font-size: 1.4em;
+	position: relative;
+	/*outline: 2px solid red;*/
+	display: flex;
+	display: inline-flex;
+	display: block;
+	width: 300px; 
+	border: 2px solid var(--vtxt,#fff);
+	/*border: 2px solid #0ff;*/
+	margin:  5px;
+	padding: 1px;
+	/*border-radius: 50px;*/
+	/*overflow: hidden;*/
+	position: relative;
+	/*background-color: #fff;*/
+	/*background-color: var(--vback,#fff);*/
+
+	/*box-sizing: border-box;*/
+	/*box-sizing: content-box;*/
+}
+
+
+
+
+
+
+/*.ti_container{*/
+.text_input_template_v2.v1.z{
+	/*width: 100%;*/
+	left: 50%; 
+	transform: translate(-50%,50%);
+	/*background-color: #0ff;*/
+	margin: auto;
+
+	/*display: block;*/
+	display: inline-block;
+	/*align-content: center;*/
+	font-size: 1.4em;
+	position: relative;
+	/*outline: 2px solid red;*/
+	display: flex;
+	display: inline-flex;
+	width: 300px; 
+	border: 2px solid var(--vtxt,#fff);
+	/*border: 2px solid #0ff;*/
+	margin:  5px;
+	padding: 1px;
+	border-radius: 50px;
+	overflow: hidden;
+	position: relative;
+	/*background-color: #fff;*/
+	/*background-color: var(--vback,#fff);*/
+
+	/*box-sizing: border-box;*/
+	/*box-sizing: content-box;*/
+}
+
+
+
+.ti_container{
+/*.text_input_template_v2{*/
+	/*width: 100%;*/
+	left: 50%; 
+	transform: translate(-50%,50%);
+	/*background-color: #0ff;*/
+	margin: auto;
+
+	/*display: block;*/
+	display: inline-block;
+	/*align-content: center;*/
+	font-size: 1.4em;
+	position: relative;
+	/*outline: 2px solid red;*/
+	display: flex;
+	display: inline-flex;
+	width: 300px; 
+	border: 2px solid var(--vtxt,#fff);
+	/*border: 2px solid #0ff;*/
+	margin:  5px;
+	padding: 1px;
+	border-radius: 50px;
+	overflow: hidden;
+	position: relative;
+	/*background-color: #fff;*/
+	/*background-color: var(--vback,#fff);*/
+
+	/*box-sizing: border-box;*/
+	/*box-sizing: content-box;*/
+}
+/*.ti_container {*/
+.text_input_template_v2{
+	/*position: relative;*/
+	/*position: absolute;*/
+	/*width: 100%;*/
+	/*background-color: red;*/
+	/*height: 100%;*/
+	/*height: 2em;*/
+	/*top: 0px; left: 0px; right: 0px; bottom: 0px;*/
+}
+.ti_container_div{
+	display: inline-flex;
+	width: 260px;
+}
+.text_input.text_input_v2 {
+	flex-grow:2;
+
+}
+
+.room_span_container {
+/*.rxi.z {*/
+	background-color: var(--vback);
+}
+
+.password {
+	opacity: .5;
+	pointer-events: none;
+}
+
+.rooms_dir {
+	/*align-items: center;*/
+	/*padding-left: 0%;*/
+}
+.rooms_dir_full {
+	/*left: calc((var(--innerWidth) - 75px)/2);*/
+	left: calc(((var(--innerWidth) ) - 150px) /2);
+	/*left: calc(((var(--innerWidth) ) - 75px) /2);*/
+	transform: translate(-50%,0%);
+	/*position: relative !important;*/
+	/*align-items: center;*/
+	/*width: 50% !important;*/
+	/*margin: auto;*/
+
+}

rf/m/m_time.js

@@ -0,0 +1,59 @@
+
+
+glob_mx.timeout = glob_mx.timeout || {} 
+
+
+dflt_timeout = {
+	name:"none",
+	timeout:2000,
+	fn:()=>{clog("arr dflt_timeout")},
+	stop_flag:0,
+}
+{
+
+class Timeout_cls{
+	constructor(o0){
+		clog("Timeout_cls con")
+		var o = Object.assign({},dflt_timeout,o0)
+		this.o = o
+		glob_mx.timeout[o.name] = this
+		this.run = this.orig_run.bind(this)
+
+		// glob_mx.timeout.
+
+	}
+	start(){
+		clog("Timeout_cls ///")
+		// this.stop()
+		this.o.stop_flag=0
+		this.id = setTimeout(this.run,this.o.timeout * 1000)
+
+	}
+	stop(){
+		clearTimeout(this.id)
+	}
+	orig_run(f=1){
+		if (this.o.stop_flag){
+			return
+		}
+
+		// clog("T run",this,this.o,f)
+		if (glob_mx.timeout[this.o.name] != this){
+			// clog("gone",this)
+			return
+		}
+		this.stop()
+		this.id = setTimeout(this.run,this.o.timeout * 1000,0)
+		this.o.fn()
+		// this.id = setTimeout(this.fn,this.o.timeout)
+
+	}
+}
+window.Timeout_cls = Timeout_cls
+}
+
+
+
+
+
+// glob_mx.timeout.ff_ti

rf/ovf_vid/n.js

@@ -26,6 +26,63 @@ function rotate_tiles(arr){
 	// n = sorted_tiles.pop()
 	// sorted_tiles.unshift(n)
 }
+function rotate_tiles(arr){
+	// return
+	// sorted_tiles
+	if (arr.length < 17){
+		// return
+	}
+
+	var rotate_index = msto.conference.rotate_index || 0
+	var rotate_index2 = msto.conference.rotate_index2 || 13
+
+	// clog("rotate_tiles0",rotate_index,[jc(arr)])
+	var a2=arr.splice(rotate_index)
+	// arr.push(...a2)
+	arr.unshift(...a2)
+
+
+
+	if (!timeout_scroll_glob.stop){
+/*
+	if (rotate_index > arr.length){
+		rotate_index = 0
+		msto.conference.rotate_index = 0
+	}
+
+	if (rotate_index2 > arr.length){
+		rotate_index2 = 13
+		msto.conference.rotate_index2 = 13
+	}
+*/
+
+
+    if (rotate_index > arr.length){
+        rotate_index = 0
+        msto.conference.rotate_index = 0
+    }
+
+    if (rotate_index2 > arr.length){
+        rotate_index2 = 13
+        msto.conference.rotate_index2 = 13
+    }
+
+
+
+
+
+	}
+
+
+
+	// clog("rotate_tiles",arr)
+
+	// var n
+	// n = sorted_tiles.pop()
+	// sorted_tiles.unshift(n)
+}
+
+
 function rand_int(max) {
   return Math.floor(Math.random() * Math.floor(max));
 }
@@ -68,6 +125,7 @@ function ordered_focus(){
 	}
 	// clog(sv_arr[indx],indx)
 	$(sv_arr[indx]).addClass("focus_test")
+	focus_focus()
 
 
 
@@ -105,7 +163,7 @@ function ps(){
 }
 
 function focus_focus(){
-	$(".focus_test").click()
+	$(".focus_test:not(.videoContainerFocused)").click()
 }
 
 function test_focus(vid){
@@ -119,5 +177,11 @@ function test_focus(vid){
 		$("#"+small_vids[vid].videoSpanId).addClass("focus_test")
 
 	} 
+	focus_focus()
 	clog("vid",vid)
-}
+}
+
+
+
+
+

rf/u/universals.js

@@ -2,8 +2,10 @@
 
 clog = console.log
 function nop(){}
+clog = nop
 // clog = nop
-// clog = nop
+
+
 
 
 

rf/ui_msg/r.html

@@ -122,7 +122,7 @@ av_io_single
 
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item ovmu_av">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_av">
 
 	<div class="av_io act_cls_mic_off_all av_io_all av_io_mic av_io_off">
 <span>Mute all<span class="ji2_mic_off"></span></span>
@@ -135,7 +135,7 @@ av_io_single
 </div>
 
 </li>
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item ovmu_av">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_av">
 
 	<div class="av_io act_cls_mic_on_all av_io_all av_io_mic av_io_on">
 <span>request on<span class="ji2_mic_off"></span></span>
@@ -150,13 +150,13 @@ av_io_single
 </li>
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item2"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ji_mic_off">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item2"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ji_mic_off">
 </div></span><span>Mute all participants<span class="ji2_mic_off"></span></span></div><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ji_vid_off">
 </div></span><span>Mute all cameras</span><span class="ji2_vid_off"></span></div></li>
 
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item2"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item2"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ">
 </div></span><span>Mute all participants</span></div><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon ">
 </div></span><span>Mute all cameras</span></div></li>
 
@@ -168,7 +168,7 @@ av_io_single
 
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon "><svg height="24" width="24" viewBox="0 0 32 32"><path d="M16 20.688c2.563 0 4.688-2.125 4.688-4.688S18.563 11.312 16 11.312 11.312 13.437 11.312 16s2.125 4.688 4.688 4.688zm9.938-3.375l2.813 2.188c.25.188.313.563.125.875l-2.688 4.625c-.188.313-.5.375-.813.25l-3.313-1.313c-.688.5-1.438 1-2.25 1.313l-.5 3.5c-.063.313-.313.563-.625.563h-5.375c-.313 0-.563-.25-.625-.563l-.5-3.5a8.148 8.148 0 01-2.25-1.313l-3.313 1.313c-.313.125-.625.063-.813-.25l-2.688-4.625c-.188-.313-.125-.688.125-.875l2.813-2.188c-.063-.438-.063-.875-.063-1.313s0-.875.063-1.313l-2.813-2.188c-.25-.188-.313-.563-.125-.875l2.688-4.625c.188-.313.5-.375.813-.25l3.313 1.313c.688-.5 1.438-1 2.25-1.313l.5-3.5c.063-.313.313-.563.625-.563h5.375c.313 0 .563.25.625.563l.5 3.5c.813.313 1.563.75 2.25 1.313l3.313-1.313c.313-.125.625-.063.813.25l2.688 4.625c.188.313.125.688-.125.875l-2.813 2.188c.063.438.063.875.063 1.313s0 .875-.063 1.313z"></path></svg></div></span><span>Settings</span></div></li>
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb"><div><span class="overflow-menu-item-icon  "><div class="jitsi-icon "><svg height="24" width="24" viewBox="0 0 32 32"><path d="M16 20.688c2.563 0 4.688-2.125 4.688-4.688S18.563 11.312 16 11.312 11.312 13.437 11.312 16s2.125 4.688 4.688 4.688zm9.938-3.375l2.813 2.188c.25.188.313.563.125.875l-2.688 4.625c-.188.313-.5.375-.813.25l-3.313-1.313c-.688.5-1.438 1-2.25 1.313l-.5 3.5c-.063.313-.313.563-.625.563h-5.375c-.313 0-.563-.25-.625-.563l-.5-3.5a8.148 8.148 0 01-2.25-1.313l-3.313 1.313c-.313.125-.625.063-.813-.25l-2.688-4.625c-.188-.313-.125-.688.125-.875l2.813-2.188c-.063-.438-.063-.875-.063-1.313s0-.875.063-1.313l-2.813-2.188c-.25-.188-.313-.563-.125-.875l2.688-4.625c.188-.313.5-.375.813-.25l3.313 1.313c.688-.5 1.438-1 2.25-1.313l.5-3.5c.063-.313.313-.563.625-.563h5.375c.313 0 .563.25.625.563l.5 3.5c.813.313 1.563.75 2.25 1.313l3.313-1.313c.313-.125.625-.063.813.25l2.688 4.625c.188.313.125.688-.125.875l-2.813 2.188c.063.438.063.875.063 1.313s0 .875-.063 1.313z"></path></svg></div></span><span>Settings</span></div></li>
 
 
 
@@ -194,7 +194,35 @@ av_io_single
 
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ffz">
+	<span class="toggle_box">
+	<label class="toggle_box_l">
+	<input class="toggle_box_i" type="checkbox" name="toggle_box_i">
+		toggle_box_i
+	</label>
+	</span>
+<br>
+
+
+</li>
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff ovmu_spot">
+
+<!-- <span class="slider_container"> -->
+<!-- <label class="switch"> -->
+
+<label class="slider_container">
+	
+<span class="switch">
+  <input class="spot_focus" type="checkbox">
+  <span class="slider"></span>
+
+</span>
+<span class="slider_txt">Spotlight Focus</span>
+</label>
+<!-- </span></label> -->
+</li>
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff_x">z2</li>
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff_x">
 <span class="m follow_focus">
 <input type="checkbox" id="follow_focus" name="follow_focus">
 <label for="follow_focus">
@@ -208,11 +236,15 @@ force
 </label>
 </span>
 </li>
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff">
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff_x">
 <span class="m follow_focus2">
  <label for="num_pseudo"># of pseudo videos</label>
   <input type="number" id="num_pseudo" name="num_pseudo" min=0>
 <br>
+
+<span class="ov_timeout_span">
+	
+
   <label for="ov_timeout">overflow scroll interval </label>
   <input type="number" id="ov_timeout" name="timeout" min=.4 step=.1>
 
@@ -223,11 +255,18 @@ disable
 </label>
 <span class="inline_input"><button id="scroll_now" class="inline_input">scroll now</button></span>
 
+</span>
 </span>
 </li>
 
 
-<li aria-label="Toggle settings" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff">
+
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff_x ovmu_ff_tog">
+	
+<button class="ff_inp ff_mod">toggle enable</button>
+<span class="ff_inp ff_mod"></span>
+</li>
+<li aria-label="overflow menu item" class="overflow-menu-item ovmu otb ovmu_item ovmu_ff">
 <span class="m follow_focus_timeout">
 
   <label for="ov_timeout">ff time</label>
@@ -246,10 +285,13 @@ random
 <br>
 <input type="radio" id="ff_none" class="ff_inp" name="ff_algo" data-ivar="ff_none">
 <label for="ff_none" class="inline_input">
-	none
+	manual / none
 </label>
 </span>
 </li>
 <!-- <span class="inline_input"><button id="scroll_now" class="inline_input">scroll now</button></span> -->
 
 
+
+
+

rf/ui_msg/r.js

@@ -2,6 +2,7 @@
 mod_templates_ui_msg = window.mod_templates_ui_msg || $("")
 
 // html_js_handler_ui_msg 
+
 function html_js_handler_ui_msg(rsp) {
 	clog("html_js_handler_ui_msg",[...arguments])
 	mod_templates_ui_msg = $(`<span>${rsp}</span>`)[0].outerHTML
@@ -12,6 +13,9 @@ function html_js_handler_ui_msg(rsp) {
 		// refresh_overflow_menu()
 	}
 	tbar()
+	if (window.tomflag){
+		refresh_overflow_menu_only()
+	}
 	// clog("html_js_handler_lobby3")
 	// init_api6()
 }
@@ -192,7 +196,6 @@ add_svg_mod()
 
 
 
-
 function vid_toggle(){
 	var v
 	var v2

rf/ui_msg/r1.js

@@ -102,51 +102,359 @@ function somv_to(a){
 	n.find(".av_io").click(evnt_av_io)
 
 	$(".toolbox-content .overflow-menu").prepend(n)
-	if ( amimod() || 1){
+	if ( amimod() || 0){
 	n = jmod_templates_ui_msg.find(".ovmu_ff")
-	set_ovmu_ff3()
+	set_ovmu_ff3(n)
 	set_ovmu_ff(n)
 	// set_ovmu_ff2(n)
 	$(".toolbox-content .overflow-menu").prepend(n)
 	}
+	order_menu()
 
-	disp(glob_react.toolbox.setToolbarHovered(!!1))
+	// refresh_overflow_menu()
+	// setTimeout(refresh_overflow_menu_only,300)
+	// disp(glob_react.toolbox.setToolbarHovered(!!1))
+	// refresh_overflow_menu_only()
 
 	// $(".overflow-menu").append(n)
 
 
 }
 
+
+
+
+function order_menu(){
+	var ovfm = $(".toolbox-content .overflow-menu")
+	$(`[aria-label="Toggle settings"]`).before($(".ovmu_av"))
+	// $(`[aria-label="Toggle settings"]`).before("<hr>")
+	$(".ovmu_av:first").before("<hr>")
+	$(".ovmu_ff:last").after("<hr>")
+	$(".ovmu_spot").after("<hr>")
+	$(".spot_focus")[0].checked = msto.conference.force_follow
+	// ovfm.append($(".ovmu_spot"))
+}
+
+
+
+
+
+
 function ovmu_change(event){
-	clog("ovmu_change",event.target.dataset,{that:this,event,args:[...arguments]})
+	var local = get_local().id
+	if (local != msto.conference.ff.ff_mod){
+		// return
+	}
+	var type,ivar,name,target
+	target = event.target
+	ivar = target.dataset.ivar
+	type = target.type
+	name = target.name
+	var ff = msto.conference.ff
+
+	// clog("")
+	clog("ovmu_change",{that:this,data:event.target.dataset,event,args:[...arguments]},{type,ivar,name,target})
+	// return
+
+	if (type == "number"){
+		ff["number"][ivar] = target.value 
+
+	} else if (type == "checkbox") {
+		ff["checkbox"][ivar] = target.checked 
+		// target.checked = ff["checkbox"][ivar] || 0
+	} else if (type == "radio") {
+		// ff[""]
+		ff["radio"][name] = ivar
+		// if (ff["radio"][name] == ivar) { target.checked = 1 }
+		// v.checked = ff["radio"][name] || 0
+	}
+	if (ivar == "ff_timeout"){
+		try {
+			glob_mx.timeout.ff_ti.o.timeout = ff["number"][ivar]
+		} catch (err){}
+	}
+
 
 }
 
+
+
+
+
+
+
+
+
+
 function set_ovmu_dflts(n){
 	var i,k,v,j
-	var type,ivar
+	var type,ivar,name
+	var ff = msto.conference.ff
+	var local = get_local()
+
+
+
+
+
+
+
+
+	clog("set_ovmu_dflts...",$(n),n)
 	for (v of $(n)){
 		ivar = v.dataset.ivar
 		type = v.type
+		name = v.name
+		if (type == "number"){
+			v.value = ff["number"][ivar] || 0
+		} else if (type == "checkbox") {
+			v.checked = ff["checkbox"][ivar] || 0
+		} else if (type == "radio") {
+			// ff[""]
+			if (ff["radio"][name] == ivar) {
+				v.checked = 1
+			}
+			// v.checked = ff["radio"][name] || 0
+
+		} else if (v.classList.contains("ff_mod")){
+			if (v.tagName == "SPAN"){
+				// $(n).find("span.ff_mod").text(msto.conference.ff.ff_mod || "zzz")
+				$(v).text(msto.conference.ff.ff_mod == local.id ? "LOCAL " + local.id : msto.conference.ff.ff_mod )
+
+			} else if (v.tagName == "BUTTON") {
+				$(v).click(ff_mod_button_cb)
+				// $(v).clock()
+			}
+
+		}
+		clog("set_ovmu_dflts",{type,ivar,name})
+	}
+	// $(n).filter("span.ff_mod").text("z")
+
+}
+
+
+
+function ff_ti(){
+	// clog("ff_ti")
+	var ff_algo = msto.conference.ff.radio.ff_algo
+	if (ff_algo=="ff_none"){
+		return
+	}
+	if (ff_algo == "ff_rand"){
+
+		test_focus()
+
+	} else if (ff_algo == "ff_ordered"){
+		ordered_focus()
+
+	}
+
+
+}
+
+
+
+function ff_mod_button_cb(event){
+	return
+	var part,ff_mod_id
+	ff_mod_id = $("span.ff_mod").text()
+	part = get_local()
+	// if (part.id == ff_mod_id){
+	if (part.id == msto.conference.ff.ff_mod){
+		msto.conference.ff.ff_mod = null
+	$("span.ff_mod").text(msto.conference.ff.ff_mod)
+		// $(".id_sideToolbarContainer").removeClass("not_local_ff_mod")
+		$(".id_sideToolbarContainer").addClass("not_local_ff_mod")
+	} else {
+		msto.conference.ff.ff_mod = part.id
+	$("span.ff_mod").text("LOCAL " + msto.conference.ff.ff_mod)
+		$(".id_sideToolbarContainer").removeClass("not_local_ff_mod")
+		new Timeout_cls({
+			name:"ff_ti",
+			timeout:msto.conference.ff.number.ff_timeout,
+			fn:ff_ti,
+			"zzz":"da"
+		})
+		// $(".not_local_ff_mod")
+	// if (local == msto.conference.ff.ff_mod){
+	// } else {
+	// }
+		// clog()
+		glob_mx.timeout.ff_ti.run()
+		// glob_mx
 	}
+	req_ff_send({ff_mod:msto.conference.ff.ff_mod})
+}
 
+function req_ff_send(o){
+
+            tmsgx({
+                "type":"event",
+                // z:
+                "payload":o,
+                etype:"req_ff"
+            },"code")
+}
+// req_av_send({act:"av_off","to":"all"})
+// req_av_send({to:"all",act:"force_vid_on"})
+// 
+function ff_evnt(o){
+	return
+	var ff_mod = o.parsed.payload.ff_mod
+	if (ff_mod != get_local().id){
+		delete glob_mx.timeout.ff_ti
+		// $(".id_sideToolbarContainer").removeClass("not_local_ff_mod")
+		$(".id_sideToolbarContainer").addClass("not_local_ff_mod")
+	}
+
+	// if (msto.conference.ff.ff_mod)
+	clog("ff_evnt",msto.conference.ff.ff_mod,get_local().id,{that:this,o,args:[...arguments]})
+}
+
+glob_mx.event_handlers.ff = {
+    fn:ff_evnt,
+    // fn:nop,
+    // m:{etype:"timer_start"},
+    m:{etype:"req_ff"},
+}
+function spot_focus_cb(event){
+	clog("spot_focus_cb",{that:this,event},event.target,event.target.checked)
+	if (event.target.checked){
+		$("input#follow_focus").click()
+
+	} else {
+		$("input#follow_focus_force").click()
+	}
+
+}
+
+function ffcb2(){
+	clog("ffcb",this.value,this.checked,[this,...arguments])
+	disp(glob_react.base_conference.setFollowMe(this.checked))
+    msto.conference.follow_focus = this.checked
+	var follow_focus_force=$("#follow_focus_force")[0] 
+	if (follow_focus_force.checked && !this.checked){
+		msto.conference.force_follow = this.checked
+		follow_focus_force.checked = this.checked
+
+	}
+}
+// force follow focus EventListener
+function fffcb2(){
+	var follow_focus=$("#follow_focus")[0]
+
+	if (!follow_focus.checked && this.checked){
+
+	follow_focus.checked = this.checked
+    msto.conference.follow_focus = this.checked
+	ffcb.bind(follow_focus)()
+	}
+	msto.conference.force_follow = this.checked
 }
+
+
+function enable_spotlight(){
+	msto.conference.follow_focus = true
+	msto.conference.force_follow = true
+	disp(glob_react.base_conference.setFollowMe(true))
+
+}
+
+function disable_spotlight(){
+
+	msto.conference.follow_focus = false
+	msto.conference.force_follow = false
+	disp(glob_react.base_conference.setFollowMe(false))
+
+
+}
+function toggle_spotlight(event){
+	var bool
+	if (this.tagName == "INPUT"){
+		bool = this.checked
+	} else {
+		bool = !msto.conference.force_follow
+	}
+	clog("toggle_spotlight",{that:this,event,bool,checked:this.checked,tagName:this.tagName})
+
+	msto.conference.follow_focus = bool
+	msto.conference.force_follow = bool
+	disp(glob_react.base_conference.setFollowMe(bool))
+	bool ? start_ff_ti() :remove_ff_ti()
+
+
+}
+
+
+
+
+
+function start_ff_ti(){
+		new Timeout_cls({
+			name:"ff_ti",
+			timeout:msto.conference.ff.number.ff_timeout,
+			fn:ff_ti,
+			"zzz":"da"
+		})
+		// $(".not_local_ff_mod")
+	// if (local == msto.conference.ff.ff_mod){
+	// } else {
+	// }
+		// clog()
+		glob_mx.timeout.ff_ti.run()
+}
+function remove_ff_ti(){
+	delete glob_mx.timeout.ff_ti
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 function set_ovmu_ff3(n){
 	msto.conference.ff ? 0 : msto.conference.ff = {
 		number:{
 	ff_timeout:5,
 		},
-		
+
 		radio:{
-	ff_algo:"ff_none"
+	ff_algo:"ff_none",
 		},
 		checkbox:{},
+		ff_mod:null,
 	// ff_ordered:0,
 	// ff_rand:0,
-	} 
-	clog("set_ovmu_ff3",jc(msto.conference.ff))
-	set_ovmu_dflts(n)
+	}
+	clog("set_ovmu_ff3.",jc(msto.conference.ff),jc(msto.conference))
+	set_ovmu_dflts($(n).find(".ff_inp"))
+	var local = get_local().id
+	if (local == msto.conference.ff.ff_mod){
+		// $(".id_sideToolbarContainer").removeClass("not_local_ff_mod")
+	} else {
+		// $(".id_sideToolbarContainer").addClass("not_local_ff_mod")
+
+	}
+	$(n).find(".spot_focus").off("change")
+	// $(n).find(".spot_focus").change(spot_focus_cb)
+	$(n).find(".spot_focus").change(toggle_spotlight)
+
 
 
 	// clog("set_ovmu_ff2",n)
@@ -166,18 +474,25 @@ function set_ovmu_ff(n){
 	        msto.conference.rotate_index = msto.conference.rotate_index || 0
 
     n = $(n)
-    n.find("input#follow_focus")[0].onchange = ffcb
-    n.find("input#follow_focus_force")[0].onchange = fffcb
     try {
 
-    n.find("input#ov_timeout")[0].onchange = scroll_timeout_runner
-    n.find("input#ov_timeout_disable")[0].onchange = scroll_timeout_runner
-    n.find("#scroll_now")[0].onclick = scroll_send
-
 
     n.find("#num_pseudo")[0].onchange = num_pseudo
     n.find("input#ov_timeout")[0].value=window.msto ? msto.conference.scroll_timeout || 15 : 15
     n.find("#num_pseudo")[0].value= window.msto ? msto.conference.repeat || 0 : 0
+
+    // n.find("#scroll_now")[0].onclick = scroll_send
+    n.find("#scroll_now")[0].onclick = timeout_scroll_start_now
+
+    n.find("input#ov_timeout")[0].onchange = scroll_timeout_runner
+    n.find("input#ov_timeout_disable")[0].onchange = scroll_timeout_runner
+
+    n.find("input#follow_focus")[0].onchange = ffcb
+    n.find("input#follow_focus_force")[0].onchange = fffcb
+
+
+
+
     } catch(err){}
     // clog("zz",n.find("input#ov_timeout")[0].value))
     // value=${window.msto ? msto.conference.scroll_timeout || 15 : 15}
@@ -271,6 +586,13 @@ function refresh_overflow_menu(){
 	setTimeout(dispatch_evnt(),50)
 
 }
+function refresh_overflow_menu_only(){
+	toggle_overflow_menu()
+	setTimeout(toggle_overflow_menu,100)
+	// dispatch_evnt(1)
+	// setTimeout(dispatch_evnt(),50)
+
+}
 
 
 

rf/ui_msg/r2.css

@@ -46,6 +46,7 @@
 .id_chat-input {
     border-top: 1px solid #A4B8D1;
     display: flex;
+    display: none;
     padding: 5px 10px;
 }
 .id_sideToolbarContainer .chat-header{
@@ -130,8 +131,8 @@
 	/*margin-right: 10px;*/
 	/*position: relative;*/
 	position: absolute;
-	bottom: 0px;
-	bottom: 3em;
+	/*bottom: 0px;*/
+	/*bottom: 3em;*/
 	padding-inline-start: 0px;
 }
 
@@ -178,4 +179,297 @@ ul.overflow-menu{
 	background-color: #040404f0;
 	/*background-color: #004444dd;*/
 
-}
+}
+
+/*.not_local_ff_mod .ff_inp {*/
+.not_local_ff_mod .ovmu_ff {
+	opacity: .5;
+	pointer-events: none;
+	/*background-color:#fff;*/
+
+}
+
+.ovmu_ff.ovmu_ff_tog {
+opacity:unset;
+	pointer-events: unset;
+}
+
+.ov_timeout_span {
+	/*opacity: 0;*/
+	/*display: none;*/
+}
+
+input[type="checkbox"]{
+
+	/*background-color: #008;*/
+	/*outline: 1px solid #f00;*/
+	top: 1px;
+	position: relative;
+}
+label{
+	/*outline: 1px solid #f00;*/
+
+}
+
+input[type="radio"]{
+	/*outline: 1px solid #f00;*/
+	/*border: 4px solid #f00;*/
+	/*margin-top: 3.5px;*/
+	top: 1.5px;
+	/*padding: 2px !important;*/
+	/*padding-top: 2px !important;*/
+	position: relative;
+	/*background-color: #008;*/
+}
+
+label.inline_input{
+	/*outline: 1px solid #f00;*/
+	/*background-color: #008;*/
+}
+
+
+.toggle_box_i{
+	background-color: red;
+	outline: 1px solid #0ff;
+}
+
+
+.toggle_box_l{
+	/*display: none;*/
+	background-color: red;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+div.subject.visible{
+	top: unset;
+	bottom: -10px;
+	z-index: 400;
+	padding-left: 175px;
+
+}
+
+
+div.subject.visible .participants-count{
+	pointer-events: none;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+.slider_container {
+	/*--vheight: 34px;*/
+	/*--vwidth: 60px;*/
+	--vheight: 2em;
+	--vheight: 1em;
+	/*--vwidth: 1.8em;*/
+	--vwidth: 3.6em;
+	--vwidth: 4.2em;
+	--vwidth: 4.2em;
+	--vwidth:calc(var(--vheight)*(8/3)) ;
+	/*--vheight: 1.2em;*/
+	/*--vwidth: 1.8em;*/
+	--vpad:1px;
+	--vnob:calc(var(--vheight) - (var(--vpad) * 2) );
+	--vnob:calc(var(--vheight) - (var(--vpad) * 2) );
+	/*--vnob:calc(var(--vwidth) - (var(--vpad) * 2) );*/
+	--vnob2:calc(var(--vwidth) - (var(--vnob) + (var(--vpad) * 2)  ) );
+	/*--vnob: 26px;*/
+	/*--vnob: .8em;*/
+}
+
+
+.switch {
+  position: relative;
+  position: absolute;
+  display: inline-block;
+  /*width: 60px;*/
+  /*height: 34px;*/
+  margin: auto;
+  margin: 3px;
+  /*top: 0px;*/
+  height: var(--vheight);
+  width: var(--vwidth);
+
+}
+
+.switch input { 
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  /*background-color: #ccc;*/
+  background-color: #888;
+  /*background-color: #aaa;*/
+  background-color: #555;
+  /*background-color: #800;*/
+  /*background-color: #f00;*/
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  /*height: 26px;*/
+  /*width: 26px;*/
+  height: var(--vnob);
+  width: var(--vnob);
+  /*left: 4px;*/
+  /*bottom: 4px;*/
+  left: var(--vpad);
+  bottom: var(--vpad);
+  background-color: white;
+  /*background-color: #000;*/
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #2196F3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+  /*box-shadow: 0 0 10px #fff;*/
+  /*box-shadow: 0 0 10px #f00;*/	
+}
+
+input:checked + .slider:before {
+	  /*left: unset;*/
+
+
+  /*animation-name: example;*/
+  /*animation-duration: 4s;*/
+
+  /*bottom: var(--vpad);*/
+
+  /*right: var(--vpad);*/
+  /*top: var(--vpad);*/
+
+  /*-webkit-transform: translateX(26px);*/
+  /*-ms-transform: translateX(26px);*/
+  /*transform: translateX(26px);*/
+  /*transform: translateX(var(--vnob));*/
+  transform: translateX(var(--vnob2));
+}
+
+@keyframes example {
+  0%   {
+  	left: var(--vpad);
+  	/*right:unset;*/
+  	background: red;
+  }
+
+  50% {
+  	/*left: unset;*/
+  	right: var(--vpad);
+  	background: #0ff;
+  }
+
+  100% {
+  	/*left: unset;*/
+  	right: var(--vpad);
+  	background: #0ff;
+  }
+}
+.slider {
+  border-radius: 34px;
+}
+
+.slider:before {
+  border-radius: 50%;
+}
+
+.slider_container {
+	position: relative;
+	width: 50px;
+}
+
+
+.slider_container {
+	position: relative;
+	/*width: 50px;*/
+	width: 100%;
+	/*outline: 1px solid #0ff;*/
+	/*height: 16px;*/
+}
+
+.slider_txt{
+	position: relative;
+	left: calc(var(--vwidth) + .5em);
+	display: inline-block;
+	display: inline-block;
+	/*position: absolute;*/
+}
+
+
+
+
+
+li[aria-label="Mute everyone"]{
+	display: none !important;
+}
+
+
+
+.follow_focus {
+	opacity: .5;
+	/*display: none;*/
+	/*pointer-events: none;*/
+}
+

rf/ui_msg/r2.js

@@ -136,6 +136,7 @@ function toolbox_update(o,name){
 	// setTimeout(somv_to,0,"A")
 	somv_to("A")
 	move_ovfm()
+	
 	} else if (o.prevProps._overflowMenuVisible && !o.that.props._overflowMenuVisible){
 		close_ovfm(ovrm)
 	}
@@ -234,7 +235,7 @@ function move_ovfm(){
 	// ovrm.parent().addClass("ovrm_conatainer")
 	ovrm.parent().addClass("ovrm_conatainer").parent().addClass("ovrm_conatainer2")
 	chatcon.append(ovrm)
-	chatcon.prepend(ovfm0)
+	// chatcon.prepend(ovfm0)
 	chatcon.find(".ovfm0").append(chatcon.find(".ovmu_ff"))
 	$(".id_sideToolbarContainer").addClass("slideInExt")
 	// $(".id_chatconversation").append(ovrm.parent())