deepcrayon/lila
deepcrayon/lila
1
0
Fork 0
Code Releases Activity

learn: what next?

Browse source
This commit is contained in:
Thibault Duplessis 2016-07-20 13:34:01 +02:00
parent 92ee584f17
commit fadc94ab78
8 changed files with 49 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
public/images/learn/beams-aura.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M263.594 20.625c-13.394 0-25.824 7.217-35.47 20.188-9.644 12.97-15.968 31.547-15.968 52.25 0 20.702 6.324 39.248 15.97 52.218 9.644 12.972 22.074 20.19 35.468 20.19 13.393 0 25.855-7.218 35.5-20.19 9.645-12.97 15.97-31.516 15.97-52.218-.002-20.702-6.325-39.28-15.97-52.25-9.645-12.97-22.107-20.187-35.5-20.187zM153.188 25l-16.563 8.625 60.5 116.063c2.778-1.51 5.673-2.87 8.72-4.032-7.715-13.314-12.578-29.542-13.845-46.187L153.187 25zM374 25l-39.313 75.438c-1.316 15.668-5.802 31.003-12.843 43.78 3.2 1.052 6.26 2.264 9.187 3.657l59.564-114.25L374 25zM102.687 64.844l-13.874 12.53 84.124 93.19c3.88-4.996 8.217-9.51 13.063-13.44l-83.313-92.28zm321.844 0l-81.467 90.22c4.357 3.202 8.283 6.853 11.78 10.874.59.677 1.185 1.366 1.75 2.062l81.813-90.625-13.875-12.53zM63.064 117.688L53 133.438l103.875 66.406c2.283-5.967 4.938-11.697 7.97-17.063L63.062 117.688zm401.093 0l-98.875 63.25c3.01 5.416 5.56 11.208 7.72 17.25l101.22-64.75-10.064-15.75zm-153.28 42.78c-12.165 14.36-28.78 23.688-47.282 23.688-18.056 0-34.3-8.885-46.375-22.656-25.124 6.894-38.6 27.533-46.94 57.344-8.19 29.287-9.914 66.253-10.155 101.562h26l-3.5-67.72 18.688-.936 4.125 80 11.218 163.78h38V362.97h18.688v132.56h40.812l9.97-164.467 4.093-79.313 18.655.938-3.5 67.718h23.813c-.02-35.714-.425-73.276-7.844-102.812-4.032-16.05-10.072-29.544-18.625-39.375-7.528-8.652-16.887-14.755-29.845-17.75zM36.968 180.032l-5.314 17.907 116.28 34.532c1.187-6.24 2.613-12.345 4.25-18.25L36.97 180.03zm453.28 0l-112.688 33.44c1.485 5.964 2.715 12.113 3.72 18.405l114.28-33.938-5.312-17.906zM26.22 247.688v18.688h117.218c.54-6.298 1.224-12.532 2.062-18.688H26.22zm357.124 0c.645 6.16 1.106 12.402 1.47 18.688h116.155v-18.688H383.343zm-241.03 35.594L31.654 316.126l5.313 17.938 104.593-31.032c.148-6.562.41-13.16.75-19.75zm243.217.19c.185 6.568.27 13.104.314 19.624l104.406 30.97 5.313-17.94L385.53 283.47zm-244.186 40.686L53 380.656l10.063 15.72 89.562-57.282h-11.313v-9.344c0-1.844.026-3.733.032-5.594zm244.562.03v14.908h-11.312l89.562 57.28 10.063-15.718-88.314-56.47zm-208.97 14.908L88.814 436.72l13.876 12.53 85.562-94.78-1.063-15.376h-10.25zm165.44 0l-1.095 17.937 83.25 92.22 13.876-12.53-88.125-97.626h-7.905zm-152.5 39.156l-53.25 102.188 16.56 8.656 39.158-75.125-2.47-35.72zm149.843 4.594l-2.19 36.25 36.47 70 16.594-8.656-50.875-97.594z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

