Implement "change dice" on client

princeibs commented 2 days ago

Description In the toolbox window, there is a page that allows the player change the current dice. Currently it's not functional.

Action Items

Implement the page and add the functionality that will allow the player select from a list of available dice.
The dice selected by the player should be the current dice in display and available for all players to roll during game play.

onlydustapp[bot] commented 2 days ago

Hi @Oshioke-Salaki! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

Jemiiah commented 2 days ago

I would love to do this @princeibs

onlydustapp[bot] commented 2 days ago

Hi @Jemiiah! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

NueloSE commented 2 days ago

@princeibs i would like to work on this

onlydustapp[bot] commented 2 days ago

Hi @NueloSE! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

CollinsC1O commented 2 days ago

@princeibs I will love to work on this

onlydustapp[bot] commented 2 days ago

Hi @CollinsC1O! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

martinvibes commented 2 days ago

i would love to work on this issue @princeibs

onlydustapp[bot] commented 2 days ago

Hi @martinvibes! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

onlydustapp[bot] commented 2 days ago

Hi @dev-chinx! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

Kaminar-i commented 2 days ago

hello @princeibs i would love to work on this

onlydustapp[bot] commented 2 days ago

Hi @Kaminar-i! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

ShantelPeters commented 2 days ago

Please I’ll like to take this up @princeibs

onlydustapp[bot] commented 2 days ago

Hi @ShantelPeters! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

onlydustapp[bot] commented 2 days ago

Hi @Jemiiah! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

melnikga commented 2 days ago

Hi, can I take this? My OnlyDust profile: https://app.onlydust.com/u/melnikga

onlydustapp[bot] commented 2 days ago

Hi @melnikga! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

onlydustapp[bot] commented 2 days ago

Hi @melnikga! Maintainers during the ODHack # 8.0 will be tracking applications via OnlyDust. Therefore, in order for you to have a chance at being assigned to this issue, please apply directly here, or else your application may not be considered.

CollinsC1O commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hello @princeibs I'm a front-end and also a blockchain developer and I would love to work on this issue

How I plan on tackling this issue

i will Implement the page and add the functionality that will allow the player select from a list of available dice
I will ensure that the dice selected by the player should be the current dice in display and available for all players to roll during game play

ShantelPeters commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a blockchain developer and also experienced in the field of UI/UX , please i will love to contribute to this ecosystem kindly assign ,i am avaliable to work.

How I plan on tackling this issue

Here is how i will approach this problem by:

Implementing UI:
- I will create a page in the toolbox window with a dropdown or list to display available dice.
Adding Functionality:
- Implement a selection mechanism that updates the current dice based on the player's choice.
Update Game State:
- Ensure the selected dice is stored in a way that makes it accessible to all players during gameplay.
Display Current Dice:
- Update the display to reflect the currently selected dice for all players.

NueloSE commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

i am a frontend developer with

How I plan on tackling this issue

UI Implementation: Create a visually appealing dice selection page that lists all available dice. State Management: Handle dice selection logic and update the current game state. Game Integration: Ensure the selected dice is the one used during gameplay for all players. Testing: Test the functionality and make sure the dice selection works across different devices and for multiple players in real-time.

Dprof-in-tech commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hello, i am Dprof-in-tech, an experienced Full Stack Blockchain Developer and I am excited to contribute my skills to this project in this ODHACK 8. With a strong background in Next.js, TypeScript, JavaScript, React, Node.js, Rust and Cairo, I've honed my technical skills across the blockchain development landscape.

My journey with OnlyDust began at Edition 2, and I've since made 34 contributions across 11 projects. This extensive experience on the platform has allowed me to develop a keen understanding of delivering high-quality solutions under tight deadlines. I bring a unique blend of technical prowess and user-centric design to every project, whether I'm crafting immersive 3D experiences or developing innovative smart contracts.

My track record demonstrates my ability to adapt quickly and contribute effectively to diverse challenges. I'm confident in my capacity to tackle new problems and drive innovation in the blockchain space. As we begin ODHACK 8, I'm eager to leverage my hackathon experience and technical skills to push the boundaries of what's possible in blockchain development.

Below is a link to my OnlyDust public profile. https://app.onlydust.com/u/Dprof-in-tech

How I plan on tackling this issue

Approach for Implementing the "Change Dice" Feature on the Client:

I will review the existing code and UI: First, I will inspect the existing implementation of the toolbox window to understand how the dice display and interaction components are structured. I will check if there are any placeholder elements for the dice selection feature and identify where the non-functional elements need to be updated.

I will create the dice selection interface:

I will build the UI for selecting a dice, following the design provided in the image (or from the Figma if applicable). This will include: A list or grid of available dice options, displayed visually for the player to choose from. Proper styling to ensure it matches the overall project’s theme, with hover and selection states that visually indicate the selected dice.

