Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature]: In the matchmaker map preview, add a symbol whether or not the map is enabled #3287

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -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()
Expand All @@ -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();
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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;
Expand All @@ -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 -> {
Expand All @@ -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");
}
}
}
4 changes: 4 additions & 0 deletions src/main/resources/theme/icons.css
Original file line number Diff line number Diff line change
Expand Up @@ -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";
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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;">
Expand All @@ -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>
Expand Down
12 changes: 12 additions & 0 deletions src/main/resources/theme/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -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
}
Expand Down