Working dark mode && more drawer specific changes.

square-messages
Black Hat 2018-11-17 20:52:17 +08:00
parent 08ce01473a
commit a7f62c13b0
18 changed files with 829 additions and 452 deletions

View File

@ -0,0 +1,219 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<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"
width="1280"
height="960"
viewBox="0 0 338.66666 254.00001"
version="1.1"
id="svg4636"
inkscape:version="0.92.2 2405546, 2018-03-11"
sodipodi:docname="roompanel-dark.svg">
<defs
id="defs4630" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1"
inkscape:cx="574.88953"
inkscape:cy="546.35799"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:window-width="1920"
inkscape:window-height="1050"
inkscape:window-x="0"
inkscape:window-y="30"
inkscape:window-maximized="1" />
<metadata
id="metadata4633">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-42.999983)">
<circle
id="path4638"
cx="274.10834"
cy="259.42917"
r="75.40625"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.26458335" />
<circle
id="path4638-6"
cx="303.0802"
cy="169.86771"
r="48.286457"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.16942617" />
<circle
id="path4638-6-7"
cx="165.76144"
cy="82.290604"
r="25.135412"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.08819444" />
<circle
id="path4638-6-5"
cx="38.100006"
cy="195.3998"
r="76.332291"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.26783261" />
<circle
id="path4638-6-3"
cx="87.709373"
cy="148.70103"
r="41.01041"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.14389619" />
<circle
id="path4638-6-56"
cx="220.3979"
cy="100.94374"
r="48.286453"
style="opacity:0.25;fill:#13100e;fill-opacity:1;stroke-width:0.16942617" />
<g
id="g5310"
transform="matrix(0.18980272,0,0,0.18980272,163.39608,213.89968)"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero">
<path
id="path5231"
d="M 34.004,340.809 H 2 c -1.104,0 -2,-0.896 -2,-2 V 2 C 0,0.896 0.896,0 2,0 h 32.004 c 1.104,0 2,0.896 2,2 v 7.71 c 0,1.104 -0.896,2 -2,2 h -21.13 v 317.386 h 21.13 c 1.104,0 2,0.896 2,2.001 v 7.712 c 0,1.104 -0.896,2 -2,2 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5233"
d="m 10.875,9.711 v 321.386 h 23.13 v 7.711 H 1.999 V 2.001 h 32.006 v 7.71 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5235"
d="m 252.402,233.711 h -32.993 c -1.104,0 -2,-0.896 -2,-2 v -68.073 c 0,-3.949 -0.154,-7.722 -0.457,-11.213 -0.289,-3.282 -1.074,-6.153 -2.332,-8.53 -1.204,-2.276 -3.017,-4.119 -5.384,-5.476 -2.393,-1.362 -5.775,-2.056 -10.042,-2.056 -4.238,0 -7.674,0.798 -10.213,2.371 -2.565,1.596 -4.604,3.701 -6.053,6.258 -1.498,2.643 -2.51,5.694 -3.013,9.067 -0.526,3.513 -0.793,7.125 -0.793,10.741 v 66.91 c 0,1.104 -0.896,2 -2,2 h -32.991 c -1.104,0 -2,-0.896 -2,-2 v -67.373 c 0,-3.435 -0.078,-6.964 -0.228,-10.485 -0.148,-3.251 -0.767,-6.278 -1.841,-8.995 -1.018,-2.571 -2.667,-4.584 -5.047,-6.153 -2.372,-1.552 -6.029,-2.341 -10.865,-2.341 -1.372,0 -3.265,0.328 -5.629,0.976 -2.28,0.624 -4.536,1.826 -6.705,3.577 -2.152,1.732 -4.036,4.306 -5.605,7.655 -1.569,3.356 -2.367,7.877 -2.367,13.438 v 69.701 c 0,1.104 -0.895,2 -2,2 H 68.857 c -1.104,0 -2,-0.896 -2,-2 V 111.594 c 0,-1.104 0.896,-1.999 2,-1.999 h 31.13 c 1.104,0 2,0.896 2,1.999 v 11.007 c 3.834,-4.499 8.248,-8.152 13.173,-10.896 6.396,-3.559 13.799,-5.362 22.002,-5.362 7.846,0 15.127,1.548 21.642,4.604 5.794,2.722 10.424,7.26 13.791,13.52 3.449,-4.362 7.833,-8.306 13.071,-11.752 6.422,-4.228 14.102,-6.371 22.824,-6.371 6.499,0 12.625,0.807 18.209,2.399 5.686,1.628 10.635,4.271 14.712,7.857 4.088,3.605 7.318,8.357 9.601,14.123 2.25,5.719 3.391,12.649 3.391,20.604 v 80.384 c -0.001,1.104 -0.896,2 -2.001,2 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5237"
d="m 99.988,111.595 v 16.264 h 0.463 c 4.338,-6.191 9.563,-10.998 15.684,-14.406 6.117,-3.402 13.129,-5.11 21.027,-5.11 7.588,0 14.521,1.475 20.793,4.415 6.274,2.945 11.038,8.131 14.291,15.567 3.56,-5.265 8.4,-9.913 14.521,-13.94 6.117,-4.025 13.358,-6.042 21.724,-6.042 6.351,0 12.234,0.776 17.66,2.325 5.418,1.549 10.065,4.027 13.938,7.434 3.869,3.41 6.889,7.863 9.062,13.357 2.167,5.504 3.253,12.122 3.253,19.869 v 80.385 H 219.41 v -68.074 c 0,-4.025 -0.154,-7.82 -0.465,-11.385 -0.313,-3.56 -1.161,-6.656 -2.555,-9.293 -1.395,-2.631 -3.45,-4.724 -6.157,-6.274 -2.711,-1.543 -6.391,-2.322 -11.037,-2.322 -4.646,0 -8.403,0.896 -11.269,2.671 -2.868,1.784 -5.112,4.109 -6.737,6.971 -1.626,2.869 -2.711,6.12 -3.252,9.762 -0.545,3.638 -0.814,7.318 -0.814,11.035 v 66.91 h -32.991 v -67.375 c 0,-3.562 -0.081,-7.087 -0.23,-10.57 -0.158,-3.487 -0.814,-6.7 -1.978,-9.645 -1.162,-2.94 -3.099,-5.304 -5.809,-7.088 -2.711,-1.775 -6.699,-2.671 -11.965,-2.671 -1.551,0 -3.603,0.349 -6.156,1.048 -2.556,0.697 -5.036,2.016 -7.435,3.949 -2.404,1.938 -4.454,4.726 -6.158,8.363 -1.705,3.642 -2.556,8.402 -2.556,14.287 v 69.701 H 68.856 V 111.595 Z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5239"
d="m 304.909,236.733 c -5.883,0 -11.46,-0.729 -16.574,-2.163 -5.192,-1.464 -9.806,-3.774 -13.713,-6.871 -3.944,-3.117 -7.068,-7.111 -9.282,-11.871 -2.205,-4.733 -3.324,-10.412 -3.324,-16.876 0,-7.13 1.293,-13.117 3.846,-17.797 2.542,-4.674 5.877,-8.464 9.912,-11.263 3.97,-2.752 8.556,-4.842 13.63,-6.209 4.901,-1.322 9.937,-2.394 14.961,-3.184 4.986,-0.775 9.949,-1.404 14.754,-1.872 4.679,-0.452 8.88,-1.139 12.489,-2.039 3.412,-0.854 6.118,-2.09 8.042,-3.672 1.666,-1.37 2.416,-3.384 2.292,-6.151 -0.002,-3.289 -0.502,-5.816 -1.492,-7.595 -0.998,-1.798 -2.283,-3.15 -3.927,-4.138 -1.703,-1.02 -3.725,-1.713 -6.012,-2.062 -2.47,-0.37 -5.146,-0.557 -7.947,-0.557 -6.034,0 -10.789,1.271 -14.135,3.783 -3.233,2.424 -5.155,6.64 -5.714,12.527 -0.098,1.026 -0.961,1.812 -1.992,1.812 h -32.992 c -0.552,0 -1.079,-0.229 -1.457,-0.629 -0.376,-0.402 -0.572,-0.941 -0.54,-1.491 0.485,-8.073 2.55,-14.894 6.142,-20.272 3.548,-5.331 8.147,-9.682 13.661,-12.931 5.424,-3.191 11.612,-5.498 18.392,-6.857 6.684,-1.335 13.5,-2.013 20.26,-2.013 6.096,0 12.365,0.437 18.626,1.296 6.377,0.88 12.285,2.622 17.562,5.177 5.376,2.604 9.845,6.29 13.282,10.951 3.498,4.744 5.271,11.048 5.271,18.731 v 62.494 c 0,5.307 0.306,10.462 0.915,15.319 0.576,4.64 1.572,8.116 2.963,10.338 0.385,0.616 0.407,1.395 0.055,2.031 -0.353,0.635 -1.022,1.03 -1.75,1.03 h -33.457 c -0.861,0 -1.624,-0.55 -1.898,-1.367 -0.646,-1.941 -1.176,-3.939 -1.572,-5.936 -0.141,-0.696 -0.267,-1.402 -0.38,-2.12 -4.825,4.184 -10.349,7.24 -16.474,9.105 -7.299,2.218 -14.843,3.342 -22.423,3.342 z m 37.032,-60.072 c -0.809,0.409 -1.676,0.768 -2.596,1.074 -2.161,0.72 -4.511,1.326 -6.988,1.807 -2.442,0.475 -5.033,0.872 -7.699,1.186 -2.631,0.311 -5.251,0.697 -7.784,1.146 -2.329,0.433 -4.705,1.035 -7.051,1.792 -2.194,0.711 -4.114,1.667 -5.699,2.842 -1.531,1.128 -2.785,2.587 -3.731,4.335 -0.917,1.709 -1.385,3.97 -1.385,6.719 0,2.598 0.465,4.778 1.385,6.481 0.928,1.722 2.142,3.035 3.716,4.018 1.644,1.026 3.601,1.757 5.816,2.17 2.344,0.439 4.799,0.663 7.297,0.663 6.105,0 10.836,-0.996 14.063,-2.961 3.244,-1.973 5.666,-4.349 7.199,-7.062 1.568,-2.78 2.542,-5.62 2.892,-8.436 0.376,-3.019 0.565,-5.436 0.565,-7.187 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5241"
d="m 273.544,129.255 c 3.405,-5.113 7.744,-9.215 13.012,-12.316 5.264,-3.097 11.186,-5.303 17.771,-6.621 6.582,-1.315 13.205,-1.976 19.865,-1.976 6.042,0 12.158,0.428 18.354,1.277 6.195,0.855 11.85,2.522 16.962,4.997 5.111,2.477 9.292,5.926 12.546,10.338 3.253,4.414 4.879,10.262 4.879,17.543 v 62.494 c 0,5.428 0.31,10.611 0.931,15.567 0.615,4.959 1.701,8.676 3.251,11.153 H 347.66 c -0.621,-1.86 -1.126,-3.755 -1.511,-5.693 -0.39,-1.933 -0.661,-3.908 -0.813,-5.923 -5.267,5.422 -11.465,9.217 -18.585,11.386 -7.127,2.163 -14.407,3.251 -21.842,3.251 -5.733,0 -11.077,-0.698 -16.033,-2.09 -4.958,-1.395 -9.293,-3.562 -13.01,-6.51 -3.718,-2.938 -6.622,-6.656 -8.713,-11.147 -2.091,-4.491 -3.138,-9.84 -3.138,-16.033 0,-6.813 1.199,-12.43 3.604,-16.84 2.399,-4.417 5.495,-7.939 9.295,-10.575 3.793,-2.632 8.129,-4.607 13.01,-5.923 4.878,-1.315 9.795,-2.358 14.752,-3.137 4.957,-0.772 9.835,-1.393 14.638,-1.857 4.801,-0.466 9.062,-1.164 12.779,-2.093 3.718,-0.929 6.658,-2.282 8.829,-4.065 2.165,-1.781 3.172,-4.375 3.02,-7.785 0,-3.56 -0.58,-6.389 -1.742,-8.479 -1.161,-2.09 -2.711,-3.719 -4.646,-4.88 -1.937,-1.161 -4.183,-1.936 -6.737,-2.325 -2.557,-0.382 -5.309,-0.58 -8.248,-0.58 -6.506,0 -11.617,1.395 -15.335,4.183 -3.716,2.788 -5.889,7.437 -6.506,13.94 h -32.991 c 0.462,-7.742 2.395,-14.173 5.807,-19.281 z m 65.169,46.583 c -2.09,0.696 -4.337,1.275 -6.736,1.741 -2.402,0.465 -4.918,0.853 -7.551,1.161 -2.635,0.313 -5.268,0.698 -7.899,1.163 -2.48,0.461 -4.919,1.086 -7.317,1.857 -2.404,0.779 -4.495,1.822 -6.274,3.138 -1.784,1.317 -3.216,2.985 -4.3,4.994 -1.085,2.014 -1.626,4.571 -1.626,7.668 0,2.94 0.541,5.422 1.626,7.431 1.084,2.017 2.558,3.604 4.416,4.765 1.858,1.161 4.025,1.976 6.507,2.438 2.475,0.466 5.031,0.698 7.665,0.698 6.505,0 11.537,-1.082 15.103,-3.253 3.561,-2.166 6.192,-4.762 7.899,-7.785 1.702,-3.019 2.749,-6.072 3.137,-9.174 0.384,-3.097 0.58,-5.576 0.58,-7.434 V 172.93 c -1.396,1.243 -3.138,2.21 -5.23,2.908 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5243"
d="m 444.542,234.874 c -5.187,0 -10.173,-0.361 -14.823,-1.069 -4.802,-0.732 -9.104,-2.183 -12.779,-4.313 -3.789,-2.185 -6.821,-5.341 -9.006,-9.375 -2.163,-3.986 -3.26,-9.232 -3.26,-15.59 v -68.859 h -17.981 c -1.104,0 -2,-0.896 -2,-1.999 v -22.073 c 0,-1.104 0.896,-1.999 2,-1.999 h 17.981 V 75.582 c 0,-1.104 0.896,-2 2,-2 h 32.992 c 1.104,0 2,0.896 2,2 v 34.014 h 22.162 c 1.104,0 2,0.896 2,1.999 v 22.073 c 0,1.104 -0.896,1.999 -2,1.999 h -22.162 v 57.479 c 0,6.229 1.198,8.731 2.202,9.733 1.004,1.007 3.506,2.205 9.738,2.205 1.804,0 3.542,-0.076 5.161,-0.225 1.604,-0.144 3.174,-0.367 4.669,-0.665 0.13,-0.026 0.261,-0.039 0.391,-0.039 0.458,0 0.907,0.159 1.27,0.454 0.463,0.379 0.73,0.946 0.73,1.546 v 25.555 c 0,0.979 -0.707,1.813 -1.672,1.974 -2.834,0.472 -6.041,0.794 -9.527,0.957 -3.613,0.157 -6.91,0.233 -10.086,0.233 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5245"
d="m 463.825,111.595 v 22.072 h -24.161 v 59.479 c 0,5.573 0.928,9.292 2.788,11.149 1.856,1.859 5.576,2.788 11.152,2.788 1.859,0 3.638,-0.076 5.343,-0.232 1.703,-0.152 3.33,-0.388 4.878,-0.696 v 25.557 c -2.788,0.465 -5.887,0.773 -9.293,0.931 -3.407,0.149 -6.737,0.23 -9.99,0.23 -5.111,0 -9.953,-0.35 -14.521,-1.048 -4.571,-0.695 -8.597,-2.047 -12.081,-4.063 -3.486,-2.011 -6.236,-4.88 -8.248,-8.597 -2.016,-3.714 -3.021,-8.595 -3.021,-14.639 v -70.859 h -19.98 v -22.072 h 19.98 V 75.583 h 32.992 v 36.012 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5247"
d="m 512.613,233.711 h -32.991 c -1.104,0 -2,-0.896 -2,-2 V 111.594 c 0,-1.104 0.896,-1.999 2,-1.999 h 31.366 c 1.104,0 2,0.896 2,1.999 v 15.069 c 0.967,-1.516 2.034,-2.978 3.199,-4.382 2.754,-3.312 5.949,-6.182 9.496,-8.522 3.545,-2.332 7.385,-4.169 11.415,-5.462 4.056,-1.298 8.327,-1.954 12.691,-1.954 2.341,0 4.953,0.418 7.766,1.243 0.852,0.25 1.437,1.032 1.437,1.92 v 30.67 c 0,0.6 -0.269,1.167 -0.732,1.547 -0.361,0.296 -0.808,0.452 -1.265,0.452 -0.133,0 -0.265,-0.013 -0.398,-0.039 -1.484,-0.3 -3.299,-0.565 -5.392,-0.787 -2.098,-0.224 -4.136,-0.339 -6.062,-0.339 -5.706,0 -10.572,0.95 -14.467,2.823 -3.862,1.86 -7.012,4.428 -9.361,7.629 -2.389,3.263 -4.115,7.12 -5.127,11.47 -1.043,4.479 -1.574,9.409 -1.574,14.647 v 54.132 c -10e-4,1.104 -0.897,2 -2.001,2 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5249"
d="M 510.988,111.595 V 133.9 h 0.465 c 1.546,-3.72 3.636,-7.163 6.272,-10.341 2.634,-3.172 5.652,-5.885 9.06,-8.131 3.405,-2.242 7.047,-3.985 10.923,-5.228 3.868,-1.237 7.898,-1.859 12.081,-1.859 2.168,0 4.566,0.39 7.202,1.163 v 30.67 c -1.551,-0.312 -3.41,-0.584 -5.576,-0.814 -2.17,-0.233 -4.26,-0.35 -6.274,-0.35 -6.041,0 -11.152,1.01 -15.332,3.021 -4.182,2.014 -7.55,4.761 -10.107,8.247 -2.555,3.487 -4.379,7.55 -5.462,12.198 -1.083,4.645 -1.625,9.682 -1.625,15.102 v 54.133 H 479.624 V 111.595 Z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5251"
d="M 603.923,233.711 H 570.93 c -1.104,0 -2,-0.896 -2,-2 V 111.594 c 0,-1.104 0.896,-1.999 2,-1.999 h 32.994 c 1.104,0 2,0.896 2,1.999 v 120.117 c -10e-4,1.104 -0.897,2 -2.001,2 z m 0,-138.705 H 570.93 c -1.104,0 -2,-0.896 -2,-1.999 V 65.825 c 0,-1.104 0.896,-2 2,-2 h 32.994 c 1.104,0 2,0.896 2,2 v 27.182 c -10e-4,1.103 -0.897,1.999 -2.001,1.999 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5253"
d="M 570.93,93.007 V 65.824 h 32.994 v 27.183 z m 32.994,18.588 V 231.712 H 570.93 V 111.595 Z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5255"
d="m 742.163,233.711 h -37.64 c -0.671,0 -1.297,-0.335 -1.667,-0.896 l -23.426,-35.352 -23.426,35.352 c -0.369,0.561 -0.995,0.896 -1.667,0.896 h -36.938 c -0.741,0 -1.424,-0.411 -1.77,-1.067 -0.345,-0.654 -0.3,-1.449 0.118,-2.061 l 42.435,-62.055 -38.71,-55.793 c -0.424,-0.613 -0.474,-1.408 -0.128,-2.069 0.343,-0.658 1.028,-1.071 1.771,-1.071 h 37.636 c 0.665,0 1.287,0.33 1.658,0.882 l 19.477,28.893 19.255,-28.884 c 0.372,-0.556 0.996,-0.891 1.665,-0.891 h 36.475 c 0.746,0 1.43,0.415 1.776,1.078 0.343,0.66 0.289,1.46 -0.139,2.071 l -38.69,55.082 43.578,62.744 c 0.424,0.61 0.474,1.408 0.128,2.066 -0.343,0.662 -1.026,1.075 -1.771,1.075 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5257"
d="m 621.115,111.595 h 37.637 l 21.144,31.365 20.911,-31.365 h 36.476 l -39.496,56.226 44.377,63.892 h -37.64 l -25.093,-37.87 -25.094,37.87 h -36.938 l 43.213,-63.193 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5259"
d="m 791.322,340.809 h -32.008 c -1.105,0 -2,-0.896 -2,-2 v -7.712 c 0,-1.105 0.896,-2.001 2,-2.001 h 21.13 V 11.71 h -21.13 c -1.105,0 -2,-0.896 -2,-2 V 2 c 0,-1.104 0.896,-2 2,-2 h 32.008 c 1.104,0 2,0.896 2,2 v 336.809 c 0,1.104 -0.896,2 -2,2 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5261"
d="M 782.443,331.097 V 9.711 h -23.13 v -7.71 h 32.008 v 336.807 h -32.008 v -7.711 z"
inkscape:connector-curvature="0"
style="opacity:0.5;fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5263"
d="m 10.875,9.711 v 321.386 h 23.13 v 7.711 H 1.999 V 2.001 h 32.006 v 7.71 z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5265"
d="m 99.988,111.595 v 16.264 h 0.463 c 4.338,-6.191 9.563,-10.998 15.684,-14.406 6.117,-3.402 13.129,-5.11 21.027,-5.11 7.588,0 14.521,1.475 20.793,4.415 6.274,2.945 11.038,8.131 14.291,15.567 3.56,-5.265 8.4,-9.913 14.521,-13.94 6.117,-4.025 13.358,-6.042 21.724,-6.042 6.351,0 12.234,0.776 17.66,2.325 5.418,1.549 10.065,4.027 13.938,7.434 3.869,3.41 6.889,7.863 9.062,13.357 2.167,5.504 3.253,12.122 3.253,19.869 v 80.385 H 219.41 v -68.074 c 0,-4.025 -0.154,-7.82 -0.465,-11.385 -0.313,-3.56 -1.161,-6.656 -2.555,-9.293 -1.395,-2.631 -3.45,-4.724 -6.157,-6.274 -2.711,-1.543 -6.391,-2.322 -11.037,-2.322 -4.646,0 -8.403,0.896 -11.269,2.671 -2.868,1.784 -5.112,4.109 -6.737,6.971 -1.626,2.869 -2.711,6.12 -3.252,9.762 -0.545,3.638 -0.814,7.318 -0.814,11.035 v 66.91 h -32.991 v -67.375 c 0,-3.562 -0.081,-7.087 -0.23,-10.57 -0.158,-3.487 -0.814,-6.7 -1.978,-9.645 -1.162,-2.94 -3.099,-5.304 -5.809,-7.088 -2.711,-1.775 -6.699,-2.671 -11.965,-2.671 -1.551,0 -3.603,0.349 -6.156,1.048 -2.556,0.697 -5.036,2.016 -7.435,3.949 -2.404,1.938 -4.454,4.726 -6.158,8.363 -1.705,3.642 -2.556,8.402 -2.556,14.287 v 69.701 H 68.856 V 111.595 Z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5267"
d="m 273.544,129.255 c 3.405,-5.113 7.744,-9.215 13.012,-12.316 5.264,-3.097 11.186,-5.303 17.771,-6.621 6.582,-1.315 13.205,-1.976 19.865,-1.976 6.042,0 12.158,0.428 18.354,1.277 6.195,0.855 11.85,2.522 16.962,4.997 5.111,2.477 9.292,5.926 12.546,10.338 3.253,4.414 4.879,10.262 4.879,17.543 v 62.494 c 0,5.428 0.31,10.611 0.931,15.567 0.615,4.959 1.701,8.676 3.251,11.153 H 347.66 c -0.621,-1.86 -1.126,-3.755 -1.511,-5.693 -0.39,-1.933 -0.661,-3.908 -0.813,-5.923 -5.267,5.422 -11.465,9.217 -18.585,11.386 -7.127,2.163 -14.407,3.251 -21.842,3.251 -5.733,0 -11.077,-0.698 -16.033,-2.09 -4.958,-1.395 -9.293,-3.562 -13.01,-6.51 -3.718,-2.938 -6.622,-6.656 -8.713,-11.147 -2.091,-4.491 -3.138,-9.84 -3.138,-16.033 0,-6.813 1.199,-12.43 3.604,-16.84 2.399,-4.417 5.495,-7.939 9.295,-10.575 3.793,-2.632 8.129,-4.607 13.01,-5.923 4.878,-1.315 9.795,-2.358 14.752,-3.137 4.957,-0.772 9.835,-1.393 14.638,-1.857 4.801,-0.466 9.062,-1.164 12.779,-2.093 3.718,-0.929 6.658,-2.282 8.829,-4.065 2.165,-1.781 3.172,-4.375 3.02,-7.785 0,-3.56 -0.58,-6.389 -1.742,-8.479 -1.161,-2.09 -2.711,-3.719 -4.646,-4.88 -1.937,-1.161 -4.183,-1.936 -6.737,-2.325 -2.557,-0.382 -5.309,-0.58 -8.248,-0.58 -6.506,0 -11.617,1.395 -15.335,4.183 -3.716,2.788 -5.889,7.437 -6.506,13.94 h -32.991 c 0.462,-7.742 2.395,-14.173 5.807,-19.281 z m 65.169,46.583 c -2.09,0.696 -4.337,1.275 -6.736,1.741 -2.402,0.465 -4.918,0.853 -7.551,1.161 -2.635,0.313 -5.268,0.698 -7.899,1.163 -2.48,0.461 -4.919,1.086 -7.317,1.857 -2.404,0.779 -4.495,1.822 -6.274,3.138 -1.784,1.317 -3.216,2.985 -4.3,4.994 -1.085,2.014 -1.626,4.571 -1.626,7.668 0,2.94 0.541,5.422 1.626,7.431 1.084,2.017 2.558,3.604 4.416,4.765 1.858,1.161 4.025,1.976 6.507,2.438 2.475,0.466 5.031,0.698 7.665,0.698 6.505,0 11.537,-1.082 15.103,-3.253 3.561,-2.166 6.192,-4.762 7.899,-7.785 1.702,-3.019 2.749,-6.072 3.137,-9.174 0.384,-3.097 0.58,-5.576 0.58,-7.434 V 172.93 c -1.396,1.243 -3.138,2.21 -5.23,2.908 z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5269"
d="m 463.825,111.595 v 22.072 h -24.161 v 59.479 c 0,5.573 0.928,9.292 2.788,11.149 1.856,1.859 5.576,2.788 11.152,2.788 1.859,0 3.638,-0.076 5.343,-0.232 1.703,-0.152 3.33,-0.388 4.878,-0.696 v 25.557 c -2.788,0.465 -5.887,0.773 -9.293,0.931 -3.407,0.149 -6.737,0.23 -9.99,0.23 -5.111,0 -9.953,-0.35 -14.521,-1.048 -4.571,-0.695 -8.597,-2.047 -12.081,-4.063 -3.486,-2.011 -6.236,-4.88 -8.248,-8.597 -2.016,-3.714 -3.021,-8.595 -3.021,-14.639 v -70.859 h -19.98 v -22.072 h 19.98 V 75.583 h 32.992 v 36.012 z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5271"
d="M 510.988,111.595 V 133.9 h 0.465 c 1.546,-3.72 3.636,-7.163 6.272,-10.341 2.634,-3.172 5.652,-5.885 9.06,-8.131 3.405,-2.242 7.047,-3.985 10.923,-5.228 3.868,-1.237 7.898,-1.859 12.081,-1.859 2.168,0 4.566,0.39 7.202,1.163 v 30.67 c -1.551,-0.312 -3.41,-0.584 -5.576,-0.814 -2.17,-0.233 -4.26,-0.35 -6.274,-0.35 -6.041,0 -11.152,1.01 -15.332,3.021 -4.182,2.014 -7.55,4.761 -10.107,8.247 -2.555,3.487 -4.379,7.55 -5.462,12.198 -1.083,4.645 -1.625,9.682 -1.625,15.102 v 54.133 H 479.624 V 111.595 Z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5273"
d="M 570.93,93.007 V 65.824 h 32.994 v 27.183 z m 32.994,18.588 V 231.712 H 570.93 V 111.595 Z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5275"
d="m 621.115,111.595 h 37.637 l 21.144,31.365 20.911,-31.365 h 36.476 l -39.496,56.226 44.377,63.892 h -37.64 l -25.093,-37.87 -25.094,37.87 h -36.938 l 43.213,-63.193 z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
<path
id="path5277"
d="M 782.443,331.097 V 9.711 h -23.13 v -7.71 h 32.008 v 336.807 h -32.008 v -7.711 z"
inkscape:connector-curvature="0"
style="fill:#13100e;fill-opacity:1;fill-rule:nonzero" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 22 KiB

