proper player names on load in SVG

apps/face/priv/static/doc/Kakaranet-7-Refined.svg

@@ -605,69 +605,44 @@
                 <path d="M15.974,14.579 C16,15.145 15.41,15.606 14.655,15.606 L1.011,15.606 C0.256,15.606 -0.335,15.145 -0.31,14.579 L0.324,0.514 C0.345,0.037 0.92,-0.347 1.607,-0.347 L14.034,-0.347 C14.722,-0.347 15.297,0.037 15.319,0.514 L15.974,14.579 L15.974,14.579 Z" id="Shape" fill="#FFFFFF"></path>
             </g>
         </g>
-        <g id="Mustafa-+-Timer" sketch:type="MSLayerGroup" transform="translate(468.000000, 99.000000)">
-            <g id="Mustafa-Timer" sketch:type="MSShapeGroup">
-                <path d="M4.968,30.194 C2.572,30.194 0.623,28.245 0.623,25.849 L0.623,4.864 C0.623,2.468 2.572,0.519 4.968,0.519 L25.982,0.519 C28.379,0.519 30.329,2.468 30.329,4.864 L30.329,25.849 C30.329,28.245 28.379,30.194 25.982,30.194 L4.968,30.194 L4.968,30.194 Z" id="Shape" fill="#517ECE"></path>
-                <path d="M25.982,1.52 C27.829,1.52 29.329,3.018 29.329,4.865 L29.329,25.85 C29.329,27.697 27.829,29.195 25.982,29.195 L4.968,29.195 C3.121,29.195 1.623,27.697 1.623,25.85 L1.623,4.865 C1.623,3.018 3.121,1.52 4.968,1.52 L25.982,1.52 L25.982,1.52 Z M25.982,-0.48 L4.968,-0.48 C2.021,-0.48 -0.377,1.917 -0.377,4.865 L-0.377,25.85 C-0.377,28.797 2.021,31.195 4.968,31.195 L25.982,31.195 C28.93,31.195 31.329,28.798 31.329,25.85 L31.329,4.865 C31.329,1.917 28.93,-0.48 25.982,-0.48 L25.982,-0.48 L25.982,-0.48 Z" id="Shape" fill="#517ECE"></path>
-                <g id="Shape-+-Shape-+-Shape" transform="translate(2.000000, 2.000000)">
-                    <path d="M23.982,-0.48 L2.968,-0.48 C1.121,-0.48 -0.377,1.018 -0.377,2.865 L-0.377,12.585 L27.329,12.585 L27.329,2.865 C27.329,1.018 25.829,-0.48 23.982,-0.48 L23.982,-0.48 Z" id="Shape" fill="#5CBF6F"></path>
-                    <path d="M5.638,10.637 L5.546,8.873 C6.732,8.627 7.919,8.505 9.105,8.505 C10.291,8.505 11.178,8.679 11.767,9.026 C12.355,9.374 12.649,10.018 12.649,10.959 C12.649,11.593 12.534,12.153 12.304,12.639 C12.074,13.125 11.616,13.731 10.931,14.457 L8.216,17.279 C8.605,17.208 9.126,17.172 9.781,17.172 L12.956,17.172 L12.956,19.274 L5.456,19.274 L5.456,17.97 C5.456,17.571 5.568,17.254 5.793,17.019 L8.385,14.227 C9.653,12.908 10.281,11.9 10.272,11.205 C10.262,10.909 10.149,10.717 9.935,10.63 C9.72,10.543 9.352,10.5 8.831,10.5 C7.745,10.499 6.681,10.544 5.638,10.637 L5.638,10.637 Z" id="Shape" fill="#FFFFFF"></path>
-                    <path d="M14.043,8.688 L20.394,8.688 C20.782,8.688 21.066,8.808 21.245,9.048 C21.424,9.289 21.452,9.583 21.329,9.93 L18.123,19.271 L15.822,19.271 L18.507,11.602 C18.63,11.224 18.778,10.891 18.952,10.605 L14.136,10.605 L14.043,8.688 L14.043,8.688 Z" id="Shape" fill="#FFFFFF"></path>
-                </g>
-            </g>
-            <g id="Mustafa" transform="translate(36.000000, 0.000000)" sketch:type="MSShapeGroup">
-                <path d="M100.518,26.986 C100.518,29.033 98.857,30.693 96.809,30.693 L3.52,30.693 C1.473,30.693 -0.188,29.033 -0.188,26.986 L-0.188,3.728 C-0.188,1.681 1.472,0.021 3.52,0.021 L96.809,0.021 C98.857,0.021 100.518,1.681 100.518,3.728 L100.518,26.986 L100.518,26.986 Z" id="Shape" fill="#517ECE"></path>
-                <g transform="translate(9.000000, 8.000000)" id="Shape" fill="#FFFFFF">
-                    <path d="M9.387,0.98 L11.886,0.98 C12.509,0.98 12.831,1.303 12.855,1.949 L13.314,12.71 L10.866,12.71 L10.475,3.003 L10.186,3.003 L8.417,10.262 C8.304,10.818 7.952,11.095 7.363,11.095 L5.663,11.095 C5.074,11.095 4.723,10.818 4.609,10.262 L2.824,3.003 L2.535,3.003 L2.195,12.71 L-0.253,12.71 L0.172,1.949 C0.206,1.303 0.529,0.98 1.142,0.98 L3.641,0.98 C4.196,0.98 4.536,1.258 4.661,1.813 L6.089,7.661 C6.18,8.035 6.282,8.585 6.396,9.31 L6.617,9.31 C6.629,9.253 6.671,9.021 6.745,8.613 C6.818,8.205 6.878,7.888 6.923,7.661 L8.334,1.813 C8.469,1.258 8.819,0.98 9.387,0.98 L9.387,0.98 Z"></path>
-                    <path d="M23.259,4.329 L23.259,12.71 L21.27,12.71 L21.083,11.554 C19.927,12.472 18.77,12.931 17.614,12.931 C16.039,12.931 15.252,12.155 15.252,10.602 L15.252,4.329 L17.768,4.329 L17.768,9.837 C17.756,10.2 17.819,10.455 17.956,10.602 C18.092,10.749 18.33,10.823 18.67,10.823 C19.157,10.823 19.854,10.591 20.761,10.126 L20.761,4.329 L23.259,4.329 L23.259,4.329 Z"></path>
-                    <path d="M29.055,9.599 L26.964,9.038 C26.193,8.811 25.66,8.502 25.366,8.111 C25.071,7.72 24.924,7.179 24.924,6.487 C24.924,5.614 25.194,4.997 25.732,4.634 C26.27,4.272 27.191,4.09 28.495,4.09 C30.002,4.113 31.294,4.22 32.371,4.413 L32.201,6.028 C30.772,6.006 29.696,5.994 28.971,5.994 C28.575,5.994 28.3,5.997 28.147,6.002 C27.994,6.008 27.841,6.027 27.688,6.062 C27.535,6.097 27.441,6.15 27.408,6.224 C27.374,6.298 27.356,6.408 27.356,6.556 C27.356,6.613 27.359,6.663 27.365,6.709 C27.371,6.755 27.385,6.797 27.408,6.836 C27.43,6.876 27.45,6.907 27.468,6.93 C27.485,6.952 27.516,6.978 27.561,7.006 C27.607,7.034 27.643,7.054 27.671,7.066 C27.699,7.078 27.751,7.097 27.824,7.126 C27.898,7.154 27.954,7.174 27.994,7.186 C28.034,7.198 28.107,7.217 28.216,7.246 C28.323,7.274 28.405,7.294 28.462,7.306 L30.604,7.884 C31.352,8.099 31.885,8.385 32.203,8.742 C32.519,9.099 32.679,9.629 32.679,10.332 C32.679,11.329 32.39,12.006 31.812,12.363 C31.234,12.72 30.243,12.899 28.837,12.899 C27.477,12.899 26.225,12.803 25.08,12.61 L25.232,10.978 C25.64,11.001 26.609,11.012 28.139,11.012 C29.012,11.012 29.581,10.975 29.848,10.902 C30.114,10.828 30.247,10.655 30.247,10.383 C30.247,10.326 30.244,10.276 30.238,10.23 C30.232,10.184 30.218,10.142 30.196,10.103 C30.173,10.063 30.15,10.032 30.128,10.009 C30.106,9.987 30.068,9.961 30.018,9.933 C29.968,9.905 29.927,9.882 29.899,9.865 C29.871,9.848 29.817,9.825 29.738,9.797 C29.658,9.769 29.595,9.749 29.55,9.737 C29.505,9.726 29.425,9.706 29.312,9.677 C29.196,9.647 29.111,9.622 29.055,9.599 L29.055,9.599 Z"></path>
-                    <path d="M37.555,6.012 L37.555,9.973 C37.555,10.29 37.623,10.511 37.759,10.636 C37.895,10.761 38.133,10.823 38.473,10.823 L39.544,10.823 L39.815,12.574 C39.169,12.801 38.381,12.914 37.453,12.914 C36.693,12.914 36.104,12.702 35.684,12.276 C35.265,11.851 35.055,11.259 35.055,10.5 L35.055,6.012 L33.576,6.012 L33.576,4.414 L35.055,4.329 L35.055,1.983 L37.554,1.983 L37.554,4.329 L39.883,4.329 L39.883,6.012 L37.555,6.012 L37.555,6.012 Z"></path>
-                    <path d="M41.499,6.199 L41.261,4.499 C42.769,4.227 44.225,4.091 45.63,4.091 C46.764,4.091 47.597,4.32 48.129,4.779 C48.662,5.238 48.928,6.034 48.928,7.168 L48.928,12.71 L46.94,12.71 L46.685,11.435 C45.846,12.421 44.815,12.914 43.59,12.914 C42.785,12.914 42.128,12.702 41.618,12.276 C41.108,11.851 40.853,11.259 40.853,10.5 L40.853,9.65 C40.853,8.982 41.08,8.46 41.533,8.086 C41.986,7.712 42.615,7.525 43.42,7.525 L46.412,7.525 L46.412,7.151 C46.4,6.72 46.302,6.431 46.114,6.284 C45.927,6.137 45.567,6.063 45.035,6.063 C44.105,6.063 42.927,6.108 41.499,6.199 L41.499,6.199 Z M43.335,9.837 L43.335,10.16 C43.335,10.738 43.664,11.027 44.321,11.027 C45.001,11.027 45.698,10.755 46.412,10.211 L46.412,9.038 L44.151,9.038 C43.607,9.049 43.335,9.316 43.335,9.837 L43.335,9.837 Z"></path>
-                    <path d="M56.901,2.306 L55.32,2.306 C54.9,2.306 54.608,2.385 54.444,2.544 C54.28,2.703 54.198,2.986 54.198,3.394 L54.198,4.329 L56.51,4.329 L56.51,6.012 L54.198,6.012 L54.198,12.71 L51.665,12.71 L51.665,6.012 L50.203,6.012 L50.203,4.414 L51.665,4.329 L51.665,3.054 C51.665,1.331 52.583,0.47 54.419,0.47 C55.608,0.47 56.516,0.527 57.139,0.64 L56.901,2.306 L56.901,2.306 Z"></path>
-                    <path d="M57.972,6.199 L57.734,4.499 C59.242,4.227 60.698,4.091 62.103,4.091 C63.237,4.091 64.07,4.32 64.602,4.779 C65.135,5.238 65.401,6.034 65.401,7.168 L65.401,12.71 L63.413,12.71 L63.158,11.435 C62.319,12.421 61.288,12.914 60.063,12.914 C59.258,12.914 58.601,12.702 58.091,12.276 C57.581,11.851 57.326,11.259 57.326,10.5 L57.326,9.65 C57.326,8.982 57.553,8.46 58.006,8.086 C58.459,7.712 59.088,7.525 59.893,7.525 L62.885,7.525 L62.885,7.151 C62.873,6.72 62.775,6.431 62.587,6.284 C62.4,6.137 62.04,6.063 61.508,6.063 C60.578,6.063 59.399,6.108 57.972,6.199 L57.972,6.199 Z M59.808,9.837 L59.808,10.16 C59.808,10.738 60.137,11.027 60.794,11.027 C61.474,11.027 62.171,10.755 62.885,10.211 L62.885,9.038 L60.624,9.038 C60.08,9.049 59.808,9.316 59.808,9.837 L59.808,9.837 Z"></path>
-                </g>
-            </g>
-        </g>
-        <g id="You-+-Timer" sketch:type="MSLayerGroup" transform="translate(469.000000, 421.000000)">
-            <g id="You" transform="translate(36.000000, 0.000000)" sketch:type="MSShapeGroup">
-                <path d="M60.353,27.127 C60.353,29.174 58.692,30.834 56.644,30.834 L3.355,30.834 C1.308,30.834 -0.353,29.174 -0.353,27.127 L-0.353,3.869 C-0.353,1.822 1.307,0.162 3.355,0.162 L56.644,0.162 C58.692,0.162 60.353,1.822 60.353,3.869 L60.353,27.127 L60.353,27.127 Z" id="Shape" fill="#517ECE"></path>
-                <g transform="translate(15.000000, 9.000000)" id="Shape" fill="#FFFFFF">
-                    <path d="M6.29,7.909 L6.29,11.785 L3.689,11.785 L3.689,7.909 L-0.187,0.055 L2.516,0.055 L4.471,4.356 C4.584,4.606 4.732,5.099 4.912,5.835 L5.082,5.835 C5.219,5.223 5.36,4.731 5.508,4.356 L7.463,0.055 L10.132,0.055 L6.29,7.909 L6.29,7.909 Z"></path>
-                    <path d="M13.906,3.166 C15.469,3.166 16.578,3.504 17.229,4.178 C17.881,4.852 18.208,5.994 18.208,7.604 C18.208,9.214 17.882,10.349 17.229,11.012 C16.579,11.675 15.469,12.006 13.906,12.006 C12.331,12.006 11.217,11.675 10.565,11.012 C9.913,10.349 9.587,9.213 9.587,7.604 C9.587,5.983 9.913,4.838 10.565,4.169 C11.217,3.5 12.331,3.166 13.906,3.166 L13.906,3.166 Z M13.906,5.053 C13.237,5.053 12.79,5.223 12.563,5.563 C12.335,5.904 12.223,6.584 12.223,7.604 C12.223,8.601 12.335,9.27 12.563,9.61 C12.79,9.95 13.237,10.12 13.906,10.12 C14.552,10.12 14.991,9.95 15.223,9.61 C15.455,9.27 15.573,8.601 15.573,7.604 C15.573,6.595 15.46,5.918 15.233,5.573 C15.004,5.227 14.563,5.053 13.906,5.053 L13.906,5.053 Z"></path>
-                    <path d="M27.879,3.404 L27.879,11.785 L25.891,11.785 L25.703,10.629 C24.547,11.547 23.39,12.006 22.234,12.006 C20.66,12.006 19.873,11.231 19.873,9.678 L19.873,3.405 L22.389,3.405 L22.389,8.913 C22.377,9.276 22.44,9.53 22.577,9.679 C22.712,9.825 22.95,9.9 23.29,9.9 C23.778,9.9 24.474,9.668 25.382,9.203 L25.382,3.406 L27.879,3.406 L27.879,3.404 Z"></path>
-                </g>
-            </g>
-            <g id="You-Timer" sketch:type="MSShapeGroup">
-                <g id="My-Timer" fill="#517ECE">
-                    <path d="M4.959,30.136 C2.606,30.136 0.691,28.222 0.691,25.869 L0.691,5.371 C0.691,3.018 2.606,1.104 4.959,1.104 L25.483,1.104 C27.837,1.104 29.752,3.018 29.752,5.371 L29.752,25.869 C29.752,28.222 27.837,30.136 25.483,30.136 L4.959,30.136 L4.959,30.136 Z" id="Shape"></path>
-                    <path d="M25.483,2.104 C27.287,2.104 28.752,3.568 28.752,5.371 L28.752,25.869 C28.752,27.672 27.287,29.136 25.483,29.136 L4.959,29.136 C3.154,29.136 1.691,27.672 1.691,25.869 L1.691,5.371 C1.691,3.568 3.154,2.104 4.959,2.104 L25.483,2.104 L25.483,2.104 Z M25.483,0.104 L4.959,0.104 C2.054,0.104 -0.309,2.466 -0.309,5.371 L-0.309,25.869 C-0.309,28.773 2.054,31.136 4.959,31.136 L25.483,31.136 C28.388,31.136 30.752,28.774 30.752,25.869 L30.752,5.371 C30.752,2.467 28.389,0.104 25.483,0.104 L25.483,0.104 L25.483,0.104 Z" id="Shape"></path>
-                </g>
-                <path d="M25.483,2.104 L4.959,2.104 C3.154,2.104 1.691,3.568 1.691,5.371 L1.691,14.865 L28.752,14.865 L28.752,5.371 C28.752,3.568 27.287,2.104 25.483,2.104 L25.483,2.104 Z" id="Shape" fill="#5CBF6F"></path>
-                <g id="Group" transform="translate(7.000000, 10.000000)" fill="#FFFFFF">
-                    <path d="M0.606,2.334 L0.516,0.609 C1.676,0.369 2.836,0.249 3.996,0.249 C5.156,0.249 6.023,0.42 6.599,0.76 C7.174,1.1 7.461,1.73 7.461,2.65 C7.461,3.27 7.349,3.818 7.124,4.293 C6.899,4.768 6.451,5.36 5.781,6.07 L3.126,8.83 C3.506,8.761 4.016,8.726 4.656,8.726 L7.761,8.726 L7.761,10.781 L0.426,10.781 L0.426,9.506 C0.426,9.116 0.536,8.807 0.756,8.576 L3.291,5.847 C4.531,4.557 5.146,3.572 5.136,2.892 C5.126,2.602 5.016,2.414 4.806,2.329 C4.596,2.244 4.236,2.201 3.726,2.201 C2.666,2.199 1.626,2.244 0.606,2.334 L0.606,2.334 Z" id="Shape"></path>
-                    <path d="M8.826,0.43 L15.036,0.43 C15.416,0.43 15.693,0.547 15.868,0.783 C16.043,1.017 16.071,1.305 15.951,1.645 L12.816,10.78 L10.566,10.78 L13.191,3.28 C13.311,2.91 13.456,2.585 13.626,2.305 L8.916,2.305 L8.826,0.43 L8.826,0.43 Z" id="Shape"></path>
-                </g>
-            </g>
-        </g>
-        <g id="Gabrielo" sketch:type="MSLayerGroup" transform="translate(222.000000, 175.000000)">
-            <path d="M-0.21,27.428 C-0.21,29.475 1.451,31.135 3.499,31.135 L96.787,31.135 C98.835,31.135 100.495,29.475 100.495,27.428 L100.495,4.17 C100.495,2.123 98.835,0.463 96.787,0.463 L3.499,0.463 C1.451,0.463 -0.21,2.123 -0.21,4.17 L-0.21,27.428 L-0.21,27.428 Z" id="Shape" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
-            <g transform="translate(11.000000, 9.000000)" id="Shape" fill="#7C8696" sketch:type="MSShapeGroup">
-                <path d="M7.387,12.386 L7.217,11.145 C6.22,12.12 5.052,12.607 3.715,12.607 C2.412,12.607 1.468,12.12 0.885,11.145 C0.301,10.17 0.009,8.618 0.009,6.487 C0.009,4.186 0.366,2.602 1.08,1.736 C1.794,0.869 3.069,0.435 4.905,0.435 C6.14,0.435 7.228,0.554 8.169,0.792 L8.016,1.914 C7.065,1.824 6.056,1.778 4.991,1.778 C4.095,1.778 3.419,1.894 2.96,2.127 C2.501,2.36 2.157,2.821 1.931,3.512 C1.704,4.203 1.591,5.229 1.591,6.589 C1.591,8.323 1.779,9.541 2.153,10.244 C2.527,10.947 3.184,11.298 4.125,11.298 C5.009,11.298 5.973,10.918 7.015,10.159 L7.015,5.603 L8.477,5.603 L8.477,12.386 L7.387,12.386 L7.387,12.386 Z"></path>
-                <path d="M11.008,5.348 L10.872,4.277 C12.391,4.027 13.722,3.903 14.867,3.903 C15.83,3.903 16.544,4.104 17.009,4.507 C17.474,4.91 17.706,5.592 17.706,6.555 L17.706,12.386 L16.566,12.386 L16.396,11.026 C16,11.422 15.503,11.774 14.909,12.08 C14.314,12.386 13.671,12.539 12.979,12.539 C12.22,12.539 11.617,12.338 11.168,11.935 C10.721,11.533 10.497,10.963 10.497,10.227 L10.497,9.326 C10.497,8.68 10.698,8.179 11.101,7.822 C11.504,7.465 12.067,7.286 12.792,7.286 L16.243,7.286 L16.243,6.555 C16.243,6.034 16.124,5.665 15.886,5.45 C15.648,5.235 15.206,5.127 14.56,5.127 C13.745,5.127 12.561,5.201 11.008,5.348 L11.008,5.348 Z M11.977,9.53 L11.977,10.057 C11.977,10.488 12.08,10.803 12.284,11 C12.488,11.199 12.816,11.298 13.269,11.298 C13.7,11.309 14.19,11.207 14.74,10.992 C15.29,10.777 15.791,10.465 16.245,10.057 L16.245,8.391 L13.049,8.391 C12.663,8.403 12.389,8.505 12.225,8.697 C12.059,8.89 11.977,9.167 11.977,9.53 L11.977,9.53 Z"></path>
-                <path d="M21.701,0.486 L21.701,3.58 C21.701,4.373 21.649,4.986 21.548,5.416 C22.534,4.408 23.599,3.903 24.744,3.903 C25.775,3.903 26.531,4.24 27.014,4.914 C27.495,5.589 27.737,6.691 27.737,8.221 C27.737,9.717 27.465,10.819 26.921,11.528 C26.377,12.237 25.425,12.591 24.065,12.591 C22.649,12.591 21.379,12.392 20.257,11.996 L20.257,0.487 L21.701,0.487 L21.701,0.486 Z M21.701,6.385 L21.701,11.077 C22.46,11.292 23.236,11.389 24.03,11.366 C24.834,11.355 25.401,11.119 25.729,10.66 C26.058,10.201 26.228,9.388 26.24,8.221 C26.228,7.054 26.087,6.252 25.814,5.816 C25.543,5.379 25.015,5.161 24.233,5.161 C23.837,5.161 23.454,5.258 23.086,5.45 C22.718,5.643 22.256,5.954 21.701,6.385 L21.701,6.385 Z"></path>
-                <path d="M35.164,3.903 L34.994,5.263 L34.518,5.263 C34.098,5.263 33.664,5.346 33.217,5.51 C32.769,5.675 32.171,5.944 31.424,6.318 L31.424,12.387 L29.979,12.387 L29.979,4.108 L31.101,4.108 L31.253,5.417 C32.534,4.409 33.713,3.904 34.789,3.904 L35.164,3.904 L35.164,3.903 Z"></path>
-                <path d="M37.238,0.588 L37.919,0.588 C38.213,0.588 38.36,0.735 38.36,1.03 L38.36,1.999 C38.36,2.294 38.213,2.441 37.919,2.441 L37.238,2.441 C36.944,2.441 36.797,2.294 36.797,1.999 L36.797,1.03 C36.797,0.735 36.944,0.588 37.238,0.588 L37.238,0.588 Z M38.293,12.386 L36.864,12.386 L36.864,4.107 L38.293,4.107 L38.293,12.386 L38.293,12.386 Z"></path>
-                <path d="M45.993,8.952 L42.135,8.952 C42.214,9.904 42.447,10.544 42.831,10.873 C43.217,11.202 43.857,11.366 44.753,11.366 C45.693,11.366 46.65,11.298 47.626,11.162 L47.778,12.131 C47.042,12.437 45.97,12.59 44.565,12.59 C43.137,12.59 42.12,12.258 41.513,11.595 C40.906,10.932 40.604,9.807 40.604,8.22 C40.604,6.622 40.899,5.503 41.488,4.863 C42.078,4.223 43.052,3.903 44.412,3.903 C45.647,3.903 46.549,4.127 47.115,4.574 C47.681,5.021 47.966,5.699 47.966,6.606 C47.988,8.17 47.331,8.952 45.993,8.952 L45.993,8.952 Z M42.117,7.83 L45.619,7.83 C46.22,7.83 46.52,7.422 46.52,6.606 C46.508,6.073 46.35,5.693 46.044,5.467 C45.737,5.24 45.216,5.127 44.48,5.127 C43.607,5.127 43.001,5.317 42.661,5.696 C42.321,6.076 42.14,6.787 42.117,7.83 L42.117,7.83 Z"></path>
-                <path d="M51.604,0.486 L51.604,10.108 C51.592,10.471 51.683,10.745 51.875,10.932 C52.068,11.119 52.352,11.213 52.726,11.213 L53.525,11.213 L53.695,12.318 C53.389,12.465 52.884,12.539 52.182,12.539 C51.558,12.539 51.066,12.355 50.703,11.987 C50.341,11.619 50.159,11.1 50.159,10.431 L50.159,0.486 L51.604,0.486 L51.604,0.486 Z"></path>
-                <path d="M58.692,3.903 C60.12,3.903 61.126,4.232 61.71,4.889 C62.293,5.547 62.585,6.668 62.585,8.255 C62.585,9.842 62.293,10.963 61.71,11.621 C61.126,12.279 60.12,12.607 58.692,12.607 C57.275,12.607 56.272,12.278 55.683,11.621 C55.093,10.964 54.798,9.842 54.798,8.255 C54.798,6.668 55.093,5.547 55.683,4.889 C56.272,4.231 57.275,3.903 58.692,3.903 L58.692,3.903 Z M60.57,5.79 C60.224,5.348 59.598,5.127 58.692,5.127 C57.785,5.127 57.162,5.348 56.822,5.79 C56.482,6.232 56.312,7.054 56.312,8.255 C56.312,9.456 56.482,10.278 56.822,10.72 C57.162,11.162 57.785,11.383 58.692,11.383 C59.598,11.383 60.224,11.162 60.57,10.72 C60.916,10.278 61.089,9.456 61.089,8.255 C61.089,7.054 60.916,6.232 60.57,5.79 L60.57,5.79 Z"></path>
-            </g>
-        </g>
         <g id="Alina-Name" sketch:type="MSLayerGroup" transform="translate(678.000000, 159.000000)">
             <rect id="Alina-Pad" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="102" height="39" rx="8"></rect>
             <text id="Alina" fill="#48AF5E" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24" font-weight="bold" sketch:alignment="middle" letter-spacing="-1">
                 <tspan x="21.9238281" y="27.734375">Alina</tspan>
             </text>
         </g>
