bem-archive / bem-site-engine

BEM CMS based on Express framework.
25 stars 8 forks source link

Correct links on docs in showcase #169

Closed gela-d closed 9 years ago

gela-d commented 9 years ago

@tavriaforever @tormozz48

tadatuta commented 9 years ago

let's make a generic solution to have possibility to render any bundle from any library?

gela-d commented 9 years ago

@tadatuta main problem in bundles such this - we haven't on bem.info level "common". Yesterday, we talking about ways to make generic solution, but in this case, this is generic solution for showcase pages, not for all bundles.

gela-d commented 9 years ago

@tormozz48 update

tadatuta commented 9 years ago

general idea for PR: we already spent a lot of time fixing bugs in current link replacer on bem.info. why writing something new on regexps again?

we can:

  1. use parsers to get links in source code instead of regexps
  2. use uri to parse and change links instead of regexps
  3. write helpers to solve common tasks like rewrite links in any lib bundle
gela-d commented 9 years ago

we can:

  1. use parsers to get links in source code instead of regexps
  2. use uri to parse and change links instead of regexps
  3. write helpers to solve common tasks like rewrite links in any lib bundle

Maybe, it's a task to @tormozz48 in case refactoring bse-admin, not in this issue?

tormozz48 commented 9 years ago

"general idea for PR: we already spent a lot of time fixing bugs in current link replacer on bem.info. why writing something new on regexps again?

we can:

  1. use parsers to get links in source code instead of regexps
  2. use uri to parse and change links instead of regexps
  3. write helpers to solve common tasks like rewrite links in any lib bundle "

You are dreamer

tormozz48 commented 9 years ago

@gela-d :ok:

tadatuta commented 9 years ago

You are dreamer

what exactly sounds so hard?

For me it looks like this:

modules.require('uri', function(Uri) {

var fs = require('fs'),
    htmlparser2 = require('htmlparser2'),
    htmlParser = new htmlparser2.Parser({
        onopentag: function(name, attrs) {
            if (name !== 'a' || !attrs.href) return;
            replaceLink(attrs.href);
        }
    });

var testFile = fs.readFileSync('./desktop.bundles/index/index.html', 'utf8');

htmlParser.write(testFile);
htmlParser.end();

function replaceLink(link) {
    console.log(Uri.parse(link));
    // call helpers for each type of replacement here
}

});

So for such file

<!DOCTYPE html>

<html class="ua_js_no">
<head>
    <meta charset="utf-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">

    <title>Title of the page</title>
    <script>
(function(e,c){e[c]=e[c].replace(/(ua_js_)no/g,"$1yes");})(document.documentElement,"className");(function(d,n){d.documentElement.className+=" ua_svg_"+(d[n]&&d[n]("http://www.w3.org/2000/svg","svg").createSVGRect?"yes":"no");})(document,"createElementNS");
    </script>
    <meta content="" name="description">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <link href="_index.css" rel="stylesheet">
    <link href="/favicon.ico" rel="shortcut icon">
</head>

<body class="page page_theme_islands">
    test<a href="http://ya.ru/bla/?q=1#ancor">link</a><a href=
    "//ya.ru/bla/?q=2#ancor">link</a><a href="/bla/?q=3#ancor">link</a><a href=
    "bla/?q=4#ancor">link</a>test<script src="_index.js"></script>
</body>
</html>

You'll get such parsed objects:

{ uriParts:
   { source: 'http://ya.ru/bla/?q=1#ancor',
     protocol: 'http',
     authority: 'ya.ru',
     userInfo: '',
     user: '',
     password: '',
     host: 'ya.ru',
     port: '',
     relative: '/bla/?q=1#ancor',
     path: '/bla/',
     directory: '/bla/',
     file: '',
     query: 'q=1',
     anchor: 'ancor' },
  queryParams: { q: [ '1' ] } }
{ uriParts:
   { source: '//ya.ru/bla/?q=2#ancor',
     protocol: '',
     authority: 'ya.ru',
     userInfo: '',
     user: '',
     password: '',
     host: 'ya.ru',
     port: '',
     relative: '/bla/?q=2#ancor',
     path: '/bla/',
     directory: '/bla/',
     file: '',
     query: 'q=2',
     anchor: 'ancor' },
  queryParams: { q: [ '2' ] } }
{ uriParts:
   { source: '/bla/?q=3#ancor',
     protocol: '',
     authority: '',
     userInfo: '',
     user: '',
     password: '',
     host: '',
     port: '',
     relative: '/bla/?q=3#ancor',
     path: '/bla/',
     directory: '/bla/',
     file: '',
     query: 'q=3',
     anchor: 'ancor' },
  queryParams: { q: [ '3' ] } }
{ uriParts:
   { source: 'bla/?q=4#ancor',
     protocol: '',
     authority: '',
     userInfo: '',
     user: '',
     password: '',
     host: '',
     port: '',
     relative: 'bla/?q=4#ancor',
     path: 'bla/',
     directory: 'bla/',
     file: '',
     query: 'q=4',
     anchor: 'ancor' },
  queryParams: { q: [ '4' ] } }

and possibility to change any part of a link with handy methods of uri module.

Sure that'll take some time but then you may easily write tests for each helper and get rid of a lot of regexps.