Skip to content

Commit

Permalink
Documentation: Adding Design patterns component category
Browse files Browse the repository at this point in the history
  • Loading branch information
@Garneauma @SebastianBurke
Garneauma authored and SebastianBurke committed Mar 6, 2024
1 parent 83fafff commit 980210e
Show file tree
Hide file tree
Showing 4 changed files with 226 additions and 29 deletions.
65 changes: 38 additions & 27 deletions Gruntfile.coffee
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ module.exports = (grunt) ->
"concat:common"
"concat:components"
"concat:templates"
"concat:designPatterns"
"concat:sites"
"concat:wet-boew"
"clean:wetboew_demos"
Expand Down Expand Up @@ -418,11 +419,13 @@ module.exports = (grunt) ->
dataComponents = grunt.file.readJSON( this.data.components )
dataCommons = grunt.file.readJSON( this.data.common )
dataTemplates = grunt.file.readJSON( this.data.templates )
dataDesignPatterns = grunt.file.readJSON( this.data.designPatterns )

a11yReportByComponent = processComponentReporting( grunt, "sites", dataSites, a11yReportByTestRequirement, acrReportByConformity, reportConf )
a11yReportByComponent = a11yReportByComponent.concat( processComponentReporting( grunt, "components", dataComponents, a11yReportByTestRequirement, acrReportByConformity, reportConf ) )
a11yReportByComponent = a11yReportByComponent.concat( processComponentReporting( grunt, "common", dataCommons, a11yReportByTestRequirement, acrReportByConformity, reportConf ) )
a11yReportByComponent = a11yReportByComponent.concat( processComponentReporting( grunt, "templates", dataTemplates, a11yReportByTestRequirement, acrReportByConformity, reportConf ) )
a11yReportByComponent = a11yReportByComponent.concat( processComponentReporting( grunt, "designPatterns", dataDesignPatterns, a11yReportByTestRequirement, acrReportByConformity, reportConf ) )


#
Expand Down Expand Up @@ -532,6 +535,7 @@ module.exports = (grunt) ->
sites: "_data/sites.json"
components: "_data/components.json"
templates: "_data/templates.json"
designPatterns: "_data/design-patterns.json"
common: "_data/common.json"
reporting: "_data/reporting.json"

