first patch to fix colorbar coherence with R

This commit is contained in:
Pixelguy14 2025-01-27 18:10:44 -06:00
parent 7667bc26e9
commit e5e6284d53
2 changed files with 117 additions and 112 deletions

217
app.jl
View File

@ -18,7 +18,6 @@ using StipplePlotly
# == Code import == # == Code import ==
# add your data analysis code here or in the lib folder. Code in lib/ will be # add your data analysis code here or in the lib folder. Code in lib/ will be
# automatically loaded # automatically loaded
rgb_ViridisPalette=reinterpret(ColorTypes.RGB24, ViridisPalette)
# == Search functions == # == Search functions ==
function increment_image(current_image, image_list) function increment_image(current_image, image_list)
@ -62,50 +61,50 @@ function loadImgPlot(interfaceImg::String)
elevation=Float32.(Array(img_gray)) elevation=Float32.(Array(img_gray))
#println(typeof(elevation)) #println(typeof(elevation))
# Get the X, Y coordinates of the image # Get the X, Y coordinates of the image
height, width = size(img_array) height, width=size(img_array)
#println("height: $(height), width: $(width)") #println("height: $(height), width: $(width)")
X = collect(1:width) X=collect(1:width)
Y = collect(1:height) Y=collect(1:height)
# Create the layout # Create the layout
layout = PlotlyBase.Layout( layout=PlotlyBase.Layout(
xaxis = PlotlyBase.attr( xaxis=PlotlyBase.attr(
visible = false, visible=false,
scaleanchor = "y" scaleanchor="y"
), ),
yaxis = PlotlyBase.attr( yaxis=PlotlyBase.attr(
visible = false visible=false
) )
) )
# Create the trace for the image # Create the trace for the image
trace = PlotlyBase.heatmap( trace=PlotlyBase.heatmap(
z = elevation, z=elevation,
x = X, x=X,
y = -Y, y=-Y,
name="", name="",
showlegend=false, showlegend=false,
colorscale = "Viridis", colorscale="Viridis",
showscale = true, showscale=false,
colorbar = attr( colorbar=attr(
title = attr( title=attr(
text = "Intensity", text="Intensity",
font = attr( font=attr(
size = 14, size=14,
color = "black" color="black"
), ),
side = "right" side="right"
), ),
ticks = "outside", ticks="outside",
ticklen = 2, ticklen=2,
tickwidth = 0.5, tickwidth=0.5,
nticks = 5, nticks=5,
tickformat = ".2g" tickformat=".2g"
) )
) )
plotdata = [trace] plotdata=[trace]
plotlayout = layout plotlayout=layout
return plotdata, plotlayout, width, height return plotdata, plotlayout, width, height
end end
# loadContourPlot recieves the local directory of the image as a string, # loadContourPlot recieves the local directory of the image as a string,
@ -149,12 +148,12 @@ function loadContourPlot(interfaceImg::String)
y=-Y[:, 1], # Use the first column y=-Y[:, 1], # Use the first column
contours_coloring="Viridis", contours_coloring="Viridis",
colorscale="Viridis", colorscale="Viridis",
colorbar = attr( colorbar=attr(
tickformat = ".2g" tickformat=".2g"
) )
) )
plotdata = [trace] plotdata=[trace]
plotlayout = layout plotlayout=layout
return plotdata, plotlayout return plotdata, plotlayout
end end
# loadSurfacePlot recieves the local directory of the image as a string, # loadSurfacePlot recieves the local directory of the image as a string,
@ -220,25 +219,25 @@ function loadSurfacePlot(interfaceImg::String)
project_z=true project_z=true
), ),
colorscale="Viridis", colorscale="Viridis",
colorbar = attr( colorbar=attr(
tickformat = ".2g" tickformat=".2g"
) )
) )
plotdata = [trace3D] plotdata=[trace3D]
plotlayout = layout3D plotlayout=layout3D
return plotdata, plotlayout return plotdata, plotlayout
end end
function crossLinesPlot(x, y, maxwidth, maxheight) function crossLinesPlot(x, y, maxwidth, maxheight)
# Define the coordinates for the two lines # Define the coordinates for the two lines
l1_x = [0, maxwidth] l1_x=[0, maxwidth]
l1_y = [y, y] l1_y=[y, y]
l2_x = [x, x] l2_x=[x, x]
l2_y = [0, maxheight] l2_y=[0, maxheight]
# Create the line traces # Create the line traces
trace1 = PlotlyBase.scatter(x = l1_x, y = l1_y, mode = "lines",line=attr(color="red", width=0.5),name="Line X",showlegend=false) trace1=PlotlyBase.scatter(x=l1_x, y=l1_y, mode="lines",line=attr(color="red", width=0.5),name="Line X",showlegend=false)
trace2 = PlotlyBase.scatter(x = l2_x, y = l2_y, mode = "lines",line=attr(color="red", width=0.5),name="Line Y",showlegend=false) trace2=PlotlyBase.scatter(x=l2_x, y=l2_y, mode="lines",line=attr(color="red", width=0.5),name="Line Y",showlegend=false)
return trace1, trace2 return trace1, trace2
end end
@ -272,9 +271,9 @@ end
@in file_route="" @in file_route=""
@in file_name="" @in file_name=""
@in Nmass=0.0 @in Nmass=0.0
@in Tol=0.0 @in Tol=0.1
@in triqProb=0.98 @in triqProb=0.98
@in triqColor=256 @in colorLevel=20
## Interface Buttons ## Interface Buttons
@in btnSearch=false # To search for files in your device @in btnSearch=false # To search for files in your device
@ -340,21 +339,21 @@ end
## Plots ## Plots
# Local image to plot # Local image to plot
layoutImg = PlotlyBase.Layout( layoutImg=PlotlyBase.Layout(
xaxis = PlotlyBase.attr( xaxis=PlotlyBase.attr(
visible = false, visible=false,
scaleanchor = "y" scaleanchor="y"
), ),
yaxis = PlotlyBase.attr( yaxis=PlotlyBase.attr(
visible = false visible=false
) )
) )
traceImg=PlotlyBase.heatmap(x=[], y=[]) traceImg=PlotlyBase.heatmap(x=[], y=[])
@out plotdataImg = [traceImg] @out plotdataImg=[traceImg]
@out plotlayoutImg = layoutImg @out plotlayoutImg=layoutImg
# For triq image # For triq image
@out plotdataImgT = [traceImg] @out plotdataImgT=[traceImg]
@out plotlayoutImgT = layoutImg @out plotlayoutImgT=layoutImg
# Interface Plot Spectrum # Interface Plot Spectrum
layoutSpectra=PlotlyBase.Layout( layoutSpectra=PlotlyBase.Layout(
title="SUM Spectrum plot", title="SUM Spectrum plot",
@ -475,12 +474,12 @@ end
# Append a query string to force the image to refresh # Append a query string to force the image to refresh
timestamp=string(time_ns()) timestamp=string(time_ns())
if triqEnabled # If we have TrIQ if triqEnabled # If we have TrIQ
if triqColor < 1 || triqColor > 256 ||triqProb < 0 || triqProb > 1 if colorLevel < 2 || colorLevel > 256 ||triqProb < 0.8 || triqProb > 1
msg="Incorrect TrIQ values, please adjust accordingly and try again." msg="Incorrect TrIQ values, please adjust accordingly and try again."
warning_msg=true warning_msg=true
else else
image_path=joinpath("./public", "TrIQ_$(text_nmass).bmp") image_path=joinpath("./public", "TrIQ_$(text_nmass).bmp")
SaveBitmap(joinpath("public", "TrIQ_$(text_nmass).bmp"),TrIQ(slice, Int(triqColor), triqProb),ViridisPalette) SaveBitmap(joinpath("public", "TrIQ_$(text_nmass).bmp"),TrIQ(slice, Int(colorLevel), triqProb),ViridisPalette)
# Flip te image vertically then save it again # Flip te image vertically then save it again
img=load(image_path) img=load(image_path)
if size(img, 1) > size(img, 2) # fix to taller images if size(img, 1) > size(img, 2) # fix to taller images
@ -492,13 +491,17 @@ end
save(image_path, flipped_img) save(image_path, flipped_img)
# Use timestamp to refresh image interface container # Use timestamp to refresh image interface container
imgIntT="/TrIQ_$(text_nmass).bmp?t=$(timestamp)" imgIntT="/TrIQ_$(text_nmass).bmp?t=$(timestamp)"
plotdataImgT, plotlayoutImgT, imgWidth, imgHeight = loadImgPlot(imgIntT) plotdataImgT, plotlayoutImgT, imgWidth, imgHeight=loadImgPlot(imgIntT)
# Get current image # Get current image
current_triq="TrIQ_$(text_nmass).bmp" current_triq="TrIQ_$(text_nmass).bmp"
msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))" msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Create colorbar # Create colorbar
ticks=round.(range(0, stop=maximum(TrIQ(slice, Int(triqColor), triqProb)), length=10), sigdigits=3) #ticks=round.(range(0, stop=maximum(TrIQ(slice, Int(colorLevel), triqProb)), length=10), sigdigits=3)
Colorbar(fig[1, 1], colormap=rgb_ViridisPalette, limits=(0, maximum(TrIQ(slice, Int(triqColor), triqProb))),ticks=ticks, label="Intensity") #println("ticks: $(round.(range(0, stop=maximum(TrIQ(slice, Int(colorLevel), triqProb)), length=10), sigdigits=3))")
ticks=round.(range(0, (stop=maximum(slice)*triqProb), length=15), sigdigits=3)
#println("ticks 2: $(round.(range(0, (stop=maximum(slice)*triqProb), length=15), sigdigits=3))")
#Colorbar(fig[1, 1], colormap=rgb_ViridisPalette, limits=(0, maximum(TrIQ(slice, Int(colorLevel), triqProb))),ticks=ticks, label="Intensity")
Colorbar(fig[1, 1], colormap=cgrad(:viridis, colorLevel, categorical=true), limits=(0, maximum(slice)*triqProb),ticks=ticks, label="Intensity")
save("public/colorbar_TrIQ_$(text_nmass).png", fig) save("public/colorbar_TrIQ_$(text_nmass).png", fig)
colorbarT="/colorbar_TrIQ_$(text_nmass).png?t=$(timestamp)" colorbarT="/colorbar_TrIQ_$(text_nmass).png?t=$(timestamp)"
# Get current colorbar # Get current colorbar
@ -527,13 +530,15 @@ end
save(image_path, flipped_img) save(image_path, flipped_img)
# Use timestamp to refresh image interface container # Use timestamp to refresh image interface container
imgInt="/MSI_$(text_nmass).bmp?t=$(timestamp)" imgInt="/MSI_$(text_nmass).bmp?t=$(timestamp)"
plotdataImg, plotlayoutImg, imgWidth, imgHeight = loadImgPlot(imgInt) plotdataImg, plotlayoutImg, imgWidth, imgHeight=loadImgPlot(imgInt)
# Get current image # Get current image
current_msi="MSI_$(text_nmass).bmp" current_msi="MSI_$(text_nmass).bmp"
msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))" msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Create colorbar # Create colorbar
ticks=round.(range(0, stop=maximum(slice), length=10), sigdigits=3) #ticks=round.(range(0, stop=maximum(slice), length=10), sigdigits=3)
Colorbar(fig[1, 1], colormap=rgb_ViridisPalette, limits=(0, maximum(slice)),ticks=ticks, label="Intensity") ticks=round.(range(0, stop=maximum(slice), length=15), sigdigits=3)
#Colorbar(fig[1, 1], colormap=rgb_ViridisPalette, limits=(0, maximum(slice)),ticks=ticks, label="Intensity")
Colorbar(fig[1, 1], colormap=cgrad(:viridis, 256, categorical=true), limits=(0, maximum(slice)),ticks=ticks, label="Intensity")
save("public/colorbar_MSI_$(text_nmass).png", fig) save("public/colorbar_MSI_$(text_nmass).png", fig)
colorbar="/colorbar_MSI_$(text_nmass).png?t=$(timestamp)" colorbar="/colorbar_MSI_$(text_nmass).png?t=$(timestamp)"
# Get current colorbar # Get current colorbar
@ -694,11 +699,11 @@ end
text_nmass=replace(text_nmass, ".bmp" => "") text_nmass=replace(text_nmass, ".bmp" => "")
msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))" msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Process the image in the function # Process the image in the function
plotdataImg, plotlayoutImg, imgWidth, imgHeight = loadImgPlot(imgInt) plotdataImg, plotlayoutImg, imgWidth, imgHeight=loadImgPlot(imgInt)
else else
traceImg=PlotlyBase.heatmap(x=[], y=[]) traceImg=PlotlyBase.heatmap(x=[], y=[])
plotdataImg = [traceImg] plotdataImg=[traceImg]
msgimg = "" msgimg=""
end end
end end
@onbutton imgPlus begin @onbutton imgPlus begin
@ -720,11 +725,11 @@ end
text_nmass=replace(text_nmass, ".bmp" => "") text_nmass=replace(text_nmass, ".bmp" => "")
msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))" msgimg="Image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Process the image in the function # Process the image in the function
plotdataImg, plotlayoutImg, imgWidth, imgHeight = loadImgPlot(imgInt) plotdataImg, plotlayoutImg, imgWidth, imgHeight=loadImgPlot(imgInt)
else else
traceImg=PlotlyBase.heatmap(x=[], y=[]) traceImg=PlotlyBase.heatmap(x=[], y=[])
plotdataImg = [traceImg] plotdataImg=[traceImg]
msgimg = "" msgimg=""
end end
end end
@ -747,11 +752,11 @@ end
text_nmass=replace(text_nmass, ".bmp" => "") text_nmass=replace(text_nmass, ".bmp" => "")
msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))" msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Process the image in the function # Process the image in the function
plotdataImgT, plotlayoutImgT, imgWidth, imgHeight = loadImgPlot(imgIntT) plotdataImgT, plotlayoutImgT, imgWidth, imgHeight=loadImgPlot(imgIntT)
else else
traceImg=PlotlyBase.heatmap(x=[], y=[]) traceImg=PlotlyBase.heatmap(x=[], y=[])
plotdataImgT = [traceImg] plotdataImgT=[traceImg]
msgtriq = "" msgtriq=""
end end
end end
@onbutton imgPlusT begin @onbutton imgPlusT begin
@ -773,11 +778,11 @@ end
text_nmass=replace(text_nmass, ".bmp" => "") text_nmass=replace(text_nmass, ".bmp" => "")
msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))" msgtriq="TrIQ image with the Nmass of $(replace(text_nmass, "_" => "."))"
# Process the image in the function # Process the image in the function
plotdataImgT, plotlayoutImgT, imgWidth, imgHeight = loadImgPlot(imgIntT) plotdataImgT, plotlayoutImgT, imgWidth, imgHeight=loadImgPlot(imgIntT)
else else
traceImg=PlotlyBase.heatmap(x=[], y=[]) traceImg=PlotlyBase.heatmap(x=[], y=[])
plotdataImgT = [traceImg] plotdataImgT=[traceImg]
msgtriq = "" msgtriq=""
end end
end end
@ -795,7 +800,7 @@ end
btnStartDisable=true btnStartDisable=true
btnSpectraDisable=true btnSpectraDisable=true
try try
plotdata3d, plotlayout3d = loadSurfacePlot(imgInt) plotdata3d, plotlayout3d=loadSurfacePlot(imgInt)
GC.gc() # Trigger garbage collection GC.gc() # Trigger garbage collection
if Sys.islinux() if Sys.islinux()
ccall(:malloc_trim, Int32, (Int32,), 0) # Ensure julia returns the freed memory to OS ccall(:malloc_trim, Int32, (Int32,), 0) # Ensure julia returns the freed memory to OS
@ -836,7 +841,7 @@ end
btnStartDisable=true btnStartDisable=true
btnSpectraDisable=true btnSpectraDisable=true
try try
plotdata3d, plotlayout3d = loadSurfacePlot(imgIntT) plotdata3d, plotlayout3d=loadSurfacePlot(imgIntT)
GC.gc() # Trigger garbage collection GC.gc() # Trigger garbage collection
if Sys.islinux() if Sys.islinux()
ccall(:malloc_trim, Int32, (Int32,), 0) # Ensure julia returns the freed memory to OS ccall(:malloc_trim, Int32, (Int32,), 0) # Ensure julia returns the freed memory to OS
@ -965,24 +970,24 @@ end
#println("Spectra: $(ndims(spectracoords))") #println("Spectra: $(ndims(spectracoords))")
# Extract x and y values from data_click # Extract x and y values from data_click
cursor_data=data_click["cursor"] cursor_data=data_click["cursor"]
x_value = cursor_data["x"] x_value=cursor_data["x"]
y_value = cursor_data["y"] # Get the x and y values from the click of the cursor y_value=cursor_data["y"] # Get the x and y values from the click of the cursor
closest_distance = Inf closest_distance=Inf
for val in spectracoords for val in spectracoords
# Find the index where x is within a range # Find the index where x is within a range
start_idx = findfirst(x -> x >= x_value - 10, val[:x]) start_idx=findfirst(x -> x >= x_value - 10, val[:x])
end_idx = findlast(x -> x <= x_value + 10, val[:x]) end_idx=findlast(x -> x <= x_value + 10, val[:x])
# Ensure the index are valid and within range # Ensure the index are valid and within range
if start_idx !== nothing && end_idx !== nothing if start_idx !== nothing && end_idx !== nothing
for i in start_idx:end_idx for i in start_idx:end_idx
spectra_x = val[:x][i] spectra_x=val[:x][i]
spectra_y = val[:y][i] spectra_y=val[:y][i]
distance = sqrt((spectra_x - x_value)^2 + (spectra_y - y_value)^2) # Calculate distance distance=sqrt((spectra_x - x_value)^2 + (spectra_y - y_value)^2) # Calculate distance
if distance < closest_distance if distance < closest_distance
closest_distance = distance closest_distance=distance
Nmass = round(spectra_x, digits=2) Nmass=round(spectra_x, digits=2)
end end
end end
end end
@ -1007,40 +1012,40 @@ end
elseif selectedTab == "tab1" elseif selectedTab == "tab1"
#println("you have clicked the triq image") #println("you have clicked the triq image")
cursor_data=data_click["cursor"] cursor_data=data_click["cursor"]
xCoord = Int32(round(cursor_data["x"])) xCoord=Int32(round(cursor_data["x"]))
if xCoord < 0 if xCoord < 0
xCoord = 0 xCoord=0
elseif xCoord > imgWidth elseif xCoord > imgWidth
xCoord = imgWidth xCoord=imgWidth
end end
yCoord = Int32(round(cursor_data["y"])) yCoord=Int32(round(cursor_data["y"]))
if yCoord > 0 if yCoord > 0
yCoord = 0 yCoord=0
elseif yCoord < -imgHeight elseif yCoord < -imgHeight
yCoord = -imgHeight yCoord=-imgHeight
end # Get the x and y values from the click of the cursor and make sure they don't exceed image proportions end # Get the x and y values from the click of the cursor and make sure they don't exceed image proportions
#plotdataImgT, plotlayoutImgT, imgWidth, imgHeight = loadImgPlot(imgIntT) #plotdataImgT, plotlayoutImgT, imgWidth, imgHeight=loadImgPlot(imgIntT)
plotdataImgT = filter(trace -> !(get(trace, :name, "") in ["Line X", "Line Y"]), plotdataImgT) plotdataImgT=filter(trace -> !(get(trace, :name, "") in ["Line X", "Line Y"]), plotdataImgT)
trace1, trace2 = crossLinesPlot(xCoord, yCoord, imgWidth, -imgHeight) trace1, trace2=crossLinesPlot(xCoord, yCoord, imgWidth, -imgHeight)
plotdataImgT=append!(plotdataImgT, [trace1, trace2]) plotdataImgT=append!(plotdataImgT, [trace1, trace2])
elseif selectedTab == "tab0" elseif selectedTab == "tab0"
#println("you have clicked the normal image") #println("you have clicked the normal image")
cursor_data=data_click["cursor"] cursor_data=data_click["cursor"]
xCoord = Int32(round(cursor_data["x"])) xCoord=Int32(round(cursor_data["x"]))
if xCoord < 0 if xCoord < 0
xCoord = 0 xCoord=0
elseif xCoord > imgWidth elseif xCoord > imgWidth
xCoord = imgWidth xCoord=imgWidth
end end
yCoord = Int32(round(cursor_data["y"])) yCoord=Int32(round(cursor_data["y"]))
if yCoord > 0 if yCoord > 0
yCoord = 0 yCoord=0
elseif yCoord < -imgHeight elseif yCoord < -imgHeight
yCoord = -imgHeight yCoord=-imgHeight
end # Get the x and y values from the click of the cursor and make sure they don't exceed image proportions end # Get the x and y values from the click of the cursor and make sure they don't exceed image proportions
#plotdataImg, plotlayoutImg, imgWidth, imgHeight = loadImgPlot(imgInt) #plotdataImg, plotlayoutImg, imgWidth, imgHeight=loadImgPlot(imgInt)
plotdataImg = filter(trace -> !(get(trace, :name, "") in ["Line X", "Line Y"]), plotdataImg) plotdataImg=filter(trace -> !(get(trace, :name, "") in ["Line X", "Line Y"]), plotdataImg)
trace1, trace2 = crossLinesPlot(xCoord, yCoord, imgWidth, -imgHeight) trace1, trace2=crossLinesPlot(xCoord, yCoord, imgWidth, -imgHeight)
plotdataImg=append!(plotdataImg, [trace1, trace2]) plotdataImg=append!(plotdataImg, [trace1, trace2])
end end
end end