+        <g id="Gabrielo-Name" sketch:type="MSLayerGroup" transform="translate(244.000000, 150.000000)">
+            <rect id="Gabrielo-Pad" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="145" height="39" rx="8"></rect>
+            <text id="Gabrielo" fill="#48AF5E" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24" font-weight="bold" sketch:alignment="middle" letter-spacing="-1">
+                <tspan x="24.5917969" y="27.734375">Gabrielo</tspan>
+            </text>
+        </g>
+        <g id="Mustafa-Name" sketch:type="MSLayerGroup" transform="translate(444.000000, 79.000000)">
+            <rect id="Mustafa-Pad" fill="#517ECE" sketch:type="MSShapeGroup" x="43" y="0" width="145" height="39" rx="8"></rect>
+            <text id="Mustafa" fill="#FFFFFF" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24" font-weight="bold" letter-spacing="-1">
+                <tspan x="69" y="27.734375">Mustafa</tspan>
+            </text>
+            <g id="Mustafa-Timer" transform="translate(0.000000, 1.000000)">
+                <path d="M5.5581364,38 C2.49316636,38 0,35.5042291 0,32.4360573 L0,5.56394271 C0,2.49577085 2.49316636,0 5.5581364,0 L32.4393052,0 C35.5055544,0 38,2.49577085 38,5.56394271 L38,32.4360573 C38,35.5042291 35.5055544,38 32.4393052,38 L5.5581364,38 L5.5581364,38 Z" id="Timer-Pad" fill="#517ECE" sketch:type="MSShapeGroup"></path>
+                <path d="M31.8926586,2 L6.10488703,2 C3.83830217,2 2,3.94917719 2,6.35246843 L2,19 L36,19 L36,6.35246843 C36,3.94917719 34.1592435,2 31.8926586,2 L31.8926586,2 Z" id="Ticks" fill="#5CBF6F" sketch:type="MSShapeGroup"></path>
+                <text id="Timer" fill="#FFFFFF" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24.8571429" font-weight="bold" sketch:alignment="middle" letter-spacing="-1">
+                    <tspan x="3.60253906" y="29">27</tspan>
+                </text>
+            </g>
+        </g>
+        <g id="Me-Name" sketch:type="MSLayerGroup" transform="translate(429.000000, 415.000000)">
+            <rect id="Me-Pad" fill="#517ECE" sketch:type="MSShapeGroup" x="43" y="0" width="89" height="39" rx="8"></rect>
+            <text id="Me" fill="#FFFFFF" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24" font-weight="bold" letter-spacing="-1">
+                <tspan x="69" y="27.734375">Me</tspan>
+            </text>
+            <g id="Me-Timer" transform="translate(0.000000, 1.000000)">
+                <path d="M5.5581364,38 C2.49316636,38 0,35.5042291 0,32.4360573 L0,5.56394271 C0,2.49577085 2.49316636,0 5.5581364,0 L32.4393052,0 C35.5055544,0 38,2.49577085 38,5.56394271 L38,32.4360573 C38,35.5042291 35.5055544,38 32.4393052,38 L5.5581364,38 L5.5581364,38 Z" id="Timer-Pad" fill="#517ECE" sketch:type="MSShapeGroup"></path>
+                <path d="M31.8926586,2 L6.10488703,2 C3.83830217,2 2,3.94917719 2,6.35246843 L2,19 L36,19 L36,6.35246843 C36,3.94917719 34.1592435,2 31.8926586,2 L31.8926586,2 Z" id="Ticks" fill="#5CBF6F" sketch:type="MSShapeGroup"></path>
+                <text id="Timer" fill="#FFFFFF" sketch:type="MSTextLayer" font-family="Lucida Grande" font-size="24.8571429" font-weight="bold" sketch:alignment="middle" letter-spacing="-1">
+                    <tspan x="3.60253906" y="29">27</tspan>
+                </text>
+            </g>
+        </g>
         <g id="Right-Menu" sketch:type="MSLayerGroup" transform="translate(956.000000, 546.000000)">
             <path d="M114,-0.235 L114,114 L-0.238,114 C-0.009,51.009 51.008,-0.008 114,-0.235" id="Shape" fill="#48AF5E" sketch:type="MSShapeGroup"></path>
             <path d="M81.215,48.569 L59.96,48.569 C57.489,48.569 55.486,50.572 55.486,53.043 L55.486,85.483 C55.486,87.954 57.489,89.957 59.96,89.957 L81.215,89.957 C83.686,89.957 85.689,87.954 85.689,85.483 L85.689,53.043 C85.688,50.572 83.686,48.569 81.215,48.569 L81.215,48.569 Z M70.588,75.609 C67.081,75.609 64.242,72.767 64.242,69.263 C64.242,65.756 67.081,62.916 70.588,62.916 C74.092,62.916 76.935,65.756 76.935,69.263 C76.935,72.768 74.092,75.609 70.588,75.609 L70.588,75.609 Z" id="Shape" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>

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

