ign4 new modules

i4/lobby.js

@@ -120,8 +120,12 @@ var mtx_2 ={
 	// `${mod_path}m0.js`,
 	`${mod_path}${n}.js`,
 	`${mod_path}${n}1.js`,
+	`${mod_path}${n}2.js`,
+	],
+	css:[
+	`${mod_path}${n}.css`,
+	`${mod_path}${n}2.css`,
 	],
-	css:[`${mod_path}${n}.css`],
 	html:[
 	{url:`${mod_path}${n}.html`,diffH:get_cui_html,success:html_rld_cb4,success_js:"html_js_handler_ui_msg"},
 	// C:\bspace\repos\jc4\ign4\rf\img\full-frame.svg
@@ -193,8 +197,36 @@ var mtx_2 ={
 
 
 }
+function ytsv() {
+	// body...
+	// clog("This is lobby2")
+var mod_path ="ign/rf/ytsv/"
+var n ="y"
+
+var mtx_2 ={	
+	// js:["ign/m/timer/m.js","ign/m/timer/m0.js"],
+	js:[
+	// `${mod_path}m0.js`,
+	`${mod_path}${n}.js`,
+	`${mod_path}vid_utils.js`,
+	// `${mod_path}${n}1.js`,
+	],
+	css:[`${mod_path}${n}.css`],
+	html:[
+	// {url:`${mod_path}${n}.html`,diffH:get_cui_html,success:html_rld_cb4,success_js:"html_js_handler_dev_ov"},
+	// C:\bspace\repos\jc4\ign4\rf\img\full-frame.svg
+	// {url:`ign/rf/img/full-frame.svg`,diffH:get_cui_html,success:html_rld_cb4,success_js:"svg_icon_handler"},
+	// {url:`ign/rf/img/full-frame_24.svg`,diffH:get_cui_html,success:html_rld_cb4,success_js:"svg_icon_handler2"},
+	]
+	}
+	mtx_2.name = "ytsv"
+
+	setTimeout(add_module,300,mtx_2)
 
 
+
+}
+
 if (location.pathname.endsWith("/")){
 insert_lobby()
 } else {
@@ -202,6 +234,7 @@ not_lobby()
 ui_msg()
 ovf_vid()
 dev_ov()
+ytsv()
 }
 svg_dev()
 

rf/coninc/coninc.css

@@ -0,0 +1,67 @@
+
+
+.inactive_vid {
+	/*outline: 5px solid #ff0 !important;*/
+}
+
+
+
+
+/*.inactive_vid.display-avatar-only video{*/
+.inactive_vid video{
+    /*opacity: 1 !important;*/
+    filter: grayscale(1);
+
+    /*z-index: 200;*/
+    visibility: visible !important;
+}
+.display-avatar-only video{
+    /*opacity: 1 !important;*/
+    /*visibility: visible !important;*/
+/*.inactive_vid.display-avatar-only video{*/
+	/*filter: sepia(1);*/
+}
+
+
+
+
+.indicator-container {
+	/*transform: translate(0%,0%);*/
+	/*z-index: 500;*/
+	/*outline: 2px solid red;*/
+	/*outline-offset: -5px;*/
+	/*background-color: red !important;*/
+	/*opacity: .5;*/
+}
+
+
+/*
+.display-name-on-black:not(:hover) video {
+    opacity: 1 !important;
+}
+.display-name-on-black video {
+    opacity: .2;
+    visibility: visible;
+*/
+
+/*
+.display-avatar-with-name video, .display-name-on-black .avatar-container {
+    visibility: hidden;
+}
+*/
+
+/*.display-name-on-black .avatar-container {*/
+	/*
+.display-avatar-only .avatar-container {
+    visibility: hidden !important;
+    background-color: red !important;
+}
+	*/
+/*.display-avatar-with-name video{*/
+/*
+.display-avatar-only video{
+    opacity: 1 !important;
+    z-index: 200;
+    visibility: visible !important;
+}
+*/

rf/coninc/coninc.js

@@ -124,6 +124,27 @@ function prune_smallvids(){
 
 
 
+
+
+function conn_stat(o){
+	var id,connection_status
+	id = o.action.participant.id
+	connection_status = o.action.participant.connectionStatus
+	if (window.glob_mx.local_id == id){
+		clog("connectionStatus local",id)
+	}
+	// clog("conic~",connection_status,glob_mx.participants[id],id)
+	// if (connection_status == "inactive" || glob_mx.participants[id] == "inactive"){
+	if (connection_status == "inactive"){
+		$("#participant_"+id).addClass("inactive_vid")
+
+	} else if (glob_mx.participants[id] == "inactive" && connection_status && connection_status != "inactive") {
+		$("#participant_"+id).removeClass("inactive_vid")
+
+	}
+	glob_mx.participants[id] = connection_status
+}
+
 function coninc_conection_event(o){
 
 	// clog("PARTICIPANT_UPDATED",o,get_participants())
@@ -135,14 +156,23 @@ function coninc_conection_event(o){
 	}
 	var ret = deep_prop_v2(o,"action.participant.connectionStatus".split("."))
 	if (ret.v_exist){
-		clog("conic +",ret,o)
+		// clog("conic +",ret,o)
+		try{
+		conn_stat(o)
 
+		}catch(err){
+			clog("conn_stat err:",err,o)
+		}
+		
 	} else {
-		clog("conic !",ret,o)
+		// clog("conic !",ret,o)
 		// clog(ret)
 	}
 	// clog("PARTICIPANT_UPDATED",o)
 }
+
+
+
 function discard_participant(o){
 	// o.action.participant.id
 	delete window.glob_mx.participants[o.action.participant.id]

rf/dev_ov/t.css

@@ -18,30 +18,3 @@
 
 	/*text-align:center;*/
 }
-
-.indicator-container{
-	display: block !important;
-}
-
-/*.connection_full {*/
-.connection_empty {
-	/*position: absolute;*/
-	/*top :2px;*/
-	width: 8px !important;
-	/*opacity: 0;*/
-	/*display: none;*/
-	/*display: block !important;*/
-}
-.connection_full {
-/*.connection_empty {*/
-		position: absolute;
-		/*position: relative;*/
-	/*top :2px;*/
-	transform: rotate(90deg);
-	transform: rotate(180deg);
-	transform: translate(-50%,-50%) rotate(180deg);
-	transform: translate(-50%,0%) rotate(180deg);
-	transform: translate(0%,-50%) rotate(180deg);
-	/*display: none;*/
-	/*opacity: 0;*/
-}

rf/exp_api/exp_api.js

@@ -48,6 +48,8 @@ fn_name_template = {
 function dev_fn(fn_arg,o){
 	var fn
 	// clog("coninc...")
+	try{
+
 
 	if (typeof(fn_arg)=="object"){
 		if (Array.isArray(fn_arg)) {
@@ -60,8 +62,9 @@ function dev_fn(fn_arg,o){
 	}
 	// clog("coninc...",fn,fn_arg)
 	if (fn){
-		fn(o,fn_arg)
+		return fn(o,fn_arg)
 	}
+	} catch (err) {	clog("dev_fn err:",err)}
 	// fn_arg = 
 
 }

rf/filmstrip_mod/m.js

@@ -122,10 +122,12 @@ function refresh_toolbars(){
 
     html_hooks.create_new_toolbox_hook(n)
 
+    // <span class="toggle_ff lvov">enter fullframe${window.full_frame_svg || ""}</span>
+
         n = `
     <div class="plugin_top tbar">
     <span class="lvov_container">
-    <span class="toggle_ff lvov">enter fullframe</span>
+    <span class="toggle_ff lvov"><span class="toggle_ff_filter"></span><span class="toggle_ff_txt">enter fullframe</span></span>
 
     <span class="lv_info lvov">
     <span class="autoplay_msg lvov">
@@ -146,6 +148,14 @@ function refresh_toolbars(){
         <div class="tbox_slide_indicator2"></div>
     </div>`
     n = $(n)
+    try {
+        var full_frame_svg_node
+        full_frame_svg_node = $(plugin_icon_template)
+        add_node(full_frame_svg,full_frame_svg_node.find(".jitsi-icon"),"prepend")
+        // add_node(full_frame_svg_node,n.find(".toggle_ff"),"prepend")
+        add_node(full_frame_svg_node,n.find(".toggle_ff"),"append")
+
+    } catch (err){}
 
     // <span class="lv_info lvov"></span>
     add_node(n,`.lvc_overlay`,"append")
@@ -156,7 +166,9 @@ function refresh_toolbars(){
     v.onmouseenter= ff_me
     v.onmouseleave =ff_ml
     try {
-    n.find(".toggle_ff")[0].onclick = toggle_ff
+    // n.find(".toggle_ff")[0].onclick = toggle_ff
+    $(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").off("click")
+$(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").on("click",toggle_ff)
     n.find(".force_enable")[0].onclick = allow_autoplay
     // n.find(".allow_autoplay")[0].onclick = allow_autoplay
 
@@ -243,7 +255,8 @@ function init_api6(){
     if (nt.length){
         n = $(nt[0].outerHTML)
          
-        nt = mod_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
@@ -287,7 +300,7 @@ function init_api6(){
 
 
 function ff_me(){
-clog("ff_me")
+// clog("ff_me")
     // $(".lvov").removeClass("_hide")
     $(".lvov_container").removeClass("_hide")
     // $(".lvov").removeClass("hide")
@@ -299,7 +312,7 @@ clog("ff_me")
     // dev_raf()
 }
 function ff_ml(){
-clog("ff_ml")
+// clog("ff_ml")
     $(".lvov_container").addClass("_hide")
     // glob_dbg.ff.stop = 1
 
@@ -316,11 +329,15 @@ function toggle_ff_dflt(){
     glob_mx.dims.fullframe = !glob_mx.dims.fullframe
     if (glob_mx.dims.fullframe){
         $(".vspace").addClass("_hide")
-        $(".toggle_ff")[0].innerHTML = "shrink"
-        $(".toggle_ff")[0].innerHTML = "exit fullframe"
+        $(".toggle_ff").addClass("isff")
+        // $(".toggle_ff")[0].innerHTML = "shrink"
+        // $(".toggle_ff")[0].innerHTML = "exit fullframe"
+        $(".toggle_ff > .toggle_ff_txt").text("exit fullframe")
         // ._hide
     } else {
-        $(".toggle_ff")[0].innerHTML = "enter fullframe"
+        // $(".toggle_ff")[0].innerHTML = "enter fullframe"
+        $(".toggle_ff > .toggle_ff_txt").text("enter fullframe")
+        $(".toggle_ff").removeClass("isff")
         $(".vspace").removeClass("_hide")
     }
     dispatch_resize()
@@ -376,14 +393,17 @@ function ff_set_ev(){
     // v.onmousemove=  ff_mm
     v.onmouseenter= ff_me
     v.onmouseleave =ff_ml
-    $(".toggle_ff")[0].onclick = toggle_ff
+    // $(".toggle_ff")[0].onclick = toggle_ff
+    $(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").off("click")
+$(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").on("click",toggle_ff)
     $(".allow_autoplay")[0].onclick = allow_autoplay
 
 }
 
-
-
-
+// $(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").off("click")
+// $(".toggle_ff").find(".toggle_ff_txt,.toolbox-button").on("click",toggle_ff)
+// toggle_ff_txt
+// toolbox-button
 
 
 

rf/filmstrip_mod/m0.js

@@ -65,15 +65,15 @@ function resize_thumbs_horizontal(cont){
   var height = Math.round(width/aspect)
   computed_css.height = height
   computed_css.width = width
-  clog("RTH",cont)
+  // clog("RTH",cont)
   computed_css["min-width"] = width
   var k,v
   for ([k,v] of Object.entries(computed_css)){
     Number(v) ? computed_css[k] = v + "px" : 0
   }
   // clog("RTHUMBS")
-  fix_avatar(thumbs)
   thumbs.css(computed_css)
+  fix_avatar(thumbs)
 
 
 }
@@ -376,6 +376,12 @@ resize_thumbs_proto($("#sharedVideoIFrame"),{
 })
 clog("top",top_margin_flag)
 resize_thumbs_proto($("#largeVideoContainer.z,#sharedVideoIFrame"),{position:"",})
+
+
+
+
+
+
 }
 
 function fullframe(){

rf/filmstrip_mod/svg_src.js

@@ -0,0 +1,76 @@
+full_frame_svg = `<svg class="full_frame_svg"
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   width="32"
+   height="32"
+   viewBox="0 0 32 32"
+   id="svg6"
+   sodipodi:docname="full-frame.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs10" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1280"
+     inkscape:window-height="971"
+     id="namedview8"
+     showgrid="true"
+     inkscape:zoom="11.313709"
+     inkscape:cx="6.1318021"
+     inkscape:cy="20.336523"
+     inkscape:window-x="1272"
+     inkscape:window-y="-6"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g826">
+    <inkscape:grid
+       type="xygrid"
+       id="grid816" />
+  </sodipodi:namedview>
+  <title
+     id="title2">full-frame</title>
+  <g
+     id="g826"
+     transform="matrix(1.0516432,0,0,1.0738255,-0.82681685,-1.1817449)">
+    <path
+       sodipodi:nodetypes="ccccccccccccccccccccccccccc"
+       inkscape:connector-curvature="0"
+       id="path4"
+       d="m 20.754964,6.688 8.558036,0 0,6.51875 h -2.852679 v -3.725 h -5.705357 z m 5.705357,15.83125 v -3.725 H 29.313 l 0,6.51875 -8.558036,0 -4e-6,-2.79375 z M 2.688,6.688 l 8.558036,0 4e-6,2.79375 H 5.5406785 v 3.725 H 2.6879999 m 2.8526786,5.5875 v 3.725 H 11.246036 V 25.313 H 2.688 l -1e-7,-6.51875 z" />
+  </g>
+</svg>`
+
+
+
+
+
+
+
+plugin_icon_template = `<div aria-label="Toggle tile view" class="plugin_top_cls plugin_icon_template toolbox-button tb otb"><div><div class="toolbox-icon  "><div class="jitsi-icon ">
+</div></div></div></div>`
+
+
+

rf/fs.css

@@ -164,7 +164,7 @@ pointer-events: none;
 }
 .videocontainer__background {
 	outline: 1px solid #8C8C8C;
-	
+
 }
 
 
@@ -333,6 +333,9 @@ pointer-events: none;
 #sharedVideo.z{
 	pointer-events: unset !important;
 }
+#sharedVideo{
+	/*z-index: -1;*/
+}
 #etherpad.z{
 	outline: 2px solid red;
 	outline-offset: -5px;

rf/fs_hook.js

@@ -14,9 +14,10 @@ glob_mx.filmstrip_handlers = glob_mx.filmstrip_handlers || {}
 glob_mx.filmstrip_tile_handlers = glob_mx.filmstrip_tile_handlers || {}
 
 
-
+// window.mvyt_helper ? mvyt_helper():0
 // run callbacks for all filmstrips on resize
 function resizeThumbnailsForCustomView(that,fn_name,args=[]){
+
     const thumbs = glob_react.Filmstrip._getThumbs()
     const all_thumbs = $(".small_vid")
     const custom_thumbs = all_thumbs.not(thumbs.remlocThumbs)
@@ -73,7 +74,8 @@ function resizeThumbnailsForCustomView(that,fn_name,args=[]){
       height: `${height}px`,
     })
 
-    clog("rtscv",fn_name,[that,...args])
+    window.mvyt_helper ? mvyt_helper():0
+    // clog("rtscv",fn_name,[that,...args])
 
 
 }

rf/i4n/m.2.css

@@ -0,0 +1,280 @@
+ 
+.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;*/
+}
+
+.uname_email_pop{
+	--vback: #111;
+	--vback: #f00;
+	--vtxt: #fff;
+	--vtxt: #00f;
+	background-color: #777;
+	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{
+	/*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{
+/*.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);
+	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";
+}
+
+
+.text_input_template_v2 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;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+.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: 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.z{
+	/*position: relative;*/
+	/*position: absolute;*/
+	/*width: 100%;*/
+	/*background-color: red;*/
+	/*height: 100%;*/
+	/*height: 2em;*/
+	/*top: 0px; left: 0px; right: 0px; bottom: 0px;*/
+}

rf/i4n/m.css

@@ -21,6 +21,19 @@
 
 
 	background-color: #222;
+	/*background-color: #000;*/
+}
+
+.uname_email_pop{
+	--vback: #111;
+	/*--vback: #f00;*/
+	--vtxt: #fff;
+	/*--vtxt: #00f;*/
+	background-color: #777;
+	background-color: var(--vback);
+	/*background-color: var(--vback,unset);*/
+	/*background-color: var(--vback,initial);*/
+
 }
 
 .popup_txt {
@@ -49,7 +62,278 @@
 	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);
+	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";
+}
+
+
+.text_input_template_v2 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;
+	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;*/
+}

rf/i4n/m.html

@@ -34,4 +34,17 @@
 	<input type="text" class="text_input"><button class="text_input_submit">Enter</button>
 </div>
 
+<div class="text_input_template_v2 v1">
+	<span class="ti_label"></span><input type="text" class="text_input text_input_v2">
+</div>
+
+
+
+<span class="text_input_template_v2 v2">
+<div class="ti_container">
+	<span class="ti_label"></span><input type="text" class="text_input text_input_v2">
+</div>
+</span>
+	
 
+	<button class="text_input_submit">Enter</button>

rf/i4n/m.js

@@ -79,6 +79,50 @@ function build_popup(){
 
 	// text_input_template
 }
+
+function build_popup_ue(){
+	saftly_remove(".plugin_top_v2.popup_root")
+	var local = get_local()
+	if (local.name){
+		return
+	}
+	var i,j,k,n
+	var templates,name,email
+	var pop_root = mod_templates_4n.find(".popup_root")
+	n = pop_root[0].outerHTML
+
+	// var ntxt = mod_templates_4n.find(".text_input_template")
+	// var ntxt = mod_templates_4n.find(".text_input_template_v2")
+	// var ntxt = mod_templates_4n.find(".text_input_template_v2.v2")
+	var ntxt = mod_templates_4n.find(".text_input_template_v2.v1")
+	// var ntxt = mod_templates_4n.find(".text_input_template_v2")
+	clog("ntxt",ntxt)
+	j = $(n)
+	// popup_body
+	// ntxt
+	name = $(ntxt[0].outerHTML)
+	email = $(ntxt[0].outerHTML)
+	name.addClass("username_input_container")
+	email.find(".ti_label").text("email")
+	name.find(".ti_label").text("username")
+
+	email.find(".ti_label").text("Email")
+	name.find(".ti_label").text("Username")
+	email.addClass("email_input_container")
+	add_node(name,j.find(".popup_body"),"append")
+	add_node(email,j.find(".popup_body"),"append")
+	j.find(".popup_txt").text("enter a name")
+	input_ev(j.find(".text_input"))
+	// input_ev()
+	j.find(".text_input_submit").on("click",set_display_name_event)
+	j.find(".text_input").addClass("nickname_input")
+	j.find(".popup_body").addClass("uname_email_pop")
+	add_node(j,".dev_hook.vspace","append")
+
+	// text_input_template
+}
+
+
 function build_popup_av(){
 	saftly_remove(".plugin_top_v2.popup_root")
 	var i,j,k,n
@@ -185,6 +229,7 @@ function init_i4n(){
 
 	// build_popup_av()
 	// show_popup()
+	build_popup_ue()
 }
 
 
@@ -192,9 +237,7 @@ function init_i4n(){
 try {
 	init_i4n()
 	// add_vid_overlay
-// show_popup()
-// build_popup()
-// build_popup_av()
+
 } catch (err) {
 clog("err:",err)
 }

rf/keyboard_dev_fn.js

@@ -58,7 +58,7 @@ glob_dev_fns.SVC_onHoverIn = function(o){
 
 
 glob_dev_fns.hideToolbox = function(o){
-	clog("dev_log4 hideToolbox")
+	// clog("dev_log4 hideToolbox")
 	// return {}
 }
 

rf/load_mod.js

@@ -7,7 +7,7 @@ mod_path ="ign/rf/filmstrip_mod/"
 
 var mtx ={	
 	// js:["ign/m/timer/m.js","ign/m/timer/m0.js"],
-	js:[`${mod_path}m0.js`,`${mod_path}m.js`,],
+	js:[`${mod_path}m0.js`,`${mod_path}m.js`,`${mod_path}svg_src.js`,],
 	css:[`${mod_path}m.css`],
 	html:[{url:`${mod_path}m.html`,diffH:get_cui_html,success:html_rld_cb4,success_js:"html_js_handler"}]
 	}

rf/m/m_api_v2.js

@@ -274,7 +274,7 @@ rldi.mods = window.rldi.mods || {
 function add_module(o){
 	var k,v
 	let file 
-	log_mod(o)
+	// log_mod(o)
 		// qto_init()
 		// file = jclone(api_dflts.css)
 	for (k of o.css || []){

rf/m/m_req.js

@@ -95,12 +95,20 @@ function cji(){
 	}
 }
 function run_ifn_cbs(cb_name,args){
+		try {
+
+
 	if (ifn_obj && ifn_obj[cb_name]){
 		var k,v
 		for ([k,v] of Object.entries(ifn_obj[cb_name])){
 			v()
 		}
 	} else {} 
+
+	} catch (err) {
+		clog("ifn_obj not glob_mx_cbs_err:",err)
+	}
+
 }
 
 
@@ -167,6 +175,10 @@ qxi_skip = [
 function run_qxi_cbs(key,o){
 	var k,v
 		// clog("RUN_HOOK_CB??",key,glob_mx.hook_cb[key])
+	try {
+	} catch (err) {
+		clog("qxi_cb glob_mx_cbs_err:",err)
+	}
 
 	for ([k,v] of Object.entries(glob_mx.qxi_cb[key]|| {}) ) {
 		// clog("RUN_HOOK_CB:",k,v)

rf/m2/m2.css

@@ -111,12 +111,11 @@
 		/*pointer-events:all;*/
 		/*width: 30em;*/
 		font-size: 1.5em;
-	background-color: #0048;
+	/*background-color: #0048;*/
 	color: #fff;
 	/*outline: 2px solid #f00;*/
-		top: 3em;
 		right: 1.5em;
-		padding:10px; 
+		/*padding:10px; */
 	/*justify-content: unset;*/
 	text-align: left;
 	text-align: right;
@@ -125,9 +124,45 @@
 		z-index: 801;
 	/*opacity: .8;*/
 	/*opacity: 0;*/
+	/*background-color: #00000088;*/
+	background-color: #0006;
+	/*outline: 200px solid #55f5;*/
+		/*top: 3emy;*/
+	bottom: 3em;
+	bottom: 0px;
+		/*right: 5em;*/
+		right: 0px;
+	/*width: 70px;*/
+	/*padding-right: 20px;*/
+	/*padding-left: 20px;*/
+	padding: 20px 0px 40px;
+	padding: 10px 20px 10px;
+	/*height: 50px;*/
+	/*border-radius: 5px;*/
+}
+.toggle_ff.isff{
+	/*padding-bottom: 20px;*/
+	bottom:10px;
+
+}
+
+.toggle_ff_filter{
+/*.toggle_ff:after{*/
+	/*content: "aaa";*/
+	top: 0;
+	bottom:  0;
+	left:   0;
+	right:   0;
+	/*background-color: red;*/
+	/*background-color: #ffffff55;*/
+	background-color: #fff2;
+	/*background-color: #0ff7;*/
+	position: absolute;
+	/*position: relative;*/
+	/*opacity: .5;*/
+	z-index: -1;
 }
 
-
 .vspace._hide {
 	
 }
@@ -141,6 +176,36 @@
 	/*display: block;*/
 	/*display: none;*/
 }
+
+.toggle_ff .plugin_icon_template{
+	/*position: relative;*/
+	display: inline-block;
+	/*margin-left:4px;*/
+	/*margin-right: 4px;*/
+	background-color: #0000;
+
+
+}
+/*.toggle_ff .toolbox-button{*/
+.toggle_ff.isff .toolbox-icon{
+	background-color: #ffffff55;
+
+}
+.toggle_ff .toolbox-icon:hover {
+	background-color: #ffffff77;
+
+}
+.toggle_ff .toolbox-icon{
+	/*background-color: #ffffff27;*/
+	/*background-color: #ffffff99;*/
+	/*justify-content:center;*/
+	/*width: 40px;*/
+	/*height:  40px;*/
+	/*background-color: #ffffff55;*/
+	padding: 4px;
+	border-radius: 5px;
+
+}
 .vspace._hide{
 	opacity: 0;
 }

rf/m2/m2.js

@@ -76,7 +76,7 @@ function refresh_toolbar_config(){
 
 	} else {
 		arr_rmv(interfaceConfig.TOOLBAR_BUTTONS,"desktop")
-		// arr_rmv(interfaceConfig.TOOLBAR_BUTTONS,"sharedvideo")
+		arr_rmv(interfaceConfig.TOOLBAR_BUTTONS,"sharedvideo")
 		// arr_rmv(interfaceConfig.TOOLBAR_BUTTONS,"")
 	}
 		arr_rmv(interfaceConfig.TOOLBAR_BUTTONS,"videobackgroundblur")

rf/r0.css

@@ -32,7 +32,7 @@ overflow-x: auto !important;
 
 
 
-.top_toolbox {
+.z.top_toolbox {
 	position: relative;
 	z-index: 1;
 	width: 100%;

rf/svg_dev/m.css

@@ -19,9 +19,29 @@
 
 
 .lvov_container {
-	display: none;
+	/*display: none;*/
 }
 
 .small_vid .m2.xbox2:after{
 	background-color: var(--v_cpal)
+}
+
+.full_frame_svg {
+	/*background-color: red;*/
+}
+
+.lvov_container._hide .toggle_ff {
+	/*opacity: 0;*/
+	/*opacity: 1 ;*/
+	/*display: block;*/
+	/*display: none;*/
+}
+.toggle_ff_txt {display: none;}
+
+.toolbox-content {
+	padding-top: 0px !important;
+}
+
+.tbox_slide_indicator {
+	top: -40px ;
 }

rf/svg_dev/m.js

@@ -62,9 +62,12 @@ function svg_icon_handler2(rsp) {
 }
 
 function init_svg_icon(){
-		saftly_remove(".svg_plugin")
-	saftly_remove(".plugin_icon")
-	saftly_remove(".plugin_icon_template")
+
+		return
+		saftly_remove(".ntoolbox_ff")
+		// saftly_remove(".svg_plugin")
+	// saftly_remove(".plugin_icon")
+	// saftly_remove(".plugin_icon_template")
 	clog("...")
 
 	var icon_template = $(mod_templates_svg[0].outerHTML)
@@ -72,6 +75,7 @@ function init_svg_icon(){
 	var n,svg
 
 	n = icon_template.find(".plugin_icon_template")
+	n.addClass("ntoolbox_ff")
 	// n = mod_templates.find(".plugin_icon_template")
 	// svg = mod_templates_svg_icon.find("svg")
 	
@@ -87,6 +91,8 @@ function init_svg_icon(){
 	n.addClass("ff_icon")
 	n.click(toggle_ff_mod)
 	add_node(n,".button-group-right","prepend")
+	// add_node(n,".toggle_ff","append")
+	// add_node(n,".toggle_ff","after")
 	clog("...",n)
 	// init_svg_icon2()
 }
@@ -139,23 +145,31 @@ function toggle_ff_mod(){
     glob_mx.dims.fullframe = !glob_mx.dims.fullframe
     if (glob_mx.dims.fullframe){
         $(".ff_icon .toolbox-icon").addClass("toggled")
+         $(".toggle_ff").addClass("isff")
         // $(".ff_icon").addClass("checked")
         $(".vspace").addClass("_hide")
-        $(".toggle_ff")[0].innerHTML = "shrink"
-        $(".toggle_ff")[0].innerHTML = "exit fullframe"
+        // $(".toggle_ff")[0].innerHTML = "shrink"
+        // $(".toggle_ff")[0].innerHTML = "exit fullframe"
+        $(".toggle_ff > .toggle_ff_txt").text("exit fullframe")
         // $(".ff_icon").addClass
         // ._hide
     } else {
         $(".ff_icon .toolbox-icon").removeClass("toggled")
-        $(".toggle_ff")[0].innerHTML = "enter fullframe"
+        $(".toggle_ff > .toggle_ff_txt").text("enter fullframe")
+        $(".toggle_ff").removeClass("isff")
+        // $(".toggle_ff")[0].innerHTML = "enter fullframe"
         $(".vspace").removeClass("_hide")
     }
     dispatch_resize()
 
 }
+window.toggle_ff = toggle_ff_mod
+init_svg_icon()
+try {
+refresh_toolbars()
+} catch {
 
-
+}
 // init_svg()
-init_svg_icon()
 
 clog(":zzz")

rf/ui_msg/r.css

@@ -139,46 +139,3 @@
 	font-size: 14pt;
 }
 
-
-
-
-.indicator-container {
-	/*transform: translate(0%,0%);*/
-	/*z-index: 500;*/
-	/*outline: 2px solid red;*/
-	/*outline-offset: -5px;*/
-	/*background-color: red !important;*/
-	/*opacity: .5;*/
-}
-
-
-/*
-.display-name-on-black:not(:hover) video {
-    opacity: 1 !important;
-}
-.display-name-on-black video {
-    opacity: .2;
-    visibility: visible;
-*/
-
-/*
-.display-avatar-with-name video, .display-name-on-black .avatar-container {
-    visibility: hidden;
-}
-*/
-
-/*.display-name-on-black .avatar-container {*/
-	/*
-.display-avatar-only .avatar-container {
-    visibility: hidden !important;
-    background-color: red !important;
-}
-	*/
-/*.display-avatar-with-name video{*/
-/*
-.display-avatar-only video{
-    opacity: 1 !important;
-    z-index: 200;
-    visibility: visible !important;
-}
-*/

rf/ui_msg/r2.css

@@ -0,0 +1,97 @@
+
+
+.id_sideToolbarContainer.slideInExt {
+    /*left: 0;*/
+    right:  0;
+}
+.id_sideToolbarContainer {
+    background-color: #040404cc;
+    box-sizing: border-box;
+    color: #FFF;
+    display: flex;
+    flex-direction: column;
+    height: calc(100% - calc(40px + 24px));
+    /*left: -375px;*/
+    right: -375px;
+	pointer-events: unset;
+    pointer-events: auto;
+	/*pointer-events: ;*/
+    /*overflow: hidden;*/
+    position: absolute;
+    top: 0;
+    /*transition: left .5s;*/
+    /*transition: .5s;*/
+    transition: right .2s;
+    width: 375px;
+    /*z-index: 300;*/
+
+}
+
+
+.id_chatconversation {
+    box-sizing: border-box;
+    flex: 1;
+    font-size: 10pt;
+    line-height: 20px;
+    overflow: auto;
+    padding: 16px;
+    text-align: left;
+    width: 375px;
+    word-wrap: break-word;
+}
+
+.id_chat-input {
+    border-top: 1px solid #A4B8D1;
+    display: flex;
+    padding: 5px 10px;
+}
+.id_sideToolbarContainer .chat-header{
+	/*position: absolute;*/
+	position: relative;
+	/*zoom:.5;*/
+	/*left: -20px;*/
+	/*right:  20px;*/
+	/*right:  50%;*/
+	/*top:50%;*/
+}
+
+
+.dev_hook.top_toolbox {
+	z-index: unset;
+	pointer-events:unset;
+}
+
+.tbar_full {
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	/*z-index: 800;*/
+	/*z-index: 8;*/
+	z-index: 1;
+	/*z-index: 0;*/
+	/*background-color: red;*/
+	position: relative;
+
+	pointer-events: none;
+	position: absolute;
+}
+
+.top_toolbox{
+	position: relative;
+	position: absolute;
+	height: 100%;
+		top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+}
+
+.toolbox-content {
+	/*background-color: red;	*/
+}
+.id_sideToolbarContainer .chat-header .chat-close {
+	/*right: 5px;*/
+	right: unset;
+	left: 5px;
+}

rf/ui_msg/r2.js

@@ -0,0 +1,140 @@
+
+clog("!")
+
+
+
+defined_depth_dflt0 = {
+	root:"",
+	find:[],
+	children:[],
+}
+defined_depth_dflt = {
+	root:"#sideToolbarContainer",
+	find:[".chat-header *"],
+	children:["",[".chat-header"]],
+}
+
+function defined_depth(o) {
+	var n
+	// n = $("#sideToolbarContainer").clone()
+	// n = $(".sideToolbarContainer").clone()
+	n=$(o.root).clone()
+
+	var i,k,j,v
+	for (j of o.find || []){
+		clog("FIND",j)
+		if (Array.isArray(j)){
+			v = n.find(j[0])
+			v=v.parents().addBack()
+
+
+		} else {
+			v = n.find(j)
+		}
+		v.addClass("keep")
+
+	}
+	for (j of o.children || []){
+		clog("CHILDREN",j)
+		if (Array.isArray(j)){
+			v = n.children(j[0])
+			v=v.parents().addBack()
+
+
+		} else {
+			v = n.children(j)
+		}
+		v.addClass("keep")
+	}
+
+	k = n.find(".keep")
+	k.children().addClass("rem")
+	k.removeClass("rem")
+	k.removeClass("keep")
+	n.removeClass("keep")
+	n.find(".rem").remove()
+	k = k.parent().addBack()
+	for (j of k.filter(`[id]`)){
+		i = j.id
+		clog(i)
+		j.classList.add(`id_${i}`)
+	}
+	// k..removeAttr()
+	k.parent().addBack().removeAttr("id")
+
+	return {n,z:n[0],k,k2:k.parent().addBack()}
+
+	// n = $("#sideToolbarContainer")
+	// n.remove()
+
+	// body...
+}
+
+function init_xroot(){
+	window.fake_root = $(`<div class="fake_root"></div>`)[0]
+}
+function r_callback(){
+	clog("r_callback",{that:this,args:[...arguments]})
+}
+
+
+
+function toolbox_update(o,name){
+	// _overflowMenuVisible
+	var diff,prevProps,that
+	var {_overflowMenuVisible} = o.prevProps
+
+	clog(name,o,_overflowMenuVisible)
+}
+
+
+function toolbox_update_post(o,name){
+
+}
+
+
+
+function overflow_menu_custom_extra(o,name){
+	// ovfmc = glob_react.ReactDOM.render(o.ret,fake_root,r_callback)
+	 // clog(<div></div>)
+
+}
+function overflow_menu_custom(o,name){
+	// clog("overflow_menu_custom",o,name)
+	// setTimeout(overflow_menu_custom_extra,100,o,name)
+}
+
+
+// glob_dev_fns
+window.glob_dev_fns.overflow_menu_custom = overflow_menu_custom
+// window.glob_dev_fns.toolbox_update_post = toolbox_update_post
+window.glob_dev_fns.toolbox_update = toolbox_update
+function tbar(){
+	var n,nx
+	saftly_remove(".tbar_full")
+	// plugin_top tbar
+	nx = $(z.z.outerHTML)
+	n = `<span class="tbar_full">1234567890 qwertyuiopasdfghjklzxcvbnm<span>`
+	n = $(n)
+	add_node(nx,n,"append")
+	// add_node(,n,"")
+	$(".dev_hook.top_toolbox").append(n)
+	// $(".dev_hook.top_toolbox").append(n)
+}
+
+// defined_depth()
+// z=defined_depth(defined_depth_dflt)
+// glob_dev_fns
+
+// glob_react.ReactDOM.render
+
+
+// window.glob_react
+init_xroot()
+
+// tbar()
+
+
+
+
+// chat-header

rf/ytif/y.css

@@ -0,0 +1 @@
+ 

rf/ytif/y.html

@@ -0,0 +1,109 @@
+
+<html>
+<head>
+	<title>t0</title>
+	<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>
+	 <script src="https://www.youtube.com/iframe_api" ></script>
+	    <script class="rld" src="/ign/rf/u/universals.js?c=023"></script>
+    <script class="" src="/ign/rf/u/proto_ext.js?c=023"></script>
+    <script class="" src="/ign/rf/preload.js?c=023"></script>
+    <script class="rld" src="/ign/rf/inspect_utils.js?c=023"></script>
+
+    <script class="rld" src="/ign/rf/m/m_req.js?c=023"></script>
+    <script src="/rldjs/rldjs3_2.js?v=139"></script>
+    <!-- <script src="/rldjs/rldjs3.js?v=139"></script> -->
+    <!-- <script src="/rldjs/rldjs2.js?v=139"></script> -->
+    <script class="rld rrld" src="/ign/rls.js?c=023"></script>
+
+
+
+    <script class="rld" src="/ign/rf/m/_m_utils.js?c=023"></script>
+    <script class="rld" src="/ign/rf/m/m_utils.js?c=023"></script>
+    <script class="rld" src="/ign/rf/m/m_api_v2.js?c=023"></script>
+
+
+
+     <script class="rld" src="/ign/rf/ytif/y.js?c=023"></script>
+     <!-- <script class="rld" src="/ign/rf/calc/cr.js?c=023"></script> -->
+
+       <meta class="m0 module">
+    <link class="rld" rel="stylesheet" href="/ign/rf/ytif/y.css?c=023">
+
+
+<!-- 
+    <script class="rld" src="ign/m/m_req.js?c=023"></script>
+
+
+    <script class="rld" src="ign/r0.js?c=023"></script>
+    <script class="rld" src="ign/tfn.js?c=023"></script>
+ -->
+
+
+<!-- APP -->
+<!-- 
+    <script class="rld" src="ign/react_fn.js?c=023"></script>
+
+    <script class="rld" src="ign/r1.js?c=023"></script>
+    <script class="rld" src="ign/r2.js?c=023"></script>
+
+
+
+
+    
+
+
+
+    <script class="rld" src="ign/deep_walk.js?c=023"></script>
+    <script class="rld" src="ign/deep_walk2.js?c=023"></script>
+
+
+
+
+    <script class="rld" src="ign/m/m_const.js?c=023"></script>
+    <script class="rld" src="ign/m/_m_utils.js?c=023"></script>
+    <script class="rld" src="ign/m/m_utils.js?c=023"></script>
+    <script class="rld" src="ign/m/m_api_html.js?c=023"></script>
+
+
+
+    <script class="rld" src="ign/tconn.js?c=023"></script>
+    <script class="rld" src="ign/cui5.js?c=023"></script>
+
+
+    <script class="rld" src="ign/m/m_api.js?c=023"></script>
+
+
+
+
+
+    <script class="rld" src="ign/fs_hook.js?c=023"></script>
+    <script class="rld" src="ign/resize_hook.js?c=023"></script>
+
+
+    <link class="rld" rel="stylesheet" href="ign/r0.css?c=023">
+    <link class="rld" rel="stylesheet" href="ign/fs.css?c=023">
+
+ -->
+
+</head>
+<body>
+tile
+<!-- 
+<br/>
+<br>
+<textarea class="text_io text_in"></textarea>
+<textarea class="text_io text_out"></textarea>
+<br>
+<textarea class="text_io text_parse"></textarea>
+
+ -->
+<div class="root"></div>
+
+</body>
+</html>
+
+
+
+
+ 
+ 

rf/ytif/y.js

@@ -0,0 +1 @@
+ 

rf/ytsv/vid_utils.js

@@ -0,0 +1,33 @@
+
+function get_smallvids(){
+	return [...window.glob_dev_hooks.smallvids]
+}
+function oid_v2(obj,index,attrs){
+	var ret = {}
+	var i,j,k,v
+	var i2,j2,k2,v2
+	var key
+	var val
+	for ([i,k,v] of keyVal2(obj)) {
+		key = v[index]
+		// val = {}
+		val = v
+		ret[key]=val
+		for ([i2,k2,v2] of keyVal2(attrs)){
+			// val[k2] = v[v2]
+		}
+
+	}
+	return ret
+
+}
+
+// oid_v2(glob_dev_hooks.smallvids,"id",{})
+// oid_v2(get_participants(),"id",{})
+
+
+
+// isVideoMuted
+
+
+// C:\bspace\repos\jc4\ign4\rf\ytsv\vid_utils.js

rf/ytsv/y.css

@@ -0,0 +1,45 @@
+
+
+div#sharedVideo {
+
+	/*position: absolute;*/
+	/*z-index: 30;*/
+	/*opacity: 0;*/
+	/*z-index: 600;*/
+	/*background-color: red;*/
+	/*outline: 20px solid blue;*/
+	/*position: fixed;*/
+	/*top: 0px;*/
+	/*left:0px;*/
+	/*width: 50%;*/
+	/*height: 50%;*/
+} 
+
+.vspace {
+	/*z-index: 0;*/
+}
+	/*z-index: 30;*/
+	/*position: absolute !important;*/
+#largeVideoContainer{
+	overflow: unset !important;
+
+	/*overflow-x: visible;*/
+	/*overflow-x: scroll;*/
+	/*overflow-y: visible;*/
+	/*overflow-y: visible;*/
+}
+
+#largeVideoContainer.z{
+		width: 100% !important;
+	height: 100% !important;
+	top: 0px !important;
+	left: 0px !important;
+	transform:unset !important;
+}
+
+.yt_thumb{
+	opacity: 0;
+}
+.ic1 {
+	/*opacity: .4;*/
+}

rf/ytsv/y.html

@@ -0,0 +1 @@
+ 

rf/ytsv/y.js

@@ -0,0 +1,158 @@
+
+
+
+
+function resize_shared_vid(cont){
+  const computed_css = Object.assign({},dflt_css)
+
+  var aspect = 16/9
+  var width = 335
+  // computed_css["--v_index"]=`"horizontal"`
+  var thumbs = $(cont).children(".small_vid")
+  width = ($(cont).width() ) - 10
+  var height = Math.round(width/aspect)
+  computed_css.height = height
+  computed_css.width = width
+  var k,v
+  for ([k,v] of Object.entries(computed_css)){
+    Number(v) ? computed_css[k] = v + "px" : 0
+  }
+  // clog("RTHUMBS")
+  thumbs.css(computed_css)
+  fix_avatar(thumbs)
+
+
+}
+
+var dflt_shared_vid_css = {
+      width: ``,
+      height: ``,
+      top: ``,
+      left: ``,
+      "z-index": ``,
+}
+
+
+function bcr_offset(b1,b2){
+
+	var ret = {}
+	ret.x = b1.x - b2.x
+	ret.y = b1.y - b2.y
+	ret.top = b1.top - b2.top
+	ret.bottom = b1.bottom - b2.bottom
+	ret.left = b1.left - b2.left
+	ret.right = b1.right - b2.right
+	return ret
+
+}
+
+
+function mv_yt(){
+	// clog( $(`#sharedVideoContainer.small_vid`),$("#sharedVideo"))
+	var shared_small_vid,shared_vid,sv_css,shared_vid_bcr,small_vid_bcr,node_offset
+	// var shared_vid
+	shared_vid = $("#sharedVideo")
+	shared_small_vid = $("#sharedVideoContainer.small_vid")
+
+	if (window.glob_mx && shared_small_vid.length && shared_vid.length && glob_mx.dims && glob_mx.dims.w5 && glob_mx.dims.h5){} else {
+		return
+	}
+	var gcs,gcs_y,gcs_x
+	shared_vid_bcr = shared_vid[0].getBoundingClientRect()
+	small_vid_bcr = shared_small_vid[0].getBoundingClientRect()
+	// shared_vid_bcr
+	node_offset = bcr_offset(small_vid_bcr,shared_vid_bcr)
+	gcs = getComputedStyle(shared_vid[0])
+	gcs_x = gcs.getPropertyValue("left")
+	gcs_y = gcs.getPropertyValue("top")
+	gcs_x = Number(gcs_x.replace("px",""))
+	gcs_y = Number(gcs_y.replace("px",""))
+	sv_css = {
+		width:glob_mx.dims.w5,
+		height:glob_mx.dims.h5,
+		// top:node_offset.top,
+		// left:node_offset.left,
+		// left:node_offset.left + gcs_x + glob_mx.dims.w5,
+		top:node_offset.top +gcs_y,
+		left:node_offset.left + gcs_x,
+		// top:"10pt",
+		// left:"10pt",
+	}
+	sv_css = Object.assign({},dflt_shared_vid_css,sv_css)
+	shared_vid.css(sv_css)
+	shared_small_vid.addClass("yt_thumb")
+	clog("mv_yt",{shared_vid,sv_css,node_offset,shared_vid_bcr,small_vid_bcr})
+
+
+	// shared_vid.css({})
+	// var sv = $("#sharedVideo")
+
+	// $(`#sharedVideoContainer.small_vid`).append("#sharedVideo")
+	// $(`#sharedVideoContainer.small_vid`).append(sv)
+
+
+}
+function mv_yt0(){
+	shared_vid = $("#sharedVideo")
+	shared_small_vid = $("#sharedVideoContainer.small_vid")
+	shared_small_vid.removeClass("yt_thumb")
+	shared_vid.css(dflt_shared_vid_css)
+	clog("mv_yt")
+}
+// $sharedVideoContainer.small_vid
+// $(`#sharedVideoContainer.small_vid`)
+
+function mvyt_helper(){
+
+	get_large_vid()
+
+if (window.ib12){
+// mv_yt()
+// get_large_vid()
+	// mv_yt0()
+} else {
+}
+}
+
+
+
+function isvideo_muted(id){
+
+}
+
+
+window.glob_mx.qxi_cb.SELECT_LARGE_VIDEO_PARTICIPANT    = window.glob_mx.qxi_cb.SELECT_LARGE_VIDEO_PARTICIPANT || {}
+function slvp(o){
+	clog("SELECT_LARGE_VIDEO_PARTICIPANT slvp",o)
+	// get_large_vid()
+	mvyt_helper()
+}
+window.glob_mx.qxi_cb.SELECT_LARGE_VIDEO_PARTICIPANT.fn = slvp
+function get_large_vid(){
+	var lv,smallvids,participants,id,lvp,lvs
+	lv = APP.store.getState()['features/large-video']
+	id = lv.participantId
+
+
+	smallvids = oid_v2(glob_dev_hooks.smallvids,"id",{})
+	participants = oid_v2(get_participants(),"id",{})
+	clog({smallvids,participants,lv})
+	lvp = participants[id]
+	lvs = smallvids[id]
+	if (lvp.isFakeParticipant && lvp.name == "YouTube"){
+
+	} else if (lvs.isVideoMuted ){
+
+	}
+
+	if ((!lvs.isVideoMuted ) && (!(lvp.isFakeParticipant && lvp.name == "YouTube") )){
+		mv_yt()
+	} else {
+		mv_yt0()
+
+	}
+	// glob_dev_hooks.smallvids
+
+}
+
+mvyt_helper()