Package meta

import "gitlab.com/zoralab/bissetii/pkg/components/internal/meta"

Package meta is the full package for rendering all compatible <meta>.

The HTML template codes are written in Go’s string format under the corresponding group. This allows one to embed the HTML codes instead of parsing it from file.

Constants

All Bissetii Compressed Compiled CSS

const (
	CSSAMP        = ``

	CSSCritical   = ``

	CSSTablet     = ``

	CSSDesktop    = ``

	CSSWidescreen = ``

	CSSPrint      = ``
)

Constants for managing the package as a whole.

const (
	// Name is the block name (`{{- define "this-name" -}}`).
	Name = "meta"

	// AMPName is the AMP HTML block name.
	AMPName = root.AMPPrefix + Name
)

Head are the leading meta tags for HTML page <head> section.

const (
	// HTMLHead is the leading `<meta>` tags for vanilla HTML.
	HTMLHead = `
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
`

	// AMPHTMLHead is the leading `<meta>` tags for AMP HTML.
	AMPHTMLHead = `
<meta charset="utf-8" />
<script async src="https://cdn.ampproject.org/v0.js"></script>
`
)

AMP Modules are amp-specific metas for AMP HTML output.

const (
	// AMPBoilerplate is the AMP required boilerplate codes in
	// AMP HTML.
	AMPBoilerplate = `<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
`

	// AMPExtensions are to render the list of selected AMP JS
	// modules.
	AMPExtensions = `
{{- range $name := .Page.Extensions }}

	{{- if eq $name "sidebar" }}
<script async

	custom-element="amp-sidebar"

	src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js">
</script>

	{{- end }}

	{{- if eq $name "google-analytics" }}
<script async

	custom-element="amp-analytics"

	src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js">
</script>

	{{- end }}

	{{- if eq $name "form" }}
<script async

	custom-element="amp-form"

	src="https://cdn.ampproject.org/v0/amp-form-0.1.js">
</script>

	{{- end }}

	{{- if eq $name "carousel" }}
<script async

	custom-element="amp-carousel"

	src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js">
</script>

	{{- end }}

	{{- if eq $name "iframe" }}
<script async

	custom-element="amp-iframe"

	src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js">
</script>

	{{- end }}
{{- end }}
`
)

Commons are the common <meta> tags used across all HTML output types.

const (
	// General specifies critical page `<meta>` information.
	General = `
<meta name="viewport"

	content="width=device-width,minimum-scale=1,initial-scale=1"/>
<meta name="description" content="{{- .Page.Description -}}" />
{{ if .Page.Keywords -}}
<meta name="keywords" content="{{- .Page.Keywords -}}" />
{{- end }}
{{ if .Page.Authors -}}
<meta name="author" content="{{- .Page.Creators -}}" />
{{- end }}
{{- if .Page.Format }}
<link rel="{{- .Page.Format.Rel -}}" href="{{- .Page.Format.URL -}}"

	{{- if .Page.Format.Type }}

	type="{{- .Page.Format.Type -}}"

	{{- end }} />
{{- end }}
`

	// Alternative.Formats are the list of alternative viewing
	// format.
	AlternativeFormats = `
{{- range .Page.Alternative.Formats }}
<link rel="{{- .Rel -}}" type="{{- .Type -}}" href="{{- .URL -}}" />
{{- end }}
`

	// Alternative.Languages are the list of alternative
	// translated content.
	AlternativeLanguages = `
{{- range .Page.Alternative.Languages }}
<link rel="alternate" hreflang="{{- .Code -}}" href="{{- .URL -}}" />
{{- end }}
`

	// Robots are the list of specific SEO robots crawler rules.
	Robots = `
{{- range $robot, $rules := .Page.Robots -}}
        <meta name="{{- $robot -}}" content="{{ $rules }}" />
{{ end -}}
`

	// Favicons are the list of associated favicon links
	Favicon = `
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192"  href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
`
)

3rd-party specific metas for sharing across various platforms

