mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-11-04 01:34:27 +00:00 
			
		
		
		
	Replace ajax with fetch, improve image diff (#27267)
1. Dropzone attachment removal, pretty simple replacement 2. Image diff: The previous code fetched every image twice, once via `img[src]` and once via `$.ajax`. Now it's only fetched once and a second time only when necessary. The image diff code was partially rewritten. --------- Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
		@@ -1,4 +1,5 @@
 | 
			
		||||
import {h} from 'vue';
 | 
			
		||||
import {parseDom, serializeXml} from './utils.js';
 | 
			
		||||
import giteaDoubleChevronLeft from '../../public/assets/img/svg/gitea-double-chevron-left.svg';
 | 
			
		||||
import giteaDoubleChevronRight from '../../public/assets/img/svg/gitea-double-chevron-right.svg';
 | 
			
		||||
import giteaEmptyCheckbox from '../../public/assets/img/svg/gitea-empty-checkbox.svg';
 | 
			
		||||
@@ -145,22 +146,19 @@ const svgs = {
 | 
			
		||||
//  At the moment, developers must check, pick and fill the names manually,
 | 
			
		||||
//  most of the SVG icons in assets couldn't be used directly.
 | 
			
		||||
 | 
			
		||||
const parser = new DOMParser();
 | 
			
		||||
const serializer = new XMLSerializer();
 | 
			
		||||
 | 
			
		||||
// retrieve an HTML string for given SVG icon name, size and additional classes
 | 
			
		||||
export function svg(name, size = 16, className = '') {
 | 
			
		||||
  if (!(name in svgs)) throw new Error(`Unknown SVG icon: ${name}`);
 | 
			
		||||
  if (size === 16 && !className) return svgs[name];
 | 
			
		||||
 | 
			
		||||
  const document = parser.parseFromString(svgs[name], 'image/svg+xml');
 | 
			
		||||
  const document = parseDom(svgs[name], 'image/svg+xml');
 | 
			
		||||
  const svgNode = document.firstChild;
 | 
			
		||||
  if (size !== 16) {
 | 
			
		||||
    svgNode.setAttribute('width', String(size));
 | 
			
		||||
    svgNode.setAttribute('height', String(size));
 | 
			
		||||
  }
 | 
			
		||||
  if (className) svgNode.classList.add(...className.split(/\s+/).filter(Boolean));
 | 
			
		||||
  return serializer.serializeToString(svgNode);
 | 
			
		||||
  return serializeXml(svgNode);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function svgParseOuterInner(name) {
 | 
			
		||||
@@ -176,7 +174,7 @@ export function svgParseOuterInner(name) {
 | 
			
		||||
  if (p1 === -1 || p2 === -1) throw new Error(`Invalid SVG icon: ${name}`);
 | 
			
		||||
  const svgInnerHtml = svgStr.slice(p1 + 1, p2);
 | 
			
		||||
  const svgOuterHtml = svgStr.slice(0, p1 + 1) + svgStr.slice(p2);
 | 
			
		||||
  const svgDoc = parser.parseFromString(svgOuterHtml, 'image/svg+xml');
 | 
			
		||||
  const svgDoc = parseDom(svgOuterHtml, 'image/svg+xml');
 | 
			
		||||
  const svgOuter = svgDoc.firstChild;
 | 
			
		||||
  return {svgOuter, svgInnerHtml};
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user