1
public/images/learn/bullseye.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M311.133 257.95a15.074 15.074 0 0 1-12.845 17.026l-147.248 20.61-21.33 32.522-82.637 11.57 21.33-32.568-24.547 3.44c-.278 0-.555.12-.843.165a15.218 15.218 0 0 1-2.108.144 15.074 15.074 0 0 1-2.074-30.016c.29 0 .567 0 .855-.078l24.547-3.438-29.45-25.512 82.582-11.547 29.45 25.51 147.26-20.608a15.196 15.196 0 0 1 2.107-.145 15.085 15.085 0 0 1 14.953 12.923zm-36.704-38.546a32.4 32.4 0 0 1 10.847-10.326 23.427 23.427 0 0 1 13.422-3.04 27.875 27.875 0 0 1 13.542 5.047 44.557 44.557 0 0 1 11.924 12.59 66.342 66.342 0 0 1 8.386 19.134 77.48 77.48 0 0 1 2.562 21.995 67.895 67.895 0 0 1-3.494 19.966 46.132 46.132 0 0 1-8.54 15.352 28.163 28.163 0 0 1-12.402 8.552 23.382 23.382 0 0 1-13.765.255 32.012 32.012 0 0 1-12.512-7.122 45.478 45.478 0 0 1-5.734-6.2l-32.278 4.514a131.154 131.154 0 0 0 7.1 15.973 104.566 104.566 0 0 0 18.656 25.512 69.016 69.016 0 0 0 23.893 15.806 48.373 48.373 0 0 0 27.597 2.22 53.43 53.43 0 0 0 26.31-14.876c7.898-7.853 14.42-18.258 19.112-30.514a131.997 131.997 0 0 0 8.32-41.995 153.26 153.26 0 0 0-5.48-46.92 128.758 128.758 0 0 0-18.49-39.932c-7.6-10.726-16.417-18.946-25.78-24.403a52.998 52.998 0 0 0-27.962-7.62 48.573 48.573 0 0 0-26.278 8.718 69.88 69.88 0 0 0-20.165 21.897 107.505 107.505 0 0 0-11.99 29.516A137.144 137.144 0 0 0 237.68 235l31.192-4.37a49.172 49.172 0 0 1 5.557-11.226zm198.305-34.984c-10.926-35.274-27.287-64.757-46.842-87.374-18.557-21.518-39.544-36.26-61.118-44.213-20.155-7.41-40.564-8.74-59.953-4.248-18.058 4.204-35.196 13.466-50.603 27.62-14.42 13.21-26.09 29.626-35.185 47.807a233.224 233.224 0 0 0-19.29 56.57 286.023 286.023 0 0 0-5.856 60.674l22.582-3.16a209.143 209.143 0 0 1 5.047-40.344 166.26 166.26 0 0 1 15.972-42.926c7.365-13.4 16.716-25.124 27.997-34.087 11.89-9.44 24.88-14.986 38.3-16.64 14.165-1.774 28.773.744 42.938 7.51 14.863 7.1 29.084 18.78 41.485 34.774 12.856 16.572 23.515 37.46 30.66 61.917a225.515 225.515 0 0 1 8.74 74.65c-1.254 24.05-6.4 46.422-14.72 65.656-8.042 18.58-18.857 33.887-31.824 44.88-12.313 10.47-26.345 16.915-41.463 18.656a76.226 76.226 0 0 1-41.163-7.1c-12.313-5.722-23.826-14.485-34.03-25.51a162.212 162.212 0 0 1-25.724-37.637 204.584 204.584 0 0 1-14.542-38.578l-22.484 3.106a280.965 280.965 0 0 0 19.966 57.823 228.2 228.2 0 0 0 32.168 50.092c12.99 15.186 27.82 27.83 43.914 36.793 17.18 9.574 36.027 15.064 55.705 14.865 21.263-.21 41.44-7.022 59.52-19.778 19.356-13.654 36.005-33.897 48.617-59.432 13.244-26.82 21.697-58.788 24.048-93.64a300.742 300.742 0 0 0-12.856-108.76z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

