Merge branch 'inventory-items' into 'master'

crosshair changes (WIP!), inventory visuals, camera changes, savannah trees

See merge request veloren/veloren!317

voxygen/src/hud/bag.rs

@@ -1,39 +1,44 @@
-use super::{img_ids::Imgs, Fonts};
+use super::{img_ids::Imgs, Fonts, TEXT_COLOR};
 use conrod_core::{
     color,
-    widget::{self, Button, Image, Rectangle, Scrollbar},
-    widget_ids, Colorable, Positionable, Sizeable, Widget, WidgetCommon,
+    position::Relative,
+    widget::{self, Button, Image, Rectangle /*, Scrollbar*/},
+    widget_ids, /*Color, Colorable,*/ Labelable, Positionable, Sizeable, Widget, WidgetCommon,
 };
 
 widget_ids! {
     struct Ids {
         bag_close,
-        bag_contents,
+        bag_top,
+        bag_mid,
+        bag_bot,
         inv_alignment,
         inv_grid_1,
         inv_grid_2,
         inv_scrollbar,
         inv_slot_0,
         map_title,
+        inv_slot[],
+        item1,
     }
 }
 
 #[derive(WidgetCommon)]
 pub struct Bag<'a> {
-    inventory_space: u32,
+    inventory_space: usize,
 
     imgs: &'a Imgs,
