scroll

apps/web/priv/static/doc/Kakaranet-Scene.svg

@@ -4,7 +4,7 @@
     <title>Kakaranet-Scene</title>
     <description>Created with Sketch.</description>
     <defs>
-    <clipPath id="myClip"><rect xmlns="http://www.w3.org/2000/svg" id="Clip-Path" x="0" y="0" width="216" height="200"/></clipPath>
+    <clipPath id="myClip"><rect id="Clip-Path" x="0" y="0" width="216" height="400"/></clipPath>
     </defs>
     <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
         <g id="Kakaranet-12-maxim" sketch:type="MSLayerGroup">
@@ -758,7 +758,6 @@
             <rect id="Chat-Input" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="8" y="194" width="196" height="61"></rect>
         </g>
         <g id="Online-List" sketch:type="MSLayerGroup" y="0" clip-path="url(#myClip)" transform="translate(1.000000, 95.000000)">
-          <g id="Online-Scroll" clip-path="url(#myClip)">
             <g id="Online-Maxim">
                 <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
                 <rect id="Rectangle-84" stroke="#48AF5E" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="7" y="7" width="60" height="60"></rect>
@@ -771,34 +770,65 @@
                 <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
                 <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
                 <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
-                    <tspan x="75.685446" y="24">Синан</tspan>
-                    <tspan x="75.685446" y="42">Устел</tspan>
+                    <tspan x="75.685446" y="24">Максим</tspan>
+                    <tspan x="75.685446" y="42">Трескин</tspan>
                 </text>
             </g>
             <g id="Online-Sinan-2" transform="translate(0.000000, 148.000000)">
                 <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
                 <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
                 <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
-                    <tspan x="75.685446" y="24">Синан</tspan>
-                    <tspan x="75.685446" y="42">Устел</tspan>
+                    <tspan x="75.685446" y="24">Влад</tspan>
+                    <tspan x="75.685446" y="42">Кириллов</tspan>
                 </text>
             </g>
             <g id="Online-Sinan-3" transform="translate(0.000000, 222.000000)">
                 <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
                 <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
                 <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
-                    <tspan x="75.685446" y="24">Синан</tspan>
-                    <tspan x="75.685446" y="42">Устел</tspan>
+                    <tspan x="75.685446" y="24">Алексей</tspan>
+                    <tspan x="75.685446" y="42">Радецкий</tspan>
                 </text>
             </g>
             <g id="Online-Sinan-4" transform="translate(0.000000, 296.000000)">
                 <rect id="Rect" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
                 <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
                 <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
+                    <tspan x="75.685446" y="24">Андрей</tspan>
+                    <tspan x="75.685446" y="42">Мартемьянов</tspan>
+                </text>
+            </g>
+            <g id="Online-Sinan-5" transform="translate(0.000000, 370.000000)">
+                <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
+                <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
+                <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
+                    <tspan x="75.685446" y="24">Роман</tspan>
+                    <tspan x="75.685446" y="42">Гладков</tspan>
+                </text>
+            </g>
+            <g id="Online-Sinan-6" transform="translate(0.000000, 444.000000)">
+                <rect id="Rectangle-83" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
+                <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
+                <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
+                    <tspan x="75.685446" y="24">Андрей</tspan>
+                    <tspan x="75.685446" y="42">Задорожний</tspan>
+                </text>
+            </g>
+            <g id="Online-Sinan-7" transform="translate(0.000000, 518.000000)">
+                <rect id="Rect" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
+                <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
+                <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
                     <tspan x="75.685446" y="24">Синан</tspan>
                     <tspan x="75.685446" y="42">Устел</tspan>
                 </text>
             </g>
+            <g id="Online-Sinan-8" transform="translate(0.000000, 592.000000)">
+                <rect id="Rect" stroke="#979797" fill="#DBEBED" sketch:type="MSShapeGroup" x="0" y="0" width="215" height="74"></rect>
+                <rect id="Rectangle-84" stroke="#E5BC7B" stroke-width="3" fill="#D8D8D8" sketch:type="MSShapeGroup" x="8" y="6.59994507" width="60.5633803" height="60"></rect>
+                <text id="Синан" sketch:type="MSTextLayer" font-family="Exo 2" font-size="18" font-weight="normal" line-spacing="18" fill="#3B5998">
+                    <tspan x="75.685446" y="24">Ахмет</tspan>
+                    <tspan x="75.685446" y="42">Тез</tspan>
+                </text>
             </g>
         </g>
         <g id="Player-Statistics" sketch:type="MSLayerGroup" transform="translate(209.000000, 87.000000)">

apps/web/priv/static/doc/svg.js

@@ -226,9 +226,10 @@ loadFile('templates/Card.svg', function() {
         
         document.getElementById('Page-1').addEventListener("mousewheel", mouseWheelHandler, false);
         
-        var clipPath = svg('<clipPath id="myClip"><rect xmlns="http://www.w3.org/2000/svg" id="Clip-Path" x="0" y="0" width="216" height="200"/></clipPath>');
+        var clipPath = svg('<clipPath id="myClip"><rect xmlns="http://www.w3.org/2000/svg" id="Clip-Path" x="0" y="0" width="216" height="400"/></clipPath>');
         document.getElementsByTagName('defs').item(0).appendChild(clipPath);
         document.getElementById("Online-List").setAttribute("clip-path","url(#myClip)");
+        document.getElementById("Clip-Path").setAttribute("transform", "translate(0,0)");
         document.getElementById('Player-Statistics').style.display = 'none';
         
         
@@ -286,8 +287,10 @@ function mouseWheelHandler(e) {
     var scroll_dy = evt.detail ? evt.detail * scrollSensitivity : evt.wheelDelta * scrollSensitivity;
     var ori = scroll;
     scroll = parseFloat(scroll_dy) + parseFloat(ori);
-    document.getElementById("Clip-Path").setAttribute("transform", "translate(0,"+parseFloat(scroll)+")");
-    document.getElementById("Online-List").setAttribute("transform", "translate(0,"+(parseFloat(95-scroll))+")");
+    if (scroll > 0) scroll = 0;
+    if (scroll < -274) scroll = -274;
+    document.getElementById("Clip-Path").setAttribute("transform", "translate(0,"+parseFloat(-scroll)+")");
+    document.getElementById("Online-List").setAttribute("transform", "translate(0,"+(parseFloat(95+scroll))+")");
     console.log(ori);
     return true; 
 }

apps/web/priv/static/doc/svg_clean.htm

@@ -11,7 +11,7 @@
 <svg id="Refined" width="900px" style="position:fixed; top:0; left:0; height:100%; width:100%;">Placeholder for SVG Game Scene</svg>
 
 
-<div style="display: none;" id="history">
+<div class="controls" id="history">
 <button id="pluslogin" type="button" data-gapiattached="true">Login</button>
 <label id="nothing"> Google</label></div><label id="gosterge">Gosterge: 1 5</label><br>
 <label id="player1"> Albert Einstein </label><select id="h1"></select>

apps/web/priv/static/doc/synrc.css

@@ -2,6 +2,8 @@
     A:link      { color: blue; }
     A:visited   { color: darkblue; }
     A:hover     { color: blue; }
+    
+    controls { display: none; }
 
     SUP        { font-size:10pt; }
     BODY        { font-size:14pt; font-family: "Exo 2",Calibri, Lucida Sans, "Lucida Grande"; }