convert-indentation-to-list.js

by Andrea Ercolino

HTML

<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<div class="IndentationToTogglingList" data-expand="['client/apps/', 'client/shared/']">
<pre>
client/
  apps/
    auth/
      components/
        login/
          login.html
          login.js
        register/
          register.html
          register.js
      index/
        index.css
      index.html
      shared/
        config.js
        modules/
        services/
      start.js
    core/
  bower_components/
  docs/
  shared/
    config.js
    modules/
    services/
      authentication.service.js
      base64.service.js
      flash.service.js
      storage.service.js
    my-project.js
    routes.js
</pre>
</div>

CSS

ol.Directory {
  line-height: normal;
}
ol.Directory li
{
  list-style: none;
}
ol.Directory li label
{
  color:navy;
}
ol.Directory li label.ToggleOnClick
{
  cursor: pointer;
  font-weight: 600;
}

JavaScript

jQuery(function($) {

    'use strict';
    IndentationToTogglingList();
    return;

    function IndentationToList(options) {

        return Main(options);


        function Interpolate(template, variables) {
            var names = Object.keys(variables);
            var result = template;
            for (var i = 0, iTop = names.length; i < iTop; i++) {
                var name = names[i];
                var value = variables[name];
                var re = RegExp('\\b' + name + '\\b', 'g');
                result = result.replace(re, value);
            }
            return result;
        }

        function Parse(lineText, lineNumber, indent) {
            var aux = lineText.split(indent);
            var result = {
                'level': aux.length - 1,
                'label': aux.pop(),
                'line': lineNumber
            };
            return result;
        }

        function InitOptions(options) {
            var defaultOptions = {
                indent: '  ',
                templates: {
                    folder: '<li class="folder"> <label class="ToggleOnClick" for="ID">FOLDER</label> <ol>CONTENT</ol> </li>',
                    file: '<li class="File">FILE</li>',
                    folderWithoutContent: '<li class="Folder"><label for="ID">FOLDER</label></li>',
                    contentWithoutFolder: '<ol class="Directory">CONTENT</ol>'
                },
                text: ''
            };
            if (options.constructor.name !== 'Object') {
                options = {
                    text: String(options)
                };
            }
            var result = {
                indent: options.indent || defaultOptions.indent,
                templates: options.templates || defaultOptions.templates,
                text: options.text
            };
            return result;
        }

        function InitLines(text) {
            var result = text.
            replace('\r\n', '\n'). // remove double line...