@@ -3,26 +3,38 @@ var transition = {pid: '', port: '8080' };
 
 // BERT Protocol
 
+var players = [0,"Gabrielo","Mustafa","Alina","Me"];
+
 function handle_web_socket(body) {
-    console.log(dec(body).value[0][2].value);
+//    console.log(dec(body).value[0][2].value);
     switch (dec(body).value[0][2].value) {
+        case 'okey_game_info': 
+            var a = dec(body).value[0][3][0].value[0][1];
+            console.log("Players: " + a.length);
+            for (var i=1;i<=a.length;i++) {
+                var c = a[i-1].value[0][3].value;
+                var v = a[i-1].value[0][4].value;
+                setPlayerName(players[i],c + " " + v);
+                console.log("Player: " + c + " " + v);
+            }
+            break;
         case 'okey_game_started': 
             var a = dec(body).value[0][3][0].value[0][1];
-            console.log("Started: " + a.length);
+//            console.log("Cards: " + a.length);
             for (var i=1;i<=a.length;i++) {
                 var c = a[i-1].value[0][1];
                 var v = a[i-1].value[0][2];
-                console.log("Card " + c + " " + v);
+//                console.log("Card: " + c + " " + v);
                 place_card(i,rand(1,2),c,v);
             }
             break;
-        case 'okey_game_player_state': 
+        case 'okey_game_player_state':  /// these two messages should be combined
             var a = dec(body).value[0][3][3].value[0][1];
-            console.log("Started: " + a.length);
+//            console.log("Cards: " + a.length);
             for (var i=1;i<=a.length;i++) {
                 var c = a[i-1].value[0][1];
                 var v = a[i-1].value[0][2];
-                console.log("Card " + c + " " + v);
+                console.log("Card: " + c + " " + v);
                 place_card(i,1,c,v);
             }
             break;
@@ -102,6 +114,14 @@ function card(line,pos,col,v) {
 
 // Game Scene
 
+function setPlayerName(e, playerName) {
+    var dx = (document.getElementById(e).attributes['fill'].value == "#FFFFFF") ? 65 : 20;
+    document.getElementById(e).setAttribute("y",27);
+    document.getElementById(e).setAttribute("x",dx);
+    document.getElementById(e).textContent = playerName;
+    document.getElementById(e+"-Pad").setAttribute('width',
+        document.getElementById(e).getBBox().width + 45); }
+
 function place_card(x,y,c,v) { 
          var slot = document.getElementById(slotName(x,y));
          slot.parentNode.replaceChild(svg(card(y,x,c,v)),slot); }
@@ -161,3 +181,4 @@ function drawSampleCards() {
     slotName = slotName1;
     for (var i=1;i<15;i++) { place_card(i,rand(1,2),rand(1,4),rand(1,13)); }
     slotName = slotNameDef; }
+

apps/server/src/auth_server.erl

@@ -16,7 +16,7 @@
 
 -define(SPARE_LOGINS, [
     #'PlayerInfo'{name = <<"Albert">>, surname= <<"Einstein">>, login = <<"quantum">>, robot = true },
-    #'PlayerInfo'{name = <<"Marie">>, surname="Curie", login = <<"radio">>, robot = true },
+    #'PlayerInfo'{name = <<"Marie">>, surname= <<"Curie">>, login = <<"radio">>, robot = true },
     #'PlayerInfo'{name = <<"Ilya">>, surname = <<"Prigogine">>, login = <<"synergetics">>, robot = true},
     #'PlayerInfo'{name = <<"Mother">>, surname = <<"Teresa">>, login = <<"peace">>, robot = true}]).