Arduino Slovakia - Farewell to Python III

I have to hurry to convert my blog, because Google is pushing us to upgrade or a completely switch to a different environment. The closest to me is javascript and NodeJS. I have worked hard on the project in previous weeks and I have already finished some parts of the blog. I've finished the homepage, blog view, page view, and blog index. Everything is still slightly unfinished, but fully functional.

Python

I told myself it was time to show, how I had made the original blog. For example, this is a sample of the code that generated a specific blog page.

class SingleArticleUrlBlogHandler(webapp2.RequestHandler):
    def get(self, year, month, path):
        template_values = {
            'caption': u'Arduino Slovakia',
            'description': u'Zápisník experimentátora',
            'path': self.request.path,
            'showadd': True
        }

        # nastavenie jazyka stranky
        lang = self.request.get('lang')
        if lang not in ['sk', 'cs', 'en']:
            lang = 'sk'

        a = Article.geturl_translated(year + "/" + month + "/" + path, lang)
        if a is None:
            self.response.set_status(404)
            self.response.write("404 Page Not Found!")
            return

        if a.has_parent:
            pl = parent.ParentList()
            a.parent_url = pl.translate_url(a.parent_name)
            a.parent_name = pl.translate_name(a.parent_name)

        template_values['bol_preklad'] = a.bol_preklad
        template_values['article'] = a
        template_values['caption'] = a.title
        template_values['render'] = 'article'
        template_values['lang'] = lang
        if lang == 'sk':
            template_values['canonical'] = '/blog/' + year + '/' + month + '/' + path
        else:
            template_values['canonical'] = '/blog/' + year + '/' + month + '/' + path + '?lang=' + lang
        funkcie.tlang = template_values['lang']
        template_values['languages'] = funkcie.get_languages(a.languages, self.request)
        template_values['menu'] = menu.get_menu(template_values['lang'])
        hidden = self.request.get('hidden')
        template_values['hidden'] = hidden
        if hidden == '1':
            template_values['showadd'] = False

        # ziskanie zoznamu suborov
        template_values['uploads'] = self.get_download(a.download)

        # upravenie menu
        template_values['menu'] = self.modify_menu(template_values['menu'], a)

        # YouTube
        if a.jason:
            data = json.loads(a.jason)
            if 'youtube' in data:
                yl = []
                y = data['youtube']
                # logging.info(y)
                if isinstance(y, list):
                    yl = y
                    # logging.info('list')
                if isinstance(y, basestring):
                    yl.append(y)
                if len(yl):
                    template_values['youtube'] = yl

        template = JINJA_ENVIRONMENT.get_template('blog.html')
        self.response.write(template.render(template_values))

Javascript

And this is a sample of new code that does the same thing. Not everything is implemented there, and I won't implement some of the original features of the blog.

router.get(/\/blog\/(.+)/, async function (req, res, next) {
  let bl = new BlogLoader();
  let mn = new MenuLoader();

  try {
    let article = await bl.get(req.language, req.params[0]);
    let tpl = await bl.getView('blog.html');
    let ptpl = await bl.getViewPartials(tpl);
    let data = {
      title: article.title,
      description: 'Zápisník experimentátora',
      language: req.language,
      lang: bl.getLang(article),
      article: article,
      menu: await mn.get(req.language)
    };

    if (article.body.indexOf('</code>') != -1)
      data.highlighter = true;

    let r = mustache.render(tpl, data, ptpl, ['[[', ']]']);
    res.setHeader('Content-type', 'text/html');
    res.send(r);
  } catch (error) {
    console.error(error.message);
    res.status(400).json({ error: error.message });
  }
});

And one more code snippet that takes the contents of the original blog from Datastore and translates and modifies the content to be compatible with Bootstrap 5.

get(language, url) {
    return new Promise(async (resolve, reject) => {
      let query = this.datastore.createQuery('Article')
        .filter('url', url);

      try {
        let [q] = await this.datastore.runQuery(query);
        if (q.length == 0)
          reject(new Error(`Article '${language}.${url}'`));

        if (language != 'sk') {
          let queryt = this.datastore.createQuery('ArticleTranslation')
            .filter('language', language)
            .filter('active', true)
            .filter('page', q[0][this.datastore.KEY]);
          let [qt] = await this.datastore.runQuery(queryt);
          if (qt.length) {
            q[0].title = qt[0].title_translated;
            q[0].body = qt[0].body_translated;
            q[0].created_when = qt[0].created_when;
            q[0].modified_when = qt[0].modified_when;
            q[0].published_when = qt[0].modified_when;
          }
        }

        let s = q[0].body;
        s = s.replace(/center-block img-responsive/g, 'img-fluid rounded-3 shadow');
        s = s.replace(/width:640px/g, '');
        q[0].body = s;
        resolve(q[0]);

      } catch (error) {
        reject(error);
      }
    });
  }

I use the Mustache template system to create content, and a sample template in Mustache might look like this.

<!DOCTYPE html>
<html lang="[[language]]">

<head>
  [[>header-head]]
</head>

<body>
  <div class="container">
    [[>header-body]]
    <div class="row">
      <div class="col-sm-9">
        [[&article.body]]
      </div>
      <div class="col-sm-3">
        <h3>Menu</h3>
        [[>menu]]
      </div>
    </div>

    [[>footer]]
  </div>
</body>

</html>

09.11.2021