aljaz/btcpayserver
1
0
Fork 0
mirror of https://github.com/aljazceru/btcpayserver.git synced 2025-12-18 14:34:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

ux fixes

Browse Source
This commit is contained in:
Kukks
2018-12-31 12:34:27 +01:00
parent 3dc250f801
commit 2245027ca3
8 changed files with 67 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
BTCPayServer/Controllers/AppsController.Crowdsale.cs
View File

@@ -36,7 +36,6 @@ namespace BTCPayServer.Controllers
public bool SoundsEnabled { get; set; }
public string DisqusShortname { get; set; }
public bool AnimationsEnabled { get; set; }
public string DisqusAPIKey { get; set; }
}
@@ -68,7 +67,6 @@ namespace BTCPayServer.Controllers
SoundsEnabled = settings.SoundsEnabled,
DisqusShortname = settings.DisqusShortname,
AnimationsEnabled = settings.AnimationsEnabled,
DisqusAPIKey = settings.DisqusAPIKey,
};
return View(vm);
}
@@ -116,7 +114,6 @@ namespace BTCPayServer.Controllers
SoundsEnabled = vm.SoundsEnabled,
DisqusShortname = vm.DisqusShortname,
AnimationsEnabled = vm.AnimationsEnabled,
DisqusAPIKey = vm.DisqusAPIKey,
});
await UpdateAppSettings(app);
_EventAggregator.Publish(new CrowdfundAppUpdated()

2
BTCPayServer/Models/AppViewModels/UpdateCrowdfundViewModel.cs
View File

@@ -37,8 +37,6 @@ namespace BTCPayServer.Models.AppViewModels
[Display(Name = "Disqus Shortname")]
public string DisqusShortname { get; set; }
[Display(Name = "Disqus Api Key")]
public string DisqusAPIKey { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }

1
BTCPayServer/Models/AppViewModels/ViewCrowdfundViewModel.cs
View File

@@ -27,7 +27,6 @@ namespace BTCPayServer.Models.AppViewModels
public bool SoundsEnabled { get; set; }
public string DisqusShortname { get; set; }
public bool AnimationsEnabled { get; set; }
public string DisqusAPIKey { get; set; }
public class CrowdfundInfo

5
BTCPayServer/Views/Apps/UpdateCrowdfund.cshtml
View File

@@ -141,11 +141,6 @@
<input asp-for="DisqusShortname" class="form-control" />
<span asp-validation-for="DisqusShortname" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="DisqusAPIKey" class="control-label"></label>
<input asp-for="DisqusAPIKey" class="form-control" />
<span asp-validation-for="DisqusAPIKey" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Save Settings" />
</div>

90
BTCPayServer/Views/AppsPublic/Crowdfund/VueCrowdfund.cshtml
View File

@@ -42,49 +42,43 @@
aria-valuemax="100">
</div>
</div>
<div class="card-body">
<ul class="nav nav-fill py-2">
<li class="nav-item">
<h5>{{srvModel.info.currentAmount + srvModel.info.currentPendingAmount }} {{targetCurrency}} </h5>
<h5 class="text-muted">Raised</h5>
</li>
<li class="nav-item">
<h5>{{srvModel.info.progressPercentage + srvModel.info.pendingProgressPercentage }}%</h5>
<h5 class="text-muted">Of Goal</h5>
</li>
<li class="nav-item">
<h5>
{{srvModel.info.totalContributors}}
</h5>
<h5 class="text-muted">Contributors</h5>
</li>
<li class="nav-item">
<div class="mx-auto">
<ul style="list-style-type: none">
<li v-if="startDate">
<template v-if="started">
Started {{startDate}}
</template>
<template v-else-if="!started">
Starts {{startDate}}
</template>
</li>
<li v-if="endDate">
<template v-if="!ended">
Ends {{endDate}}
</template>
<template v-else-if="ended">
Ended {{endDate}}
</template>
</li>
<li class="list-group-item" v-else-if="!endDate">
No specific end date
</li>
</ul>
</div>
</li>
</ul>
<div class="row py-2 text-center">
<div class="col-sm border-right">
<h5>{{srvModel.info.currentAmount + srvModel.info.currentPendingAmount }} {{targetCurrency}} </h5>
<h5 class="text-muted">Raised</h5>
</div>
<div class="col-sm border-right">
<h5>{{srvModel.info.progressPercentage + srvModel.info.pendingProgressPercentage }}%</h5>
<h5 class="text-muted">Of Goal</h5>
</div>
<div class="col-sm border-right">
<h5>
{{srvModel.info.totalContributors}}
</h5>
<h5 class="text-muted">Contributors</h5>
</div>
<div class="col-sm" v-if="endDiff">
<h5>
{{endDiff}}
</h5>
<h5 class="text-muted">Left</h5>
</div>
<div class="col-sm" v-if="startDiff">
<h5>
{{startDiff}}
</h5>
<h5 class="text-muted">Left to start</h5>
</div>
<div class="col-sm" v-if="ended">
<h5>
Campaign
</h5>
<h5 >not active</h5>
</div>
</div>
<div class="card-title">
<div class="row">
@@ -94,7 +88,7 @@
<h2 class="text-muted" v-if="srvModel.tagline">{{srvModel.tagline}}</h2>
</div>
<div class="col-sm-12 col-md-4 col-lg-3">
<button v-if="srvModel.info.active" class="btn btn-lg btn-primary w-100 font-weight-bold" v-on:click="contributeModalOpen = true">Contribute</button>
<button v-if="active" class="btn btn-lg btn-primary w-100 font-weight-bold" v-on:click="contributeModalOpen = true">Contribute</button>
</div>
@@ -109,7 +103,7 @@
</div>
<div class="col-md-4 col-sm-12">
<contribute :target-currency="srvModel.targetCurrency"
:active="srvModel.info.active"
:active="active"
:in-modal="false"
:perks="srvModel.perks">
@@ -131,7 +125,7 @@
</div>
<div class="col-md-4 col-sm-12">
<contribute :target-currency="srvModel.targetCurrency"
:active="srvModel.info.active"
:active="active"
:in-modal="false"
:perks="srvModel.perks">
@@ -146,7 +140,7 @@
<contribute v-if="contributeModalOpen"
:target-currency="srvModel.targetCurrency"
:active="srvModel.info.active"
:active="active"
:perks="srvModel.perks"
:in-modal="true">
</contribute>
@@ -166,8 +160,8 @@
</script>
<script type="text/x-template" id="perk-template">
<div class="card mb-4 perk" v-bind:class="{ 'expanded': expanded, 'unexpanded': !expanded }" v-on:click="expanded = true">
<div class="perk-zoom " v-if="!expanded">
<div class="card mb-4 perk" v-bind:class="{ 'expanded': expanded, 'unexpanded': !expanded }" v-on:click="expand">
<div class="perk-zoom " v-if="!expanded && active">
<div class="perk-zoom-bg bg-primary"> </div>
<div class="perk-zoom-text w-100 text-center text-white font-weight-bold">
Select this contribution perk
@@ -191,7 +185,7 @@
</div>
<p class="card-text" v-if="perk.description" v-html="perk.description"></p>
<div class="input-group" style="max-width: 500px;" v-if="expanded">
<div class="input-group" style="max-width: 500px;" v-if="expanded" :id="'perk-form'+ perk.id">
<input
:disabled="!active"
:readonly="!perk.custom"

22
BTCPayServer/wwwroot/crowdfund/app.js
View File

@@ -28,7 +28,11 @@ addLoadEvent(function (ev) {
endDateRelativeTime: "",
started: false,
ended: false,
contributeModalOpen: false
contributeModalOpen: false,
endDiff: "",
startDiff: "",
active: true
}
},
computed: {
@@ -43,6 +47,7 @@ addLoadEvent(function (ev) {
this.endDate = endDateM.format('MMMM Do YYYY');
this.endDateRelativeTime = endDateM.fromNow();
this.ended = endDateM.isBefore(moment());
}else{
this.ended = false;
}
@@ -55,6 +60,21 @@ addLoadEvent(function (ev) {
}else{
this.started = true;
}
if(this.started && !this.ended && this.srvModel.endDate){
var mDiffD = moment(this.srvModel.endDate).diff(moment(), "days");
var mDiffH = moment(this.srvModel.endDate).diff(moment(), "hours");
var mDiffM = moment(this.srvModel.endDate).diff(moment(), "minutes");
var mDiffS = moment(this.srvModel.endDate).diff(moment(), "seconds");
this.endDiff = mDiffD > 0? mDiffD + " Days" : mDiffH> 0? mDiffH + " Hours" : mDiffM> 0? mDiffM+ " Minutes" : mDiffS> 0? mDiffS + " Seconds": "";
}
if(!this.started && this.srvModel.startDate){
var mDiffD = moment(this.srvModel.startDate).diff(moment(), "days");
var mDiffH = moment(this.srvModel.startDate).diff(moment(), "hours");
var mDiffM = moment(this.srvModel.startDate).diff(moment(), "minutes");
var mDiffS = moment(this.srvModel.startDate).diff(moment(), "seconds");
this.startDiff = mDiffD > 0? mDiffD + " Days" : mDiffH> 0? mDiffH + " Hours" : mDiffM> 0? mDiffM+ " Minutes" : mDiffS> 0? mDiffS + " Seconds": "";
}
this.active = this.started && !this.ended;
setTimeout(this.updateComputed, 1000);
},
submitModalContribute: function(e){

4
BTCPayServer/wwwroot/crowdfund/components/contribute.js
View File

@@ -28,7 +28,9 @@ Vue.component('perk', {
eventAggregator.$emit("contribute", {amount: this.amount, choiceKey: this.choiceKey});
},
expand: function(){
this.expanded = true;
if(this.active){
this.expanded = true;
}
}

1
BTCPayServer/wwwroot/crowdfund/styles/main.css
View File

@@ -27,6 +27,7 @@ canvas#fireworks{
position: absolute;
}
.perk:hover .perk-zoom{
cursor: pointer;
opacity:1;
display: block;
position: absolute;