Expand Down Expand Up @@ -560,11 +564,11 @@ module.exports = (grunt) ->
stripBanners: true
banner: "<%= banner %>"
src: [
"{sites,common,components,templates,wet-boew}/**/*.js"
"!{sites,common,components,templates,wet-boew}/**/test.js"
"!{sites,common,components,templates,wet-boew}/**/assets"
"!{sites,common,components,templates,wet-boew}/**/demo"
"!{sites,common,components,templates,wet-boew}/**/demos"
"{sites,common,components,templates,design-patterns,wet-boew}/**/*.js"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/test.js"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/assets"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/demo"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/demos"
]
dest: "<%= themeDist %>/js/theme.js"
common:
Expand All @@ -588,6 +592,13 @@ module.exports = (grunt) ->
separator: ","
src: "templates/**/index.json-ld"
dest: "_data/templates.json"
designPatterns:
options:
banner: "["
footer: "]\n"
separator: ","
src: "design-patterns/**/index.json-ld"
dest: "_data/design-patterns.json"
"wet-boew":
options:
banner: "["
Expand Down Expand Up @@ -723,14 +734,14 @@ module.exports = (grunt) ->
layouts:
expand: true
flatten: true
src: "{sites,components,templates,docs,wet-boew}/**/layouts/**.*"
src: "{sites,components,templates,design-patterns,docs,wet-boew}/**/layouts/**.*"
dest: "<%= jekyllDist %>/_layouts"
includes:
files: [
expand: true
src: [
"{sites,components,templates,wet-boew}/**/*-{includes,inc}/**.html"
"!{sites,components,templates,wet-boew}/**/includes/**.*"
"{sites,components,templates,design-patterns,wet-boew}/**/*-{includes,inc}/**.html"
"!{sites,components,templates,design-patterns,wet-boew}/**/includes/**.*"
]
dest: "<%= jekyllDist %>/_includes"
rename: (dest, src) ->
Expand All @@ -741,21 +752,21 @@ module.exports = (grunt) ->
,
expand: true
src: [
"{sites,components,templates,wet-boew}/**/includes/**.*"
"{sites,components,templates,design-patterns,wet-boew}/**/includes/**.*"
]
dest: "<%= jekyllDist %>/_includes"
rename: (dest, src) ->
dest + src.substring( src.indexOf('/') ).replace( '/includes/', '/' )
,
expand: true
src: "{sites,components,templates,wet-boew}/*/include.html"
src: "{sites,components,templates,design-patterns,wet-boew}/*/include.html"
dest: "<%= jekyllDist %>/_includes"
rename: (dest, src) ->
dest + "/" + src.replace( '/include.html', '.html' )
]
samples:
expand: true
src: "{sites,common,components,templates,wet-boew}/**/samples/**.*"
src: "{sites,common,components,templates,design-patterns,wet-boew}/**/samples/**.*"
dest: "_includes"
rename: (dest, src) ->
dest + "/" + src.replace( 'samples/', '' )
Expand All @@ -778,15 +789,15 @@ module.exports = (grunt) ->
expand: true
flatten: true
src: [
"{sites,common,components,templates,wet-boew}/**/fonts/**.*"
"{sites,common,components,templates,design-patterns,wet-boew}/**/fonts/**.*"
"!**/*.scss"
]
dest: "<%= themeDist %>/fonts"
assets:
expand: true
src: [
"{sites,common,components,templates,wet-boew}/**/assets/**.*"
"{sites,common,components,templates,wet-boew}/**/assets/**/*.*"
"{sites,common,components,templates,design-patterns,wet-boew}/**/assets/**.*"
"{sites,common,components,templates,design-patterns,wet-boew}/**/assets/**/*.*"
]
dest: "<%= themeDist %>/assets"
rename: (dest, src) ->
Expand All @@ -801,7 +812,7 @@ module.exports = (grunt) ->
depsJS_custom:
expand: true
flatten: true
src: "{sites,common,components,templates,wet-boew}/deps/**.js"
src: "{sites,common,components,templates,design-patterns,wet-boew}/deps/**.js"
dest: "<%= themeDist %>/deps-js"
depsJS:
expand: true
Expand Down Expand Up @@ -1065,13 +1076,13 @@ module.exports = (grunt) ->
quiet: true
all:
src: [
"{sites,common,components,templates,wet-boew}/**/*.js"
"{sites,common,components,templates,design-patterns,wet-boew}/**/*.js"
]
jsonlint:
all:
src: [
"{sites,common,components,templates,wet-boew}/**/*.json",
"{sites,common,components,templates,wet-boew}/**/*.json-ld"
"{sites,common,components,templates,design-patterns,wet-boew}/**/*.json",
"{sites,common,components,templates,design-patterns,wet-boew}/**/*.json-ld"
]
options: {
indent: "\t"
Expand All @@ -1082,7 +1093,7 @@ module.exports = (grunt) ->
all:
expand: true
src: [
"{sites,common,components,templates,wet-boew}/**/*.scss"
"{sites,common,components,templates,design-patterns,wet-boew}/**/*.scss"
"!*-jekyll.scss"
"!node_modules"
]
Expand All @@ -1102,7 +1113,7 @@ module.exports = (grunt) ->
"Rakefile"

# Folders
"{sites,common,components,templates,wet-boew}/**"
"{sites,common,components,templates,design-patterns,wet-boew}/**"

#
# Exemptions...
Expand All @@ -1112,17 +1123,17 @@ module.exports = (grunt) ->
"!Gemfile.lock"

# Web contents
"!{sites,common,components,templates,wet-boew}/**/*.md"
# "{sites,components,templates}/*/*.{md,html}"
# "{sites,components,templates}/*.{md, html}"
# "!{sites,components,templates}/*/**/*.{md,html}"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/*.md"
# "{sites,components,templatesdesign-patterns}/*/*.{md,html}"
# "{sites,components,templatesdesign-patterns}/*.{md, html}"
# "!{sites,components,templatesdesign-patterns}/*/**/*.{md,html}"

# Images
"!{sites,common,components,templates,wet-boew}/**/*.{jpg,png,ico}"
"!{sites,common,components,templates,wet-boew}/*.{ico,jpg,png}"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/*.{jpg,png,ico}"
"!{sites,common,components,templates,design-patterns,wet-boew}/*.{ico,jpg,png}"

# External fonts
"!{sites,common,components,templates,wet-boew}/**/*.{eot,svg,ttf,woff}"
"!{sites,common,components,templates,design-patterns,wet-boew}/**/*.{eot,svg,ttf,woff}"

# Docker environment file
# File that gets created/populated in a manner that goes against .editorconfig settings during the main Travis-CI build.
Expand Down
Empty file added design-patterns/.gitkeep
View file
Empty file.
95 changes: 94 additions & 1 deletion index-en.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ css:
<ul class="list-unstyled colcount-md-3">
<li><a href="#components"><span aria-hidden="true" class="fas fa-cube mrgn-rght-md"></span>Components</a></li>
<li><a href="#templates"><span aria-hidden="true" class="fas fa-table mrgn-rght-md"></span>Templates</a></li>
<li><a href="#designPatterns"><span aria-hidden="true" class="fas fa-th-large mrgn-rght-md"></span>Design patterns</a></li>
<li><a href="#experiment"><span aria-hidden="true" class="fas fa-puzzle-piece mrgn-rght-md"></span>Méli-mélo and thematics</a></li>
<li><a href="#sitesglobal"><span aria-hidden="true" class="fas fa-globe mrgn-rght-md"></span>Sites and global functionality</a></li>
<li><a href="#wetboew"><span aria-hidden="true" class="fas fa-cube mrgn-rght-md"></span>Wet-boew</a></li>
Expand All @@ -53,6 +54,9 @@ css:
<li class="mrgn-lft-md">
<a href="#templates" class="btn btn-link text-white"><span aria-hidden="true" class="fas fa-table mrgn-rght-sm"></span>Templates</a>
</li>
<li class="mrgn-lft-md">
<a href="#designPatterns" class="btn btn-link text-white"><span aria-hidden="true" class="fas fa-th-large mrgn-rght-sm"></span>Design patterns</a>
</li>
<li class="mrgn-lft-md">
<a href="#experiment" class="btn btn-link text-white"><span aria-hidden="true" class="fas fa-puzzle-piece mrgn-rght-sm"></span>Méli-mélo and thematics</a>
</li>
Expand Down Expand Up @@ -190,7 +194,7 @@ css:
</ul>
<hr />
<h2 id="templates" class="mrgn-bttm-lg pt-4">Templates</h2>
<ul class="row list-unstyled wb-eqht-grd wb-filter mrgn-tp-md"data-wb-filter='{ "selector": ">li" }'>
<ul class="row list-unstyled wb-eqht-grd wb-filter mrgn-tp-md pb-4" data-wb-filter='{ "selector": ">li" }'>
{% for template in site.data.templates %}
{% assign list-pages = template.pages %}
<li class="col-xs-12 col-md-6 mrgn-tp-md mrgn-bttm-md">
Expand Down Expand Up @@ -276,6 +280,95 @@ css:
</li>
{% endfor %}
</ul>
<hr />
<h2 id="designPatterns" class="mrgn-bttm-lg pt-4">Design patterns</h2>
<ul class="row list-unstyled wb-eqht-grd wb-filter mrgn-tp-md pb-4" data-wb-filter='{ "selector": ">li" }'>
{% for designPattern in site.data.design-patterns %}
{% assign list-pages = designPattern.pages %}
<li class="col-xs-12 col-md-6 mrgn-tp-md mrgn-bttm-md">
<div class="brdr-tp brdr-rght brdr-bttm brdr-lft hght-inhrt">
<h3 class="mrgn-tp-md mrgn-rght-md mrgn-bttm-md mrgn-lft-md">{{ designPattern.title[ page.language ] }}
{% if designPattern.status == "stable" %}
<span class="label label-success mrgn-lft-sm"><span class="wb-inv">State: </span>{{ comp_status[ designPattern.status ] }}</span>
{% elsif designPattern.status == "provisional" %}
<span class="label label-warning mrgn-lft-sm"><span class="wb-inv">State: </span>{{ comp_status[ designPattern.status ] }}</span>
{% elsif designPattern.status == "deprecated" %}
<span class="label label-danger mrgn-lft-sm"><span class="wb-inv">State: </span>{{ comp_status[ designPattern.status ] }}</span>
{% else %}
<span class="label label-default mrgn-lft-sm"><span class="wb-inv">State: </span>Undefined</span>
{% endif %}
</h3>
<div class="mrgn-rght-md mrgn-bttm-md mrgn-lft-md">
<p>{{ designPattern.description[ page.language ] | default: "[Short description of the design pattern]" }}</p>
<!--
Main working example
- First working example in the example list where the language match
-->
{% assign mainExamples = list-pages.examples | where: "language", page.language | first %}
<ul class="list-unstyled mrgn-bttm-lg mrgn-lft-md">
{% if mainExamples %}
<li>
{% if mainExamples.path %}
<a href="design-patterns/
{%- if designPattern.componentName -%}
{{ designPattern.componentName }}/
{%- endif -%}
{{ mainExamples.path }}" lang="{{ mainExamples.language }}" hreflang="{{ mainExamples.language }}"><span class="fas fa-eye small mrgn-rght-sm" aria-hidden="true"></span>Working example</a>
{% elsif mainExamples.url %}
<a href="{{ mainExamples.url }}" lang="{{ mainExamples.language }}" hreflang="{{ mainExamples.language }}"><span class="fas fa-eye small mrgn-rght-sm" aria-hidden="true"></span>Working example</a>
{% else %}
<span class="fas fa-eye small mrgn-rght-sm" aria-hidden="true"></span>Working example
{% endif %}
{% endif %}
<!--
Documentation
- Link to the documentations if any
-->
{% if list-pages.docs %}
<!--<ul class="list-unstyled mrgn-bttm-lg mrgn-lft-md">-->
{% assign docs = list-pages.docs | where: "language", page.language %}
{% for doc in docs %}
<li><a href="design-patterns/{{ designPattern.componentName }}/{{ doc.path }}"><span class="fas fa-info-circle small mrgn-rght-sm" aria-hidden="true"></span>Documentation</a></li>
{% endfor %}
{% endif %}
<li><a href="https://github.com/wet-boew/GCWeb/tree/master/design-patterns/{{ designPattern.componentName }}" hreflang="en"><span class="fas fa-code small mrgn-rght-sm" aria-hidden="true"></span>Source code</a></li>
</ul>
<!--
> All examples and info
* Example
* Documentation
* Spec
-->
<details class="mrgn-tp-lg"><summary>All examples and info</summary>
<ul class="list-unstyled">
{% for pgGroup in list-pages %}
{% assign grpkey = pgGroup[0] %}
<li>{{ page_group[ grpkey ] | default: "Unknown group" }}
<ul>
{% assign examples = pgGroup[1] %}
{% for example in examples %}
{% if example.path %}
<li><a href="design-patterns/
{%- if designPattern.componentName -%}
{{ designPattern.componentName }}/
{%- endif -%}
{{ example.path }}" {% if example.language != page.language %}lang="{{ example.language }}" hreflang="{{ example.language }}"{% endif %}>{{ example.title }}</a></li>
{% elsif example.url %}
<li><a href="{{ example.url }}">{{ example.title }}</a></li>
{% else %}
<li>{{ example.title }}</li>
{% endif %}
{% endfor %}
</ul>
</li>
{% endfor %}
</ul>
</details>
</div>
</div>
</li>
{% endfor %}
</ul>
</div>
<div class="container-fluid">
<div class="row">
Expand Down
Loading

0 comments on commit 980210e

Please sign in to comment.