aljaz/btcpayserver
1
0
Fork 0
mirror of https://github.com/aljazceru/btcpayserver.git synced 2025-12-18 22:44:29 +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 bool SoundsEnabled { get; set; }
public string DisqusShortname { get; set; } public string DisqusShortname { get; set; }
public bool AnimationsEnabled { get; set; } public bool AnimationsEnabled { get; set; }
public string DisqusAPIKey { get; set; }
} }
@@ -68,7 +67,6 @@ namespace BTCPayServer.Controllers
SoundsEnabled = settings.SoundsEnabled, SoundsEnabled = settings.SoundsEnabled,
DisqusShortname = settings.DisqusShortname, DisqusShortname = settings.DisqusShortname,
AnimationsEnabled = settings.AnimationsEnabled, AnimationsEnabled = settings.AnimationsEnabled,
DisqusAPIKey = settings.DisqusAPIKey,
}; };
return View(vm); return View(vm);
} }
@@ -116,7 +114,6 @@ namespace BTCPayServer.Controllers
SoundsEnabled = vm.SoundsEnabled, SoundsEnabled = vm.SoundsEnabled,
DisqusShortname = vm.DisqusShortname, DisqusShortname = vm.DisqusShortname,
AnimationsEnabled = vm.AnimationsEnabled, AnimationsEnabled = vm.AnimationsEnabled,
DisqusAPIKey = vm.DisqusAPIKey,
}); });
await UpdateAppSettings(app); await UpdateAppSettings(app);
_EventAggregator.Publish(new CrowdfundAppUpdated() _EventAggregator.Publish(new CrowdfundAppUpdated()

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

@@ -37,8 +37,6 @@ namespace BTCPayServer.Models.AppViewModels
[Display(Name = "Disqus Shortname")] [Display(Name = "Disqus Shortname")]
public string DisqusShortname { get; set; } public string DisqusShortname { get; set; }
[Display(Name = "Disqus Api Key")]
public string DisqusAPIKey { get; set; }
public DateTime? StartDate { get; set; } public DateTime? StartDate { get; set; }
public DateTime? EndDate { 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 bool SoundsEnabled { get; set; }
public string DisqusShortname { get; set; } public string DisqusShortname { get; set; }
public bool AnimationsEnabled { get; set; } public bool AnimationsEnabled { get; set; }
public string DisqusAPIKey { get; set; }
public class CrowdfundInfo public class CrowdfundInfo

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

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

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

@@ -42,49 +42,43 @@
aria-valuemax="100"> aria-valuemax="100">
</div> </div>
</div> </div>
<div class="card-body"> <div class="card-body">
<ul class="nav nav-fill py-2"> <div class="row py-2 text-center">
<li class="nav-item"> <div class="col-sm border-right">
<h5>{{srvModel.info.currentAmount + srvModel.info.currentPendingAmount }} {{targetCurrency}} </h5> <h5>{{srvModel.info.currentAmount + srvModel.info.currentPendingAmount }} {{targetCurrency}} </h5>
<h5 class="text-muted">Raised</h5> <h5 class="text-muted">Raised</h5>
</li> </div>
<li class="nav-item"> <div class="col-sm border-right">
<h5>{{srvModel.info.progressPercentage + srvModel.info.pendingProgressPercentage }}%</h5> <h5>{{srvModel.info.progressPercentage + srvModel.info.pendingProgressPercentage }}%</h5>
<h5 class="text-muted">Of Goal</h5> <h5 class="text-muted">Of Goal</h5>
</li> </div>
<li class="nav-item"> <div class="col-sm border-right">
<h5> <h5>
{{srvModel.info.totalContributors}} {{srvModel.info.totalContributors}}
</h5> </h5>
<h5 class="text-muted">Contributors</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> </div>
</li> <div class="col-sm" v-if="endDiff">
</ul> <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="card-title">
<div class="row"> <div class="row">
@@ -94,7 +88,7 @@
<h2 class="text-muted" v-if="srvModel.tagline">{{srvModel.tagline}}</h2> <h2 class="text-muted" v-if="srvModel.tagline">{{srvModel.tagline}}</h2>
</div> </div>
<div class="col-sm-12 col-md-4 col-lg-3"> <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> </div>
@@ -109,7 +103,7 @@
</div> </div>
<div class="col-md-4 col-sm-12"> <div class="col-md-4 col-sm-12">
<contribute :target-currency="srvModel.targetCurrency" <contribute :target-currency="srvModel.targetCurrency"
:active="srvModel.info.active" :active="active"
:in-modal="false" :in-modal="false"
:perks="srvModel.perks"> :perks="srvModel.perks">
@@ -131,7 +125,7 @@
</div> </div>
<div class="col-md-4 col-sm-12"> <div class="col-md-4 col-sm-12">
<contribute :target-currency="srvModel.targetCurrency" <contribute :target-currency="srvModel.targetCurrency"
:active="srvModel.info.active" :active="active"
:in-modal="false" :in-modal="false"
:perks="srvModel.perks"> :perks="srvModel.perks">
@@ -146,7 +140,7 @@
<contribute v-if="contributeModalOpen" <contribute v-if="contributeModalOpen"
:target-currency="srvModel.targetCurrency" :target-currency="srvModel.targetCurrency"
:active="srvModel.info.active" :active="active"
:perks="srvModel.perks" :perks="srvModel.perks"
:in-modal="true"> :in-modal="true">
</contribute> </contribute>
@@ -166,8 +160,8 @@
</script> </script>
<script type="text/x-template" id="perk-template"> <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="card mb-4 perk" v-bind:class="{ 'expanded': expanded, 'unexpanded': !expanded }" v-on:click="expand">
<div class="perk-zoom " v-if="!expanded"> <div class="perk-zoom " v-if="!expanded && active">
<div class="perk-zoom-bg bg-primary"> </div> <div class="perk-zoom-bg bg-primary"> </div>
<div class="perk-zoom-text w-100 text-center text-white font-weight-bold"> <div class="perk-zoom-text w-100 text-center text-white font-weight-bold">
Select this contribution perk Select this contribution perk
@@ -191,7 +185,7 @@
</div> </div>
<p class="card-text" v-if="perk.description" v-html="perk.description"></p> <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 <input
:disabled="!active" :disabled="!active"
:readonly="!perk.custom" :readonly="!perk.custom"

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

@@ -28,7 +28,11 @@ addLoadEvent(function (ev) {
endDateRelativeTime: "", endDateRelativeTime: "",
started: false, started: false,
ended: false, ended: false,
contributeModalOpen: false contributeModalOpen: false,
endDiff: "",
startDiff: "",
active: true
} }
}, },
computed: { computed: {
@@ -43,6 +47,7 @@ addLoadEvent(function (ev) {
this.endDate = endDateM.format('MMMM Do YYYY'); this.endDate = endDateM.format('MMMM Do YYYY');
this.endDateRelativeTime = endDateM.fromNow(); this.endDateRelativeTime = endDateM.fromNow();
this.ended = endDateM.isBefore(moment()); this.ended = endDateM.isBefore(moment());
}else{ }else{
this.ended = false; this.ended = false;
} }
@@ -55,6 +60,21 @@ addLoadEvent(function (ev) {
}else{ }else{
this.started = true; 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); setTimeout(this.updateComputed, 1000);
}, },
submitModalContribute: function(e){ submitModalContribute: function(e){

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

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

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

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