View File

@ -60,10 +60,10 @@
<div class="st-col col-12 col-sm q-ma-sm"> <div class="st-col col-12 col-sm q-ma-sm">
<q-input standout="custom-standout" id="textNmass" step="0.01" v-model="Nmass" <q-input standout="custom-standout" id="textNmass" step="0.01" v-model="Nmass"
label="Mass-to-charge ratio of interest" type="number" label="Mass-to-charge ratio of interest" type="number"
:rules="[ val => !!val || '* Required', val => val >= 0.0 &amp;&amp; val <= 2000.0 || 'Need positive mass values',]"></q-input> :rules="[ val => !!val || '* Required', val => val >= 0.0 || 'Need positive mass values',]"></q-input>
</div> </div>
<div class="st-col col-12 col-sm q-ma-sm"> <div class="st-col col-12 col-sm q-ma-sm">
<q-input standout="custom-standout" id="textTol" step="0.01" v-model="Tol" <q-input standout="custom-standout" id="textTol" step="0.05" v-model="Tol"
label="Mass-to-charge ratio tolerance" type="number" label="Mass-to-charge ratio tolerance" type="number"
:rules="[val => !!val || '* Required', val => val >= 0.0 &amp;&amp; val <= 1.0 || 'Needs to be in range between 0 and 1',]"></q-input> :rules="[val => !!val || '* Required', val => val >= 0.0 &amp;&amp; val <= 1.0 || 'Needs to be in range between 0 and 1',]"></q-input>
</div> </div>
@ -73,19 +73,19 @@
<div class="col-6"> <div class="col-6">
<div class="st-col col-6 col-sm q-ma-sm"> <div class="st-col col-6 col-sm q-ma-sm">
<q-toggle id="btnEnableTriq" v-on:click="triqEnabled" v-model="triqEnabled" color="blue" <q-toggle id="btnEnableTriq" v-on:click="triqEnabled" v-model="triqEnabled" color="blue"
label="Add Threshold Intensity Quantization (TrIQ)!"></q-toggle> label="Add Threshold Intensity Quantization (TrIQ)"></q-toggle>
</div> </div>
<div class="row"> <div class="row">
<div class="st-col col-4 col-sm-4 q-ma-sm"> <div class="st-col col-4 col-sm-4 q-ma-sm">
<q-input standout="custom-standout" id="textTriqProb" step="0.01" v-model="triqProb" <q-input standout="custom-standout" id="textTriqProb" step="0.01" v-model="triqProb"
label="TrIQ probability" type="number" :rules="[ label="TrIQ probability" type="number" :rules="[
val => triqEnabled ? ( '* Required', val >= 0 &amp;&amp; val <= 1 || 'Needs to be in range between 0 and 1') : true val => triqEnabled ? ( '* Required', val >= 0.8 &amp;&amp; val <= 1 || 'Needs to be in range between 0.8 and 1') : true
]" :readonly="!triqEnabled" :disable="!triqEnabled"></q-input> ]" :readonly="!triqEnabled" :disable="!triqEnabled"></q-input>
</div> </div>
<div class="st-col col-4 col-sm-4 q-ma-sm"> <div class="st-col col-4 col-sm-4 q-ma-sm">
<q-input standout="custom-standout" id="textTriqColor" step="1" v-model="triqColor" <q-input standout="custom-standout" id="textcolorLevel" step="1" v-model="colorLevel"
label="TrIQ color levels" type="number" :rules="[ label="TrIQ color levels" type="number" :rules="[
val => triqEnabled ? ( '* Required', val >= 0 &amp;&amp; val <= 256 || 'Needs to be in range between 1 and 256') : true val => triqEnabled ? ( '* Required', val >= 2 &amp;&amp; val <= 256 || 'Needs to be in range between 2 and 256') : true
]" :readonly="!triqEnabled" :disable="!triqEnabled"></q-input> ]" :readonly="!triqEnabled" :disable="!triqEnabled"></q-input>
</div> </div>
</div> </div>