1
public/images/learn/sword-clash.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M311.313 25.625l-23 10.656-29.532 123.032 60.814-111.968-8.28-21.72zM59.625 50.03c11.448 76.937 48.43 141.423 100.188 195.75 14.133-9.564 28.405-19.384 42.718-29.405-22.156-27.314-37.85-56.204-43.593-86.28-34.214-26.492-67.613-53.376-99.312-80.064zm390.47.032C419.178 76.1 386.64 102.33 353.31 128.22c-10.333 58.234-58.087 112.074-118.218 158.624-65.433 50.654-146.56 92.934-215.28 121.406l-.002 32.78c93.65-34.132 195.55-81.378 276.875-146.592C375.72 231.06 435.014 151.375 450.095 50.063zm-236.158 9.344l-8.5 27.813 40.688 73.06-6.875-85.31-25.313-15.564zm114.688 87.813C223.39 227.47 112.257 302.862 19.812 355.905V388c65.917-27.914 142.58-68.51 203.844-115.938 49.83-38.574 88.822-81.513 104.97-124.843zm-144.563 2.155c7.35 18.89 19.03 37.68 34 56.063 7.03-4.98 14.056-10.03 21.094-15.094-18.444-13.456-36.863-27.12-55.094-40.97zM352.656 269.72c-9.573 9.472-19.58 18.588-29.906 27.405 54.914 37.294 117.228 69.156 171.906 92.156V358.19c-43.86-24.988-92.103-55.13-142-88.47zm-44.906 39.81c-11.65 9.32-23.696 18.253-36.03 26.845C342.046 381.51 421.05 416.15 494.655 442.75v-33.22c-58.858-24.223-127.1-58.727-186.906-100zm-58.625 52.033l-46.188 78.25 7.813 23.593 27.75-11.344 10.625-90.5zm15.844.812L316.343 467l36.47 10.28-3.533-31.967-84.31-82.938z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

1
public/images/learn/tied-scroll.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M373.563 18.406c-15.616-.167-27.91 4.622-32.563 14.75-22.778 49.605-48.743 87.14-79.094 117.28 3.047 1.015 6.046 2.29 8.938 3.783 12.987 6.708 25.268 17.78 35.312 30.843 10.044 13.062 17.85 28.114 20.78 43.5.746 3.908 1.16 7.885 1.158 11.843 38.97-24.36 85.058-41.223 140.875-51.312 14.91-2.697 23.652-28.632 21.405-58.656l-35.156-1 30.56-24.813c-4.148-14.507-11.013-28.754-21.155-40.72-15.528-18.314-36.43-31.376-56.72-38.686L381.94 40.812l2.812-21.5c-3.875-.55-7.61-.87-11.188-.907zM246.938 166.562c-1.063.052-2.06.226-3 .47-11.976 10.254-24.61 19.597-37.938 28.28.842.33 1.67.667 2.5 1.032 14.123 6.192 27.438 17.145 38.47 30.625 13.356 16.322 23.62 36.94 25.624 57.75 10.334-10.367 21.24-19.943 32.844-28.72 4.096-6.555 4.93-14.468 3.125-23.938-2.184-11.46-8.642-24.43-17.25-35.625-8.61-11.194-19.38-20.622-29.063-25.625-6.052-3.126-11.154-4.45-15.313-4.25zm-61.907 43.282c-1.385.053-2.69.27-3.968.562-37 20.762-79.088 37.985-127.312 56 .574.042 1.14.093 1.72.156 10.627 1.156 21.076 5.008 31.155 10.875L124.313 261 108.5 293.72c5.995 5.432 11.803 11.477 17.344 18 20.76 24.434 37.964 55.865 47.094 88.092.002.01-.003.022 0 .032 2.98 10.508 5.11 20.916 6.312 31 20.99-48.438 44.38-89.26 72.344-123 7.3-21.48-2.186-48.408-19.063-69.03-9.44-11.538-20.976-20.718-31.53-25.345-5.936-2.604-11.27-3.808-15.97-3.626zm141.626 54.844c-7.31 5.05-14.462 10.51-21.437 16.312 39.16 9.26 60.953 35.722 80.655 62.156 10.464 14.04 20.598 28.11 33.125 40.688 24.19 9.147 43.17 6.38 63.906-14.938-92.165-27.78-96.11-92.61-156.25-104.22zM48.594 284.906c-10.873.225-18.26 5.755-23.344 16.594-5.81 12.387-7.114 32.47.438 57.063 5.75 18.73 16.52 37.718 28.75 51.625 12.23 13.906 25.9 22.076 35.374 22.406h.032c3.717.13 6.553-.682 8.812-2.75l-.187-.188 2.093-2.094c.793-1.168 1.52-2.548 2.187-4.187 2.81-6.9 3.28-18.552-1.844-33-6.885-19.417-19.12-31.932-33.375-34.78l-22.968-4.564 19.813-12.5 38.47-24.186c-16.65-16.822-34.55-27.607-49.376-29.22-1.7-.184-3.323-.25-4.876-.218zm236.25 5.406l-24.53 25.375c100.442 17.878 55.45 141.005 159.31 176.188l-24.78-57.28c32.766 16.15 67.39 22.623 97.72 12.03-135.77-41.948-96.32-126.983-207.72-156.313zm-169.47 38.22l-25.968 16.343c13.18 8.5 23.21 22.565 29.125 39.25 2.57 7.244 4.133 14.205 4.75 20.78l23.44-23.374c-8.08-19.19-19.035-37.566-31.345-53zm38.376 72.374l-42.063 42-.156-.156c-4.255 3.942-9.456 6.765-15.186 7.938 23.268 14.873 44.644 19.346 56.812 9.562 4.26-3.426 7.043-8.36 8.47-14.406-.41-12.684-2.602-26.615-6.657-40.906-.382-1.346-.806-2.686-1.22-4.032z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

