feat(teamMatchMaking): add a symbol whether the map is enabled/disabled

FAForever · Dec 20, 2024 · f2acdb6 · f2acdb6
1 parent eaec53e
commit f2acdb6
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 23 deletions.
diff --git a/src/main/java/com/faforever/client/teammatchmaking/TeamMatchmakingMapListController.java b/src/main/java/com/faforever/client/teammatchmaking/TeamMatchmakingMapListController.java
@@ -185,7 +185,7 @@ private Pane createMapTile(MapVersion mapVersion) {
     Integer playerBracketIndex = this.playerBracketIndex.getValue();
     List<MatchmakerQueueMapPool> pools = this.sortedMapPools.getValue();
     Map<MatchmakerQueueMapPool, List<MapVersion>> brackets = this.brackets.get();
-    double relevanceLevel = 1;
+    boolean isRelevant = true;
     if (playerBracketIndex != null) {
       int bracketDistance = brackets.entrySet()
                                     .stream()
@@ -197,16 +197,12 @@ private Pane createMapTile(MapVersion mapVersion) {
                                     .min()
                                     .orElseThrow();
 
-      relevanceLevel = switch (bracketDistance) {
-        case 0 -> 1;
-        case 1 -> 0.2;
-        default -> 0;
-      };
+      isRelevant = bracketDistance == 0;
     }
 
     TeamMatchmakingMapTileController controller = uiService.loadFxml(
         "theme/play/teammatchmaking/matchmaking_map_tile.fxml");
-    controller.setRelevanceLevel(relevanceLevel);
+    controller.setIsRelevant(isRelevant);
     controller.setMapVersion(mapVersion);
     return controller.getRoot();
   }

diff --git a/src/main/java/com/faforever/client/teammatchmaking/TeamMatchmakingMapTileController.java b/src/main/java/com/faforever/client/teammatchmaking/TeamMatchmakingMapTileController.java
@@ -8,15 +8,16 @@
 import com.faforever.client.map.MapService;
 import com.faforever.client.map.MapService.PreviewSize;
 import com.faforever.client.map.generator.MapGeneratorService;
-import javafx.beans.property.DoubleProperty;
+import javafx.beans.property.BooleanProperty;
 import javafx.beans.property.ObjectProperty;
-import javafx.beans.property.SimpleDoubleProperty;
+import javafx.beans.property.SimpleBooleanProperty;
 import javafx.beans.property.SimpleObjectProperty;
 import javafx.beans.value.ObservableValue;
 import javafx.scene.control.Label;
 import javafx.scene.effect.ColorAdjust;
 import javafx.scene.image.ImageView;
 import javafx.scene.layout.Pane;
+import javafx.scene.layout.Region;
 import javafx.scene.layout.VBox;
 import lombok.RequiredArgsConstructor;
 import lombok.extern.slf4j.Slf4j;
@@ -42,20 +43,17 @@ public class TeamMatchmakingMapTileController extends NodeController<Pane> {
   public Label authorLabel;
   public Label sizeLabel;
   public VBox authorBox;
+  public Region relevanceIcon;
 
   protected final ObjectProperty<MapVersion> entity = new SimpleObjectProperty<>();
-  private DoubleProperty relevanceLevel = new SimpleDoubleProperty(0);;
+  private final BooleanProperty isRelevant = new SimpleBooleanProperty(false);
 
-  public double getRelevanceLevel(){
-    return this.relevanceLevel.get();
-  }
-  public void setRelevanceLevel(double value) {
-    this.relevanceLevel.set(value);
-  }
-  public DoubleProperty relevanceLevelProperty() {
-    return this.relevanceLevel;
+
+  public void setIsRelevant(boolean isRelevant) {
+    this.isRelevant.set(isRelevant);
   }
 
+
   @Override
   public Pane getRoot() {
     return root;
@@ -68,14 +66,16 @@ public void setMapVersion(MapVersion mapVersion) {
 
 
   @Override
-  protected void onInitialize(){
+  protected void onInitialize() {
     thumbnailImageView.imageProperty().bind(entity.map(mapVersionBean -> mapService.loadPreview(mapVersionBean, PreviewSize.SMALL))
                                                   .flatMap(imageViewHelper::createPlaceholderImageOnErrorObservable));
-    thumbnailImageView.effectProperty().bind(relevanceLevel.map(relevanceLevel -> {
+    thumbnailImageView.effectProperty().bind(isRelevant.map(isRel -> {
       ColorAdjust grayscaleEffect = new ColorAdjust();
-      grayscaleEffect.setSaturation(-1 + relevanceLevel.intValue());
+      grayscaleEffect.setSaturation(isRel ? 0 : -1);
       return grayscaleEffect;
     }));
+    isRelevant.addListener((observable, oldValue, newValue) -> updateRelevanceIcon(newValue));
+
     ObservableValue<Map> mapObservable = entity.map(MapVersion::map);
 
     nameLabel.textProperty().bind(mapObservable.map(map -> {
@@ -98,4 +98,13 @@ protected void onInitialize(){
     }));
     sizeLabel.textProperty().bind(entity.map(MapVersion::size).map(size -> i18n.get("mapPreview.size", size.widthInKm(), size.heightInKm())));
   }
+
+
+  private void updateRelevanceIcon(boolean isRelevant) {
+    if (isRelevant) {
+      relevanceIcon.getStyleClass().setAll("icon", "icon16x16", "check-icon", "icon-map-available");
+    } else {
+      relevanceIcon.getStyleClass().setAll("icon", "icon16x16", "x-icon", "icon-map-not-available");
+    }
+  }
 }
diff --git a/src/main/resources/theme/icons.css b/src/main/resources/theme/icons.css
@@ -327,6 +327,10 @@
   -fx-shape: "M12 21.563l14.125-14.125 1.875 1.875-16 16-7.438-7.438 1.875-1.875z";
 }
 
+.x-icon {
+  -fx-shape: "M31.708 25.708c-0-0-0-0-0-0l-9.708-9.708 9.708-9.708c0-0 0-0 0-0 0.105-0.105 0.18-0.227 0.229-0.357 0.133-0.356 0.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13 0.048-0.252 0.124-0.357 0.228 0 0-0 0-0 0l-9.708 9.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057 0.229l-4.586 4.586c-0.286 0.286-0.361 0.702-0.229 1.057 0.049 0.13 0.124 0.252 0.229 0.357 0 0 0 0 0 0l9.708 9.708-9.708 9.708c-0 0-0 0-0 0-0.104 0.105-0.18 0.227-0.229 0.357-0.133 0.355-0.057 0.771 0.229 1.057l4.586 4.586c0.286 0.286 0.702 0.361 1.057 0.229 0.13-0.049 0.252-0.124 0.357-0.229 0-0 0-0 0-0l9.708-9.708 9.708 9.708c0 0 0 0 0 0 0.105 0.105 0.227 0.18 0.357 0.229 0.356 0.133 0.771 0.057 1.057-0.229l4.586-4.586c0.286-0.286 0.362-0.702 0.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z"
+}
+
 .spinner-icon {
   -fx-shape: "M32 12h-12l4.485-4.485c-2.267-2.266-5.28-3.515-8.485-3.515s-6.219 1.248-8.485 3.515c-2.266 2.267-3.515 5.28-3.515 8.485s1.248 6.219 3.515 8.485c2.267 2.266 5.28 3.515 8.485 3.515s6.219-1.248 8.485-3.515c0.189-0.189 0.371-0.384 0.546-0.583l3.010 2.634c-2.933 3.349-7.239 5.464-12.041 5.464-8.837 0-16-7.163-16-16s7.163-16 16-16c4.418 0 8.418 1.791 11.313 4.687l4.687-4.687v12z";
 }

diff --git a/src/main/resources/theme/play/teammatchmaking/matchmaking_map_tile.fxml b/src/main/resources/theme/play/teammatchmaking/matchmaking_map_tile.fxml
@@ -6,7 +6,8 @@
 <?import javafx.scene.layout.RowConstraints?>
 <?import javafx.scene.layout.VBox?>
 <?import javafx.scene.layout.StackPane?>
-
+<?import javafx.scene.layout.Region?>
+<?import javafx.scene.layout.HBox?>
 
 
 <StackPane fx:id="root" prefWidth="125.0" fx:controller="com.faforever.client.teammatchmaking.TeamMatchmakingMapTileController" prefHeight="125.0" xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1" style="-fx-margin:0 0 0 0;">
@@ -24,7 +25,13 @@
         </VBox>
 
         <VBox prefHeight="60" alignment="BOTTOM_CENTER" prefWidth="125" GridPane.rowIndex="2" styleClass="image-dimmer-light">
-            <Label fx:id="nameLabel" style="-fx-line-spacing: 0;"  alignment="TOP_CENTER" textAlignment="CENTER" wrapText="true"/>
+            <HBox alignment="CENTER">
+                <Label fx:id="nameLabel" style="-fx-line-spacing: 0;"  alignment="TOP_CENTER" textAlignment="CENTER" wrapText="true">
+                    <graphic>
+                        <Region fx:id="relevanceIcon" styleClass="icon, icon16x16, x-icon, icon-map-not-available"/>
+                    </graphic>
+                </Label>
+            </HBox>
             <Label fx:id="sizeLabel" style="-fx-line-spacing: 0;"  alignment="BOTTOM_CENTER" textAlignment="CENTER" />
         </VBox>
     </GridPane>

diff --git a/src/main/resources/theme/style.css b/src/main/resources/theme/style.css
@@ -1135,6 +1135,18 @@
   -fx-background-color: linear-gradient(to top, #00000000 0%, #00000000 10%, #00000033 20%, #0000004d 30%, #00000066 40%, #00000080 50%, #00000099 60%, #000000b3 70%);
 }
 
+.icon-map-available {
+  -fx-background-color: -good;
+  -fx-padding: 0;
+  -fx-margin: 0;
+}
+
+.icon-map-not-available {
+  -fx-background-color: -bad;
+  -fx-padding: 0;
+  -fx-margin: 0;
+}
+
 .tmm-maplist {
  -fx-padding: 20 8 20 20; //related to PADDING constant, do not change without adjusting it
 }