// cjs
const {metapatcher} = require('metapatcher')

// es
import {metapatcher} from 'metapatcher'

// script tag, window.metapatcher
<script src="https://cdn.jsdelivr.net/npm/metapatcher@3/dist/metapatcher.iife.js" crossorigin type="text/javascript"></script>

// default settings
const settings = {
  structuredData: {enabled: true},
  androidChromeIcons: {enabled: true},
  msTags: {enabled: true},
  safariTags: {enabled: true},
  appleTags: {enabled: true},
  openGraphTags: {enabled: true},
  twitterTags: {enabled: true},
  facebookTags: {enabled: true}
}
// no need to run configure if you are okay with the default settings
metapatcher.configure(settings)

// injects favicon and returns the dom element
metapatcher.setFavicon('/path/favicon.ico')

// set application name, url and logo across devices and browsers
// returns self
metapatcher.setProjectMeta({
  name: 'Sample App',
  url: 'https://frondjs.org',
  logo: '/path/logo.png',
  primaryColor: '#333333',
  backgroundColor: '#ffffff'
})

// set robots directives, returns the node element
metapatcher.robots('noindex')
metapatcher.robots('index, nofollow')
// reference for google can be found at:
// https://developers.google.com/search/reference/robots_meta_tag

// prioritize loading resources, returns the node element
metapatcher.prioritize('https://frondjs.org', 'preconnect')
metapatcher.prioritize('https://frondjs.org', 'dns-prefetch')
metapatcher.prioritize('/some/page', 'prefetch')
metapatcher.prioritize('/some/path/sample.css', 'preload')
// remove all prioritizations
metapatcher.removeAllPrioritizations()

// document title, meta name and description, social media, canonical, hreflang
// and other applicable tags
// returns self
metapatcher.setPageMeta({
  title: 'Home',
  description: 'This is home.',
  url: 'https://frondjs.org',
  image: '/path/cover.jpg',
  locale: 'tr_TR',
  localVersions: {
    'en_US': 'https://frondjs.org/en-us'
  },
  canonicals: [
    'https://www.frondjs.org'
  ]
})

// if you would like to patch canonicals seperately
metapatcher.setCanonical('https://www.frondjs.org') // returns element
metapatcher.setCanonical('https://www.frondjs.org/home')
// and remove all of them
metapatcher.removeAllCanonicals() // returns self

// if you would like to patch local version tags seperately
metapatcher.setLocalVersion('tr_TR', url, isActiveLocale = false) // returns self
// isActiveLocale indicates that the locale in the first argument is
// equal to the current locale of the page
metapatcher.setLocalVersion('en_US', url2, true)
// and remove all
metapatcher.removeAllLocalVersions()

const elem = metapatcher.set(tag, identifierAttr = undefined, attrs = {})

// three example below will create meta name=$1 content=$2 tags.
metapatcher.set('meta', 'name', {name: 'viewport', content: 'width=device-width, initial-scale=1, viewport-fit=cover'})
metapatcher.set('meta', 'name', {name: 'manifest', content: '/manifest.json'})
metapatcher.set('meta', 'name', {name: 'msapplication-config', content: '/path/msconfig.xml'})

// the example below will create link rel=$1 href=$2 tag.
metapatcher.set('link', undefined, {rel: 'stylesheet', href: '/path/style.css'})

// disable chrome auto-translate recommendation
metapatcher.set('meta', undefined, {name: 'google', content: 'notranslate'})

const data = [
  {title: 'Home', url: 'https://www.frondjs.org'},
  {title: 'About', url: 'https://www.frondjs.org/about'}
]
metapatcher.breadcrumb(data) // returns self

const icons = [
  '/path/icon-72x72.png',
  '/path/icon-180x180.png'
  // ...
  // /path/icon-[size].[ext]
]
metapatcher.setIcons(icons)

metapatcher.setSafariMobileWebApp({
  name: 'Sample App', // already set with .setProjectMeta
  statusBarStyle: 'black-translucent'
})
metapatcher.setSafariPinnedTab('/path/pinned-tab-icon.svg', '#000000')

metapatcher.setFacebookMeta({
  appID: ''
})

metapatcher.setTwitterMeta({
  card: 'summary_large_image',
  site: '@twitter',
  creator: '@muratgozel'
})

metapatcher.set('meta', 'name', {name: 'number', content: 'One'})
metapatcher.set('meta', undefined, {name: 'names', content: 'One'})
metapatcher.set('meta', undefined, {name: 'names', content: 'Two'})

const dump = metapatcher.dump()
/*
<meta id="name" name="msapplication-config" content="none">
<meta id="name" name="number" content="One">
<meta name="names" content="One">
<meta name="names" content="Two">
 */