Fix handles and text editor

.pk-config.yml

@@ -26,6 +26,7 @@ categories:
     - Layout
     - Component
     - Atom
+body_attr:
 assets:
   css:
   js:

CHANGELOG-1.x.md

@@ -1,6 +1,20 @@
-## 1.2 Minor style tweaks and functionality additions (2017-03-09)
+## 1.3.1 Additional config features (2020-04-28)
 
-Tag: [1.2](https://github.com/PatternBuilder/pattern-kit/releases/tag/V1.2)
+Tag: [1.3.1](https://github.com/PatternBuilder/pattern-kit/releases/tag/1.3.1)
+
+- Add support for body attributes in the config
+- Update documentation
+- Update styles for squishy-window indicators for usability
+
+## 1.3.0 Documentation style updates (2017-03-14)
+
+Tag: [1.3.0](https://github.com/PatternBuilder/pattern-kit/releases/tag/1.3.0)
+
+- Add font family, colors, spacing, etc. to styleguide. Cleaned up some extra scrollbars, set a max width on the content area of the docs area.
+
+## 1.2.0 Minor style tweaks and functionality additions (2017-03-09)
+
+Tag: [1.2.0](https://github.com/PatternBuilder/pattern-kit/releases/tag/1.2.0)
 
 - Change rendering of the styleguide documentation to lean on bootstrap column grid
 - Add logic to render only the tabs that work for a particular atom based on what data is present
@@ -12,9 +26,9 @@ Tag: [1.2](https://github.com/PatternBuilder/pattern-kit/releases/tag/V1.2)
 - Update jQuery package to reference CDN for consistency
 
 
-## 1.0 support-at-data-and-yaml (2016-08-01)
+## 1.1 support-at-data-and-yaml (2016-08-01)
 
-Tag: [1.0](https://github.com/PatternBuilder/pattern-kit/tree/V1.1)
+Tag: [1.1](https://github.com/PatternBuilder/pattern-kit/tree/V1.1)
 
 Now supporting YAML files for docs using the same basename as JSON. Also supporting @data to reference other component's doc data file. So @component would import component.docs.json or component.docs.yaml into your data file.
 

README.md

@@ -1,8 +1,8 @@
 # Pattern Kit
 
-Pattern Kit is an application that lets you preview your library of templates and manipulate their content by interacting with a form built from the schemas. It is both a development tool and a public facing pattern library.
+Pattern Kit is an application that lets you preview your library of templates and manipulate their content by interacting with a form built from the schemas. It is both a development tool and a public-facing pattern library.
 
-For a demo check out [Pattern Kit Demo](http://patternkit.info/sg/). 
+For a demo check out [Pattern Kit Demo](https://webrh-patternkit.int.open.paas.redhat.com/).  
 
 # Installation
 
@@ -38,6 +38,7 @@ $app['http_cache']->run();
 - Create arrays of paths to your data, schema, template, docs and styleguide files (relative to config)
 - Set the file extensions for each file type
 - List categories in order you'd like them to appear in navigation
+- Add any attributes you want printed on the body tag using `body_attr`
 - Create arrays of assets for css, js and footer js (including live reload if necessary)
 
 ```
@@ -62,11 +63,17 @@ extensions:
   docs: .docs.md
   sg: .sg.md
 categories:
-    - Pattern
-    - Sub Pattern
-    - Layout
-    - Component
-    - Atom
+  - Pattern
+  - Sub-pattern
+  - Layout
+  - Component
+  - Atom
+body_attr:
+  - unresolved
+  - id: main
+  - class:
+    - foo
+    - bar
 assets:
   css:
     - path/to/css

resources/templates/_pattern-kit-app.twig

@@ -21,11 +21,11 @@
 	<script type="text/javascript" src="{{vendor_path}}web/js/lzstring.js"></script>
 	<script src="https://cdn.jsdelivr.net/interact.js/1.2.8/interact.min.js"></script>
 	<script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/sceditor/1.4.3/jquery.sceditor.bbcode.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/minified/jquery.sceditor.bbcode.min.js"></script>
 	<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/ace.js"></script>
 	<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/mode-html.js"></script>
-	<script src="https://cdn.jsdelivr.net/sceditor/1.4.3/jquery.sceditor.xhtml.min.js"></script>
-	<link rel="stylesheet" href="//cdn.jsdelivr.net/sceditor/1.4.3/themes/default.min.css">
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/minified/jquery.sceditor.xhtml.min.js"></script>
+	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/minified/themes/default.min.css">
 </head>
 <body>
 

resources/templates/basic.twig

@@ -1,3 +1,22 @@
+{% set body_props %}
+    {%- if app_config.body_attr -%}
+        {% for attr in app_config.body_attr -%}
+            {% if attr is iterable -%}
+                {% for key in attr|keys %}
+                    {% if attr[key] is iterable -%}
+                        {% set items %}
+                            {% for item in attr[key] %} {{ item }}{% endfor %}
+                        {% endset %}
+                    {% elseif attr[key] is same as(false) or attr[key] is same as(true) %}
+                        {% set items = attr[key] ? "true" : "false" %}
+                    {% else %}{% set items = attr[key]|trim %}{% endif %}
+                    {{ key }}="{{ items|trim }}"
+                {% endfor %}
+            {% else %} {{ attr }}{% endif %}
+        {%- endfor %}
+    {% endif -%}
+{% endset -%}
+
 <!DOCTYPE html>
 <html>
 <head>
@@ -12,7 +31,7 @@
         <script type="text/javascript" src="{{js}}"></script>
     {% endfor %}
 </head>
-<body>
+<body{{ body_props }}>
     <div id="snippet" data-default-overflow="scroll">
         {% if (name) or (template) %}
             {% include template ?: name ~ '.twig' %}
@@ -23,5 +42,8 @@
 {% for js in app_config.assets.footer_js %}
    <script type="text/javascript" src="{{js}}"></script>
 {% endfor %}
+{% for js in app_config.assets.footer_module_js %}
+   <script type="module" src="{{js}}"></script>
+{% endfor %}
 </body>
 </html>