Skip to content

Commit

Permalink
Enhancement: Profile page
Browse files Browse the repository at this point in the history
Fix some overflow issues in the design of profile page
added an edit button to edit user's crypto address
  • Loading branch information
CodeWithBishal committed Aug 12, 2024
1 parent fed4a4f commit 7db4664
Show file tree
Hide file tree
Showing 5 changed files with 130 additions and 20 deletions.
46 changes: 43 additions & 3 deletions website/static/js/validate-btc.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ function validateBCH(address) {
* Params: BCH Address
* ***/
if (address == null || address == "" || address == " ") {
return false;
return "empty";
}
if (address.startsWith("bitcoincash:")) {
address = address.slice(12);
Expand All @@ -50,7 +50,7 @@ function validateEthereum(address) {
let regex = new RegExp(/^(0x)?[0-9a-fA-F]{40}$/);

if (address == null || address == "" || address == " ") {
return false;
return "empty";
} else if (regex.test(address) == true) {
return true;
} else {
Expand All @@ -65,13 +65,53 @@ function validateBitCoin(address) {
* ***/
let regex = new RegExp(/^(bc1|[13])[a-km-zA-HJ-NP-Z1-9]{25,34}$/);
if (address == null || address == "" || address == " ") {
return false;
return "empty";
} else if (regex.test(address) == true) {
return true;
} else {
return false;
}
}

async function CryptoEditForm(crypto, selected_c) {
if(selected_c == "BTC"){
selected_c = "Bitcoin"
var isValidAddress = validateBitCoin(crypto);
}else if(selected_c == "BCH"){
selected_c = "BitcoinCash"
var isValidAddress = validateBCH(crypto);
}else if(selected_c == "ETH"){
selected_c = "Ethereum"
var isValidAddress = validateEthereum(crypto);
}else{
$.notify("Please select a Crypto Address", {
style: "custom",
className: "danger"
});
return;
}
if(isValidAddress == true){
const data = {
selected_crypto: selected_c,
new_address: crypto
};
const request = await fetch("/update_bch_address/", {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(data),
});
if(request.status == 200){
window.location.reload();
}
}else{
$.notify("Please enter a valid Crypto Address", {
style: "custom",
className: "danger"
});
}
}
// TEST THE VALIDATORS
// BitCoin VALIDATOR
// Uncomment the below code
Expand Down
22 changes: 11 additions & 11 deletions website/templates/includes/crypto_donation.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,27 +8,27 @@
width="32px"
height="32px">
<div class="ml-3" id="crypto">
{% if object.user.userprofile.btc_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="BTC" right=object.user.userprofile.btc_address lessWidth=True %}
{% if user.userprofile.btc_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="BTC" right=user.userprofile.btc_address|slice:":40" lessWidth=True editCrypto=True %}
{% endif %}
{% if object.user.userprofile.bch_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="BCH" right=object.user.userprofile.bch_address lessWidth=True %}
{% if user.userprofile.bch_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="BCH" right=user.userprofile.bch_address|slice:":40" lessWidth=True editCrypto=True %}
{% endif %}
{% if object.user.userprofile.eth_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="ETH" right=object.user.userprofile.eth_address lessWidth=True %}
{% if user.userprofile.eth_address %}
{% include "./tiny-cards.html" with insideIFCondition=True left="ETH" right=user.userprofile.eth_address|slice:":40" lessWidth=True editCrypto=True %}
{% endif %}
</div>
<div class="hidden" id="no-crypto">
{% include "./tiny-cards.html" with left="BCH" right="qr5yccf7j4dpjekyz3vpawgaarl352n7yv5d5mtzzc" lessWidth=True %}
<div class="hidden max-sm:w-[100%] max-sm:overflow-hidden" id="no-crypto">
{% include "./tiny-cards.html" with left="BCH" right="qr5yccf7j4dpjekyz3vpawgaarl352n7yv5d5mtzzc" lessWidth=True editCrypto=True %}
<i class="ml-[3%] text-[12px]">No Address, will go to BLT Donation</i>
</div>
</div>
</div>
<script>
function loadQRCode(){
var btc_address = "{{object.user.userprofile.btc_address}}";
var bch_address = "{{object.user.userprofile.bch_address}}";
var eth_address = "{{object.user.userprofile.eth_address}}";
var btc_address = "{{user.userprofile.btc_address}}";
var bch_address = "{{user.userprofile.bch_address}}";
var eth_address = "{{user.userprofile.eth_address}}";

if(btc_address != "None" && btc_address != ""){
document.getElementById('crypto-qr-image').src = `https://api.qrserver.com/v1/create-qr-code/?data=${btc_address}&size=400x300`;
Expand Down
4 changes: 4 additions & 0 deletions website/templates/includes/tiny-cards.html
Original file line number Diff line number Diff line change
Expand Up @@ -23,4 +23,8 @@
rel="noopener noreferrer"
class="text-[#6B7280]"><i class="fas fa-external-link-alt"></i></a>
{% endif %}
{% if editCrypto and request.user.is_authenticated and request.user == user %}
<div class="h-0 w-[20px]"></div>
<a href="#" class="text-[#6B7280]" onclick="return openEditCrypto();"><i class="fas fa-edit"></i></a>
{% endif %}
</div>
71 changes: 68 additions & 3 deletions website/templates/profile.html
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@
</form>
{% endif %}
</div>
<div class="flex items-center justify-between w-[17vw] max-sm:w-[100vw]">
<div class="flex items-center justify-between w-[17vw] max-sm:w-[70vw]">
<span class="text-[25px] font-['Poppins']">{{ my_score|default:0 }} <span class="text-[19px] text-[#909090]">{% trans "POINTS" %}</span></span>
{% if request.user != user and request.user.is_authenticated %}
<span class="text-[25px]"></span>
Expand Down Expand Up @@ -365,14 +365,14 @@
</a>
<div class="mb-2 text-xl">
{{ activity.user|default:"Anonymous" }}
found a bug on <a href="{% url 'domain' slug=activity.domain_name %}">{{ activity.domain_title }}</a> {{ activity.created|timesince }}
found a bug on <a href="{% url 'domain' slug=activity.domain_name %}">{{ activity.domain_title }}</a> - {{ activity.created|timesince }}
ago
</div>
<a class="text-lg"
href="{{ activity.url }}"
target="_blank"
rel="noopener noreferrer">
<div>{{ activity.url }}</div>
<div>{{ activity.url|truncatechars:30 }}</div>
</a>
<a class="whitespace-nowrap mb-1 text-xl"
href="{{ activity.get_absolute_url }}#comments">
Expand Down Expand Up @@ -666,6 +666,57 @@ <h3>Following:</h3>
</div>
</div>
</div>
<div id="cryptoEdit"
class="hidden relative z-10"
aria-labelledby="modal-title"
role="dialog"
aria-modal="true">
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"
aria-hidden="true"></div>
<div class="fixed inset-0 z-10 w-screen overflow-y-auto">
<div class="flex min-h-full items-center justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 max-sm:w-full lg:w-[30vw] ">
<div class="bg-white px-4 pb-4 pt-5 sm:p-6 sm:pb-4">
<div class="sm:flex sm:items-start lg:w-full">
<div class="mt-3 sm:ml-4 sm:mt-0 sm:text-left lg:w-full">
<div class="mt-2">
<h3>Edit Crypto Addresses:</h3>
<br>
<select id="selectCrypto"
class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-4 px-5 text-gray-700 mb-6 leading-tight focus:outline-none focus:bg-white focus:border-[#c7e4ff] focus:border-500">
<option selected>Choose a Crypto Address</option>
<option value="BTC">BTC</option>
<option value="BCH">BCH</option>
<option value="ETH">ETH</option>
</select>
<p class="text-xl">
<div class="md:flex md:items-center mb-6">
<div class="md:w-[100%]">
<input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-4 px-5 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-[#c7e4ff] focus:border-500"
id="input-crypto"
type="text"
placeholder="Add Crypto Address for donation">
</div>
</div>
</p>
</div>
</div>
</div>
</div>
<div class="bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
<button type="button"
onclick="return CryptoEditForm(document.getElementById('input-crypto').value, document.getElementById('selectCrypto').value);"
class="mt-3 ml-4 max-sm:ml-0 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-xl font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:mt-0 sm:w-auto">
Submit
</button>
<button type="button"
class="mt-3 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-xl font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:mt-0 sm:w-auto"
id="close-cryptoEdit">Close</button>
</div>
</div>
</div>
</div>
</div>
<div id="Bookmark"
class="hidden relative z-10"
aria-labelledby="modal-title"
Expand Down Expand Up @@ -802,6 +853,7 @@ <h3>Bookmarks:</h3>
style: "custom",
className: "success"
});
window.location.reload();
}
else{
$.notify("Permission Denied", {
Expand Down Expand Up @@ -880,5 +932,18 @@ <h3>Bookmarks:</h3>
}
});
});


var cryptoEdit = document.getElementById("cryptoEdit");

function openEditCrypto(){
cryptoEdit.classList.remove("hidden");
}

var close = document.getElementById("close-cryptoEdit");
close.addEventListener("click", ()=>{
cryptoEdit.classList.add("hidden");
})
</script>
<script src="{% static 'js/validate-btc.js' %}"></script>
{% endblock content %}
7 changes: 4 additions & 3 deletions website/views.py
Original file line number Diff line number Diff line change
Expand Up @@ -4231,7 +4231,6 @@ def get_context_data(self, **kwargs):
context["bookmarked"] = self.request.user.userprofile.issue_saved.filter(
pk=self.object.id
).exists()

context["screenshots"] = IssueScreenshot.objects.filter(issue=self.object).all()
context["status"] = Issue.objects.filter(id=self.object.id).get().status
context["github_issues_url"] = (
Expand Down Expand Up @@ -4540,10 +4539,12 @@ def trademark_detailview(request, slug):
# headers=headers,
# )
# mail.logout()
@csrf_exempt
def update_bch_address(request):
if request.method == "POST":
selected_crypto = request.POST.get("selected_crypto")
new_address = request.POST.get("new_address")
data = json.loads(request.body)
selected_crypto = data.get("selected_crypto")
new_address = data.get("new_address")
if selected_crypto and new_address:
try:
user_profile = request.user.userprofile
Expand Down

0 comments on commit 7db4664

Please sign in to comment.