public/javascripts/components/rules.js

   1 // Load rules on variant page
   2 Vue.component('my-rules', {
   3     data: function() {
   4         return { content: "" };
   5     },
   6     template: `
   7         <div class="col-sm-12 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
   8             <div v-html="content" class="section-content"></div>
   9         </div>
  10     `,
  11     mounted: function() {
  12         // AJAX request to get rules content (plain text, HTML)
  13         ajax("/rules/" + variant, "GET", response => {
  14             let replaceByDiag = (match, p1, p2) => {
  15                 const args = this.parseFen(p2);
  16                 return getDiagram(args);
  17             };
  18             this.content = response.replace(/(fen:)([^:]*):/g, replaceByDiag);
  19         });
  20     },
  21     methods: {
  22         parseFen(fen) {
  23             const fenParts = fen.split(" ");
  24             return {
  25                 position: fenParts[0],
  26                 marks: fenParts[1],
  27                 orientation: fenParts[2],
  28                 shadow: fenParts[3],
  29             };
  30         },
  31     },
  32 })