add ply option to the study chapter share URL

public/stylesheets/material.form.css

@@ -80,7 +80,7 @@
   margin-top: -1rem;
 }
 
-.material.form .form-group input {
+.material.form .form-group input:not([type="checkbox"]) {
   height: 1.9rem;
 }
 .material.form .form-group textarea {
@@ -132,7 +132,7 @@
   transition: left 0.28s ease, width 0.28s ease;
   z-index: 2;
 }
-.material.form .form-group input,
+.material.form .form-group input:not([type="checkbox"]),
 .material.form .form-group textarea {
   display: block;
   background: none;

public/stylesheets/study.css

@@ -48,6 +48,19 @@ form.chapter_form.material.form .form-group textarea {
 .form.share input {
   font-size: 13px!important;
 }
+.form.share .ply-wrap {
+  margin-top: -5px;
+  text-align: left;
+  opacity: 0.7;
+  font-size: 0.8rem;
+}
+.form.share .ply {
+  cursor: pointer;
+}
+.form.share .ply input {
+  margin-right: 5px;
+  vertical-align: middle;
+}
 div.underboard {
   margin-top: 20px;
   min-height: 370px;

ui/analyse/src/study/studyCtrl.js

@@ -165,7 +165,11 @@ module.exports = function(data, ctrl, tagTypes, practiceData) {
 
   if (members.canContribute()) form.openIfNew();
 
-  var share = shareCtrl(data, currentChapter);
+  var currentNode = function() {
+    return ctrl.vm.node;
+  };
+
+  var share = shareCtrl(data, currentChapter, currentNode);
 
   var practice = practiceData && practiceCtrl(ctrl, data, practiceData);
 
@@ -256,9 +260,7 @@ module.exports = function(data, ctrl, tagTypes, practiceData) {
     contribute: contribute,
     startTour: startTour,
     userJump: ctrl.userJump,
-    currentNode: function() {
-      return ctrl.vm.node;
-    },
+    currentNode: currentNode,
     practice: practice,
     socketHandlers: {
       path: function(d) {

ui/analyse/src/study/studyShare.js

@@ -4,8 +4,9 @@ var dialog = require('./dialog');
 var baseUrl = 'https://lichess.org/study/';
 
 module.exports = {
-  ctrl: function(data, currentChapter) {
+  ctrl: function(data, currentChapter, currentNode) {
     var open = m.prop(false);
+    var withPly = m.prop(false);
     return {
       open: open,
       toggle: function() {
@@ -15,13 +16,17 @@ module.exports = {
       chapter: currentChapter,
       isPublic: function() {
         return data.visibility === 'public';
-      }
+      },
+      currentNode: currentNode,
+      withPly: withPly
     }
   },
   view: function(ctrl) {
     if (!ctrl.open()) return;
     var studyId = ctrl.studyId;
     var chapter = ctrl.chapter();
+    var fullUrl = baseUrl + studyId + '/' + chapter.id;
+    if (ctrl.withPly()) fullUrl += '#' + ctrl.currentNode().ply;
     return dialog.form({
       onClose: function() {
         ctrl.open(false);
@@ -40,11 +45,18 @@ module.exports = {
           m('div.form-group', [
             m('input.has-value.autoselect', {
               readonly: true,
-              value: baseUrl + studyId + '/' + chapter.id
+              value: fullUrl
             }),
+            m('div.ply-wrap', m('label.ply', [
+              m('input[type=checkbox]', {
+                onchange: m.withAttr("checked", ctrl.withPly)
+              }),
+              'Start at ply ',
+              m('strong', ctrl.currentNode().ply)
+            ])),
             m('p.form-help.text', {
               'data-icon': ''
-            }, 'Paste this in a forum post to embed the chapter.'),
+            }, 'You can paste this in the forum to embed the chapter.'),
             m('label.control-label', 'Current chapter URL'),
             m('i.bar')
           ]),