{%- if page.key and
  site.comments.gitalk.clientID and
	site.comments.gitalk.clientSecret and
	site.comments.gitalk.repository and
	site.comments.gitalk.owner and
	site.comments.gitalk.admin -%}

	<!-- fix text color in the input textarea of gitalk -->
	<style type="text/css">
		.gitalk-wrapper .gt-header-textarea {
			color: #333 !important;
		}
	</style>

	{%- include snippets/get-sources.html -%}
	{%- assign _sources = __return -%}
	<div class="gitalk-wrapper" id="js-gitalk-container"></div>
	{%- assign _admin = '' -%}
	{%- for _admin_id in site.comments.gitalk.admin -%}
		{%- assign _admin = _admin | append: ", '" | append: _admin_id | append: "'" -%}
	{%- endfor -%}
	{%- assign _last = _admin | size | minus: 1 -%}
	{%- assign _admin = _admin | slice: 2, _last -%}
	<script>
		window.Lazyload.css('{{ _sources.gitalk.css }}');
		window.Lazyload.js('{{ _sources.gitalk.js }}', function() {
			var gitalk = new Gitalk({
				clientID: '{{ site.comments.gitalk.clientID }}',
				clientSecret: '{{ site.comments.gitalk.clientSecret }}',
				repo: '{{ site.comments.gitalk.repository }}',
				owner: '{{ site.comments.gitalk.owner }}',
				admin: [{{ _admin }}],
				id: '{{ page.key }}'
			});
			gitalk.render('js-gitalk-container');
		});
	</script>

{%- endif -%}
