список персонажей на сцене

js/script.js

@@ -10,6 +10,7 @@ saveChoice = function(index) {
 };
 
 function listCharacters (paragraphs) {
+  console.log(paragraphs)
   const chars = [
     {
       match: "Я:",
@@ -20,17 +21,11 @@ function listCharacters (paragraphs) {
       title: "🙍‍♀️"
     }
   ]
-  let output = ""
-  for (let i = 0; i < paragraphs.length; i++) {
-    const p = paragraphs[i];
-    if (p.length < 3) {
-      continue;
-    }
-    for (let j = 0; j < chars.length; j++) {
-      const e = chars[j];
-      if (p.match(e.match)) {
-        output += e.title
-      }
+  let output = "<p>На сцене:</p>"
+  for (let j = 0; j < chars.length; j++) {
+    const e = chars[j];
+    if (paragraphs.match(e.match)) {
+      output += "<p>"+e.title+"</p>"
     }
   }
   return output.trim()
@@ -47,16 +42,11 @@ displayText = function(s, interactive = true) {
     results.push((function() {
       let j, len, results1;
       results1 = [];
-      const characters = listCharacters(paragraphs);
       for (j = 0, len = paragraphs.length; j < len; j++) {
         i = paragraphs[j];
         if (i !== "") {
           i = i.replace('<st>', '<span class="subtitle">');
           i = i.replace('</st>', '</span>');
-          i = i.replace('<ang>', '<span class="portrait">🙍‍♀️</span>');
-          if (characters.trim().length > 0) {
-            i = '<span class="portrait">'+characters.trim()+'</span>' + i.trim()
-          }
           html = jQuery.parseHTML(i);
           block = jQuery('<p>').html(html);
           if (interactive) {
@@ -84,6 +74,10 @@ continueToNextChoice = function(s) {
   displayText(s, true);
   scrollTo = jQuery('#options').offset().top;
   if (s.currentChoices.length > 0) {
+    const characters = listCharacters(jQuery("#content").text());
+    if (characters.trim().length > 0) {
+      jQuery("#content").prepend('<div class="portraits">'+characters.trim()+'</div>')
+    }
     jQuery("#options").html("").hide();
     ref = s.currentChoices;
     for (j = 0, len = ref.length; j < len; j++) {

scss/style.scss

@@ -115,3 +115,8 @@ h2 {
 .portrait {
   font-size: ($font-size-base * 1.5);
 }
+
+.portraits {
+  float: right;
+  margin: ($font-size-base * 0.5);
+}