manage/activation.ts000064400000004474151541500230010512 0ustar00import { __ } from '@wordpress/i18n'
import { updateSnippet } from './requests'
import type { Snippet } from '../../types/Snippet'

/**
 * Update the snippet count of a specific view
 * @param element
 * @param increment
 */
const updateViewCount = (element: HTMLElement | null, increment: boolean) => {
	if (element?.textContent) {
		let count = parseInt(element.textContent.replace(/\((?<count>\d+)\)/, '$1'), 10)
		count += increment ? 1 : -1
		element.textContent = `(${count})`
	} else {
		console.error('Could not update view count.', element)
	}
}

/**
 * Activate an inactive snippet, or deactivate an active snippet
 * @param link
 * @param event
 */
export const toggleSnippetActive = (link: HTMLAnchorElement, event: Event) => {
	const row = link.parentElement?.parentElement // Switch < cell < row
	if (!row) {
		console.error('Could not toggle snippet active status.', row)
		return
	}

	const match = /\b(?:in)?active-snippet\b/.exec(row.className)
	if (!match) {
		return
	}

	event.preventDefault()

	const activating = 'inactive-snippet' === match[0]
	const snippet: Partial<Snippet> = { active: activating }

	updateSnippet('active', row, snippet, response => {
		const button: HTMLAnchorElement | null = row.querySelector('.snippet-activation-switch')

		if (response.success) {
			row.className = activating
				? row.className.replace(/\binactive-snippet\b/, 'active-snippet')
				: row.className.replace(/\bactive-snippet\b/, 'inactive-snippet')

			const views = document.querySelector('.subsubsub')
			const activeCount = views?.querySelector<HTMLElement>('.active .count')
			const inactiveCount = views?.querySelector<HTMLElement>('.inactive .count')

			if (activeCount) {
				updateViewCount(activeCount, activating)
			}

			if (inactiveCount) {
				updateViewCount(inactiveCount, activating)
			}

			if (button) {
				button.title = activating ? __('Deactivate', 'code-snippets') : __('Activate', 'code-snippets')
			}
		} else {
			row.className += ' erroneous-snippet'

			if (button) {
				button.title = __('An error occurred when attempting to activate', 'code-snippets')
			}
		}
	})
}

export const handleSnippetActivationSwitches = () => {
	for (const link of document.getElementsByClassName('snippet-activation-switch')) {
		link.addEventListener('click', event => toggleSnippetActive(<HTMLAnchorElement> link, event))
	}
}
manage/cloud.ts000064400000003002151541500230007441 0ustar00import Prism from 'prismjs'
import 'prismjs/components/prism-clike'
import 'prismjs/components/prism-javascript'
import 'prismjs/components/prism-css'
import 'prismjs/components/prism-php'
import 'prismjs/components/prism-markup'
import 'prismjs/plugins/keep-markup/prism-keep-markup'

/**
 * Handle clicks on snippet preview button.
 */
export const handleShowCloudPreview = () => {
	const previewButtons = document.querySelectorAll('.cloud-snippet-preview')

	previewButtons.forEach(button => {
		button.addEventListener('click', () => {
			const snippetId = button.getAttribute('data-snippet')
			const snippetLanguage = button.getAttribute('data-lang')

			const snippetCodeInput = <HTMLInputElement | null> document.getElementById(`cloud-snippet-code-${snippetId}`)
			const snippetCodeModalTag = document.getElementById('snippet-code-thickbox')

			if (!snippetCodeModalTag || !snippetCodeInput) {
				return
			}

			snippetCodeModalTag.classList.remove(...snippetCodeModalTag.classList)
			snippetCodeModalTag.classList.add(`language-${snippetLanguage}`)
			snippetCodeModalTag.textContent = snippetCodeInput.value

			if ('markup' === snippetLanguage) {
				snippetCodeModalTag.innerHTML = `<xmp>${snippetCodeInput.value}</xmp>`
			}

			if ('php' === snippetLanguage) {
				// Check if there is an opening php tag if not add it.
				if (!snippetCodeInput.value.startsWith('<?php')) {
					snippetCodeModalTag.textContent = `<?php\n${snippetCodeInput.value}`
				}
			}

			Prism.highlightElement(snippetCodeModalTag)
		})
	})
}
manage/index.ts000064400000000252151541500230007446 0ustar00export { handleSnippetActivationSwitches } from './activation'
export { handleSnippetPriorityChanges } from './priority'
export { handleShowCloudPreview } from './cloud'
manage/priority.ts000064400000001344151541500230010223 0ustar00import { updateSnippet } from './requests'
import type { Snippet } from '../../types/Snippet'

/**
 * Update the priority of a snippet
 */
export const updateSnippetPriority = (element: HTMLInputElement) => {
	const row = element.parentElement?.parentElement
	const snippet: Partial<Snippet> = { priority: parseFloat(element.value) }
	if (row) {
		updateSnippet('priority', row, snippet)
	} else {
		console.error('Could not update snippet information.', snippet, row)
	}
}

export const handleSnippetPriorityChanges = () => {
	for (const field of <HTMLCollectionOf<HTMLInputElement>> document.getElementsByClassName('snippet-priority')) {
		field.addEventListener('input', () => updateSnippetPriority(field))
		field.disabled = false
	}
}
manage/requests.ts000064400000003345151541500230010220 0ustar00import { isNetworkAdmin } from '../../utils/general'
import type { Snippet, SnippetScope } from '../../types/Snippet'