View File

@ -1,6 +1,7 @@
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.2
import Spectral.Setting 0.1
import Spectral.Font 0.1
@ -10,7 +11,7 @@ Text {
id: materialLabel
color: MSettings.darkTheme ? "white" : "dark"
color: Material.foreground
font.pointSize: 16
font.family: MaterialFont.name
horizontalAlignment: Text.AlignHCenter

View File

@ -1,25 +0,0 @@
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.2
import "qrc:/js/util.js" as Util
ItemDelegate {
property var page
property bool selected: stackView.currentItem === page
property color highlightColor: Material.accent
Rectangle {
width: selected ? 4 : 0
height: parent.height
color: highlightColor
Behavior on width {
PropertyAnimation { easing.type: Easing.InOutCubic; duration: 200 }
}
}
onClicked: Util.pushToStack(stackView, page)
}

View File

@ -41,6 +41,7 @@ import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Window 2.1
import Spectral.Setting 0.1
Item {
id: root
@ -64,7 +65,7 @@ Item {
property Component handleDelegate: Rectangle {
width: 1
height: 1
color: "#E1E1E1"
color: MSettings.darkTheme ? "#424242" : "#E1E1E1"
}
/*!

View File

@ -74,24 +74,6 @@ RowLayout {
spacing: 0
// TimelineLabel {
// Layout.fillWidth: true
// id: authorLabel
// visible: messageRow.avatarVisible
// text: author.displayName
// Material.foreground: Material.accent
// coloredBackground: highlighted
// font.bold: true
// MouseArea {
// anchors.fill: parent
// cursorShape: Qt.PointingHandCursor
// onClicked: roomPanelInput.insert(author.displayName)
// }
// }
TextEdit {
Layout.fillWidth: true
@ -134,54 +116,6 @@ RowLayout {
active: eventType === "image" || eventType === "file" || eventType === "audio"
}
// Row {
// Layout.alignment: Qt.AlignRight
// spacing: 4
// TimelineLabel {
// visible: userMarker.length > 5
// text: userMarker.length - 5 + "+"
// coloredBackground: highlighted
// Material.foreground: "grey"
// font.pointSize: 8
// }
// Repeater {
// model: userMarker.length > 5 ? userMarker.slice(0, 5) : userMarker
// ImageItem {
// width: parent.height
// height: parent.height
// hint: modelData.displayName
// source: modelData.paintable
// MouseArea {
// anchors.fill: parent
// cursorShape: Qt.PointingHandCursor
// onClicked: {
// readMarkerDialog.listModel = userMarker
// readMarkerDialog.open()
// }
// }
// }
// }
// TimelineLabel {
// id: timeLabel
// visible: Math.abs(time - aboveTime) > 600000 || index == 0
// text: Qt.formatTime(time, "hh:mm")
// coloredBackground: highlighted
// Material.foreground: "grey"
// font.pointSize: 8
// }
// }
}
Component {

View File

@ -3,7 +3,6 @@ import QtQuick.Controls 2.2
Label {
text: section + " • " + Qt.formatTime(time, "hh:mm")
color: "#1D333E"
font.pointSize: 9.75
font.weight: Font.Medium
font.capitalization: Font.AllUppercase

View File

@ -0,0 +1,29 @@
import QtQuick 2.9
import QtGraphicalEffects 1.0
Item {
id: item
property alias source: mask.source
Rectangle {
id: circleMask
width: parent.width
height: parent.height
smooth: true
visible: false
radius: Math.max(width/2, height/2)
}
OpacityMask {
id: mask
width: parent.width
height: parent.height
maskSource: circleMask
}
}

View File

@ -0,0 +1,239 @@
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtGraphicalEffects 1.0
import Spectral.Component 2.0
import Spectral.Setting 0.1
AutoMouseArea {
id: ripple
property color color: MSettings.darkTheme ? Qt.rgba(255, 255, 255, 0.16) : Qt.rgba(0, 0, 0, 0.08)
property bool circular: false
property bool centered: false
property bool focused
property color focusColor: "transparent"
property int focusWidth: width - 32
property Item control
clip: true
Connections {
target: control
onPressedChanged: {
if (!control.pressed)
__private.removeLastCircle()
}
}
onPressed: {
__private.createTapCircle(mouse.x, mouse.y)
if (control)
mouse.accepted = false
}
onReleased: __private.removeLastCircle()
onCanceled: __private.removeLastCircle()
QtObject {
id: __private
property int startRadius: circular ? width/10 : width/6
property int endRadius
property bool showFocus: true
property Item lastCircle
function createTapCircle(x, y) {
endRadius = centered ? width/2 : radius(x, y) + 5
showFocus = false
lastCircle = tapCircle.createObject(ripple, {
"circleX": centered ? width/2 : x,
"circleY": centered ? height/2 : y
})
}
function removeLastCircle() {
if (lastCircle)
lastCircle.removeCircle()
}
function radius(x, y) {
var dist1 = Math.max(dist(x, y, 0, 0), dist(x, y, width, height))
var dist2 = Math.max(dist(x, y, width, 0), dist(x, y, 0, height))
return Math.max(dist1, dist2)
}
function dist(x1, y1, x2, y2) {
var distX = x2 - x1
var distY = y2 - y1
return Math.sqrt(distX * distX + distY * distY)
}
}
Rectangle {
id: focusBackground
objectName: "focusBackground"
width: parent.width
height: parent.height
color: Qt.rgba(0,0,0,0.2)
opacity: __private.showFocus && focused ? 1 : 0
Behavior on opacity {
NumberAnimation { duration: 500; easing.type: Easing.InOutQuad }
}
}
Rectangle {
id: focusCircle
objectName: "focusRipple"
property bool focusedState
x: (parent.width - width)/2
y: (parent.height - height)/2
width: focused
? focusedState ? focusWidth
: Math.min(parent.width - 8, focusWidth + 12)
: parent.width/5
height: width
radius: width/2
opacity: __private.showFocus && focused ? 1 : 0
color: focusColor.a === 0 ? Qt.rgba(1,1,1,0.4) : focusColor
Behavior on opacity {
NumberAnimation { duration: 500; easing.type: Easing.InOutQuad }
}
Behavior on width {
NumberAnimation { duration: focusTimer.interval; }
}
Timer {
id: focusTimer
running: focused
repeat: true
interval: 800
onTriggered: focusCircle.focusedState = !focusCircle.focusedState
}
}
Component {
id: tapCircle
Item {
id: circleItem
objectName: "tapRipple"
property bool done
property real circleX
property real circleY
property bool closed
width: parent.width
height: parent.height
function removeCircle() {
done = true
if (fillSizeAnimation.running) {
fillOpacityAnimation.stop()
closeAnimation.start()
circleItem.destroy(500);
} else {
__private.showFocus = true
fadeAnimation.start();
circleItem.destroy(300);
}
}
Item {
id: circleParent
width: parent.width
height: parent.height
visible: !circular
Rectangle {
id: circleRectangle
x: circleItem.circleX - radius
y: circleItem.circleY - radius
width: radius * 2
height: radius * 2
opacity: 0
color: ripple.color
NumberAnimation {
id: fillSizeAnimation
running: true
target: circleRectangle; property: "radius"; duration: 500;
from: __private.startRadius; to: __private.endRadius;
easing.type: Easing.InOutQuad
onStopped: {
if (done)
__private.showFocus = true
}
}
NumberAnimation {
id: fillOpacityAnimation
running: true
target: circleRectangle; property: "opacity"; duration: 300;
from: 0; to: 1; easing.type: Easing.InOutQuad
}
NumberAnimation {
id: fadeAnimation
target: circleRectangle; property: "opacity"; duration: 300;
from: 1; to: 0; easing.type: Easing.InOutQuad
}
SequentialAnimation {
id: closeAnimation
NumberAnimation {
target: circleRectangle; property: "opacity"; duration: 250;
to: 1; easing.type: Easing.InOutQuad
}
NumberAnimation {
target: circleRectangle; property: "opacity"; duration: 250;
from: 1; to: 0; easing.type: Easing.InOutQuad
}
}
}
}
CircleMask {
anchors.fill: parent
source: circleParent
visible: circular
}
}
}
}

View File

@ -1,2 +1,3 @@
module Spectral.Effect
ElevationEffect 2.0 ElevationEffect.qml
RippleEffect 2.0 RippleEffect.qml

View File

@ -1,27 +0,0 @@
import QtQuick 2.9
LoginForm {
loginButton.onClicked: doLogin()
Shortcut {
sequence: "Return"
onActivated: doLogin()
}
function doLogin() {
if (!(serverField.text.startsWith("http") && serverField.text.includes("://"))) {
loginButtonTooltip.text = "Server address should start with http(s)://"
loginButtonTooltip.open()
return
}
loginButton.text = "Logging in..."
loginButton.enabled = false
controller.loginWithCredentials(serverField.text, usernameField.text, passwordField.text)
controller.connectionAdded.connect(function(conn) {
stackView.pop()
accountListView.currentConnection = conn
})
}
}

View File

@ -1,143 +0,0 @@
import QtQuick 2.9
import QtQuick.Layouts 1.3
import QtGraphicalEffects 1.0
import QtQuick.Controls 2.2
import QtQuick.Controls.Material 2.2
import Spectral.Component 2.0
import Spectral.Setting 0.1
Page {
property var controller
property alias loginButton: loginButton
property alias serverField: serverField
property alias usernameField: usernameField
property alias passwordField: passwordField
property alias loginButtonTooltip: loginButtonTooltip
Row {
anchors.fill: parent
Rectangle {
width: parent.width / 2
height: parent.height
color: Material.accent
Column {
x: 32
anchors.verticalCenter: parent.verticalCenter
Label {
text: "Matrix Login."
font.pointSize: 28
font.bold: true
font.capitalization: Font.AllUppercase
color: "white"
}
Label {
text: "A new method of messaging."
font.pointSize: 12
font.capitalization: Font.AllUppercase
color: "white"
}
}
}
Pane {
width: parent.width / 2
height: parent.height
padding: 64
ColumnLayout {
width: parent.width
id: mainCol
AutoTextField {
Layout.fillWidth: true
id: serverField
leftPadding: 16
topPadding: 0
bottomPadding: 0
text: "https://matrix.org"
placeholderText: "Server"
background: Rectangle {
implicitHeight: 48
color: MSettings.darkTheme ? "#242424" : "#eaeaea"
border.color: parent.activeFocus ? Material.accent : "transparent"
border.width: 2
}
}
AutoTextField {
Layout.fillWidth: true
id: usernameField
leftPadding: 16
topPadding: 0
bottomPadding: 0
placeholderText: "Username"
background: Rectangle {
implicitHeight: 48
color: MSettings.darkTheme ? "#242424" : "#eaeaea"
border.color: parent.activeFocus ? Material.accent : "transparent"
border.width: 2
}
}
AutoTextField {
Layout.fillWidth: true
id: passwordField
leftPadding: 16
topPadding: 0
bottomPadding: 0
placeholderText: "Password"
echoMode: TextInput.Password
background: Rectangle {
implicitHeight: 48
color: MSettings.darkTheme ? "#242424" : "#eaeaea"
border.color: parent.activeFocus ? Material.accent : "transparent"
border.width: 2
}
}
Button {
Layout.fillWidth: true
id: loginButton
text: "LOGIN"
highlighted: true
ToolTip {
id: loginButtonTooltip
}
}
}
}
}
}
/*##^## Designer {
D{i:0;autoSize:true;height:480;width:640}
}
##^##*/

View File

@ -6,7 +6,7 @@ import QtQuick.Controls.Material 2.2
import Spectral 0.1
import Spectral.Effect 2.0
Rectangle {
Control {
property alias paintable: headerImage.source
property alias topic: headerTopicLabel.text
property bool atTop: false
@ -14,64 +14,65 @@ Rectangle {
id: header
color: atTop ? "transparent" : "white"
background: Rectangle {
color: Material.background
layer.enabled: !atTop
layer.effect: ElevationEffect {
elevation: 4
opacity: atTop ? 0 : 1
layer.enabled: true
layer.effect: ElevationEffect {
elevation: 2
}
}
ItemDelegate {
RowLayout {
anchors.fill: parent
anchors.margins: 12
id: roomHeader
spacing: 12
onClicked: header.clicked()
ImageItem {
Layout.preferredWidth: height
Layout.fillHeight: true
RowLayout {
anchors.fill: parent
anchors.margins: 12
id: headerImage
spacing: 12
source: currentRoom.paintable
hint: currentRoom ? currentRoom.displayName : "No name"
}
ImageItem {
Layout.preferredWidth: height
Layout.fillHeight: true
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
id: headerImage
visible: parent.width > 64
source: currentRoom.paintable
hint: currentRoom ? currentRoom.displayName : "No name"
}
ColumnLayout {
Label {
Layout.fillWidth: true
Layout.fillHeight: true
visible: parent.width > 64
text: currentRoom ? currentRoom.displayName : ""
font.pointSize: 12
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
Label {
Layout.fillWidth: true
Layout.fillHeight: true
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: currentRoom ? currentRoom.displayName : ""
color: "#1D333E"
font.pointSize: 12
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
id: headerTopicLabel
Label {
Layout.fillWidth: true
Layout.fillHeight: true
id: headerTopicLabel
color: "#5B7480"
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
color: "#5B7480"
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
}
}
RippleEffect {
anchors.fill: parent
onClicked: header.clicked()
}
}

View File

@ -1,96 +0,0 @@
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.2
import Spectral 0.1
import Spectral.Setting 0.1
import Spectral.Component 2.0
Item {
AutoMouseArea {
anchors.fill: parent
onSecondaryClicked: {
roomContextMenu.model = model
roomContextMenu.popup()
}
onPrimaryClicked: {
if (category === RoomType.Invited) {
inviteDialog.currentRoom = currentRoom
inviteDialog.open()
} else {
leaveRoom(enteredRoom)
enterRoom(currentRoom)
enteredRoom = currentRoom
}
}
}
Rectangle {
anchors.fill: parent
visible: highlightCount > 0 || currentRoom === enteredRoom
color: Material.accent
opacity: 0.1
}
Rectangle {
width: unreadCount > 0 ? 4 : 0
height: parent.height
color: Material.accent
Behavior on width {
PropertyAnimation { easing.type: Easing.InOutCubic; duration: 200 }
}
}
RowLayout {
anchors.fill: parent
anchors.margins: 12
spacing: 12
ImageItem {
id: imageItem
Layout.preferredWidth: height
Layout.fillHeight: true
source: paintable
hint: name || "No Name"
}
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter
visible: parent.width > 64
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: name || "No Name"
color: "#1D333E"
font.pointSize: 12
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: (lastEvent == "" ? topic : lastEvent).replace(/(\r\n\t|\n|\r\t)/gm,"")
color: "#5B7480"
font.pointSize: 9.75
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
}
}
}

View File

@ -17,7 +17,7 @@ Rectangle {
property var controller: null
readonly property var user: controller.connection ? controller.connection.localUser : null
readonly property int filter: 0
property int filter: 0
property var enteredRoom: null
property alias errorControl: errorControl
@ -140,7 +140,7 @@ Rectangle {
background: Rectangle { color: Material.primary }
ItemDelegate {
RippleEffect {
anchors.fill: parent
}
}
@ -172,11 +172,19 @@ Rectangle {
}
}
ItemDelegate {
Layout.fillWidth: true
text: "Add Account"
onClicked: loginDialog.open()
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 1
color: "#e7ebeb"
color: MSettings.darkTheme ? "#424242" : "#e7ebeb"
}
ItemDelegate {
@ -187,6 +195,14 @@ Rectangle {
onClicked: stackView.push(settingsPage)
}
ItemDelegate {
Layout.fillWidth: true
text: "Logout"
onClicked: controller.logout(controller.connection)
}
ItemDelegate {
Layout.fillWidth: true
@ -249,14 +265,18 @@ Rectangle {
spacing: 0
Control {
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 64
visible: stackView.depth > 1
contentItem: RowLayout {
color: Material.primary
RowLayout {
anchors.fill: parent
anchors.margins: 4
ToolButton {
Layout.preferredWidth: height
Layout.fillHeight: true
@ -277,10 +297,6 @@ Rectangle {
elide: Label.ElideRight
}
}
background: Rectangle {
color: Material.primary
}
}
StackView {
@ -289,6 +305,8 @@ Rectangle {
id: stackView
clip: true
initialItem: mainPage
}
}
@ -299,8 +317,6 @@ Rectangle {
spacing: 0
Control {
readonly property bool isSearching: searchField.text
Layout.fillWidth: true
Layout.preferredHeight: 64
@ -316,22 +332,66 @@ Rectangle {
Layout.preferredWidth: height
Layout.fillHeight: true
contentItem: MaterialIcon {
icon: roomListHeader.isSearching ? "\ue5cd" : "\ue8b6"
color: roomListHeader.isSearching ? "#1D333E" : "7F7F7F"
}
visible: !searchField.active
onClicked: {
if (searchField.focus) {
searchField.clear()
searchField.focus = false
} else {
searchField.focus = true
contentItem: MaterialIcon {
icon: {
switch (filter) {
case 0: return "\ue8b6"
case 1: return "\ue7f5"
case 2: return "\ue7ff"
case 3: return "\ue7fc"
}
}
}
Menu {
id: filterMenu
MenuItem {
text: "All"
onClicked: filter = 0
}
MenuSeparator {}
MenuItem {
text: "New"
onClicked: filter = 1
}
MenuItem {
text: "People"
onClicked: filter = 2
}
MenuItem {
text: "Group"
onClicked: filter = 3
}
}
onClicked: filterMenu.popup()
}
ItemDelegate {
Layout.preferredWidth: height
Layout.fillHeight: true
visible: searchField.active
contentItem: MaterialIcon { icon: "\ue5cd" }
onClicked: searchField.clear()
}
AutoTextField {
readonly property bool active: text
Layout.fillWidth: true
Layout.fillHeight: true
@ -349,7 +409,7 @@ Rectangle {
Layout.fillHeight: true
Layout.alignment: Qt.AlignRight
visible: !roomListHeader.isSearching
visible: !searchField.active
source: root.user ? root.user.paintable : null
hint: root.user ? root.user.displayName : "?"
@ -360,6 +420,17 @@ Rectangle {
}
}
}
background: Rectangle {
color: Material.background
opacity: listView.atYBeginning ? 0 : 1
layer.enabled: true
layer.effect: ElevationEffect {
elevation: 2
}
}
}
Control {
@ -423,9 +494,93 @@ Rectangle {
ScrollBar.vertical: ScrollBar {}
delegate: RoomListDelegate {
width: parent.width
delegate: Item {
width: listView.width
height: 64
Rectangle {
anchors.fill: parent
visible: highlightCount > 0 || currentRoom === enteredRoom
color: Material.accent
opacity: 0.1
}
Rectangle {
width: unreadCount > 0 ? 4 : 0
height: parent.height
color: Material.accent
Behavior on width {
PropertyAnimation { easing.type: Easing.InOutCubic; duration: 200 }
}
}
RowLayout {
anchors.fill: parent
anchors.margins: 12
spacing: 12
ImageItem {
id: imageItem
Layout.preferredWidth: height
Layout.fillHeight: true
source: paintable
hint: name || "No Name"
}
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignHCenter
visible: parent.width > 64
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: name || "No Name"
font.pointSize: 12
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
Label {
Layout.fillWidth: true
Layout.fillHeight: true
text: (lastEvent == "" ? topic : lastEvent).replace(/(\r\n\t|\n|\r\t)/gm,"")
color: "#5B7480"
font.pointSize: 9.75
elide: Text.ElideRight
wrapMode: Text.NoWrap
}
}
}
RippleEffect {
anchors.fill: parent
onSecondaryClicked: {
roomContextMenu.model = model
roomContextMenu.popup()
}
onPrimaryClicked: {
if (category === RoomType.Invited) {
inviteDialog.currentRoom = currentRoom
inviteDialog.open()
} else {
leaveRoom(enteredRoom)
enterRoom(currentRoom)
enteredRoom = currentRoom
}
}
}
}
section.property: "display"

View File

@ -54,7 +54,7 @@ Item {
visible: currentRoom
source: "qrc:/assets/img/roompanel.svg"
source: MSettings.darkTheme ? "qrc:/assets/img/roompanel-dark.svg" : "qrc:/assets/img/roompanel.svg"
fillMode: Image.PreserveAspectCrop
}

View File

@ -28,6 +28,9 @@ ApplicationWindow {
visible: true
title: qsTr("Spectral")
Material.foreground: Material.theme == Material.Dark ? "#FFFFFF" : "#1D333E"
Material.background: Material.theme == Material.Dark ? "#303030" : "#FFFFFF"
Platform.SystemTrayIcon {
visible: MSettings.showTray
iconSource: "qrc:/assets/img/icon.png"
@ -52,8 +55,8 @@ ApplicationWindow {
quitOnLastWindowClosed: !MSettings.showTray
onNotificationClicked: {
roomPage.enteredRoom = spectralController.connection.room(roomId)
roomPage.goToEvent(eventId)
roomForm.enteredRoom = spectralController.connection.room(roomId)
roomForm.goToEvent(eventId)
showWindow()
}
onErrorOccured: {
@ -64,6 +67,95 @@ ApplicationWindow {
onSyncDone: roomListForm.errorControl.visible = false
}
Dialog {
property bool busy: false
width: 360
height: 300
x: (window.width - width) / 2
y: (window.height - height) / 2
id: loginDialog
parent: ApplicationWindow.overlay
title: "Login"
contentItem: ColumnLayout {
AutoTextField {
Layout.fillWidth: true
id: serverField
placeholderText: "Server Address"
text: "https://matrix.org"
}
AutoTextField {
Layout.fillWidth: true
id: usernameField
placeholderText: "Username"
}
AutoTextField {
Layout.fillWidth: true
id: passwordField
placeholderText: "Password"
echoMode: TextInput.Password
}
}
footer: DialogButtonBox {
Button {
text: "OK"
flat: true
enabled: !loginDialog.busy
onClicked: loginDialog.doLogin()
}
Button {
text: "Cancel"
flat: true
enabled: !loginDialog.busy
onClicked: loginDialog.close()
}
ToolTip {
id: loginButtonTooltip
}
}
Component.onCompleted: {
spectralController.onErrorOccured.connect(function(error, detail) {
loginDialog.busy = false
loginButtonTooltip.text = error + ": " + detail
loginButtonTooltip.open()
})
}
function doLogin() {
if (!(serverField.text.startsWith("http") && serverField.text.includes("://"))) {
loginButtonTooltip.text = "Server address should start with http(s)://"
loginButtonTooltip.open()
return
}
loginDialog.busy = true
spectralController.loginWithCredentials(serverField.text, usernameField.text, passwordField.text)
spectralController.connectionAdded.connect(function(conn) {
busy = false
loginDialog.close()
})
}
}
SplitView {
anchors.fill: parent
@ -108,13 +200,9 @@ ApplicationWindow {
window.hide()
}
function showError() {
}
// Component.onCompleted: {
// spectralController.initiated.connect(function() {
// if (spectralController.accountCount == 0) stackView.push(loginPage)
// })
// }
Component.onCompleted: {
spectralController.initiated.connect(function() {
if (spectralController.accountCount == 0) loginDialog.open()
})
}
}

View File

@ -13,13 +13,11 @@
<file>imports/Spectral/Component/AutoMouseArea.qml</file>
<file>imports/Spectral/Component/MaterialIcon.qml</file>
<file>imports/Spectral/Component/qmldir</file>
<file>imports/Spectral/Component/SideNavButton.qml</file>
<file>imports/Spectral/Effect/ElevationEffect.qml</file>
<file>imports/Spectral/Effect/qmldir</file>
<file>imports/Spectral/Menu/MessageContextMenu.qml</file>
<file>imports/Spectral/Menu/qmldir</file>
<file>imports/Spectral/Menu/RoomContextMenu.qml</file>
<file>imports/Spectral/Page/Login.qml</file>
<file>imports/Spectral/Page/qmldir</file>
<file>assets/font/material.ttf</file>
<file>assets/img/icon.icns</file>
@ -29,14 +27,12 @@
<file>imports/Spectral/Font/MaterialFont.qml</file>
<file>imports/Spectral/Font/qmldir</file>
<file>imports/Spectral/Setting/qmldir</file>
<file>imports/Spectral/Page/LoginForm.ui.qml</file>
<file>imports/Spectral/Panel/qmldir</file>
<file>imports/Spectral/Panel/RoomDrawer.qml</file>
<file>imports/Spectral/Panel/RoomListPanel.qml</file>
<file>imports/Spectral/Panel/RoomPanel.qml</file>
<file>imports/Spectral/Panel/RoomPanelForm.ui.qml</file>
<file>imports/Spectral/Panel/RoomHeader.qml</file>
<file>imports/Spectral/Panel/RoomListDelegate.qml</file>
<file>imports/Spectral/Component/ScrollHelper.qml</file>
<file>imports/Spectral/Component/AutoListView.qml</file>
<file>imports/Spectral/Component/Timeline/TimelineImage.qml</file>
@ -48,5 +44,8 @@
<file>imports/Spectral/Component/Timeline/SectionDelegate.qml</file>
<file>assets/img/roompanel.svg</file>
<file>assets/img/matrix.svg</file>
<file>imports/Spectral/Effect/RippleEffect.qml</file>
<file>imports/Spectral/Effect/CircleMask.qml</file>
<file>assets/img/roompanel-dark.svg</file>
</qresource>
</RCC>

View File

@ -58,26 +58,27 @@ inline QString accessTokenFileName(const AccountSettings& account) {
void Controller::loginWithCredentials(QString serverAddr, QString user,
QString pass) {
if (!user.isEmpty() && !pass.isEmpty()) {
Connection* m_connection = new Connection(this);
m_connection->setHomeserver(QUrl(serverAddr));
m_connection->connectToServer(user, pass, "");
connect(m_connection, &Connection::connected, [=] {
AccountSettings account(m_connection->userId());
Connection* conn = new Connection(this);
conn->setHomeserver(QUrl(serverAddr));
conn->connectToServer(user, pass, "");
connect(conn, &Connection::connected, [=] {
AccountSettings account(conn->userId());
account.setKeepLoggedIn(true);
account.clearAccessToken(); // Drop the legacy - just in case
account.setHomeserver(m_connection->homeserver());
account.setDeviceId(m_connection->deviceId());
account.setHomeserver(conn->homeserver());
account.setDeviceId(conn->deviceId());
account.setDeviceName("Spectral");
if (!saveAccessToken(account, m_connection->accessToken()))
if (!saveAccessToken(account, conn->accessToken()))
qWarning() << "Couldn't save access token";
account.sync();
addConnection(m_connection);
addConnection(conn);
setConnection(conn);
});
connect(m_connection, &Connection::networkError,
connect(conn, &Connection::networkError,
[=](QString error, QByteArray detail) {
emit errorOccured("Network Error", error);
});
connect(m_connection, &Connection::loginError,
connect(conn, &Connection::loginError,
[=](QString error, QByteArray detail) {
emit errorOccured("Login Failed", error);
});
@ -98,6 +99,7 @@ void Controller::logout(Connection* conn) {
conn->stopSync();
emit conn->stateChanged();
emit conn->loggedOut();
if (!m_connections.isEmpty()) setConnection(m_connections[0]);
});
connect(job, &LogoutJob::failure, this, [=] {
emit errorOccured("Server-side Logout Failed", job->errorString());