Commit Graph

99 Commits

Author SHA1 Message Date
Kris
f371258b42
UX: Give ranked choice polls distinctive bullets in preview (#29439) 2024-10-28 11:10:37 -04:00
Penar Musaraj
1a88728d39
FIX: Poll voters list wasn't expanding properly (#28823) 2024-09-10 11:46:12 -04:00
Robert
88e1690d86
FIX: poll preview list styling remove redundant bullets (#28592) 2024-09-10 10:54:59 +02:00
Kris
c0611a06e5
UX: remove poll button bg color to avoid highlight issue (#28319) 2024-08-12 14:39:37 -04:00
锦心
c8c859762b
FEATURE: Absolute Numbers in Poll (#28240)
What does this add?
===================

This PR adds an extra button to the poll to show the absolute number of
people who voted for each option. This button will only be added for
the single/multi-select bar chart.

Related meta topic: https://meta.discourse.org/t/absolute-numbers-in-polls/32771
2024-08-07 11:46:29 +02:00
Joffrey JAFFEUX
7a7cc815be
DEV: removes legacy modal code (#28047) 2024-07-24 18:07:17 +02:00
chapoi
2ca06ba236
DEV: form-kit
This PR introduces FormKit, a component-based form library designed to simplify form creation and management. This library provides a single `Form` component, various field components, controls, validation mechanisms, and customization options. Additionally, it includes helpers to facilitate testing and writing specifications for forms.

1. **Form Component**:
   - The main component that encapsulates form logic and structure.
   - Yields various utilities like `Field`, `Submit`, `Alert`, etc.

   **Example Usage**:
   ```gjs
   import Form from "discourse/form";

   <template>
     <Form as |form|>
       <form.Field
         @name="username"
         @title="Username"
         @validation="required"
         as |field|
       >
         <field.Input />
       </form.Field>

       <form.Field @name="age" @title="Age" as |field|>
         <field.Input @type="number" />
       </form.Field>

       <form.Submit />
     </Form>
   </template>
   ```

2. **Validation**:
   - Built-in validation rules such as `required`, `number`, `length`, and `url`.
   - Custom validation callbacks for more complex validation logic.

   **Example Usage**:
   ```javascript
   validateUsername(name, value, data, { addError }) {
     if (data.bar / 2 === value) {
       addError(name, "That's not how maths work.");
     }
   }
   ```

   ```hbs
   <form.Field @name="username" @validate={{this.validateUsername}} />
   ```

3. **Customization**:
   - Plugin outlets for extending form functionality.
   - Styling capabilities through propagated attributes.
   - Custom controls with properties provided by `form` and `field`.

   **Example Usage**:
   ```hbs
   <Form class="my-form" as |form|>
     <form.Field class="my-field" as |field|>
       <MyCustomControl id={{field.id}} @onChange={{field.set}} />
     </form.Field>
   </Form>
   ```

4. **Helpers for Testing**:
   - Test assertions for form and field validation.

   **Example usage**:
   ```javascript
   assert.form().hasErrors("the form shows errors");
   assert.form().field("foo").hasValue("bar", "user has set the value");
   ```

   - Helper for interacting with he form

   **Example usage**:
   ```javascript
   await formKit().field("foo").fillIn("bar");
   ```

5. **Page Object for System Specs**:
   - Page objects for interacting with forms in system specs.
   - Methods for submitting forms, checking alerts, and interacting with fields.

   **Example Usage**:
   ```ruby
   form = PageObjects::Components::FormKit.new(".my-form")
   form.submit
   expect(form).to have_an_alert("message")
   ```

   **Field Interactions**:
   ```ruby
   field = form.field("foo")
   expect(field).to have_value("bar")
   field.fill_in("bar")
   ```


6. **Collections handling**:
   - A specific component to handle array of objects

   **Example Usage**:
   ```gjs
    <Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
      <form.Collection @name="foo" as |collection|>
        <collection.Field @name="bar" @title="Bar" as |field|>
          <field.Input />
        </collection.Field>
      </form.Collection>
    </Form>
   ```
2024-07-17 11:59:35 +02:00
Robert
bae492efee
FEATURE: Add Ranked Choice Voting
using Instant Run-off Voting algorithm to Poll Plugin (Part 2 add Ranked Choice)

---------

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Co-authored-by: Jarek Radosz <jradosz@gmail.com>
2024-07-17 11:49:14 +02:00
Robert
4f87f0d7ef
FIX: Poll: option text wrapping bevahiour styling improvement (#27738) 2024-07-05 15:27:40 +02:00
Robert
e3b6be15b8
FEATURE: Add Instant Run-off Voting to Poll Plugin (Part 1: migrate existing plugin to Glimmer only) (#27204)
The "migration to Glimmer" has been broken out here from #27155 to make the review process less onerous and reduce change risk: 

* DEV: migrates most of the widget code to Glimmer in prep for IRV additions
* NB This already incorporates significant amounts of review and feedback from the prior PR.
* NB because there was significant additional feedback relating to older Poll code that I've improved with feedback, there are some additional changes here that are general improvements to the plugin and not specific to IRV nor Glimmer!
* There should be no trace of IRV code here.

Once this is finalised and merged we can continue to progress with #27155.
2024-07-04 13:34:48 +02:00
Kris
e5c0cfcd27
UX: remove default use of quaternary color, update nav pill styles (#27502) 2024-06-24 09:54:34 -04:00
Kris
6b185f8655
PERF: eliminate some slow CSS selectors (#25392) 2024-01-26 13:10:45 -05:00
Kris
22bb1c8951
UX: improve poll text wrap (#24732) 2023-12-06 10:58:06 -05:00
David Taylor
7e37e3e824
UX: Create polls with public=true by default (#24332)
In the vast majority of cases, people want poll voters to be public. Previously, the checkbox for this was hidden behind the 'show advanced' settings in the poll builder UI.

This commit makes three changes to improve the experience:

1. Add `public=true|false` to poll markup (previously it would only be added when true

2. Bring the 'public' switch outside the 'show advanced' section for improved visibility

3. Change the default to 'true'
2023-11-13 09:07:51 +11:00
Jarek Radosz
38d3208027
FIX: Poll breakdown regressions (#22955)
Some related to the modal api change, some due to chart.js updates
2023-08-03 16:58:52 +02:00
Jarek Radosz
407ff39fdf
FIX: Poll builder UI issues (#22931)
1. recent css regression related to modal upgrade
2. autofocus and on-enter regressions
3. array related linting issue (reliance on Ember's firstObject/lastObject)
2023-08-02 12:55:25 +02:00
Kris
4cec091f1a
REFACTOR: improve poll info layout (#22353) 2023-07-05 12:20:18 -04:00
Meghna
68549fe54e
UX: Vertical alignment issues on mobile (#21118)
Vertical alignment fixes for topic closed small message and poll info.
2023-04-17 22:51:13 +05:30
Jarek Radosz
4170b9bb58
DEV: Use more css vars (#18561)
Followup to #18518

This time it's mostly line-height vars and a couple of other uncommon vars.
2022-10-12 16:05:42 +02:00
Jarek Radosz
ea326906e3
DEV: Use css var font sizes (#18518)
For consistency and and the ability to change all font sizes at once in the dev tools
2022-10-12 15:31:59 +02:00
Bianca Nenciu
ac68cb20c3
UX: Show all pie legend options for long polls (#16510)
Results pie chart of polls with very many options were wider than the
post and most of their content was hidden.
2022-04-20 10:43:10 +03:00
Kris
a87216f1f3
A11Y: set modal widths with EMs; improves scaling (#14863) 2021-11-09 14:56:05 -05:00
Penar Musaraj
24e71acf3f
UX: Normalize sizing for inputs, buttons, dropdowns (#14226)
See PR for details
2021-09-09 11:01:56 -04:00
Kris
5c0ad215af
UX: adjust button spacing (#14230) 2021-09-07 13:19:03 -04:00
Joffrey JAFFEUX
d7c185bf3d
DEV: updates chart.js to 3.5.1 (#14107) 2021-08-23 13:49:49 +02:00
Jordan Vidrine
465db1e5b5
FIX: Adjust poll buttons (#13924)
* FIX: Adjust poll buttons

* REFACTOR: Move styles to desktop stylesheet
2021-08-03 10:03:18 +08:00
Régis Hanol
b8a0e47913
UX: make poll content selectable (#13529)
When initially released, the polls had a different design that didn't interact
well with the quote button - https://meta.discourse.org/t/31586

Now that the design has evolved, not being able to select text from inside a poll is
counter productive, so it's enabled again.
2021-06-30 15:25:59 +10:00
Penar Musaraj
e305365168
FEATURE: Use responsive image sizes in post stream (#13343) 2021-06-18 09:15:03 -04:00
Penar Musaraj
9ebc9541b9
FIX: Size of emoji in poll options (#13294)
Fixes a regression in 33cb1b
2021-06-04 18:27:25 -04:00
Penar Musaraj
33cb1b7cf1
FIX: Ensure images in polls don't cause abrupt scrolling (#13272)
In some very rare cases, poll options can end up with images that have
no dimensions, in which case, navigating to replies in that post stream
might result in unexpected scrolling (as the browser loads the images
and adjusts its layout).

This ensures that if width/height attributes are missing from an image,
the image is forced to display within a 200 by 200 pixels space.

Co-authored-by: David Taylor <david@taylorhq.com>
2021-06-03 22:09:59 -04:00
Penar Musaraj
b21f74060e
FIX: Layout of date input in poll builder (#13057) 2021-05-13 10:27:03 -04:00
Bianca Nenciu
8636292a40
FIX: Do not cut off long polls (#12854)
Some polls with images can be very long. Those which showed a pie chart
for the results had a fixed height set, which meant that some long polls
could be cut off.
2021-04-29 10:32:45 +03:00
Bianca Nenciu
2081b6e5c9
UX: Improve poll builder UI (#12549)
* Improve poll validation

* Redesign poll builder

* Group all advanced settings under a new section
2021-04-12 19:48:01 +03:00
Jarek Radosz
690a38bc9b
FIX: Show title on results of all poll types (#11041)
Previously, the title was shown only with pie chart results. Issue originally reported in https://meta.discourse.org/t/keep-the-heading-visible-when-showing-poll-results/167585

Also includes:
UX: Move the "Show breakdown" button (Display it with other poll buttons at the bottom)
FIX: Show the breakdown button only on any votes
2020-10-27 13:48:54 +01:00
Jarek Radosz
babbebfb35
FEATURE: Add the title attribute to polls (#10759)
Adds an optional title attribute to polls. The rationale for this addition is that polls themselves didn't contain context/question and relied on post body to explain them. That context wasn't always obvious (e.g. when there are multiple polls in a single post) or available (e.g. when you display the poll breakdown - you see the answers, but not the question)

As a side note, here's a word on how the poll plugin works:

> We have a markdown poll renderer, which we use in the builder UI and the composer preview, but… when you submit a post, raw markdown is cooked into html (twice), then we extract data from the generated html and save it to the database. When it's render time, we first display the cooked html poll, and then extract some data from that html, get the data from the post's JSON (and identify that poll using the extracted html stuff) to then render the poll using widgets and the JSON data.
2020-10-02 09:21:24 +02:00
Jarek Radosz
cd4f251891
FEATURE: Poll breakdown 2.0 (#10345)
The poll breakdown modal replaces the grouped pie charts feature.

Includes:

* MODAL: Untangle `onSelectPanel`
Previously modal-tab component would call on click the onSelectPanel callback with itself (modal-tab) as `this` which severely limited its usefulness. Now showModal binds the callback to its controller.

"The PR includes a fix/change to d-modal (b7f6ec6) that hasn't been extracted to a separate PR because it's not currently possible to test a change like this in abstract, i.e. with dynamically created controllers/components in tests. The percentage/count toggle test for the poll breakdown feature is essentially a test for that d-modal modification."
2020-08-06 17:57:06 +02:00
Penar Musaraj
14eec43889
DEV: Use CSS custom properties for colors in core plugins 2020-08-04 11:14:33 -04:00
Bianca Nenciu
ff6811ceb8
Allow multiple groups which can vote when creating a poll (#10015)
* FEATURE: Allow multiple groups which can vote when creating a poll

* DEV: Fix select-kit deprecations

* DEV: Fix lint
2020-06-12 14:52:32 +03:00
Joffrey JAFFEUX
faeb5793ba
UI: various tweaks to polls UI on mobile (#9864) 2020-05-23 19:08:49 +02:00
Bianca Nenciu
5e4cf244a5
FIX: Show time input in poll builder (#9128) 2020-03-16 13:25:45 +01:00
Joffrey JAFFEUX
a4fc6ccc12
UX: prevents jumpyness when displaying poll voters (#9054) 2020-02-27 11:09:54 +01:00
Joffrey JAFFEUX
72b6f908f4
UX: minor tweaks to poll builder UI (#8985) 2020-02-17 11:02:44 -05:00
Mark VanLandingham
daaa0a657f
FIX: Render HTML for pie chart options (#8912) 2020-02-11 10:02:54 -06:00
Mark VanLandingham
87a298a59b
FIX: Poll pie container was too large (#8444) 2019-12-02 11:51:06 -06:00
Mark VanLandingham
b92a8131c0
FEATURE: Pie chart option for poll results (#8352) 2019-11-25 11:51:01 -06:00
Rafael dos Santos Silva
fd0025a735
FEATURE: Add export poll button (#8370)
This PR aims to make poll results easily exportable to staff in a CSV format, so they can be analyzed in external software.

It also makes the export data easily customizable by allowing users to leverage any data explorer query to generate the report. By default, we use a query that ships with data explorer, but user can change the ID in settings or use 0 to disable this feature.

One potential upgrade is using the recent work that allows arbitrary group to run data explorer and allow all the groups with access to the configured query to also export polls, but that can be added later.

Co-Authored-By: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2019-11-22 16:06:39 -03:00
Jarek Radosz
6a65e5312b FEATURE: Add a preview to the poll builder (#7988)
* FEATURE: Add a preview to the poll builder

* Use selectKit helper in the poll preview test

* Extract the mobile-specific poll builder form CSS
2019-08-13 09:49:40 -04:00
Penar Musaraj
78500fb770 UX: Improve layout of poll builder modal 2019-08-07 15:00:03 -04:00
Kris
be5e889b1b UX: Poll style fix, button classes 2019-03-06 20:27:40 -05:00
Joe
a342d2f150 UX: reduces white-space in polls (#6956)
* reduces white-space in polls and uses font-size variables
2019-02-05 10:47:22 +01:00