I will implement the dice selection functionality: I will add event handlers (e.g., onClick) to each dice option in the list, so that when a player clicks on a dice, it becomes the "active" dice. This functionality will involve updating the state to reflect the selected dice. I will ensure the selected dice is stored globally (or at an appropriate level) so that it persists through gameplay.

I will sync the selected dice with the current game session: I will ensure that the dice selected by the player is set as the current dice for all players in the session. This might involve updating or sending the selected dice information to the game state via an API or shared state management system, so that it can be used during gameplay.

I will handle any real-time synchronization needed if multiple players are viewing or interacting with the dice simultaneously.

I will test the dice functionality in gameplay: I will integrate the newly selected dice into the gameplay logic, ensuring that once a player selects a dice, it becomes the default dice used for rolling during the game. I will ensure that all players in the game session are able to see and roll the newly selected dice without issues.

I will handle edge cases: I will address scenarios where a player might try to change the dice mid-game or where no dice is selected initially. I will set sensible defaults or provide warnings where necessary. I will ensure that any dice-specific rules or limitations are followed (if there are specific game rules governing dice changes).

I will test the functionality across devices and scenarios: I will test the dice selection across different devices and screen sizes to ensure that the UI is responsive and functional. I will also perform tests with multiple players to confirm that the selected dice are correctly reflected for all players in real time.

I will submit the PR with a demo: I will include a short demo video or series of screenshots showing how the player can select a dice and how the selected dice is reflected in the game.

I will include notes on how the new dice functionality is integrated and any steps required to test it during the review process.

aji70 commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

i'm a solidity and frontend developer

Solomonsolomonsolomon commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

3+ years fullstack developer

How I plan on tackling this issue

I looked at the codebase,the I will implement the available dice selection tab in the toolbox.tsx, then ensure whatever die is selected is used during gameplay

Rayan9064 commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a Full Stack Developer and Cairo Developer. I have good experience building web application. I am new to Open Source and want to begin with this project. I am good in React, Typescript, Redux and Context APIs. I can leverage the same to make this a better game for the users.

How I plan on tackling this issue

1) Checking the structure of the project and understanding the codebase. 2) Knowing the tech stack required 3) Finding the area of the problem. 3) Designing the Figma solution. 4) Implementing into code. 5) Testing the code by inspecting in different screen size. 6) Modify the code when not working as expected. 7) After successful review, create a pull request.

anonfedora commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a Blockchain/Software Developer with experience in ReactJS, NestJS, TypeScript, Solidity, and Cairo.

How I plan on tackling this issue

Here’s how: I'll review the animation prototype and proceed to implement the action section on the page. I'll develop the action section as a React component, dividing the functionality into smaller, reusable components (e.g., buttons, forms). I'll configure the necessary state or props to manage interactions (e.g., inputs, button clicks) and ensure the action section is responsive across various screen sizes and devices.

I'll thoroughly test the action section to confirm it functions as expected, including dynamic features. Finally, I'll integrate the action section into the page, positioning it appropriately and verifying it interacts seamlessly with other page components.

estherbreath commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a fullstack developer

As a fullstack developer, I will leverage my background to solve this issue by: Utilizing front-end skills to create an interactive dice selection interface. Applying backend knowledge to manage dice state and ensure real-time updates for all players. Implementing API endpoints for dice selection and retrieval. Ensuring responsive design for various screen sizes.

How I plan on tackling this issue

I will develop a user-friendly dice selection page with a list view. Implement server-side logic to store and broadcast the chosen dice. Update client-side displays to reflect the new dice selection in real-time.

Agbeleshe commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a full stack developer with 3 years experience in HTML, CSS JavaScript, node.js React, Typescript and other libraries and frameworks .

How I plan on tackling this issue

I would love this to be my first contribution to the platform. To solve this problem i will iterate the list of available dice array and create an function that passes the details of the selected dice and populates it where needed so that when a player selects a dice it update the state with the chosen dice and make it the current dice.

Otaiki1 commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hi I am a blockchain developer with 3 years experience. Previously contributed to this project and would love to contribute again.

How I plan on tackling this issue

I would have to create a general context /state for the dice that would allow it to be used throughout the game once it has been updated/changed

Jayse007 commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I would like to take this task, to be delivered within 26, September, 2024- 30, September, 2024. I am Shawon James. I am a programmer with intensive knowledge in Python and Javascript. I engage in web development both backend and frontend.

How I plan on tackling this issue

I would add an event based on clicking that would decrease the number of dice by 1 after clicking if the number of dice is higher than 0. And if the number of dice is 0, it would do nothing. But this will have to be linked to user sessions on the backend in order to store the number of dice for the particular user logged in.

melnikga commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Can I take this? I’ve participated in almost every ODHack, and I already contributed to the StarkLudo project at the last hackathon. I have extensive experience in frontend development. I can handle this task.

How I plan on tackling this issue

My profile on OD: https://app.onlydust.com/u/melnikga

