crowdresearch · kjlaw · Dec 17, 2017
diff --git a/poll/assets/javascripts/controllers/poll-ui-builder.js.es6 b/poll/assets/javascripts/controllers/poll-ui-builder.js.es6
@@ -0,0 +1,203 @@
+import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
+import InputValidation from 'discourse/models/input-validation';
+
+export default Ember.Controller.extend({
+  regularPollType: 'regular',
+  numberPollType: 'number',
+  multiplePollType: 'multiple',
+
+  init() {
+    this._super();
+    this._setupPoll();
+  },
+
+  @computed("regularPollType", "numberPollType", "multiplePollType")
+  pollTypes(regularPollType, numberPollType, multiplePollType) {
+    let types = [];
+
+    types.push({ name: I18n.t("poll.ui_builder.poll_type.regular"), value: regularPollType });
+    // TODO number & multiple do not work for polls with voter groups
+    types.push({ name: I18n.t("poll.ui_builder.poll_type.number"), value: numberPollType });
+    types.push({ name: I18n.t("poll.ui_builder.poll_type.multiple"), value: multiplePollType });
+
+    return types;
+  },
+
+  @computed("pollType", "regularPollType")
+  isRegular(pollType, regularPollType) {
+    return pollType === regularPollType;
+  },
+
+  @computed("pollType", "pollOptionsCount", "multiplePollType")
+  isMultiple(pollType, count, multiplePollType) {
+    return (pollType === multiplePollType) && count > 0;
+  },
+
+  @computed("pollType", "numberPollType")
+  isNumber(pollType, numberPollType) {
+    return pollType === numberPollType;
+  },
+
+  @computed("isRegular")
+  showMinMax(isRegular) {
+    return !isRegular;
+  },
+
+  @computed("pollOptions")
+  pollOptionsCount(pollOptions) {
+    if (pollOptions.length === 0) return 0;
+
+    let length = 0;
+
+    pollOptions.split("\n").forEach(option => {
+      if (option.length !== 0) length += 1;
+    });
+
+    return length;
+  },
+
+  @observes("isMultiple", "isNumber", "pollOptionsCount")
+  _setPollMax() {
+    const isMultiple = this.get("isMultiple");
+    const isNumber = this.get("isNumber");
+    if (!isMultiple && !isNumber) return;
+
+    if (isMultiple) {
+      this.set("pollMax", this.get("pollOptionsCount"));
+    } else if (isNumber) {
+      this.set("pollMax", this.siteSettings.poll_maximum_options);
+    }
+  },
+
+  @computed("isRegular", "isMultiple", "isNumber", "pollOptionsCount")
+  pollMinOptions(isRegular, isMultiple, isNumber, count) {
+    if (isRegular) return;
+
+    if (isMultiple) {
+      return this._comboboxOptions(1, count + 1);
+    } else if (isNumber) {
+      return this._comboboxOptions(1, this.siteSettings.poll_maximum_options + 1);
+    }
+  },
+
+  @computed("isRegular", "isMultiple", "isNumber", "pollOptionsCount", "pollMin", "pollStep")
+  pollMaxOptions(isRegular, isMultiple, isNumber, count, pollMin, pollStep) {
+    if (isRegular) return;
+    const pollMinInt = parseInt(pollMin) || 1;
+
+    if (isMultiple) {
+      return this._comboboxOptions(pollMinInt + 1, count + 1);
+    } else if (isNumber) {
+      let pollStepInt = parseInt(pollStep, 10);
+      if (pollStepInt < 1) {
+        pollStepInt = 1;
+      }
+      return this._comboboxOptions(pollMinInt + 1, pollMinInt + (this.siteSettings.poll_maximum_options * pollStepInt));
+    }
+  },
+
+  @computed("isNumber", "pollMax")
+  pollStepOptions(isNumber, pollMax) {
+    if (!isNumber) return;
+    return this._comboboxOptions(1, (parseInt(pollMax) || 1) + 1);
+  },
+
+  @computed("isNumber", "showMinMax", "pollType", "publicPoll", "voterGroups", "pollOptions", "pollMin", "pollMax", "pollStep")
+  pollOutput(isNumber, showMinMax, pollType, publicPoll, voterGroups, pollOptions, pollMin, pollMax, pollStep) {
+    let pollHeader = '[poll';
+    let output = '';
+
+    const match = this.get("toolbarEvent").getText().match(/\[poll(\s+name=[^\s\]]+)*.*\]/igm);
+
+    if (match) {
+      pollHeader += ` name=poll${match.length + 1}`;
+    };
+
+    let step = pollStep;
+    if (step < 1) {
+      step = 1;
+    }
+
+    if (pollType) pollHeader += ` type=${pollType}`;
+    if (pollMin && showMinMax) pollHeader += ` min=${pollMin}`;
+    if (pollMax) pollHeader += ` max=${pollMax}`;
+    if (isNumber) pollHeader += ` step=${step}`;
+    if (publicPoll) pollHeader += ' public=true';
+    if (voterGroups) pollHeader += ' groups=true';
+    pollHeader += ']';
+    output += `${pollHeader}\n`;
+
+    if (pollOptions.length > 0 && !isNumber) {
+      pollOptions.split("\n").forEach(option => {
+        if (option.length !== 0) output += `* ${option}\n`;
+      });
+    }
+
+    output += '[/poll]';
+    return output;
+  },
+
+  @computed("pollOptionsCount", "isRegular", "isMultiple", "isNumber", "pollMin", "pollMax")
+  disableInsert(count, isRegular, isMultiple, isNumber, pollMin, pollMax) {
+    return (isRegular && count < 2) || (isMultiple && count < pollMin && pollMin >= pollMax) || (isNumber ? false : (count < 2));
+  },
+
+  @computed("pollMin", "pollMax")
+  minMaxValueValidation(pollMin, pollMax) {
+    let options = { ok: true };
+
+    if (pollMin >= pollMax) {
+      options = { failed: true, reason: I18n.t("poll.ui_builder.help.invalid_values") };
+    }
+
+    return InputValidation.create(options);
+  },
+
+  @computed("pollStep")
+  minStepValueValidation(pollStep) {
+    let options = { ok: true };
+
+    if (pollStep < 1) {
+      options = { failed: true, reason: I18n.t("poll.ui_builder.help.min_step_value") };
+    }
+
+    return InputValidation.create(options);
+  },
+
+  @computed("disableInsert")
+  minNumOfOptionsValidation(disableInsert) {
+    let options = { ok: true };
+
+    if (disableInsert) {
+      options = { failed: true, reason: I18n.t("poll.ui_builder.help.options_count") };
+    }
+
+    return InputValidation.create(options);
+  },
+
+  _comboboxOptions(start_index, end_index) {
+    return _.range(start_index, end_index).map(number => {
+      return { value: number, name: number };
+    });
+  },
+
+  _setupPoll() {
+    this.setProperties({
+      pollType: 'regular',
+      publicPoll: false,
+      voterGroups: false,
+      pollOptions: '',
+      pollMin: 1,
+      pollMax: null,
+      pollStep: 1
+    });
+  },
+
+  actions: {
+    insertPoll() {
+      this.get("toolbarEvent").addText(this.get("pollOutput"));
+      this.send("closeModal");
+      this._setupPoll();
+    }
+  }
+});
diff --git a/poll/assets/javascripts/discourse/templates/modal/poll-ui-builder.hbs b/poll/assets/javascripts/discourse/templates/modal/poll-ui-builder.hbs
@@ -0,0 +1,69 @@
+{{#d-modal-body title="poll.ui_builder.title" class="poll-ui-builder"}}
+  <form class="poll-ui-builder-form form-horizontal">
+    <div class="input-group">
+      <label class="input-group-label">{{i18n 'poll.ui_builder.poll_type.label'}}</label>
+      {{combo-box content=pollTypes
+                  value=pollType
+                  valueAttribute="value"}}
+    </div>
+
+    {{#if showMinMax}}
+      <div class="input-group">
+        <label class="input-group-label">{{i18n 'poll.ui_builder.poll_config.min'}}</label>
+        {{input type='number'
+                value=pollMin
+                valueAttribute="value"
+                class="poll-options-min"}}
+        {{input-tip validation=minMaxValueValidation}}
+      </div>
+
+
+      <div class="input-group">
+        <label class="input-group-label">{{i18n 'poll.ui_builder.poll_config.max'}}</label>
+        {{input type='number'
+                value=pollMax
+                valueAttribute="value"
+                class="poll-options-max"}}
+      </div>
+
+      {{#if isNumber}}
+        <div class="input-group">
+          <label class="input-group-label">{{i18n 'poll.ui_builder.poll_config.step'}}</label>
+          {{input type='number'
+                  value=pollStep
+                  valueAttribute="value"
+                  min="1"
+                  class="poll-options-step"}}
+          {{input-tip validation=minStepValueValidation}}
+        </div>
+      {{/if}}
+    {{/if}}
+
+    <!-- TODO add back in once compatible -->
+    <!-- <div class="input-group">
+      <label>
+        {{input type='checkbox' checked=publicPoll}}
+        {{i18n "poll.ui_builder.poll_public.label"}}
+      </label>
+    </div> -->
+
+    <div class="input-group">
+      <label>
+        {{input type='checkbox' checked=voterGroups}}
+        {{i18n "poll.ui_builder.voter_groups.label"}}
+      </label>
+    </div>
+
+    {{#unless isNumber}}
+      <div class="input-group">
+        <label>{{i18n 'poll.ui_builder.poll_options.label'}}</label>
+        {{input-tip validation=minNumOfOptionsValidation}}
+        {{textarea value=pollOptions}}
+      </div>
+    {{/unless}}
+  </form>
+{{/d-modal-body}}
+
+<div class="modal-footer">
+  {{d-button action="insertPoll" icon="bar-chart-o" class='btn-primary' label='poll.ui_builder.insert' disabled=disableInsert}}
+</div>
diff --git a/poll/assets/javascripts/initializers/add-poll-ui-builder.js.es6 b/poll/assets/javascripts/initializers/add-poll-ui-builder.js.es6
@@ -0,0 +1,40 @@
+import { withPluginApi } from 'discourse/lib/plugin-api';
+import computed from 'ember-addons/ember-computed-decorators';
+import showModal from 'discourse/lib/show-modal';
+
+function initializePollUIBuilder(api) {
+  api.modifyClass('controller:composer', {
+    @computed('siteSettings.poll_enabled', 'siteSettings.poll_minimum_trust_level_to_create')
+    canBuildPoll(pollEnabled, minimumTrustLevel) {
+      return pollEnabled &&
+             this.currentUser &&
+             (
+               this.currentUser.staff ||
+               this.currentUser.trust_level >= minimumTrustLevel
+             );
+    },
+
+    actions: {
+      showPollBuilder() {
+        showModal('poll-ui-builder').set('toolbarEvent', this.get('toolbarEvent'));
+      }
+    }
+  });
+
+  api.addToolbarPopupMenuOptionsCallback(function() {
+    return {
+      action: 'showPollBuilder',
+      icon: 'bar-chart-o',
+      label: 'poll.ui_builder.title',
+      condition: 'canBuildPoll'
+    };
+  });
+}
+
+export default {
+  name: 'add-poll-ui-builder',
+
+  initialize() {
+    withPluginApi('0.8.7', initializePollUIBuilder);
+  }
+};