Repository
https://github.com/artolabs/steemax
SteemAX helps minnow content-creators and whale curators
by automating an exchange of upvotes between their quality blog posts, allowing both 1 to 1 as well as disproportional exchanges that grant bigger curations, better support than a bid bot, and the long-term support they both deserve.
SteemAX 1.4 Improvements
First of all, thank you to @camiloferrua for providing the designs that guided the improvements to the GUI on SteemAX!
Using the mockups provided, the table that displays the exchange history (at https://steemax.info/history) was updated with a new "clock" and "exchange arrows" graphics, and the fonts were made bigger, giving the table a much nicer feel and easier readability.
Using the same design guidelines, and reusing the same graphics, the Invite Info Page (my page provided as an example) was also updated to have the same look and feel. Additionally, the Accept, Cancel, Barter and Send (previously named "Start") buttons have all been color coded so that when they are activated the "Steem Connect" button shares their color letting the user know which command will be sent to @steem-ax.
SteemAX now has a global navigation menu that can be accessed from every page (accept the Home page) by clicking the "hamburger icon", which then reveals the menu via CSS animation.
The menu and all other changes in this update have all be made mobile ready, using media queries for screen sizes 380, 600 and 1024 and above. All designs are responsive and will readily reformat themselves on the fly.
Color Coding
One of the biggest problems people were having when using SteemAX was understanding how to send the invite after it has been created. A user must send $0.001 SBD to @steem-ax along with the Memo ID Code in the memo field in order for their invite to be sent to the invitee. SteemAX works this way because:
- The only polite way to send a message to another Steemian on the blockchain is via the memo field when sending funds.
- Requiring a monetary send deters spammers from using SteemAX to gain exchanges for spam accounts.
- SteemAX only has permission to vote on behalf of your account, and never has permission to transfer funds.
After the user creates their invites they will then click the pending invite counter (see previous update) to see a complete list of all their exchanges, including active exchanges as well as those pending further user action. The invites recently created by the user now have a blue button labeled "Send" instead of "Start". There is no longer a "Cancel" button, but instead there is now a grey "X" at the top right of every exchange invite. When the user clicks either of these buttons a new box is revealed showing the exact vote exchange values along with the button the sends the selected command to @steem-ax. Now that the buttons are color code, clicking the blue "Send" button also turns the "Steem Connect" button blue, and likewise, clicking the cancellation "X" turns the Steem Connect button red. Additionally, the Barter button is coded grey, and the Accept button is also blue as it will never appear at the same time as the send button.
To accomplish this:
The HTML for each button was updated to include the CSS class name, giving individual control of the buttons. This HTML is generated by web.py. Commit d1fca01
The CSS was updated to include the classes that color the buttons. This commit also shows all the new classes created to update the GUI as per @camiloferrua's designs (over 1000 additional lines of code). Commit 4ae80f2
The Javascript was updated to include the color changes as each particular function is executed for those buttons. Commit 683a94b
Navigation Menu
A new "hamburger icon" now appears at the top right of every page except the home page, which when clicked will cause a menu to appear at the far right of the screen. This menu is sized appropriately for all screen sizes. The options in the menu are very simple and will expand with additional updates, but for now they include returning home, seeing the exchange history, creating an invite and seeking help via the Artopium discord server.
To accomplish this:
The HTML of the Invite Info Page, the Exchange History Page, and the Invite Creation Form were all updated to include the menu icon as well as the menu and it's options. Additionally, these commits contain updates needed to incorporate @camiloferrua's designs. Commit 7fb5031 Commit 4f8ebac Commit 60765c8
The CSS in the
page_layoutfiles, used as site-wide "template code", was updated to give the menu a very basic design. Hopefully this will be improved with graphic icons via a task request. Commit 07d53ebThe Javascript was updated to rotate the menu icon, as well as display the menu itself. Commit 683a94b
Issues Fixed
There were two issues that were fixed in this update.
Issue #11: The cancellation notice was forwarded to the invitee if it was canceled immediately after being created, causing the invitee to receive a notice for an exchange they have not yet accepted. Additionally, if they have never been to SteemAX before this could potentially be their first message ever. Yikes! This was fixed by updating the code in axtrans.py in Commit d53f109
Issue #12: The ratio slider would skip the numbers 1 and 11. The logic was ajusted a little bit as it was found to be a bit messy, however the real problem lies in the fact that using the mouse causes the ratio output to skip numbers, particularly those nearest to 1 and 11, however if you use the left and right arrows on the keyboard to move the slider all numbers are displayed correctly. This shows it's not a logical error but one of mouse sensitivity. Logic was updated in Commit f6b26ea
Technology Stack
SteemAX is written to use Python 3.5 and MySQL. The web interface for https://steemax.trade and https://steemax.info has been written in HTML, CSS and Javascript.
Roadmap
In the future more contributors will be brought into the fold
via Task Requests to help improve the functionality of the site and most especially the look and feel. After all, projects always benefit from the synergistic action of teamwork.
Contact
Please contact Mike (Mike-A) on Discord
https://discord.gg/97GKVFC