export interface ResponseData<T = unknown> {
	success: boolean
	data?: T
}

export type SuccessCallback = (response: ResponseData) => void

const sendSnippetRequest = (query: string, onSuccess?: SuccessCallback) => {
	const request = new XMLHttpRequest()
	request.open('POST', window.ajaxurl, true)
	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded charset=UTF-8')

	request.onload = () => {
		const success = 200
		const errorStart = 400
		if (success > request.status || errorStart <= request.status) {
			return
		}

		console.info(request.responseText)
		onSuccess?.(<ResponseData> JSON.parse(request.responseText))
	}

	request.send(query)
}

/**
 * Update the data of a given snippet using AJAX
 * @param field
 * @param row
 * @param snippet
 * @param successCallback
 */
export const updateSnippet = (field: keyof Snippet, row: Element, snippet: Partial<Snippet>, successCallback?: SuccessCallback) => {
	const nonce = <HTMLInputElement | null> document.getElementById('code_snippets_ajax_nonce')
	const columnId = row.querySelector('.column-id')

	if (!nonce || !columnId?.textContent || !parseInt(columnId.textContent, 10)) {
		return
	}

	snippet.id = parseInt(columnId.textContent, 10)
	snippet.shared_network = null !== /\bshared-network-snippet\b/.exec(row.className)
	snippet.network = snippet.shared_network || isNetworkAdmin()
	snippet.scope = <SnippetScope | null> row.getAttribute('data-snippet-scope') ?? snippet.scope

	const queryString = `action=update_code_snippet&_ajax_nonce=${nonce.value}&field=${field}&snippet=${JSON.stringify(snippet)}`
	sendSnippetRequest(queryString, successCallback)
}
settings/editor-preview.ts000064400000002623151541500230011720 0ustar00import '../../editor'

const parseSelect = (select: HTMLSelectElement) => select.options[select.selectedIndex].value
const parseCheckbox = (checkbox: HTMLInputElement) => checkbox.checked
const parseNumber = (input: HTMLInputElement) => parseInt(input.value, 10)

const initialiseCodeMirror = () => {
	const { codeEditor } = window.wp
	const textarea = document.getElementById('code_snippets_editor_preview')

	if (textarea) {
		window.code_snippets_editor_preview = codeEditor.initialize(textarea)
		return window.code_snippets_editor_preview.codemirror
	}

	console.error('Could not initialise CodeMirror on textarea.', textarea)
	return undefined
}

export const handleEditorPreviewUpdates = () => {
	const editor = initialiseCodeMirror()
	const editorSettings = window.code_snippets_editor_settings

	for (const setting of editorSettings) {
		const element = document.querySelector(`[name="code_snippets_settings[editor][${setting.name}]"]`)

		element?.addEventListener('change', () => {
			const opt = setting.codemirror

			const value = (() => {
				switch (setting.type) {
					case 'select':
						return parseSelect(<HTMLSelectElement> element)
					case 'checkbox':
						return parseCheckbox(<HTMLInputElement> element)
					case 'number':
						return parseNumber(<HTMLInputElement> element)
					default:
						return null
				}
			})()

			if (null !== value) {
				editor?.setOption(opt, value)
			}
		})
	}
}
settings/index.ts000064400000000152151541500230010055 0ustar00export { handleSettingsTabs } from './tabs'
export { handleEditorPreviewUpdates } from './editor-preview'
settings/tabs.ts000064400000003232151541500230007701 0ustar00const selectTab = (tabsWrapper: Element, tab: Element, section: string) => {
	// Swap the active tab class from the previously active tab to the current one.
	tabsWrapper.querySelector('.nav-tab-active')?.classList.remove('nav-tab-active')
	tab.classList.add('nav-tab-active')

	// Update the current active tab attribute so that only the active tab is displayed.
	tabsWrapper.closest('.wrap')?.setAttribute('data-active-tab', section)
}

// Refresh the editor preview if we're viewing the editor section.
const refreshEditorPreview = (section: string) => {
	if ('editor' === section) {
		window.code_snippets_editor_preview?.codemirror.refresh()
	}
}

// Update the http referer value so that any redirections lead back to this tab.
const updateHttpReferer = (section: string) => {
	const httpReferer = document.querySelector<HTMLInputElement>('input[name=_wp_http_referer]')
	if (!httpReferer) {
		console.error('could not find http referer')
		return
	}

	const newReferer = httpReferer.value.replace(/(?<base>[&?]section=)[^&]+/, `$1${section}`)
	httpReferer.value = newReferer + (newReferer === httpReferer.value ? `&section=${section}` : '')
}

export const handleSettingsTabs = () => {
	const tabsWrapper = document.getElementById('settings-sections-tabs')
	if (!tabsWrapper) {
		console.error('Could not find snippets tabs')
		return
	}

	const tabs = tabsWrapper.querySelectorAll('.nav-tab')

	for (const tab of tabs) {
		tab.addEventListener('click', event => {
			event.preventDefault()
			const section = tab.getAttribute('data-section')

			if (section) {
				selectTab(tabsWrapper, tab, section)
				refreshEditorPreview(section)
				updateHttpReferer(section)
			}
		})
	}
}