CommunityScripts/plugins/hotCards

Hot Cards

https://discourse.stashapp.cc/t/hot-cards/1380

Hot Cards is a Stash CommunityScript plugin designed to enhance your visual experience by applying custom styling to card elements based on a Tag ID or a Rating Threshold. This plugin is perfect for highlighting certain performers or scenes and making sure you don't forget them!

Features

• Custom styling to card elements that match a specified Tag ID or Rating Threshold.
• Enable or disable Hot Cards on various sections like home, scenes, images, groups, galleries, performers, and studios.
• Specify Hot Cards to be tag-based or rating-based for each card type, as desired.
• Customizable Hot Cards.
• Support for multi-tag and multi-style configurations.

Installation

1. Go to Settings > Plugins.
2. Under Available Plugins expand the Community (stable) option.
3. Search for Hot Cards.
4. Select the plugin and click Install.

Usage

After installation, you can configure the plugin to suit your needs. Set a desired Tag ID or Rating Threshold and enable Hot Cards for the card types you want. Customize the appearance of Hot Cards for each type of card (scene, image, group, gallery, performer, studio) using the format provided or leave the fields empty to apply the default style.

Configure the field format:

[criterion]_[value]_[style]_[gradient-opts]_[hover-opts]_[card-opts]

Parameter	Description	Details
<criterion>	Defines the basis for applying styles. Use t for tag-based criteria, r for rating-based criteria, or d to disable.	If left empty, it will default to the global Tag ID or Rating Threshold as configured. If both options are enabled and unspecified, the Tag ID will be used by default both criteria will be used.
<value>	Specifies the exact value for the Tag ID or Rating Threshold to be used. Multiple values can be specified using a comma-separated list and slashes to delimit each set of criteria: <tag_id>,.../<tag_id>,.../... or <rating>/<rating>/...	Defaults to the global Tag ID or Rating Threshold value. The value parameter supports all Rating System Types in Stash: - Decimals (0.0 to 10.0): Multiply the rating by 10 to map it to the 0-100 range and set the Rating Threshold in the 6-100 range. - Stars (0.0 to 5.0): Use directly within the 1-5 range for all precisions (Full, Half, Quarter, Tenth) and set the Rating Threshold in the 1-5 range. Alternatively, use the 6-100 range if preferred. Example Conversions: - Decimals: A rating of 6.9 becomes 69. - Stars (Tenth Precision): A rating of 4.6 stars can be inputted as 4.6 or 92 (using the 6-100 range). See this additional information on multiple values.
<style>	Defines the styling options as a comma-separated list of colors or a style preset. Options include: a fixed color (e.g., #5ff2a2), a style preset (e.g., hot), or a gradient (e.g., #ef1313,#3bd612,... hex color codes or color names). A style can be specified for each set of values using a slash-separated list: <style>/<style>/...	Defaults to default (basic style preset) Style Presets available: default, hot, gold, and holo.
<gradient_opts>	Specifies gradient options as a comma-separated list: <type>,<angle>,<animation> Example: linear,35deg,4s alternate infinite for a linear gradient with a 35-degree angle and a 4-second alternating infinite animation. Gradient options can be specified for each set of values using a slash-separated list: <gradient_opts>/<gradient_opts>/...	<type> Defaults to linear Refer to Using CSS gradients to see all types you can use. <angle> Defaults to 0deg <animation> Defaults to none Note that you can only configure the animation properties of the element. See Using CSS animations for additional information.
<hover_opts>	Specifies hover options as a comma-separated list: <color>,<animation> Example: #ff0000,2s ease infinite for a hover effect with a color of #ff0000 and a 2-second ease infinite animation. Hover options can be specified for each set of values using a slash-separated list: <hover_opts>/<hover_opts>/...	<color> Defaults to transparent <animation> Defaults to none Similar to the gradient animation, you can only configure the animation properties of the element.
<card_opts>	Specifies the general options for the card as a comma-separated list: <fill>,<opacity>,<animate> Card options can be specified for each set of values using a slash-separated list: <card_opts>/<card_opts>/...	fill Defaults to true Indicates whether the card should be filled. Tip: You can set this to false to color only the border of the card. opacity Defaults to 80 Represents the opacity for the card background. Range from 0 to 100. animate Defaults to false Only used for holo style preset.

Regarding multiple values

In scenarios where multiple values are specified, the rules for how these values are processed can get complex. Below is a detailed explanation of how to handle multiple values.

1. Tag IDs

   Corresponding styles (style, gradient_opts, hover_opts, card_opts) are applied only if ALL tags in a set match.

   The tags are prioritized from left to right, meaning if it finds a match for a tag list, the corresponding style is applied and subsequent sets that may also match are ignored.

   For example:

   t_201,202/202_red/blue

   • A card with tags 201 and 202 will be painted red.
   • A card with tag 202 will be painted blue (only if it does not have tag 201).

   Conversely, t_202/201,202_blue/red

   • A card with tag 202 will be painted blue, regardless of the presence of tag 201. Therefore, there will be no cards painted red.

2. Ratings

   The same left-to-right prioritization applies.

   Consider the declaration:

   r_4/2_red/blue

   • A card with a rating >= 4 will be painted red.
   • A card with a rating >= 2 but < 4 will be painted blue.
   
   

   You can also specify multiple ratings in a single value if you wish to target multiple specific ratings, though such scenarios are rare and generally not as useful. For instance:

   r_2,4_blue

   • Targets cards with exact ratings of 4 or 2. Here, the order does not matter.

Examples

Style Preset:

t_123_gold

Segment	Value	Meaning
criterion	t	Tag-based
value	123	Use 123 as Tag ID
style	gold	Use Gold style
gradient-opts		Use Gold gradient options
hover-opts		Use Gold hover options
card-opts		Use default values

---

Modify an existing Style Preset:

__hot_,,none_pink,none_,40

Segment	Value	Meaning
criterion		Use tag or rating as configured
value		Use global tag or rating value
style	hot	Use Hot style
gradient-opts	,,none	No gradient animation
hover-opts	pink,none	Set hover effect color, no hover animation
card-opts	,40	Set opacity to 40

---

Fixed Color

r__#2673b8

Segment	Value	Meaning
criterion	r	Rating-based
value		Use global rating value
style	#2673b8	Set fixed color
gradient-opts		No gradient
hover-opts		No hover effect
card-opts		Use default values

---

Fixed Color border-only with hover effect

r_4_white__#5ff1a1_false

Segment	Value	Meaning
criterion	r	Rating-based
value	4	Use 4 as Rating Threshold
style	white	Set fixed color
gradient-opts		No gradient
hover-opts	#5ff1a1	Set hover effect color
card-opts	false	No fill

---

Animated gradient with animated hover effect

_67_pink,red,yellow,green,red,blue_,30deg,5s ease infinite_red,1s ease-in-out infinite_,100

Segment	Value	Meaning
criterion		Use tag or rating as configured
value	67	Use 67 as Tag ID or Rating Threshold
style	pink,red,yellow,green,red,blue	Apply gradient
gradient-opts	,30deg,5s ease infinite	Specify angle and animate gradient
hover-opts	red,1s ease-in-out infinite	Set hover effect color and animate hover
card-opts	,100	Use max opacity

Note: You can also skip inner values, notice the first comma in gradient-opts. The type is not provided, so linear gradient will be used by default.

---

Multi-tag

t_111,116,78,87_blue__green

Segment	Value	Meaning
criterion	t	Tag-based
value	111,116,78,87	Use tags 111, 116, 78, 87
style	blue	Set fixed color
gradient-opts		No gradient
hover-opts	green	Set hover effect color
card-opts		Use default values

---

Multi-tag with multi-style

t_111,116,78,87/105_pink,red,white/orange,white_/,70deg,4s alternate infinite__,30/

Segment	Value	Meaning
criterion	t	Tag-based
value	111,116,78,87/105	Use tags 111, 116, 78, 87 or 105
style	pink,red,white/orange,white	Apply pink, red, white gradient for first set of tags; orange, white gradient for tag 105
gradient-opts	/,70deg,4s alternate infinite	Use default gradient options for first set of tags; specify angle and animate gradient for tag 105
hover-opts		No hover effect
card-opts	,30/	Set opacity to 30 for first set of tags; default opacity for tag 105

---

Rating with multi-style

r_5/4.2/3.7_gold/hot/default___//,50

Segment	Value	Meaning
criterion	r	Rating-based
value	5/4.2/3.7	Use ratings 5, 4.2, and 3.7
style	gold/hot/default	Apply Gold style to ratings 5, Hot style to ratings >= 4.2, and Default style to ratings >= 3.7
gradient-opts		Use corresponding gradient options
hover-opts		Use corresponding hover options
card-opts	//,50	Set opacity to 50 for ratings >= 3.7; default opacity to other ratings

---

Multi-rating with multi-style

r_96,90,88/70,60_#0fff00/#000cff

Segment	Value	Meaning
criterion	r	Rating-based
value	96,90,88/70,60	Use ratings 96, 90, 88 or 70, 60
style	#0fff00/#000cff	Apply #0fff00 color to ratings 96, 90, 88; #000cff color to ratings 70, 60
gradient-opts		No gradient
hover-opts		No hover effect
card-opts		Use default values

Style Presets

These presets provide predefined styles for quick and easy customization.

Default

You can specify __default for the card type you want the default preset to be applied and it will use the configured Tag ID or Rating Threshold. You can also leave the field empty and the default style will be applied anyway.

Hot

You can specify __hot for the card type you want the hot preset to be applied and it will use the configured Tag ID or Rating Threshold.

Gold

You can specify __gold for the card type you want the gold preset to be applied and it will use the configured Tag ID or Rating Threshold.

Holo

You can specify __holo for the card type you want the holo preset to be applied and it will use the configured Tag ID or Rating Threshold.

Note: By default, the animation of the holographic effect is disabled, you can enable it by running: __holo___,,true.