Benjtalkshow commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm Benjamin, a full-stack JavaScript developer, and I'm excited to enhance the Ludo game by implementing the "change dice" feature in the toolbox window. With my background in creating interactive elements, including 18 contributions at OnlyDust, I’m ready to bring this functionality to life.

How I plan on tackling this issue

To start, I will develop the page that allows players to change the current dice. I’ll ensure that it includes a user-friendly interface where players can easily select from a list of available dice options.

Once a player makes a selection, I will make sure that the chosen dice is displayed as the current dice and is accessible for all players during gameplay. This will create a more dynamic gaming experience, as everyone can see and use the same dice.

I’ll thoroughly test the functionality to confirm that the change reflects correctly in the game and that all players can roll the selected dice seamlessly. My goal is to make the dice selection process intuitive and engaging, adding to the overall enjoyment of the game.

GoSTEAN commented 2 days ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I have experience in frontend development, particularly in creating interactive user interfaces with frameworks like React and Next.js. I’ve worked on game-related projects that involve managing user interactions and updating game states. My skills in managing state and user input, combined with experience in implementing dynamic UIs, will help me efficiently build the functionality for selecting dice in the game.

How I plan on tackling this issue

I would begin by designing the UI to display the available dice options in the toolbox window. Next, I’d implement functionality to allow the player to select a dice from the list, updating the current dice state accordingly. This selected dice would then be reflected throughout the game as the dice available for all players to roll. I would also ensure that the current dice state is stored persistently, so the selected dice remains consistent across sessions if needed.

suhas-sensei commented 1 day ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Looking forward to being assigned this issue, my previous experiences in hackathons and last internship, i can leverage those to come up with a solution to the issues at stake. Also this my fist Odhack, so bonus points for me (emotionally) if i get assigned this issue :)

How I plan on tackling this issue

Well well, a lot of deep dives in the comments above! As a Tech Meme Engineer and developer, I’ve got a clean plan for this:

Build the dice selection UI based on the mockup, ensuring a responsive, intuitive experience.
Sync the selected dice to the global state for all players to see and roll in real-time.
Use event handlers for seamless dice selection and update the current game state.
Test across devices for smooth gameplay and compatibility.

just about 2 days of work maybe

abdegenius commented 1 day ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a skilled fullstack developer with a wealth of experience in both frontend and backend JavaScript. With a solid foundation in testing,I have mastered frameworks like Mocha, Chai, and Jest to ensure robust, reliable code in every project. In addition to traditional web development, I have a strong background in blockchain technology, with hands-on experience in Solidity for Ethereum-based smart contracts. Moreover, I have delved into the emerging world of StarkNet, working with Cairo, a cutting-edge language tailored for STARKs, making them a versatile developer capable of bridging both traditional and decentralized web applications.

How I plan on tackling this issue

Setting the current user selected Dice option to be displayed for all the users in a game to use can certainly be a tricky implementation but it is one implementation that i have dabbled with in the past across the various projects i have worked on before, using the current state management and data storage available in the project this can easily be achievement efficiently and effectively!

JoelVR17 commented 1 day ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

UI: Copy Button Next to Addresses

Hello Starkludo team,

I am Joel Vargas, and I'm a member of Dojo Coding. I also come from OnlyDust.

I would like to request the assignment of the issue related to Copy Button Next to Addresses. Below is my proposed approach for implementing this issue:

How I plan on tackling this issue

Implementation Plan

STEP 1: Analyze the current component where the addresses are displayed.
Description: I will review the existing code to understand how addresses are rendered and identify where to insert the copy button.

STEP 2: Create a new component for the copy button.
Description: This component will include an icon and a tooltip that shows a small message when hovered over. I will ensure it integrates well with the existing UI using SCSS and Tailwind CSS.

STEP 3: Implement the copy functionality.
Description: I will use the Clipboard API to allow users to copy the address to their clipboard when they click the button.

Dice Selection Functionality

Description: In the toolbox window, there is a page that allows the player to change the current dice. Currently, it's not functional.

Action Items

Implement the page:
I will create a new page in the toolbox window that allows players to view and select available dice.
Add functionality for dice selection:
I will implement logic to handle player selection from a list of available dice. The selected dice will be displayed as the current dice for all players to roll during gameplay.
Ensure state management:
I will manage the state using React’s context or a state management library to ensure that the selected dice are available for all players throughout the game session.

I look forward to your feedback on my approach!

MullerTheScientist commented 1 day ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a full-stack developer with experience in QA testing and languages like Python, Cairo, Solidity, React, and JavaScript.

How I plan on tackling this issue

Step 1: Define Dice Options Determine available dice types (e.g., six-sided, eight-sided, custom) Create a data structure to store dice options (e.g., JSON object) Step 2: Create Dice Selection UI Design and implement a user interface for selecting dice: Dropdown menu Button group Radio buttons Step 3: Update Dice Display Create a function to update the dice display based on the selected dice type: Update dice image or SVG Update dice value range

sivicstudio / starkludo