mirror of
https://github.com/tdurieux/anonymous_github.git
synced 2026-11-14 00:07:00 +01:00
Thomas DurieuxandClaude Opus 5.5
d25e5336ce
Most authors use the service for one paper a few times a year, so a subscription does not fit. Add cheap one-time options (Paper pack, Extra repository, Live updates, Extended expiration, Never expire), cap free dated expiration at 5 months, keep cheaper subscriptions for heavy users, and make every new conference a paid review package in three sizes. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
221 lines
17 KiB
HTML
221 lines
17 KiB
HTML
<div class="container paper-page paper-settings">
|
|
<div class="paper-crumbs"><a href="/dashboard">My work</a> / <a href="/conferences">Conferences</a> / <span class="here">{{ editionMode ? 'Edit' : 'New' }}</span></div>
|
|
<h1 class="paper-page-title">{{ editionMode ? 'Edit' : 'Create a' }} <em>conference</em></h1>
|
|
<p class="paper-page-lede">
|
|
Give chairs access to every anonymization submitted to a venue. One
|
|
payment hosts every submission, so authors don't pay during the review window.
|
|
</p>
|
|
|
|
<div class="paper-settings-body">
|
|
<aside class="paper-settings-toc" v-paper-scrollspy>
|
|
<div class="paper-settings-toc-head">On this page</div>
|
|
<nav>
|
|
<a href="#conf-basics">Basics</a>
|
|
<a href="#conf-window">Review window</a>
|
|
<a href="#conf-rendering">Rendering defaults</a>
|
|
<a href="#conf-features">Features</a>
|
|
<a href="#conf-plan">Plan</a>
|
|
<a href="#conf-billing" v-show="plan?.pricePerRepo > 0">Billing</a>
|
|
</nav>
|
|
</aside>
|
|
|
|
<form class="form needs-validation paper-settings-main" name="conference" novalidate v-form="viewState">
|
|
<section id="conf-basics" class="paper-settings-section">
|
|
<div class="paper-section-eyebrow">Basics</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="name">Conference name</label>
|
|
<input type="text" class="form-control" name="name" id="name" required placeholder="e.g. International Conference on Software Engineering" v-field="{ state: viewState, set: value => { options.name = value }, value: options?.name, form: "conference", options: {} }" :class="{'is-invalid': conference?.name?.invalid && (conference?.name?.touched || conference?.submitted)}">
|
|
<div class="invalid-feedback" v-show="conference?.name?.errors?.invalid">
|
|
The name of the conference is invalid.
|
|
</div>
|
|
<div class="invalid-feedback" v-show="conference?.name?.errors?.required">
|
|
The name of the conference is required.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="url">Website</label>
|
|
<input type="url" class="form-control" name="url" id="url" placeholder="https://example.org" v-field="{ state: viewState, set: value => { options.url = value }, value: options?.url, form: "conference", options: {} }" :class="{'is-invalid': conference?.url?.invalid && (conference?.url?.touched || conference?.submitted)}">
|
|
<div class="invalid-feedback" v-show="conference?.url?.errors?.url">
|
|
The url of the conference is invalid.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="conferenceID">Conference ID</label>
|
|
<input type="text" class="form-control" name="conferenceID" id="conferenceID" required pattern="[a-zA-Z0-9\-_]{3,10}" placeholder="ICSE26" v-field="{ state: viewState, set: value => { options.conferenceID = value }, value: options?.conferenceID, form: "conference", options: {} }" :class="{'is-invalid': conference?.conferenceID?.invalid && (conference?.conferenceID?.touched || conference?.submitted)}">
|
|
<small class="form-text text-muted">3–10 characters, letters, numbers, <code>-</code> and <code>_</code>. Authors reference this when they anonymize.</small>
|
|
<div class="invalid-feedback" v-show="conference?.conferenceID?.errors?.used">
|
|
The conference ID '{{ options?.conferenceID }}' is already used.
|
|
</div>
|
|
<div class="invalid-feedback" v-show="conference?.conferenceID?.errors?.required">
|
|
The conference ID is required.
|
|
</div>
|
|
<div class="invalid-feedback" v-show="conference?.conferenceID?.errors?.pattern">
|
|
The format of the conference ID is incorrect ([a-zA-Z0-9-_]{3,10}).
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="conf-window" class="paper-settings-section">
|
|
<div class="paper-section-eyebrow">Review window</div>
|
|
|
|
<div class="form-grid-2">
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="startDate">Start date</label>
|
|
<input type="date" class="form-control" name="startDate" id="startDate" required v-field="{ state: viewState, set: value => { options.startDate = value }, value: options?.startDate, form: "conference", options: {} }" :class="{'is-invalid': conference?.startDate?.invalid && (conference?.startDate?.touched || conference?.submitted)}">
|
|
<small class="form-text text-muted">Beginning of the review process.</small>
|
|
<div class="invalid-feedback" v-show="conference?.startDate?.errors?.required">
|
|
Start date is required.
|
|
</div>
|
|
<div class="invalid-feedback" v-show="conference?.startDate?.errors?.invalid">
|
|
Start date must be before end date.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="endDate">End date</label>
|
|
<input type="date" class="form-control" name="endDate" id="endDate" required v-field="{ state: viewState, set: value => { options.endDate = value }, value: options?.endDate, form: "conference", options: {} }" :class="{'is-invalid': conference?.endDate?.invalid && (conference?.endDate?.touched || conference?.submitted)}">
|
|
<small class="form-text text-muted">All repositories expire on this date.</small>
|
|
<div class="invalid-feedback" v-show="conference?.endDate?.errors?.required">
|
|
End date is required.
|
|
</div>
|
|
<div class="invalid-feedback" v-show="conference?.endDate?.errors?.invalid">
|
|
End date is invalid.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="conf-rendering" class="paper-settings-section">
|
|
<div class="paper-section-eyebrow">Rendering defaults</div>
|
|
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="link" name="link" v-field="{ state: viewState, set: value => { options.options.link = value }, value: options?.options?.link, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="link">Keep links</label>
|
|
<small class="form-text text-muted">Keep or remove all links from text files.</small>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="image" name="image" v-field="{ state: viewState, set: value => { options.options.image = value }, value: options?.options?.image, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="image">Display images</label>
|
|
<small class="form-text text-muted">Images are not anonymized.</small>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="pdf" name="pdf" v-field="{ state: viewState, set: value => { options.options.pdf = value }, value: options?.options?.pdf, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="pdf">Display PDFs</label>
|
|
<small class="form-text text-muted">PDFs are not anonymized.</small>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="notebook" name="notebook" v-field="{ state: viewState, set: value => { options.options.notebook = value }, value: options?.options?.notebook, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="notebook">Display notebooks</label>
|
|
<small class="form-text text-muted">Render Jupyter notebooks instead of raw JSON.</small>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="conf-features" class="paper-settings-section">
|
|
<div class="paper-section-eyebrow">Features</div>
|
|
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="update" name="update" v-field="{ state: viewState, set: value => { options.options.update = value }, value: options?.options?.update, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="update">Auto-update from GitHub</label>
|
|
<small class="form-text text-muted">Pull the latest commit automatically (hourly maximum).</small>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" id="page" name="page" v-field="{ state: viewState, set: value => { options.options.page = value }, value: options?.options?.page, form: "conference", options: {} }">
|
|
<label class="form-check-label" for="page">GitHub Pages</label>
|
|
<small class="form-text text-muted">Enable anonymized GitHub pages.</small>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="conf-plan" class="paper-settings-section">
|
|
<div class="paper-section-eyebrow">Plan</div>
|
|
<p class="paper-section-copy" v-if="editionMode">{{ conferencePlanName(options?.plan?.planID) }}. The plan and review dates can't change after creation.</p>
|
|
<template v-else-if="conferenceTiers().length">
|
|
<p class="paper-section-copy">Pick the package that fits the number of submissions you expect. One payment hosts every submission, so authors don't pay.</p>
|
|
<div class="conference-tiers" role="radiogroup" aria-label="Review package size">
|
|
<label class="conference-tier" v-for="tier in conferenceTiers()" :key="tier.id" :class="{ 'is-selected': options?.plan?.planID === tier.id }">
|
|
<input type="radio" name="planPicker" :value="tier.id" :checked="options?.plan?.planID === tier.id" @change="options.plan.planID = tier.id">
|
|
<span class="conference-tier-head"><strong>{{ tier.name }}</strong><span class="conference-tier-pill" v-if="tier.id === 'conference' && conferenceTiers().length > 1">Most common</span></span>
|
|
<span class="conference-tier-who">{{ conferenceAudience(tier.id) }}</span>
|
|
<span class="conference-tier-price" v-if="tier.amount != null"><strong>{{ conferenceAmount(tier) }}</strong> once</span>
|
|
<span class="conference-tier-size">Up to {{ tier.repositories }} papers · {{ conferenceBytes(tier.storage) }}</span>
|
|
<span class="conference-tier-per" v-if="tier.amount != null && tier.repositories">About {{ conferenceAmount(tier, tier.amount / tier.repositories) }} per paper</span>
|
|
</label>
|
|
</div>
|
|
<div class="conference-package">
|
|
<h3>Every package includes</h3>
|
|
<ul class="billing-offer-list">
|
|
<li>A review window of up to 180 days</li>
|
|
<li>Automatic updates for every submission</li>
|
|
<li>Links stay online until the review window ends</li>
|
|
<li>A dashboard of every submission for chairs</li>
|
|
</ul>
|
|
<p class="conference-package-note">Nothing renews · Tax shown at checkout · Expecting more submissions? Email <a href="mailto:tdurieux@anonymous.4open.science">tdurieux@anonymous.4open.science</a></p>
|
|
</div>
|
|
<p class="paper-section-copy">Create the conference, then pay from its page. Authors can submit once the payment is confirmed.</p>
|
|
</template>
|
|
<div class="paper-plan-grid" v-else-if="plans.length">
|
|
<label class="paper-plan-card" v-for="plan in plans" :key="plan.id" :class="{ selected: options?.plan?.planID == plan?.id }">
|
|
<input type="radio" name="planPicker" v-field="{ state: viewState, set: value => { options.plan.planID = value }, value: options?.plan?.planID, form: "conference", options: {} }" :value="plan?.id">
|
|
<div class="paper-plan-head" v-text="plan?.name"></div>
|
|
<div class="paper-plan-price">{{ plan.pricePerRepo > 0 ? fmt?.number(plan.pricePerRepo, 2) + ' € per repository' : 'Free' }}</div>
|
|
<div class="paper-plan-desc" v-html="sanitize(plan?.description)"></div>
|
|
</label>
|
|
</div>
|
|
<p class="settings-notice" v-else-if="plansLoaded" role="status">New conferences are unavailable right now. Please try again later.</p>
|
|
</section>
|
|
|
|
<section id="conf-billing" class="paper-settings-section" v-if="plan?.pricePerRepo > 0">
|
|
<div class="paper-section-eyebrow">Billing</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="billing_name">Name</label>
|
|
<input type="text" class="form-control" name="billing_name" id="billing_name" required placeholder="First & last name" v-field="{ state: viewState, set: value => { options.billing.name = value }, value: options?.billing?.name, form: "conference", options: {} }" :class="{'is-invalid': conference?.billing_name?.invalid && (conference?.billing_name?.touched || conference?.submitted)}">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="email">Email</label>
|
|
<input type="email" class="form-control" name="email" id="email" required placeholder="you@example.org" v-field="{ state: viewState, set: value => { options.billing.email = value }, value: options?.billing?.email, form: "conference", options: {} }" :class="{'is-invalid': conference?.email?.invalid && (conference?.email?.touched || conference?.submitted)}">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="inputAddress">Address</label>
|
|
<input type="text" class="form-control" name="inputAddress" id="inputAddress" required placeholder="1234 Main St" v-field="{ state: viewState, set: value => { options.billing.address = value }, value: options?.billing?.address, form: "conference", options: {} }" :class="{'is-invalid': conference?.inputAddress?.invalid && (conference?.inputAddress?.touched || conference?.submitted)}">
|
|
</div>
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="inputAddress2" id="inputAddress2" placeholder="Apartment, studio, or floor" v-field="{ state: viewState, set: value => { options.billing.address2 = value }, value: options?.billing?.address2, form: "conference", options: {} }" :class="{'is-invalid': conference?.inputAddress2?.invalid && (conference?.inputAddress2?.touched || conference?.submitted)}">
|
|
</div>
|
|
|
|
<div class="form-grid-3">
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="city">City</label>
|
|
<input type="text" class="form-control" name="city" id="city" required placeholder="City" v-field="{ state: viewState, set: value => { options.billing.city = value }, value: options?.billing?.city, form: "conference", options: {} }" :class="{'is-invalid': conference?.city?.invalid && (conference?.city?.touched || conference?.submitted)}">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="country">Country</label>
|
|
<input type="text" class="form-control" name="country" id="country" required placeholder="Country" v-field="{ state: viewState, set: value => { options.billing.country = value }, value: options?.billing?.country, form: "conference", options: {} }" :class="{'is-invalid': conference?.country?.invalid && (conference?.country?.touched || conference?.submitted)}">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="zip">Zip</label>
|
|
<input type="text" class="form-control" name="zip" id="zip" required placeholder="Zip" v-field="{ state: viewState, set: value => { options.billing.zip = value }, value: options?.billing?.zip, form: "conference", options: {} }" :class="{'is-invalid': conference?.zip?.invalid && (conference?.zip?.touched || conference?.submitted)}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="paper-field-label" for="vat">VAT number</label>
|
|
<input type="text" class="form-control" name="vat" id="vat" placeholder="VAT Number" v-field="{ state: viewState, set: value => { options.billing.vat = value }, value: options?.billing?.vat, form: "conference", options: {} }" :class="{'is-invalid': conference?.vat?.invalid && (conference?.vat?.touched || conference?.submitted)}">
|
|
</div>
|
|
</section>
|
|
|
|
<div class="paper-settings-footer">
|
|
<div class="alert alert-danger" role="alert" v-if="error" v-text="error"></div>
|
|
<div class="alert alert-success" role="alert" v-if="message" v-text="message"></div>
|
|
<button id="send" :disabled="saving" type="submit" class="btn btn-ink" @click.prevent="submitForm($event, () => { submit($event) })">
|
|
{{ saving ? (editionMode ? "Updating…" : "Creating…") : (editionMode ? "Update conference" : "Create conference") }}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|