1
public/images/learn/unlocking.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M78.53 157.188c-23.843 0-43.93 21.364-50.28 50.593-4.216 5.54-6.75 12.435-6.75 19.876 0 7.506 2.56 14.467 6.844 20.03 6.475 28.963 26.485 50.064 50.187 50.064 24.293 0 44.72-22.173 50.657-52.25H234.97v65.594h19.31v-44.22h18.69v44.22h20.092V286h18.688v25.094h15.125V245.5h17.97v-33.47h-215.19c-5.248-31.382-26.14-54.843-51.124-54.843zM424.44 169.28c-31.78 0-57.813 26.036-57.813 57.814 0 17.65 7.836 33.673 20.47 44.312l-25.22 72.938-4.28 12.406h133.123l-4.314-12.406-25.187-72.938c12.63-10.64 20.467-26.662 20.467-44.312 0-31.642-25.47-57.813-57.25-57.813zm0 18.69c21.617 0 38.562 17.372 38.562 39.124 0 14.002-7.057 26.117-17.875 33l-6.22 3.97 2.408 6.967 23.156 67.033H383.81L407 271.03l2.406-6.967-6.22-3.97c-10.817-6.882-17.873-18.997-17.873-33 0-21.615 17.507-39.124 39.125-39.124zm-369.97 25.405c8.003 0 14.313 6.28 14.313 14.28 0 8.003-6.31 14.282-14.31 14.282-8.003 0-14.282-6.28-14.282-14.28 0-8.003 6.28-14.282 14.28-14.282z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

