jfinn
/
jsyncdb


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
							<html itemscope itemtype="http://schema.org/Product" prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/html">
  <head>

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />


<!-- <script class="win_keys2 win_keys_glob_attrs" src="/ign/j9/dbg/glob_attrs.js?c=00x"></script> -->


<script src="/jquery-3.5.1.min.js"></script>

<!-- <script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script> -->
<!-- 
<script class="rld" src="jsync_dep.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_ord.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_ws.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_sto.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_init.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_test.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script class="rld" src="jsync_demo.js"></script>
 -->


<!-- 
<script class="rld" src="/ign/indx/jsyncdb/jsync_dep.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_ord.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_ws.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_sto.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_init.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_test.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
<script class="rld" src="/ign/indx/jsyncdb/jsync_demo.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>                             
 -->


<!-- 
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
<script src="/ign/j7/rldjs/rldjs5.js?v=139"></script>
<script class="rld rrld" src="/ign/rls.js?<!--#echo var='rtqs'-->"></script>
<script class="rld rrld_u" src="/ign/rls_u.js?<!--#echo var='rtqs'-->"></script>

<script class="rld" src="/ign/indx/jsyncdb/jsync_test2.js"></script>
<script class="win_keys" src="/ign/j9/dbg/win_keys.js?c=00x"></script>
 -->

<!-- <script class="rld" type="module" src="/ign/indx/jsyncdb/jsync_lib.js"></script> -->
<script class="rld" src="/jsync_lib.js"></script>
<script class="rld" src="/jsync_demo.js"></script>


<style type="text/css">


</style>
 <link  class="rld" rel="stylesheet" href="/jsync_demo.css">

</head>
<body>

<div id="root_div">
  <span class="iblock_2"></span>
  <span class="iblock_1"></span>
</div>
<div id="oops_i_lied"><div class="code_container">
  in this demo the global variable msto_prx is the root of the database.
we will use the global variable msto because it is a little nicer (has shortcuts to the parts you have exclusive write permissions to).

<b>open devtools on two pages connected to the same database to begin</b>
to get a copy of the datastructure without the Proxies:
<code>jc(msto)

</code> set values<code>

msto.key = "value"

  msto.example = {
    str:"these are supported data types",
    number:12.7,
    arr:["val0",1,{z:1},["a","b"]],
    obj:{d:"there is a max depth of 15"},
    str2:"null isn't fully supported yet and can break things",
  }
</code>
  you can paste this shorter statement to avoid newlines in your devtools history :)

<code>msto.example = {str:"str_val",number:12.7,arr:["val0",1,{z:2},["a","b"]],obj:{d:"depth of 2?"},str2:"yet another string",}</code>

  get values
  <code>
msto.example.arr[0]
// "val0"

msto.example.arr[2]
// {z:2}</code>
the datastructure should have syncronized msto & msto_prx on both webpages 
<span class="db_desc">
values can be strings,numbers,objects or arrays
null and undefined are not supported yet
local changes are immediate
and deletes are local only (for now)
after a value is set is pushed to everyone else who is connected

msto.ws_channels and msto.participants are write protected 
msto.my_data links to the path you have write access to as does msto.my_channel
participants and channels write only data are automatically deleted after they leave
the data is not persistent it exists in the webpages of those connected
if everyone leaves a room the datastructure is destroyed
</span></div></div>

</body>
</html>