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

gui: Overhaul the voting UI #2151

Merged
merged 9 commits into from Jun 10, 2021

Conversation

cyrossignol
Copy link
Member

@cyrossignol cyrossignol commented Jun 1, 2021

This replaces the voting GUI with a new design based on #847. It adds these features:

  • A header bar with a poll title filter
  • Distinct tabs for "active" and "completed" polls (vs. "active" and "all" in one screen)
  • A new list view for polls and minor updates for the table view
  • A loading animation displayed when refreshing polls
  • A "new poll received" alert banner and system tray notification
  • A revamped poll results dialog and visualizations
  • A "create poll" wizard with more structure than the old dialog
  • A simple (for now) "submit vote" wizard

The scope of this PR does not include these proposed features:

The omitted items listed above need non-trivial support from core features. I chose to limit the scope of this PR to appearance and functionality changes that could be accomplished without modifying core behavior much. I'll address the other items individually in the future.


Voting Page

The main voting section defaults to the list view of "cards" proposed in #847. I kept the table view as well. A user can toggle between the two with the first toolbar button. The second toolbar button opens a menu used to choose a field to sort the view by (the list doesn't have sortable table headers). Unlike the table view, the list view displays the approximated remaining time for active polls next to the "vote" button (#1280). The remaining time labels update every 60 seconds, but a user still needs to press "refresh" to update the poll results because of the computational cost with the current implementation. Future optimizations may remove that limitation.

When a participant broadcasts a new poll, this page will display an alert banner under the "active" tab, and the GUI will pop-up an accompanying system notification. The notifications can be disabled in the GUI options like the transaction notifications.

light_vote_page_active

dark_vote_page_active

The "completed" tab does not display a "vote" button for the finished polls:

dark_vote_page_completed

The page prompts a user to press "refresh" for the first visit on either tab:

dark_vote_page_no_result

While a tab reloads, it displays an infinite progress bar animation across the top as a loading indicator:

dark_vote_page_loading


Poll Results Dialog

The poll details dialog now displays the information in a unified view. Since the proposed design uses progress bars for visualizations instead of a pie chart, we can drop the Qt Charts submodule dependency.

light_poll_details_dialog

dark_poll_details_dialog


Poll Wizard

