Some checks failed
Build and Release / Create Release (push) Successful in 1s
Build and Release / Unit Tests (push) Successful in 3m29s
Build and Release / Integration Tests (PostgreSQL) (push) Successful in 7m44s
Build and Release / Lint (push) Successful in 8m50s
Build and Release / Build Binaries (arm64, darwin, macos) (push) Failing after 1s
Build and Release / Build Binaries (amd64, linux, linux-latest) (push) Successful in 4m57s
Build and Release / Build Binaries (amd64, darwin, macos) (push) Successful in 5m16s
Build and Release / Build Binaries (amd64, windows, windows-latest) (push) Successful in 9h5m13s
Build and Release / Build Binary (linux/arm64) (push) Has been cancelled
Extract comparison table configuration from Content page to new Comparison settings page. Content page now only has enable/disable toggle with link to full config. New page includes dynamic UI for managing groups and features with add/remove buttons. Improves UX by separating complex comparison config from other content settings. Adds navigation tab and route for /settings/pages/comparison.
126 lines
8.2 KiB
Handlebars
126 lines
8.2 KiB
Handlebars
{{template "repo/settings/layout_head" (dict "ctxData" . "pageClass" "repository settings pages")}}
|
|
<div class="user-main-content twelve wide column">
|
|
<h4 class="ui top attached header">{{ctx.Locale.Tr "repo.settings.pages.comparison"}}</h4>
|
|
<div class="ui attached segment">
|
|
<form class="ui form" method="post">
|
|
{{.CsrfTokenHtml}}
|
|
<div class="field">
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_headline"}}</label>
|
|
<input name="comparison_headline" value="{{.Config.Comparison.Headline}}" placeholder="How We Compare">
|
|
</div>
|
|
<div class="field">
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_subheadline"}}</label>
|
|
<input name="comparison_subheadline" value="{{.Config.Comparison.Subheadline}}" placeholder="See how we stack up against the competition">
|
|
</div>
|
|
<h5 class="ui dividing header">{{ctx.Locale.Tr "repo.settings.pages.comparison_columns"}}</h5>
|
|
<p class="help">{{ctx.Locale.Tr "repo.settings.pages.comparison_columns_help"}}</p>
|
|
<div class="three fields">
|
|
<div class="field">
|
|
<label>Column 1</label>
|
|
<input name="comparison_col_name_0" value="{{if gt (len .Config.Comparison.Columns) 0}}{{(index .Config.Comparison.Columns 0).Name}}{{end}}" placeholder="Us">
|
|
<div class="inline field tw-mt-2">
|
|
<div class="ui checkbox">
|
|
<input type="checkbox" name="comparison_col_highlight_0" {{if and (gt (len .Config.Comparison.Columns) 0) (index .Config.Comparison.Columns 0).Highlight}}checked{{end}}>
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_highlight"}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label>Column 2</label>
|
|
<input name="comparison_col_name_1" value="{{if gt (len .Config.Comparison.Columns) 1}}{{(index .Config.Comparison.Columns 1).Name}}{{end}}" placeholder="Competitor A">
|
|
<div class="inline field tw-mt-2">
|
|
<div class="ui checkbox">
|
|
<input type="checkbox" name="comparison_col_highlight_1" {{if and (gt (len .Config.Comparison.Columns) 1) (index .Config.Comparison.Columns 1).Highlight}}checked{{end}}>
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_highlight"}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label>Column 3</label>
|
|
<input name="comparison_col_name_2" value="{{if gt (len .Config.Comparison.Columns) 2}}{{(index .Config.Comparison.Columns 2).Name}}{{end}}" placeholder="Competitor B">
|
|
<div class="inline field tw-mt-2">
|
|
<div class="ui checkbox">
|
|
<input type="checkbox" name="comparison_col_highlight_2" {{if and (gt (len .Config.Comparison.Columns) 2) (index .Config.Comparison.Columns 2).Highlight}}checked{{end}}>
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_highlight"}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h5 class="ui dividing header">{{ctx.Locale.Tr "repo.settings.pages.comparison_features"}}</h5>
|
|
<p class="help">{{ctx.Locale.Tr "repo.settings.pages.comparison_features_help"}}</p>
|
|
<div id="comparison-groups-container">
|
|
{{if .Config.Comparison.Groups}}
|
|
{{range $g, $group := .Config.Comparison.Groups}}
|
|
<div class="comparison-group" data-group-index="{{$g}}">
|
|
<div class="field tw-mt-3" style="background: rgba(0,0,0,0.02); padding: 8px 12px; border-radius: 4px;">
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_group_name"}}</label>
|
|
<input name="comparison_group_name_{{$g}}" value="{{$group.Name}}" placeholder="e.g., Core Features (optional)">
|
|
</div>
|
|
<div class="comparison-features" data-group="{{$g}}">
|
|
{{range $f, $feat := $group.Features}}
|
|
<div class="fields comparison-feature-row tw-mt-2">
|
|
<div class="four wide field"><input name="comparison_feat_name_{{$g}}_{{$f}}" value="{{$feat.Name}}" placeholder="Feature name"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_{{$g}}_{{$f}}_0" value="{{if gt (len $feat.Values) 0}}{{index $feat.Values 0}}{{end}}" placeholder="true / false / text"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_{{$g}}_{{$f}}_1" value="{{if gt (len $feat.Values) 1}}{{index $feat.Values 1}}{{end}}" placeholder="true / false / text"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_{{$g}}_{{$f}}_2" value="{{if gt (len $feat.Values) 2}}{{index $feat.Values 2}}{{end}}" placeholder="true / false / text"></div>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
<button type="button" class="ui mini button tw-mt-2" onclick="addComparisonFeature({{$g}})">+ Add Feature</button>
|
|
</div>
|
|
{{end}}
|
|
{{else}}
|
|
<div class="comparison-group" data-group-index="0">
|
|
<div class="field tw-mt-3" style="background: rgba(0,0,0,0.02); padding: 8px 12px; border-radius: 4px;">
|
|
<label>{{ctx.Locale.Tr "repo.settings.pages.comparison_group_name"}}</label>
|
|
<input name="comparison_group_name_0" placeholder="e.g., Core Features (optional)">
|
|
</div>
|
|
<div class="comparison-features" data-group="0">
|
|
<div class="fields comparison-feature-row tw-mt-2">
|
|
<div class="four wide field"><input name="comparison_feat_name_0_0" placeholder="Feature name"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_0_0_0" placeholder="true / false / text"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_0_0_1" placeholder="true / false / text"></div>
|
|
<div class="four wide field"><input name="comparison_feat_val_0_0_2" placeholder="true / false / text"></div>
|
|
</div>
|
|
</div>
|
|
<button type="button" class="ui mini button tw-mt-2" onclick="addComparisonFeature(0)">+ Add Feature</button>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
<button type="button" class="ui mini button tw-mt-2" onclick="addComparisonGroup()">+ Add Feature Group</button>
|
|
<div class="field tw-mt-4">
|
|
<button class="ui primary button">{{ctx.Locale.Tr "save"}}</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
let compGroupCount = {{len .Config.Comparison.Groups}};
|
|
let compFeatCounts = {};
|
|
{{range $g, $group := .Config.Comparison.Groups}}
|
|
compFeatCounts[{{$g}}] = {{len $group.Features}};
|
|
{{end}}
|
|
if (compGroupCount === 0) { compGroupCount = 1; compFeatCounts[0] = 1; }
|
|
|
|
function addComparisonFeature(g) {
|
|
if (!compFeatCounts[g]) compFeatCounts[g] = 0;
|
|
const f = compFeatCounts[g];
|
|
const container = document.querySelector(`.comparison-features[data-group="${g}"]`);
|
|
container.insertAdjacentHTML('beforeend',
|
|
`<div class="fields comparison-feature-row tw-mt-2"><div class="four wide field"><input name="comparison_feat_name_${g}_${f}" placeholder="Feature name"></div><div class="four wide field"><input name="comparison_feat_val_${g}_${f}_0" placeholder="true / false / text"></div><div class="four wide field"><input name="comparison_feat_val_${g}_${f}_1" placeholder="true / false / text"></div><div class="four wide field"><input name="comparison_feat_val_${g}_${f}_2" placeholder="true / false / text"></div></div>`
|
|
);
|
|
compFeatCounts[g]++;
|
|
}
|
|
|
|
function addComparisonGroup() {
|
|
const g = compGroupCount;
|
|
compFeatCounts[g] = 1;
|
|
const container = document.getElementById('comparison-groups-container');
|
|
container.insertAdjacentHTML('beforeend',
|
|
`<div class="comparison-group" data-group-index="${g}"><div class="field tw-mt-3" style="background:rgba(0,0,0,0.02);padding:8px 12px;border-radius:4px;"><label>Group Name</label><input name="comparison_group_name_${g}" placeholder="e.g., Core Features (optional)"></div><div class="comparison-features" data-group="${g}"><div class="fields comparison-feature-row tw-mt-2"><div class="four wide field"><input name="comparison_feat_name_${g}_0" placeholder="Feature name"></div><div class="four wide field"><input name="comparison_feat_val_${g}_0_0" placeholder="true / false / text"></div><div class="four wide field"><input name="comparison_feat_val_${g}_0_1" placeholder="true / false / text"></div><div class="four wide field"><input name="comparison_feat_val_${g}_0_2" placeholder="true / false / text"></div></div></div><button type="button" class="ui mini button tw-mt-2" onclick="addComparisonFeature(${g})">+ Add Feature</button></div>`
|
|
);
|
|
compGroupCount++;
|
|
}
|
|
</script>
|
|
{{template "repo/settings/layout_footer" .}}
|