update

package.json

 {
   "name": "react-ag-qeditor",
-    "version": "1.1.81",
+  "version": "1.1.82",
   "description": "WYSIWYG html editor",
   "author": "atma",
   "license": "MIT",

src/extensions/Iframe.js

@@ -319,10 +319,64 @@ const ResizableIframeView = ({ editor, node, updateAttributes, getPos, selected
                     </Fragment>
                 )}
             </div>
+
+            {/*
+                Досмотр настраивается только у выделенной вставки и только там,
+                где его можно измерить: YouTube, ВКонтакте, Rutube отдают
+                позицию воспроизведения, а документ Google или произвольная
+                страница — нет. Показывать там «досмотреть до 80%» значило бы
+                обещать проверку, которой не будет.
+            */}
+            {selected && MEASURABLE.test(node.attrs.src || '') && (
+                <div className="atma-video-watch" contentEditable={false}>
+                    <label>
+                        <input
+                            type="checkbox"
+                            checked={node.attrs.threshold != null}
+                            onChange={(e) =>
+                                updateAttributes({ threshold: e.target.checked ? 80 : null })
+                            }
+                        />
+                        досмотреть до
+                    </label>
+                    <input
+                        type="number"
+                        min={1}
+                        max={100}
+                        disabled={node.attrs.threshold == null}
+                        value={node.attrs.threshold == null ? 80 : node.attrs.threshold}
+                        onChange={(e) => {
+                            const v = parseInt(e.target.value, 10)
+                            updateAttributes({
+                                threshold: Number.isFinite(v) ? Math.min(100, Math.max(1, v)) : 80,
+                            })
+                        }}
+                    />
+                    <span>%</span>
+                    <label>
+                        <input
+                            type="checkbox"
+                            checked={!!node.attrs.required}
+                            onChange={(e) => updateAttributes({ required: e.target.checked })}
+                        />
+                        обязательное
+                    </label>
+                </div>
+            )}
         </NodeViewWrapper>
     )
 }
 
+/**
+ * Вставки, у которых досмотр измерим.
+ *
+ * Правило-близнец живёт на стороне платформы (`VideoEmbed.php` и
+ * `videoEmbed.js`) — там оно полное и по нему собирается разметка. Здесь
+ * нужно ответить только на вопрос «показывать ли автору настройку», поэтому
+ * достаточно узнать сервис по адресу.
+ */
+const MEASURABLE = /^https?:\/\/(www\.)?(youtube\.com\/embed\/|youtube-nocookie\.com\/embed\/|vk\.com\/video_ext\.php|vkvideo\.ru\/video_ext\.php|rutube\.ru\/play\/embed\/)/i
+
 const Iframe = Node.create({
     name: 'iframe',
     group: 'block',
@@ -365,6 +419,38 @@ const Iframe = Node.create({
                 parseHTML: (el) => el.getAttribute('data-node-id'),
                 renderHTML: (attrs) => ({ 'data-node-id': attrs['data-node-id'] }),
             },
+
+            /**
+             * Порог обязательного досмотра, проценты.
+             *
+             * Работает у YouTube, ВКонтакте и Rutube: их плееры сами сообщают
+             * позицию воспроизведения. У прочих вставок (документ Google,
+             * презентация, произвольная страница) измерять нечего — там порог
+             * автору не показывается.
+             *
+             * Считается сумма фактически проигранных отрезков, а не позиция
+             * ползунка: перемотал в конец — досмотра нет.
+             *
+             * null — порога нет. По умолчанию именно так: включённый задним
+             * числом порог закрыл бы ролики у тех, кто модуль давно прошёл.
+             */
+            threshold: {
+                default: null,
+                parseHTML: (el) => {
+                    const v = parseInt(el.getAttribute('data-threshold') || '', 10)
+
+                    return Number.isFinite(v) ? Math.min(100, Math.max(1, v)) : null
+                },
+                renderHTML: (attrs) =>
+                    (attrs.threshold ? { 'data-threshold': String(attrs.threshold) } : {}),
+            },
+
+            /** Обязательный блок: без него модуль не считается освоенным */
+            required: {
+                default: false,
+                parseHTML: (el) => el.getAttribute('data-required') === 'true',
+                renderHTML: (attrs) => (attrs.required ? { 'data-required': 'true' } : {}),
+            },
         }
     },