I replaced the "create poll" dialog with a wizard to address feedback about invalid polls (#1725, #1788). The wizard provides some guidance for Gridcoin's poll requirements. A user begins by choosing the poll type. The selected type influences how the wizard configures the poll form, but there is no protocol behavior for these types yet. This page encourages a user to read the voting process on the wiki.

image

For project whitelist additions, the wizard provides a special page that introduces a user to the approval process. A user must check the box to proceed.

As an aside, I used links to avoid embedding the information in the application as much as possible. These are living documents, and it's much easier to update and translate a website than a piece of desktop software.

image

The "remove" option displays the current projects for convenience:

light_poll_wizard_project_page_remove

The next page prepopulates and locks some fields based on the selected poll type as described by the wiki. The page suggests a title for project polls only.

light_poll_wizard_details_page_project

As an example, here is the page for a development poll. The "duration" and "weight type" fields lock for all but the "survey" (opinion/casual) poll type. I'm not sure whether we want to lock "duration" because the documentation describes the requirement as a "minimum" number of days, but the community seems to oppose polls longer than the minimum duration.

The improved choices editor now supports drag-and-drop to reorder the items.

light_poll_wizard_details_page_dev

Pressing the "create poll" button prompts for fee confirmation, sends the poll transaction, and displays a summary page with the poll ID for reference:

light_poll_wizard_details_page_ask_fee

light_poll_wizard_summary_page


Vote Wizard

The vote wizard is a simple response form for now, but it provides a framework for future features like UTXO selection for vote weight control and privacy. It displays a summary page with the vote ID for reference:

dark_vote_wizard_ballot

dark_vote_wizard_summary

Closes #1279.

@RoboticMind
Copy link
Contributor

Wow that looks great! I think this would also close #1725

Minor nitpick, but I think we should probably use the term(s) opinion or casual instead of survey since that's not really terminology that's used elsewhere.

@jamescowens
Copy link
Member

@cyrossignol I merged this along with the args PR on a test branch on my fork to try it out. So far really looks slick!

@jamescowens
Copy link
Member

I have tested this and like it a lot.

Copy link
Member

@jamescowens jamescowens left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ACK

@cyrossignol
Copy link
Member Author

cyrossignol commented Jun 8, 2021

Thanks, all.

Minor nitpick, but I think we should probably use the term(s) opinion or casual instead of survey since that's not really terminology that's used elsewhere.

@RoboticMind I tried to future-proof the category titles a bit. If these make sense, could we update the documentation on the web site?

  • Project Listing: there have been several discussions around avoiding the term "whitelist" to follow the trend in the industry. I was careful to refrain from using the term in new material.
  • Protocol Development: ...since "development" is too broad, and we don't need to vote for every change to the code base.
  • Governance: a more precise term than "management" which could apply to any of the categories, really.
  • Survey: a more generic term that can encompass all of the free-form possibilities ("opinion", "casual", "informal", etc.) without a restrictive implication (in case old clients need to use it for a new poll category in the future).

@cyrossignol
Copy link
Member Author

cyrossignol commented Jun 8, 2021

The "duration" and "weight type" fields lock for all but the "survey" (opinion/casual) poll type. I'm not sure whether we want to lock "duration" because the documentation describes the requirement as a "minimum" number of days, but the community seems to oppose polls longer than the minimum duration.

Need ACK/NACK on this bit still too.

CC: @barton2526 @jring-o

@jamescowens jamescowens self-requested a review June 8, 2021 15:33
@jamescowens
Copy link
Member

I think the duration should not be locked but instead should include a validation for minimum duration to follow the approved rules.

@jamescowens
Copy link
Member

I think it is a separate question as to whether we should put a reasonable upper bound validation/clamp on the duration. I would think we need to set an upper limit for duration for all poll types. Perhaps we need to do a poll to establish that rule?

@jamescowens
Copy link
Member

jamescowens commented Jun 8, 2021

(We don't have to wait on the upper bound poll to finish this PR, BTW. We can, and should, do that in a separate PR.)

The PollRegistry class provides a sequence iterator that could perform
rudimentary filtering to exclude finished polls, but it could not walk
the sequence for finished polls only. This updates the polls filtering
mechanism to support that use case with a structure that enables other
types of filters for the future.
This adds view models that provide access to core voting functionality.
This adds a function that formats a human-friendly time span from
newer Bitcoin code modified to round the result time span half-up
instead of flooring it.
This adds a core signal that the poll registry broadcasts when a node
receives a poll contract in a transaction so that the GUI can respond
to the event.
This adds a wizard that will replace the old "create poll" dialog. It
provides a more structured process for poll creation. The wizard will
present the set of poll types to the user based on community-approved
guidelines and request information or disable fields for the selected
type.
This updates the GUI voting page according to the proposed design
mock ups:

 - Add a header bar with a poll title filter input
 - Add tabs for "active" and "completed" polls
 - Add a list view for polls and update the table view
 - Add a loading animation displayed when refreshing polls
 - Limit the max content width for large window sizes
 - Update colors, icons, layout, sizing, and spacing
This adds a wizard that replaces the old "vote" dialog and displays a
more pleasant voting form. It does not add new features yet. However,
the wizard format provides a structure which can enable more advanced
voting features in the future.
This removes the dependency for the Qt Charts submodule and autotools
pieces that check for it. Gridcoin used Qt Charts for the voting GUI.
The redesigned UI displays poll results with standard widgets now, so
we don't need the charting library.
This adds a GUI hook that displays a system notification when a node
receives a new poll as well as an accompanying GUI option to disable
those notifications.
@cyrossignol
Copy link
Member Author

Unlocked duration. The field is constrained to the minimum for each poll category.

@cyrossignol cyrossignol marked this pull request as ready for review June 10, 2021 01:44
Copy link
Member

@jamescowens jamescowens left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ACK

@jamescowens jamescowens merged commit 052113a into gridcoin-community:development Jun 10, 2021
jamescowens added a commit to jamescowens/Gridcoin-Research that referenced this pull request Aug 1, 2021
Added
 - util, rpc. gui: Changes for snapshotdownload and add feature sync from zero gridcoin-community#2093 (@iFoggz)
 - gui: Implement GUI version of consolidateunspent (coin control part) gridcoin-community#2111 (@jamescowens)
 - gui: Implement consolidateunspent wizard gridcoin-community#2125 (@jamescowens)
 - qt: Add antialiasing to traffic graph widget gridcoin-community#2150 (@barton2526)
 - util: Port of ArgsManager and a significant subset of src/util gridcoin-community#2146 (@jamescowens)
 - doc: add issue templates for bug reports and feature requests gridcoin-community#2147 (@Pythonix)
 - gui, rpc: Implement dynamic stakesplitting control, settings changes via rpc, and dynamic changes to sidestaking via rpc gridcoin-community#2164 (@jamescowens)
 - rpc: Implement getblocksbatch gridcoin-community#2205 (@jamescowens)
 - voting, rpc, gui: Implement demand loading of historical poll by poll id and AVW calculation gridcoin-community#2210 (@jamescowens)
 - gui: Show GUI error dialog if command line parsing fails gridcoin-community#2218 (@jamescowens)
 - gui: Implement close confirmation. gridcoin-community#2216 (@denravonska)
 - build: Use -fstack-reuse=none gridcoin-community#2232 (@barton2526)

Changed
 - doc: Update build doc gridcoin-community#2078 (@iFoggz)
 - gui: Normalize button and input control appearance gridcoin-community#2096 (@cyrossignol)
 - consensus: Implement GetMinimumRequiredConnectionsForStaking gridcoin-community#2097 (@jamescowens)
 - refactor: move CTransaction to primitives gridcoin-community#2006 (@div72)
 - consensus, refactor, test: Merkle gridcoin-community#2094 (@div72)
 - gui: Update diagnostics gridcoin-community#2095 (@jamescowens)
 - gui: Refresh UI styles and sidebar/statusbar design gridcoin-community#2102 (@cyrossignol)
 - gui: Set standard base Qt style on Windows and macOS gridcoin-community#2114 (@cyrossignol)
 - build, refactor: bump to C++17 gridcoin-community#2113 (@div72)
 - util, rpc, gui: Implement GetMaxInputsForConsolidationTxn() gridcoin-community#2119 (@jamescowens)
 - gui: Refresh overview page design gridcoin-community#2117 (@cyrossignol)
 - depends: change boost mirror gridcoin-community#2122 (@div72)
 - refactor: small cleanup gridcoin-community#2123 (@div72)
 - build: Update depends Qt recipe to version 5.12.10 gridcoin-community#2129 (@cyrossignol)
 - build: Bump Codespell to 2.0.0 gridcoin-community#2135 (@barton2526)
 - gui: Refresh "send coins" page design gridcoin-community#2126 (@cyrossignol)
 - gui: Optimize locks to improve responsiveness gridcoin-community#2137 (@cyrossignol)
 - gui: Refresh "receive payment" page design gridcoin-community#2138 (@cyrossignol)
 - gui: Add empty placeholder to recent transactions list gridcoin-community#2140 (@cyrossignol)
 - gui: Refresh transaction history page design gridcoin-community#2143 (@cyrossignol)
 - gui: Refresh address book page design gridcoin-community#2145 (@cyrossignol)
 - doc: Update http to https where possible gridcoin-community#2148 (@barton2526)
 - depends: Update dependencies gridcoin-community#2153 (@barton2526)
 - depends: Bump python to 3.6 gridcoin-community#2159 (@barton2526)
 - test: Update cppcheck linter to c++17 gridcoin-community#2157 (@barton2526)
 - test: Drop Travis specific workarounds, Mention commit id in error, Fix typos, Update spellcheck ignore words gridcoin-community#2158 (@barton2526)
 - gui: Overhaul the voting UI gridcoin-community#2151 (@cyrossignol)
 - wallet: simplify nTimeSmart calculation gridcoin-community#2144 (@div72)
 - gui: Refresh checkbox and radio button styles gridcoin-community#2170 (@cyrossignol)
 - build: Bump libevent to 2.1.11 gridcoin-community#2172 (@barton2526)
 - build: Update native_mac_alias, Remove big sur patch file in qt recipe gridcoin-community#2173 (@barton2526)
 - docs: Misc Grammar gridcoin-community#2176 (@barton2526)
 - build: miniupnpc 2.2.2 gridcoin-community#2179 (@barton2526)
 - rpc: Refresh rainbymagnitude gridcoin-community#2163 (@jamescowens)
 - util: optimize HexStr gridcoin-community#2185 (@div72)
 - refactor: misc style changes gridcoin-community#2177 (@div72)
 - rpc: consolidatemsunspent changes. gridcoin-community#2136 (@iFoggz)
 - refactor: Replace "GlobalStatus" state management gridcoin-community#2183 (@cyrossignol)
 - rpc, util: Remove use of ArgsManager::NETWORK_ONLY for now gridcoin-community#2190 (@jamescowens)
 - doc: Replace hidden service with onion service, Capitalize "Tor" gridcoin-community#2193 (@barton2526)
 - gui: Update Qt Linguist localization files gridcoin-community#2192 (@cyrossignol)
 - script: Shell script cleanups gridcoin-community#2195 (@barton2526)
 - build: set minimum required Boost to 1.58.0 gridcoin-community#2194 (@barton2526)
 - build, util: Prevent execution for Windows versions less than Windows 7 gridcoin-community#2203 (@jamescowens)
 - build: Tweak NSIS Windows installer gridcoin-community#2204 (@jamescowens)
 - build: Add bison in depends gridcoin-community#2206 (@iFoggz)
 - build: macOS toolchain bump gridcoin-community#2207 (@div72)
 - doc: Update build-unix.md gridcoin-community#2212 (@springfielddatarecovery)
 - build: Bump minimum python version to 3.6, Remove python2 references gridcoin-community#2219 (@barton2526)
 - depends: Change openSSL source path to Github gridcoin-community#2237 (@barton2526)
 - doc: Fix typo in bug report template gridcoin-community#2243 (@jamescowens)
 - ci: fold depends output gridcoin-community#2244 (@div72)

Removed
 - wallet: remove dead hardcoded addnodes gridcoin-community#2116 (@sweede-se)
 - rpc: Remove readconfig gridcoin-community#2248 (@jamescowens)
 - rpc: Remove obsolete comparesnapshotaccrual RPC function gridcoin-community#2100 (@jamescowens)
 - rpc: Remove memorypool RPC Command gridcoin-community#2214 (@RoboticMind)
 - rpc: Remove deprecated RPC commands gridcoin-community#2101 (@jamescowens)
 - Remove CCT from README, add Discord gridcoin-community#2134 (@barton2526)
 - refactor: Remove obsolete pubsub method definitions gridcoin-community#2191 (@barton2526)
 - refactor: Remove msMiningErrorsIncluded & msMiningErrorsExcluded gridcoin-community#2215 (@RoboticMind)
 - qt: Remove obsolete topLevelWidget(), Remove obsolete QRegExpValidator gridcoin-community#2198 (@barton2526)
 - net: Drop support of the insecure miniUPnPc versions gridcoin-community#2178 (@barton2526)
 - log: remove deprecated db log category gridcoin-community#2201 (@barton2526)
 - doc: Remove CCT from README and release process docs gridcoin-community#2175 (@barton2526)
 - build: Remove travis references gridcoin-community#2156 (@barton2526)

Fixed
 - gui: Fix macOS and designer font sizes gridcoin-community#2098 (@cyrossignol)
 - gui: Have the TrafficGraphWidget respect the selected stylesheet. gridcoin-community#2107 (@jamescowens)
 - gui: Fix macOS display inconsistencies gridcoin-community#2106 (@cyrossignol)
 - gui: Fix RPC console auto-complete background color gridcoin-community#2108 (@cyrossignol)
 - gui: Avoid reloading redundant stylesheets gridcoin-community#2109 (@cyrossignol)
 - gui: Fix "no active beacon" status gridcoin-community#2110 (@cyrossignol)
 - gui: Fix dark theme link text color visibility gridcoin-community#2115 (@cyrossignol)
 - scraper, util, qt: Fix several deprecations and warnings gridcoin-community#2131 (@jamescowens)
 - gui: Fix duplicate time in GUIUtil::dateTimeStr() gridcoin-community#2139 (@cyrossignol)
 - gui: Fix debug console traffic graph legend colors gridcoin-community#2142 (@cyrossignol)
 - gui: Fix nomenclature gridcoin-community#2104 (@jamescowens)
 - doc: Fix Typos gridcoin-community#2149 (@barton2526)
 - doc: Fix "master" branch build status badge in readme gridcoin-community#2167 (@cyrossignol)
 - gui: Fix Inter font rendering on Windows with FreeType gridcoin-community#2169 (@cyrossignol)
 - gui: Fix assert on non-existent data directory and GUI datadir chooser corner case issues gridcoin-community#2174 (@jamescowens)
 - gui: Fix display artifact in poll loading indicator gridcoin-community#2180 (@cyrossignol)
 - rpc, logging: Minor fixes for sidestake logging gridcoin-community#2187 (@jamescowens)
 - gui: Fix fractional scaling for dialog sizes gridcoin-community#2189 (@cyrossignol)
 - doc: Random fixes gridcoin-community#2197 (@barton2526)
 - doc: getbalance should say GRC not "btc" gridcoin-community#2199 (@barton2526)
 - net: Add missing verification of IPv6 address in CNetAddr::GetIn6Addr¦ gridcoin-community#2200 (@barton2526)
 - doc: remove duplicate line from .gitignore gridcoin-community#2202 (@Pythonix)
 - util: Tweak exception handling in MilliTimer class to eliminate compiler warnings gridcoin-community#2233 (@jamescowens)
 - depends: patch missing include in qt gridcoin-community#2234 (@div72)
 - wallet, rpc: Check each input for IsMine() in GetAddressGroupings gridcoin-community#2242 (@jamescowens)
 - util, qt: Fix snapshot download gridcoin-community#2246 (@jamescowens)
 - gui: Fix Column Widths in RPC Console. Elide long strings in their center. Indent user agent. gridcoin-community#2241 (@barton2526)
 - qt: Fix crash during download snapshot on macOS gridcoin-community#2250 (@jamescowens)
 - qt: Don't allow to open the debug window during splashscreen & verification state gridcoin-community#2245 (@barton2526)
 - gui: Fix address book selected model record when editing gridcoin-community#2253 (@cyrossignol)
 - researcher: Check wallet status before beacon renewal gridcoin-community#2254 (@cyrossignol)
 - qt: Prevent pasting (no label) as label in consolidation transaction gridcoin-community#2255 (@jamescowens)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Minor UI bug in "Create Poll" window
3 participants