1
public/images/learn/vintage-robot.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" ><path d="M0 0h512v512H0z" fill="transparent" stroke="transparent"></path><path d="M260.22 58.28c-33.15 0-60.763 22.89-68 53.782h136c-7.24-30.89-34.85-53.78-68-53.78zM146.06 130.75v194.188H381.22V130.75H146.06zm117.063 24.125c32.075 0 58.28 26.207 58.28 58.28 0 32.075-26.206 58.282-58.28 58.282s-58.28-26.207-58.28-58.28c0-32.076 26.206-58.282 58.28-58.282zm-135.75 40.22c-37.902 8.577-67.593 37.596-77.094 75.124-3.368.833-6.668 2.127-9.81 3.936-18.16 10.452-24.47 33.907-13.97 52.03l16.156-9.342c-5.428-9.37-2.296-21.078 7.125-26.5l.157-.063c9.396-5.302 21.1-2.135 26.5 7.19 5.43 9.374 2.3 21.043-7.124 26.467l9.312 16.188c18.16-10.453 24.466-33.905 13.97-52.03-1.42-2.454-3.09-4.682-4.94-6.69 5.013-20.46 20.205-36.686 39.72-44v-42.31zm272.53 3.25v44.624c13.927 8.56 24.357 22.155 28.345 38.436-1.848 2.007-3.517 4.235-4.938 6.688-10.497 18.126-4.19 41.578 13.97 52.03l9.312-16.187c-9.425-5.424-12.555-17.093-7.125-26.468 5.427-9.375 17.234-12.55 26.655-7.126 9.42 5.422 12.553 17.13 7.125 26.5l16.156 9.344c10.5-18.125 4.19-41.58-13.97-52.032-3.142-1.81-6.442-3.103-9.81-3.937-8.527-33.68-33.33-60.522-65.72-71.876zm-224.28 145.28v33.125c5.605-1.6 11.743-2.5 18.438-2.5 8.152 0 15.475 1.222 22 3.406v-34.03h-40.438zm141.688 0v33.47c6.063-1.826 12.78-2.845 20.187-2.845 7.424 0 14.164 1.085 20.25 3.03v-33.655h-40.438zm-123.25 49.313c-21.565 0-31.638 9.323-38.75 23.375-5.676 11.21-8.255 25.565-9.438 38.718h96.438c-1.052-13.284-3.285-27.65-8.75-38.81-6.833-13.953-16.734-23.283-39.5-23.283zm143.437 0c-22.766 0-32.668 9.33-39.5 23.28-5.466 11.162-7.698 25.528-8.75 38.813h96.438c-1.183-13.152-3.763-27.506-9.438-38.717-7.113-14.052-17.186-23.375-38.75-23.375z" fill="#ffffff"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.7 KiB

6
public/stylesheets/learn.css
View file

@ -844,3 +844,9 @@ body.dark #learn_app .map .categ > h2 {
#learn_app .map .stage .ribbon.ongoing:after {
border-top: 3px solid #536DFE;
}
#learn_app .map .what_next > p {
width: 100%;
text-align: center;
margin: 20px 0;
font-size: 1.2em;
}

38
ui/learn/src/map/mapView.js
View file

@ -27,6 +27,41 @@ function ribbon(ctrl, s, status, res) {
);
}
function whatNext(ctrl) {
var makeStage = function(href, img, title, subtitle, done) {
return m('a.stage.done', {
href: href
}, [
done ? m('span.ribbon-wrapper',
m('span.ribbon.done', makeStars(1))
) : null,
m('img', {
src: util.assetUrl + 'images/learn/' + img + '.svg'
}),
m('div.text', [
m('h2', title),
m('p.subtitle', subtitle)
])
]);
};
var userId = ctrl.data._id;
console.log(userId);
return m('div.categ.what_next', [
m('h2', 'What next?'),
m('p', "You know how to play chess, congratulations! Do you want to become a stronger player?"),
m('div.categ_stages', [
userId ?
makeStage('/@/' + userId, 'beams-aura', 'Register', 'Get a free lichess account', true) :
makeStage('/signup', 'beams-aura', 'Register', 'Get a free lichess account'),
makeStage('/training', 'bullseye', 'Training', 'Solve various chess positions'),
makeStage('/training/opening', 'unlocking', 'Openings', 'Find the best opening move'),
makeStage('/video', 'tied-scroll', 'Videos', 'Watch free and instructive chess videos'),
makeStage('/#hook', 'sword-clash', 'Play people', 'Find opponents from all over the world'),
makeStage('/#ai', 'vintage-robot', 'Play machine', 'Test your skill against the computer'),
])
]);
}
module.exports = function(ctrl) {
return m('div.learn.map', [
m('div.stages', stages.categs.map(function(categ) {
@ -57,6 +92,7 @@ module.exports = function(ctrl) {
})
)
]);
}))
})),
whatNext(ctrl)
]);
};