Add interaction hint #615

Add text above dropped items hinting at
the use of the interaction control

e.g. pressing E

voxygen/src/hud/mod.rs

@@ -1061,7 +1061,7 @@ impl Hud {
             let mut sct_walker = self.ids.scts.walk();
             let mut sct_bg_walker = self.ids.sct_bgs.walk();
 
-            // Render overitem name
+            // Render overitem: name, etc.
             for (pos, item, distance) in (&entities, &pos, &items)
                 .join()
                 .map(|(_, pos, item)| (pos, item, pos.0.distance_squared(player_pos)))
@@ -1073,11 +1073,16 @@ impl Hud {
                 );
                 let ingame_pos = pos.0 + Vec3::unit_z() * 1.2;
 
-                // Item name
+                // Item
-                overitem::Overitem::new(&item.name(), &distance, &self.fonts)
+                overitem::Overitem::new(
-                    .x_y(0.0, 100.0)
+                    &item.name(),
-                    .position_ingame(ingame_pos)
+                    &distance,
-                    .set(overitem_id, ui_widgets);
+                    &self.fonts,
+                    &global_state.settings.controls,
+                )
+                .x_y(0.0, 100.0)
+                .position_ingame(ingame_pos)
+                .set(overitem_id, ui_widgets);
             }
 
             // Render overhead name tags and health bars

voxygen/src/hud/overitem.rs

@@ -1,6 +1,10 @@
-use crate::ui::{fonts::ConrodVoxygenFonts, Ingameable};
+use crate::{
+    settings::ControlSettings,
+    ui::{fonts::ConrodVoxygenFonts, Ingameable},
+    window::GameInput,
+};
 use conrod_core::{
-    widget::{self, Text},
+    widget::{self, RoundedRectangle, Text},
     widget_ids, Color, Colorable, Positionable, Widget, WidgetCommon,
 };
 
@@ -9,26 +13,36 @@ widget_ids! {
         // Name
         name_bg,
         name,
+        // Key
+        btn_bg,
+        btn,
     }
 }
 
-/// ui widget containing everything that goes over a item
+/// UI widget containing everything that goes over a item
 /// (Item, DistanceFromPlayer, Rarity, etc.)
 #[derive(WidgetCommon)]
 pub struct Overitem<'a> {
     name: &'a str,
-    _distance: &'a f32,
+    distance_from_player_sqr: &'a f32,
     fonts: &'a ConrodVoxygenFonts,
+    controls: &'a ControlSettings,
     #[conrod(common_builder)]
     common: widget::CommonBuilder,
 }
 
 impl<'a> Overitem<'a> {
-    pub fn new(name: &'a str, distance: &'a f32, fonts: &'a ConrodVoxygenFonts) -> Self {
+    pub fn new(
+        name: &'a str,
+        distance_from_player_sqr: &'a f32,
+        fonts: &'a ConrodVoxygenFonts,
+        controls: &'a ControlSettings,
+    ) -> Self {
         Self {
             name,
-            _distance: distance,
+            distance_from_player_sqr,
             fonts,
+            controls,
             common: widget::CommonBuilder::default(),
         }
     }
@@ -40,10 +54,14 @@ pub struct State {
 
 impl<'a> Ingameable for Overitem<'a> {
     fn prim_count(&self) -> usize {
-        // Number of conrod primitives contained in the overitem isplay. TODO maybe
+        // Number of conrod primitives contained in the overitem display.
-        // this could be done automatically?
+        // TODO maybe this could be done automatically?
-        // - 2 Text::new for name
+        // - 2 Text for name
-        2
+        // - 0 or 2 Rectangle and Text for button
+        2 + match self.controls.get_binding(GameInput::Interact) {
+            Some(_) => 2,
+            None => 0,
+        }
     }
 }
 
@@ -61,23 +79,62 @@ impl<'a> Widget for Overitem<'a> {
     fn style(&self) -> Self::Style {}
 
     fn update(self, args: widget::UpdateArgs<Self>) -> Self::Event {
-        let widget::UpdateArgs { state, ui, .. } = args;
+        let widget::UpdateArgs { id, state, ui, .. } = args;
 
-        let font_size = 30;
+        let text_color = Color::Rgba(0.61, 0.61, 0.89, 1.0);
-        // ((1.0 - (self.distance / common::comp::MAX_PICKUP_RANGE_SQR)) * 30.0) as u32;
+        let btn_color = Color::Rgba(0.0, 0.0, 0.0, 0.4);
 
-        // ItemName
+        // Example:
+        //            MUSHROOM
+        //              ___
+        //             | E |
+        //              ———
+
+        // scale at max distance is 10, and at min distance is 30
+        let scale: f64 =
+            ((1.5 - (self.distance_from_player_sqr / common::comp::MAX_PICKUP_RANGE_SQR)) * 20.0)
+                .into();
+        let text_font_size = scale * 1.0;
+        let text_pos_y = scale * 1.2;
+        let btn_rect_size = scale * 0.8;
+        let btn_font_size = scale * 0.6;
+        let btn_rect_pos_y = 0.0;
+        let btn_text_pos_y = btn_rect_pos_y + ((btn_rect_size - btn_font_size) * 0.5);
+        let btn_radius = btn_rect_size / 5.0;
+
+        // Item Name
         Text::new(&self.name)
             .font_id(self.fonts.cyri.conrod_id)
-            .font_size(font_size)
+            .font_size(text_font_size as u32)
             .color(Color::Rgba(0.0, 0.0, 0.0, 1.0))
-            .x_y(-1.0, 48.0)
+            .x_y(-1.0, text_pos_y - 2.0)
+            .parent(id)
+            .depth(self.distance_from_player_sqr + 4.0)
             .set(state.ids.name_bg, ui);
         Text::new(&self.name)
             .font_id(self.fonts.cyri.conrod_id)
-            .font_size(font_size)
+            .font_size(text_font_size as u32)
-            .color(Color::Rgba(0.61, 0.61, 0.89, 1.0))
+            .color(text_color)
-            .x_y(0.0, 50.0)
+            .x_y(0.0, text_pos_y)
+            .depth(self.distance_from_player_sqr + 3.0)
+            .parent(id)
             .set(state.ids.name, ui);
+
+        // Pickup Button
+        if let Some(key_button) = self.controls.get_binding(GameInput::Interact) {
+            RoundedRectangle::fill_with([btn_rect_size, btn_rect_size], btn_radius, btn_color)
+                .x_y(0.0, btn_rect_pos_y)
+                .depth(self.distance_from_player_sqr + 1.0)
+                .parent(id)
+                .set(state.ids.btn_bg, ui);
+            Text::new(&format!("{}", key_button))
+                .font_id(self.fonts.cyri.conrod_id)
+                .font_size(btn_font_size as u32)
+                .color(text_color)
+                .x_y(0.0, btn_text_pos_y)
+                .depth(self.distance_from_player_sqr + 2.0)
+                .parent(id)
+                .set(state.ids.btn, ui);
+        }
     }
 }