IDEA-312489: svg viewer: set grid color according to config

GitOrigin-RevId: 68fb5c70e78c6079cad99ac1af7c33bf321e2a92
This commit is contained in:
Vladimir Kharitonov
2023-02-27 18:43:25 +01:00
committed by intellij-monorepo-bot
parent a8ce0b033c
commit ef7ca8c93d
2 changed files with 32 additions and 2 deletions

View File

@@ -69,11 +69,13 @@ class JCefImageViewer(private val myFile: VirtualFile,
private const val IMAGE_PATH = "/image"
private const val SCROLLBARS_CSS_PATH = "/scrollbars.css"
private const val CHESSBOARD_CSS_PATH = "/chessboard.css"
private const val GRID_CSS_PATH = "/pixel_grid.css"
private const val VIEWER_URL = "$PROTOCOL://$HOST_NAME$VIEWER_PATH"
private const val IMAGE_URL = "$PROTOCOL://$HOST_NAME$IMAGE_PATH"
private const val SCROLLBARS_STYLE_URL = "$PROTOCOL://$HOST_NAME$SCROLLBARS_CSS_PATH"
private const val CHESSBOARD_STYLE_URL = "$PROTOCOL://$HOST_NAME$CHESSBOARD_CSS_PATH"
private const val GRID_STYLE_URL = "$PROTOCOL://$HOST_NAME$GRID_CSS_PATH"
private val ourCefClient = JBCefApp.getInstance().createClient()
@@ -197,6 +199,10 @@ class JCefImageViewer(private val myFile: VirtualFile,
CefStreamResourceHandler(ByteArrayInputStream(buildChessboardStyle().toByteArray(StandardCharsets.UTF_8)), "text/css", this)
}
myRequestHandler.addResource(GRID_CSS_PATH) {
CefStreamResourceHandler(ByteArrayInputStream(buildGridStyle().toByteArray(StandardCharsets.UTF_8)), "text/css", this)
}
myRequestHandler.addResource(IMAGE_PATH) {
var stream: InputStream? = null
try {
@@ -421,10 +427,27 @@ class JCefImageViewer(private val myFile: VirtualFile,
""".trimIndent()
}
private fun buildGridStyle(): String {
val color = colorToCSS(OptionsManager.getInstance().options.editorOptions.gridOptions.lineColor)
return /*language=css*/ """
#pixel_grid {
position: absolute;
width: 100%;
height: 100%;
margin: 0;
background-image: linear-gradient(to right, ${color} 1px, transparent 1px),
linear-gradient(to bottom, ${color} 1px, transparent 1px);
background-size: 1px 1px;
mix-blend-mode: normal;
}
""".trimIndent()
}
private fun reloadStyles() {
execute("""
loadScrollbarsStyle('$SCROLLBARS_STYLE_URL');
loadChessboardStyle('$CHESSBOARD_STYLE_URL');
loadPixelGridStyle('$GRID_STYLE_URL');
""".trimIndent())
}
}

View File

@@ -116,6 +116,7 @@
</style>
<link id="scrollbars_style" rel="stylesheet" type="text/css" href="scrollbars.css"/>
<link id="chessboard_style" rel="stylesheet" type="text/css" href="chessboard.css"/>
<link id="pixel_grid_style" rel="stylesheet" type="text/css" href="pixel_grid.css"/>
<title>Image viewer</title>
</head>
@@ -153,7 +154,7 @@
<script>
const gIsDebug = (new URL(window.location.href).searchParams.get('debug') != null)
const MIN_GRID_ZOOM = 10
const MIN_GRID_ZOOM = 3
const MAX_ZOOM = 150
const MIN_IMAGE_SIZE = 5
const ViewerStatus = {
@@ -185,7 +186,8 @@
const gStyles = {
'scrollbars': document.getElementById('scrollbars_style'),
'chessboard': document.getElementById('chessboard_style')
'chessboard': document.getElementById('chessboard_style'),
'pixel_grid': document.getElementById('pixel_grid_style')
}
let sendInfo = function (info_string) {}
@@ -452,6 +454,10 @@
gStyles.chessboard.href = _setTimestamp(url)
}
function loadPixelGridStyle(url) {
gStyles.pixel_grid.href = _setTimestamp(url)
}
function _setTimestamp(url) {
let patched_url = new URL(url)
patched_url.searchParams.set('timestamp', new Date().getTime().toString())
@@ -461,6 +467,7 @@
function reloadStyles() {
loadScrollbarsStyle(gStyles.scrollbars.href)
loadChessboardStyle(gStyles.chessboard.href)
loadPixelGridStyle(gStyles.pixel_grid.href)
}
</script>