Inject SVG sprite via ajax (#10320)

* AJAX SVG * Fix PWA * Remove unused PWA assets Signed-off-by: jolheiser <[email protected]> Co-Authored-by: silverwind <[email protected]>
go-gitea · Feb 17, 2020 · e76a64d · e76a64d
1 parent 05c1f2b
commit e76a64d
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/modules/templates/helper.go b/modules/templates/helper.go
@@ -287,7 +287,7 @@ func NewFuncMap() []template.FuncMap {
  return false
  },
  "svg": func(icon string, size int) template.HTML {
- return template.HTML(fmt.Sprintf(`<svg class="svg %s" width="%d" height="%d" aria-hidden="true"><use xlink:href="%s/img/svg/icons.svg#%s" /></svg>`, icon, size, size, setting.StaticURLPrefix, icon))
+ return template.HTML(fmt.Sprintf(`<svg class="svg %s" width="%d" height="%d" aria-hidden="true"><use xlink:href="#%s" /></svg>`, icon, size, size, icon))
  },
  }}
 }

diff --git a/templates/pwa/serviceworker_js.tmpl b/templates/pwa/serviceworker_js.tmpl
@@ -22,7 +22,6 @@ var urlsToCache = [
  '{{StaticUrlPrefix}}/css/swagger.css?v={{MD5 AppVer}}',
  '{{StaticUrlPrefix}}/fomantic/semantic.min.css?v={{MD5 AppVer}}',
  '{{StaticUrlPrefix}}/vendor/assets/font-awesome/css/font-awesome.min.css',
- '{{StaticUrlPrefix}}/vendor/assets/octicons/octicons.min.css',
  '{{StaticUrlPrefix}}/vendor/plugins/dropzone/dropzone.css',
  '{{StaticUrlPrefix}}/vendor/plugins/jquery.datetimepicker/jquery.datetimepicker.css',
  '{{StaticUrlPrefix}}/vendor/plugins/jquery.minicolors/jquery.minicolors.css',
@@ -41,11 +40,10 @@ var urlsToCache = [
  '{{StaticUrlPrefix}}/img/gitea-lg.png',
 
  // svg
- '{{StaticUrlPrefix}}/img/svg/icons.svg'
+ '{{StaticUrlPrefix}}/img/svg/icons.svg',
 
  // fonts
  '{{StaticUrlPrefix}}/fomantic/themes/default/assets/fonts/icons.woff2',
- '{{StaticUrlPrefix}}/vendor/assets/octicons/octicons.woff2?ef21c39f0ca9b1b5116e5eb7ac5eabe6',
  '{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-regular.woff2',
  '{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-italic.woff2',
  '{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-700.woff2',

diff --git a/web_src/js/index.js b/web_src/js/index.js
@@ -3581,3 +3581,12 @@ window.onOAuthLoginClick = function () {
  oauthNav.show();
  }, 5000);
 };
+
+// Pull SVGs via AJAX to workaround CORS issues with <use> tags
+// https://css-tricks.com/ajaxing-svg-sprite/
+$.get(`${window.config.StaticUrlPrefix}/img/svg/icons.svg`, (data) => {
+ const div = document.createElement('div');
+ div.style.display = 'none';
+ div.innerHTML = new XMLSerializer().serializeToString(data.documentElement);
+ document.body.insertBefore(div, document.body.childNodes[0]);
+});