-    _fonts: &'a Fonts,
+    fonts: &'a Fonts,
     #[conrod(common_builder)]
     common: widget::CommonBuilder,
 }
 
 impl<'a> Bag<'a> {
-    pub fn new(inventory_space: u32, imgs: &'a Imgs, _fonts: &'a Fonts) -> Self {
+    pub fn new(inventory_space: usize, imgs: &'a Imgs, fonts: &'a Fonts) -> Self {
         Self {
             inventory_space,
             imgs,
-            _fonts,
+            fonts,
             common: widget::CommonBuilder::default(),
         }
     }
@@ -43,6 +48,8 @@ pub struct State {
     ids: Ids,
 }
 
+const BAG_SCALE: f64 = 4.0;
+
 pub enum Event {
     Close,
 }
@@ -65,46 +72,92 @@ impl<'a> Widget for Bag<'a> {
     fn update(self, args: widget::UpdateArgs<Self>) -> Self::Event {
         let widget::UpdateArgs { state, ui, .. } = args;
 
-        // Contents
-        Image::new(self.imgs.bag_contents)
-            .w_h(68.0 * 4.0, 123.0 * 4.0)
+        // Bag parts
+        Image::new(self.imgs.bag_bot)
+            .w_h(61.0 * BAG_SCALE, 9.0 * BAG_SCALE)
             .bottom_right_with_margins_on(ui.window, 60.0, 5.0)
-            .set(state.ids.bag_contents, ui);
+            .set(state.ids.bag_bot, ui);
+        Image::new(self.imgs.bag_mid)
+            .w_h(
+                61.0 * BAG_SCALE,
+                ((self.inventory_space + 4) / 5) as f64 * 44.0,
+            )
+            .up_from(state.ids.bag_bot, 0.0)
+            .set(state.ids.bag_mid, ui);
+        Image::new(self.imgs.bag_top)
+            .w_h(61.0 * BAG_SCALE, 9.0 * BAG_SCALE)
+            .up_from(state.ids.bag_mid, 0.0)
+            .set(state.ids.bag_top, ui);
 
         // Alignment for Grid
-        Rectangle::fill_with([58.0 * 4.0 - 5.0, 100.0 * 4.0], color::TRANSPARENT)
-            .top_left_with_margins_on(state.ids.bag_contents, 11.0 * 4.0, 5.0 * 4.0)
-            .scroll_kids()
-            .scroll_kids_vertically()
-            .set(state.ids.inv_alignment, ui);
+        Rectangle::fill_with(
+            [
+                54.0 * BAG_SCALE,
+                ((self.inventory_space + 4) / 5) as f64 * 44.0,
+            ],
+            color::TRANSPARENT,
+        )
+        .top_left_with_margins_on(state.ids.bag_top, 9.0 * BAG_SCALE, 3.0 * BAG_SCALE)
+        .scroll_kids()
+        .scroll_kids_vertically()
+        .set(state.ids.inv_alignment, ui);
+
         // Grid
-        Image::new(self.imgs.inv_grid)
-            .w_h(58.0 * 4.0, 111.0 * 4.0)
+        /*Image::new(self.imgs.inv_grid)
+            .w_h(61.0 * BAG_SCALE, 111.0 * BAG_SCALE)
+            .color(Some(Color::Rgba(1.0, 1.0, 1.0, 0.5)))
             .mid_top_with_margin_on(state.ids.inv_alignment, 0.0)
             .set(state.ids.inv_grid_1, ui);
         Image::new(self.imgs.inv_grid)
-            .w_h(58.0 * 4.0, 111.0 * 4.0)
-            .mid_top_with_margin_on(state.ids.inv_alignment, 110.0 * 4.0)
+            .w_h(61.0 * BAG_SCALE, 111.0 * BAG_SCALE)
+            .color(Some(Color::Rgba(1.0, 1.0, 1.0, 0.5)))
+            .mid_top_with_margin_on(state.ids.inv_alignment, 110.0 * BAG_SCALE)
             .set(state.ids.inv_grid_2, ui);
         Scrollbar::y_axis(state.ids.inv_alignment)
             .thickness(5.0)
             .rgba(0.33, 0.33, 0.33, 1.0)
-            .set(state.ids.inv_scrollbar, ui);
-
-        if self.inventory_space > 0 {
-            // First Slot
-            Button::image(self.imgs.inv_slot)
-                .top_left_with_margins_on(state.ids.inv_grid_1, 4.0, 4.0)
-                .w_h(10.0 * 4.0, 10.0 * 4.0)
-                .set(state.ids.inv_slot_0, ui);
+            .set(state.ids.inv_scrollbar, ui);*/
+        // Create available inventory slot widgets
+        if state.ids.inv_slot.len() < self.inventory_space {
+            state.update(|s| {
+                s.ids
+                    .inv_slot
+                    .resize(self.inventory_space, &mut ui.widget_id_generator());
+            });
+        }
+        // "Allowed" max. inventory space should be handled serverside and thus isn't limited in the UI
+        for i in 0..self.inventory_space {
+            let x = i % 5;
+            let y = i / 5;
+            Button::image(self.imgs.inv_slot)
+                .top_left_with_margins_on(
+                    state.ids.inv_alignment,
+                    4.0 + y as f64 * (40.0 + 4.0),
+                    4.0 + x as f64 * (40.0 + 4.0),
+                ) // conrod uses a (y,x) format for placing...
+                .parent(state.ids.bag_mid) // Avoids the background overlapping available slots
+                .w_h(40.0, 40.0)
+                .set(state.ids.inv_slot[i], ui);
+        }
+        // Test Item
+        if self.inventory_space > 0 {
+            Button::image(self.imgs.potion_red) // TODO: Insert variable image depending on the item displayed in that slot
+                .w_h(4.0 * 4.4, 7.0 * 4.4) // TODO: Fix height and scale width correctly to that to avoid a stretched item image
+                .middle_of(state.ids.inv_slot[0]) // TODO: Items need to be assigned to a certain slot and then placed like in this example
+                .label("5x") // TODO: Quantity goes here...
+                .label_font_id(self.fonts.opensans)
+                .label_font_size(12)
+                .label_x(Relative::Scalar(10.0))
+                .label_y(Relative::Scalar(-10.0))
+                .label_color(TEXT_COLOR)
+                .set(state.ids.item1, ui); // TODO: Add widget_id generator for displayed items
         }
-
         // X-button
         if Button::image(self.imgs.close_button)
             .w_h(28.0, 28.0)
             .hover_image(self.imgs.close_button_hover)
             .press_image(self.imgs.close_button_press)
-            .top_right_with_margins_on(state.ids.bag_contents, 0.0, 0.0)
+            .top_right_with_margins_on(state.ids.bag_top, 0.0, 0.0)
             .set(state.ids.bag_close, ui)
             .was_clicked()
         {

voxygen/src/hud/img_ids.rs

@@ -8,6 +8,10 @@ image_ids! {
         bag_contents: "voxygen/element/frames/bag.vox",
         inv_grid: "voxygen/element/frames/inv_grid.vox",
         inv_slot: "voxygen/element/buttons/inv_slot.vox",
+        grid_inv: "voxygen/element/buttons/grid_inv.vox",
+        bag_top: "voxygen/element/bag/top.vox",
+        bag_mid: "voxygen/element/bag/mid.vox",
+        bag_bot: "voxygen/element/bag/bot.vox",
 
         // Window Parts
         window_3: "voxygen/element/frames/window_3.vox",
@@ -49,9 +53,16 @@ image_ids! {
         chat_arrow_mo: "voxygen/element/buttons/arrow_down_hover.vox",
         chat_arrow_press: "voxygen/element/buttons/arrow_down_press.vox",
 
+        // Crosshair
+        crosshair: "voxygen/element/misc_bg/crosshair.vox",
+        //crosshair_outer: "voxygen/element/misc_bg/crosshair_outer.vox",
+        crosshair_inner: "voxygen/element/misc_bg/crosshair_inner.vox",
+
 ////////////////////////////////////////////////////////////////////////
         <VoxelMs9Graphic>
 
+        crosshair_outer: "voxygen/element/misc_bg/crosshair_outer.vox",
+
         // Buttons
         mmap_closed: "voxygen/element/buttons/button_mmap_closed.vox",
         mmap_closed_hover: "voxygen/element/buttons/button_mmap_closed_hover.vox",
@@ -119,9 +130,12 @@ image_ids! {
         button_hover: "voxygen/element/buttons/button_hover.vox",
         button_press: "voxygen/element/buttons/button_press.vox",
 
-        // Crosshair
-        crosshair: "voxygen/element/misc_bg/crosshair.vox",
-
+        // Items
+        potion_red: "voxygen/voxel/object/potion_red.vox",
+        potion_green: "voxygen/voxel/object/potion_green.vox",
+        potion_blue: "voxygen/voxel/object/potion_blue.vox",
+        key: "voxygen/voxel/object/key.vox",
+        key_gold: "voxygen/voxel/object/key_gold.vox",
 //////////////////////////////////////////////////////////////////////////////////////////////////////
         <ImageGraphic>
 

voxygen/src/hud/mod.rs

@@ -53,7 +53,8 @@ const MANA_COLOR: Color = Color::Rgba(0.42, 0.41, 0.66, 1.0);
 widget_ids! {
     struct Ids {
         // Crosshair
-        crosshair,
+        crosshair_inner,
+        crosshair_outer,
 
         // Character Names
         name_tags[],
@@ -124,6 +125,8 @@ pub enum Event {
     AdjustVolume(f32),
     ChangeAudioDevice(String),
     ChangeMaxFPS(u32),
+    CrosshairTransp(f32),
+    //UiScale(f32),
     CharacterSelection,
     Logout,
     Quit,
@@ -259,7 +262,7 @@ pub struct Hud {
     imgs: Imgs,
     fonts: Fonts,
     new_messages: VecDeque<String>,
-    inventory_space: u32,
+    inventory_space: usize,
     show: Show,
     to_focus: Option<Option<widget::Id>>,
     force_ungrab: bool,
@@ -271,7 +274,10 @@ impl Hud {
     pub fn new(window: &mut Window) -> Self {
         let mut ui = Ui::new(window).unwrap();
         // TODO: Adjust/remove this, right now it is used to demonstrate window scaling functionality.
-        ui.scaling_mode(ScaleMode::RelativeToWindow([1920.0, 1080.0].into()));
+        let ui_scale = 0.7;
+        ui.scaling_mode(ScaleMode::RelativeToWindow(
+            window.renderer().get_resolution().map(|e| e as f64) / ui_scale as f64,
+        ));
         // Generate ids.
         let ids = Ids::new(ui.id_generator());
         // Load images.
@@ -285,7 +291,7 @@ impl Hud {
             fonts,
             ids,
             new_messages: VecDeque::new(),
-            inventory_space: 0,
+            inventory_space: 8,
             show: Show {
                 help: false,
                 debug: true,
@@ -342,11 +348,21 @@ impl Hud {
             let mut health_back_id_walker = self.ids.health_bar_backs.walk();
 
             // Crosshair
-            Image::new(self.imgs.crosshair)
-                .w_h(21.0 * 2.0, 21.0 * 2.0)
+            Image::new(self.imgs.crosshair_outer)
+                .w_h(21.0 * 1.5, 21.0 * 1.5)
                 .middle_of(ui_widgets.window)
-                .color(Some(Color::Rgba(1.0, 1.0, 1.0, 1.0)))
-                .set(self.ids.crosshair, ui_widgets);
+                .color(Some(Color::Rgba(
+                    1.0,
+                    1.0,
+                    1.0,
+                    global_state.settings.gameplay.crosshair_transp,
+                )))
+                .set(self.ids.crosshair_outer, ui_widgets);
+            Image::new(self.imgs.crosshair_inner)
+                .w_h(21.0 * 2.0, 21.0 * 2.0)
+                .middle_of(self.ids.crosshair_outer)
+                .color(Some(Color::Rgba(1.0, 1.0, 1.0, 0.6)))
+                .set(self.ids.crosshair_inner, ui_widgets);
 
             // Render Name Tags
             for (pos, name) in (&entities, &pos, &stats, player.maybe())
@@ -376,7 +392,7 @@ impl Hud {
                 );
                 Text::new(&name)
                     .font_size(20)
-                    .color(Color::Rgba(1.0, 1.0, 1.0, 1.0))
+                    .color(Color::Rgba(0.61, 0.61, 0.89, 1.0))
                     .x_y(0.0, 0.0)
                     .position_ingame(pos + Vec3::new(0.0, 0.0, 3.0))
                     .resolution(100.0)
@@ -479,17 +495,21 @@ impl Hud {
 
         // Add Bag-Space Button.
         if self.show.inventory_test_button {
-            if Button::image(self.imgs.grid_button)
+            if Button::image(self.imgs.button)
                 .w_h(100.0, 100.0)
                 .middle_of(ui_widgets.window)
-                .label("1 Up!")
+                .label("Add 1 Space")
                 .label_font_size(20)
-                .hover_image(self.imgs.grid_button_hover)
-                .press_image(self.imgs.grid_button_press)
+                .label_color(TEXT_COLOR)
+                .hover_image(self.imgs.button_hover)
+                .press_image(self.imgs.button_press)
                 .set(self.ids.bag_space_add, ui_widgets)
                 .was_clicked()
             {
-                self.inventory_space += 1;
+                if self.inventory_space < 100 {
+                    self.inventory_space += 1;
+                } else {
+                }
             };
         }
 
@@ -617,6 +637,9 @@ impl Hud {
                     settings_window::Event::AdjustViewDistance(view_distance) => {
                         events.push(Event::AdjustViewDistance(view_distance));
                     }
+                    settings_window::Event::CrosshairTransp(crosshair_transp) => {
+                        events.push(Event::CrosshairTransp(crosshair_transp));
+                    }
                     settings_window::Event::AdjustVolume(volume) => {
                         events.push(Event::AdjustVolume(volume));
                     }

voxygen/src/hud/settings_window.rs

@@ -42,6 +42,10 @@ widget_ids! {
         mouse_zoom_slider,
         mouse_zoom_label,
         mouse_zoom_value,
+        ch_transp_slider,
+        ch_transp_label,
+        ch_transp_value,
+        ch_transp_text,
         settings_bg,
         sound,
         test,
@@ -113,6 +117,7 @@ pub enum Event {
     AdjustVolume(f32),
     ChangeAudioDevice(String),
     MaximumFPS(u32),
+    CrosshairTransp(f32),
 }
 
 impl<'a> Widget for SettingsWindow<'a> {
@@ -305,6 +310,7 @@ impl<'a> Widget for SettingsWindow<'a> {
         if let SettingsTab::Gameplay = self.show.settings_tab {
             let display_pan = self.global_state.settings.gameplay.pan_sensitivity;
             let display_zoom = self.global_state.settings.gameplay.zoom_sensitivity;
+            let crosshair_transp = self.global_state.settings.gameplay.crosshair_transp;
 
             // Mouse Pan Sensitivity
             Text::new("Pan Sensitivity")
@@ -369,6 +375,38 @@ impl<'a> Widget for SettingsWindow<'a> {
                 .font_id(self.fonts.opensans)
                 .color(TEXT_COLOR)
                 .set(state.ids.mouse_zoom_value, ui);
+
+            // Crosshair Translucency
+            Text::new("Crosshair Transparency")
+                .down_from(state.ids.mouse_zoom_slider, 10.0)
+                .font_size(14)
+                .font_id(self.fonts.opensans)
+                .color(TEXT_COLOR)
+                .set(state.ids.ch_transp_text, ui);
+
+            if let Some(new_val) = ImageSlider::continuous(
+                crosshair_transp,
+                0.0,
+                1.0,
+                self.imgs.slider_indicator,
+                self.imgs.slider,
+            )
+            .w_h(104.0, 22.0)
+            .down_from(state.ids.ch_transp_text, 8.0)
+            .track_breadth(12.0)
+            .slider_length(10.0)
+            .pad_track((5.0, 5.0))
+            .set(state.ids.ch_transp_slider, ui)
+            {
+                events.push(Event::CrosshairTransp(new_val));
+            }
+
+            Text::new(&format!("{:.2}", crosshair_transp,))
+                .right_from(state.ids.ch_transp_slider, 8.0)
+                .font_size(14)
+                .font_id(self.fonts.opensans)
+                .color(TEXT_COLOR)
+                .set(state.ids.ch_transp_value, ui);
         }
 
         // 3) Controls Tab --------------------------------

voxygen/src/scene/mod.rs

@@ -118,7 +118,7 @@ impl Scene {
         let tilt = self.camera.get_orientation().y;
         let dist = self.camera.get_distance();
         self.camera
-            .set_focus_pos(player_pos + Vec3::unit_z() * (1.95 - tilt.min(0.0) * dist * 0.75));
+            .set_focus_pos(player_pos + Vec3::unit_z() * (3.0 - tilt.min(0.0) * dist * 0.75));
 
         // Tick camera for interpolation.
         self.camera.update(client.state().get_time());

voxygen/src/session.rs

@@ -282,6 +282,13 @@ impl PlayState for SessionState {
                             warn!("Failed to save settings: {:?}", err);
                         }
                     }
+                    HudEvent::CrosshairTransp(crosshair_transp) => {
+                        global_state.settings.gameplay.crosshair_transp = crosshair_transp;
+                        global_state.settings.gameplay.crosshair_transp = crosshair_transp;
+                        if let Err(err) = global_state.settings.save_to_file() {
+                            warn!("Failed to save settings: {:?}", err);
+                        }
+                    }
                     HudEvent::AdjustVolume(volume) => {
                         global_state.audio.model.player.set_volume(volume);
 

voxygen/src/settings.rs

@@ -75,6 +75,7 @@ impl Default for ControlSettings {
 pub struct GameplaySettings {
     pub pan_sensitivity: u32,
     pub zoom_sensitivity: u32,
+    pub crosshair_transp: f32,
 }
 
 impl Default for GameplaySettings {
@@ -82,6 +83,7 @@ impl Default for GameplaySettings {
         Self {
             pan_sensitivity: 100,
             zoom_sensitivity: 100,
+            crosshair_transp: 0.6,
         }
     }
 }