const (
	// Twitter meta tags are specific to Twitter
	Twitter = `
{{- if .Vendor.Twitter.Cards.Card }}
<meta name="twitter:card" content="{{- .Vendor.Twitter.Cards.Card -}}" />

	{{- if .Vendor.Twitter.Cards.Username }}
<meta name="twitter:site" content="{{- .Vendor.Twitter.Cards.Username -}}" />

	{{- end }}

	{{- if .Page.Creators }}
<meta name="twitter:creator" content="{{- .Page.Creators -}}" />

	{{- end }}
{{- end }}
`

	// OpenGraph meta tags are for general parsing
	OpenGraph = `
<meta property="og:site_name" content="{{ .Page.Site.Title }}" />
<meta property="og:title" content="{{ .Page.Title }}" />
<meta property="og:locale" content="{{- .Page.Language.Code -}}" />
{{- range .Page.Alternative.Languages }}
<meta property="og:locale:alternate" content="{{- .Code -}}" />
{{- end }}
<meta property="og:description" content="{{ .Page.Description }}" />
<meta property="og:type" content="website" />
<meta property="og:url" content="{{ .Page.Link.URL }}" />
{{- range $x := .Page.Thumbnails -}}

	{{- if $x.SourceURL }}
<meta property="og:image" content="{{- $x.SourceURL -}}"/>

		{{- if $x.Type }}
<meta property="og:image:type" content="{{- $x.Type -}}" />

		{{- end }}

		{{- if $x.Width }}
<meta property="og:image:width" content="{{- $x.Width -}}" />

		{{- end }}

		{{- if $x.Height }}
<meta property="og:image:height" content="{{- $x.Height -}}" />

		{{- end }}

		{{- if $x.AltText }}
<meta property="og:image:alt" content="{{- $x.AltText -}}" />

		{{- end }}

	{{- end -}}
{{- end }}
`

	// Schema.org json meta tag for simplifying page content
	// parsing
	SchemaOrg = `
<script type="application/ld+json">
{

	{{- $notFirst := "" -}}

	{{- range $label, $value := .Page.Schema -}}

		{{- if $notFirst -}}, {{ end -}}

		"{{- $label -}}": {{ $value -}}

		{{- $notFirst = "true" -}}

	{{- end -}}
}
</script>

`
)

Dependencies are the dependent codes for building independent template.

This is useful for rendering portable template usage like Hugo partials where they do not share a common definition source.

const (
	// DepHTML is the vanilla HTML output type.
	DepHTML = ``

	// DepAMPHTML is the Accelerated Mobile Pages HTML output
	// type.
	DepAMPHTML = ``
)

Full HTML codes for rendering templates without needing to parse file.

const (
	// HTML is the vanilla HTML output type.
	HTML = HTMLHead +

		General +

		AlternativeFormats +

		AlternativeLanguages +

		Robots +

		Favicon +

		Twitter +

		OpenGraph +

		SchemaOrg +

		GoogleAnalytics

	// AMPHTML is the Accelerated Mobile Pages HTML output type.
	AMPHTML = AMPHTMLHead +

		AMPExtensions +

		General +

		AlternativeFormats +

		AlternativeLanguages +

		Robots +

		Favicon +

		Twitter +

		OpenGraph +

		AMPBoilerplate +

		SchemaOrg
)

Analytics are metas related to page telemetrics and user experience tools

const (
	GoogleAnalytics = `
{{- if .Vendor.Google.Analytics.ID }}
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', '{{- .Vendor.Google.Analytics.ID -}}', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
{{- end }}
`
)

Alternative

type Alternative struct {
	Languages []*Language
	Formats   []*Format
}

Alternative is the list of alternatives for the Page structure.

Data

type Data struct {
	Page    *Page
	Section *Page
	Vendor  *Vendor
}

Data is the full meta data structure for filling this component.

Date

type Date struct {
	Created   string
	Published string
	Modified  string
}

Date is the date dataset for the Page structure.

Format

type Format struct {
	Name string
	Type string
	Rel  string
	URL  string
}

Format is the alternative page format for the Page structure.

Language

type Language struct {
	Code   string
	Prefix string
	URL    string
}

Language is the language dataset for the Page structure.

Page

type Page struct {
	Title       string
	Level       string // title heading level
	Site        *Site
	Creators    string
	Authors     string
	Publishers  string
	Type        string
	Date        *Date
	Link        *anchor.Data
	Description string
	Keywords    string
	Format      *Format
	Language    *Language
	Alternative *Alternative
	Thumbnails  []*image.Data
	Robots      map[string]string
	Schema      map[string]interface{}
	Content     string
	Copyright   string
	Extensions  []string

	// Nav data elements (possible recursive iterations)
	Pre      string
	UID      string
	Children []*Page
}

Page is the page data structure.

Site

type Site struct {
	Title string // hugo: .Site.Title
}

Site is the site-level data structure for Page structure.

Vendor

type Vendor struct {
	Twitter *twitter.Data
	Google  *google.Data
}

Vendor is the 3rd-party vendor data structure.