Browse Source

Add dark theme

master
arnaucube 3 years ago
parent
commit
f6323e7ca4
13 changed files with 584 additions and 45 deletions
  1. BIN
      blogo
  2. +1
    -1
      blogo-input/blogo.json
  3. +51
    -0
      blogo-input/css/style.css
  4. +35
    -1
      blogo-input/index.html
  5. +1
    -2
      blogo-input/postThumbTemplate.html
  6. +39
    -5
      public/blind-signatures-ec.html
  7. +39
    -5
      public/blogo.html
  8. +39
    -5
      public/coffeeminer-hacking-wifi-cryptocurrency-miner.html
  9. +51
    -0
      public/css/style.css
  10. +39
    -5
      public/flock-botnet.html
  11. +53
    -15
      public/index.html
  12. +196
    -0
      public/kzg-batch-proof.html
  13. +40
    -6
      public/kzg-commitments.html

BIN
blogo


+ 1
- 1
blogo-input/blogo.json

@ -1,5 +1,5 @@
{
"title": "arnaucube",
"title": "arnaucube - blog",
"relativePath": "/blog",
"absoluteUrl": "https://arnaucube.com/blog",
"postsDir": "posts",

+ 51
- 0
blogo-input/css/style.css

@ -7,6 +7,15 @@ body {
font-family: 'Roboto', sans-serif;
}
.dark-theme { /* used for body class */
filter: invert(100%) hue-rotate(180deg);
background-color: #111;
}
.dark-theme img, .dark-theme video, .dark-theme iframe, .dark-theme .onoffswitch-label, .dark-theme code {
filter: invert(100%) hue-rotate(180deg);
}
a {
text-decoration:none!important;
}
@ -24,3 +33,45 @@ h1,h2, h3, h4, h5 {
padding-top: 20px;
}
.postThumb {
color:#000000;
text-decoration:none;
}
.postThumb:hover {
background: #f9f9f9;
}
/* switch button */
.onoffswitch {
position: relative; width: 46px;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
height: 20px; padding: 0; line-height: 20px;
border: 2px solid #FFFFFF; border-radius: 20px;
background-color: #9E9E9E;
transition: background-color 0.3s ease-in;
margin-bottom: 0;
}
.onoffswitch-label:before {
content: "";
display: block; width: 20px; margin: 0px;
background: #FFFFFF;
position: absolute; top: 0; bottom: 0;
right: 24px;
border: 2px solid #FFFFFF; border-radius: 20px;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
background-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
border-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
right: 0px;
}

+ 35
- 1
blogo-input/index.html

@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -92,6 +99,33 @@
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 1
- 2
blogo-input/postThumbTemplate.html

@ -1,4 +1,3 @@
<div class="row" style="color:#000000;text-decoration:none;">
<div class="row postThumb">
[blogo-index-post-template]
<hr>
</div>

+ 39
- 5
public/blind-signatures-ec.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="In this notes, we will cover the scheme proposed at 'New Blind Signature Schemes Based on the (Elliptic Curve) Discrete Logarithm Problem' paper by Hamid Mala & Nafiseh Nezhadansari." />
<meta charset="utf-8">
<title>Notes on blind signatures over elliptic curves - arnaucube</title>
<meta name="title" content="Notes on blind signatures over elliptic curves - arnaucube">
<title> Notes on blind signatures over elliptic curves - arnaucube - blog</title>
<meta name="title" content=" Notes on blind signatures over elliptic curves - arnaucube - blog">
<meta name="description" content="In this notes, we will cover the scheme proposed at 'New Blind Signature Schemes Based on the (Elliptic Curve) Discrete Logarithm Problem' paper by Hamid Mala & Nafiseh Nezhadansari.">
<meta property="og:title" content="Notes on blind signatures over elliptic curves - arnaucube" />
<meta property="og:title" content=" Notes on blind signatures over elliptic curves - arnaucube - blog" />
<meta property="og:description" content="In this notes, we will cover the scheme proposed at 'New Blind Signature Schemes Based on the (Elliptic Curve) Discrete Logarithm Problem' paper by Hamid Mala & Nafiseh Nezhadansari." />
<meta property="og:url" content="https://arnaucube.com/blog/blind-signatures-ec.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/img/posts/blind-signatures-ec/flow1.png" />
<meta name="twitter:title" content="Notes on blind signatures over elliptic curves - arnaucube">
<meta name="twitter:title" content=" Notes on blind signatures over elliptic curves - arnaucube - blog">
<meta name="twitter:description" content="In this notes, we will cover the scheme proposed at 'New Blind Signature Schemes Based on the (Elliptic Curve) Discrete Logarithm Problem' paper by Hamid Mala & Nafiseh Nezhadansari.">
<meta name="twitter:image" content="https://arnaucube.com/blog/img/posts/blind-signatures-ec/flow1.png">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -198,6 +205,33 @@ func main() {
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 39
- 5
public/blogo.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="How has this blog been made? In this post we will see how to develop a minimalistic static blog template engine with Go." />
<meta charset="utf-8">
<title>Static blog template engine implementation in Go - arnaucube</title>
<meta name="title" content="Static blog template engine implementation in Go - arnaucube">
<title> Static blog template engine implementation in Go - arnaucube - blog</title>
<meta name="title" content=" Static blog template engine implementation in Go - arnaucube - blog">
<meta name="description" content="How has this blog been made? In this post we will see how to develop a minimalistic static blog template engine with Go.">
<meta property="og:title" content="Static blog template engine implementation in Go - arnaucube" />
<meta property="og:title" content=" Static blog template engine implementation in Go - arnaucube - blog" />
<meta property="og:description" content="How has this blog been made? In this post we will see how to develop a minimalistic static blog template engine with Go." />
<meta property="og:url" content="https://arnaucube.com/blog/blogo.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/" />
<meta name="twitter:title" content="Static blog template engine implementation in Go - arnaucube">
<meta name="twitter:title" content=" Static blog template engine implementation in Go - arnaucube - blog">
<meta name="twitter:description" content="How has this blog been made? In this post we will see how to develop a minimalistic static blog template engine with Go.">
<meta name="twitter:image" content="https://arnaucube.com/blog/">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -445,6 +452,33 @@ func putHTMLToTemplate(template string, m map[string]string) string {
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 39
- 5
public/coffeeminer-hacking-wifi-cryptocurrency-miner.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="The goal of this post, is to explain how can be done the attack of MITM (Machine-In-The-Middle) to inject some javascript in the html pages, to force all the machines connected to a WiFi network to be mining a cryptocurrency for the attacker." />
<meta charset="utf-8">
<title>CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube</title>
<meta name="title" content="CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube">
<title> CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube - blog</title>
<meta name="title" content=" CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube - blog">
<meta name="description" content="The goal of this post, is to explain how can be done the attack of MITM (Machine-In-The-Middle) to inject some javascript in the html pages, to force all the machines connected to a WiFi network to be mining a cryptocurrency for the attacker.">
<meta property="og:title" content="CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube" />
<meta property="og:title" content=" CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube - blog" />
<meta property="og:description" content="The goal of this post, is to explain how can be done the attack of MITM (Machine-In-The-Middle) to inject some javascript in the html pages, to force all the machines connected to a WiFi network to be mining a cryptocurrency for the attacker." />
<meta property="og:url" content="https://arnaucube.com/blog/coffeeminer-hacking-wifi-cryptocurrency-miner.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/img/posts/coffeeMiner/coffeeMiner-network-attack.png" />
<meta name="twitter:title" content="CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube">
<meta name="twitter:title" content=" CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests - arnaucube - blog">
<meta name="twitter:description" content="The goal of this post, is to explain how can be done the attack of MITM (Machine-In-The-Middle) to inject some javascript in the html pages, to force all the machines connected to a WiFi network to be mining a cryptocurrency for the attacker.">
<meta name="twitter:image" content="https://arnaucube.com/blog/img/posts/coffeeMiner/coffeeMiner-network-attack.png">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -584,6 +591,33 @@ def start():
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 51
- 0
public/css/style.css

@ -7,6 +7,15 @@ body {
font-family: 'Roboto', sans-serif;
}
.dark-theme { /* used for body class */
filter: invert(100%) hue-rotate(180deg);
background-color: #111;
}
.dark-theme img, .dark-theme video, .dark-theme iframe, .dark-theme .onoffswitch-label, .dark-theme code {
filter: invert(100%) hue-rotate(180deg);
}
a {
text-decoration:none!important;
}
@ -24,3 +33,45 @@ h1,h2, h3, h4, h5 {
padding-top: 20px;
}
.postThumb {
color:#000000;
text-decoration:none;
}
.postThumb:hover {
background: #f9f9f9;
}
/* switch button */
.onoffswitch {
position: relative; width: 46px;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
height: 20px; padding: 0; line-height: 20px;
border: 2px solid #FFFFFF; border-radius: 20px;
background-color: #9E9E9E;
transition: background-color 0.3s ease-in;
margin-bottom: 0;
}
.onoffswitch-label:before {
content: "";
display: block; width: 20px; margin: 0px;
background: #FFFFFF;
position: absolute; top: 0; bottom: 0;
right: 24px;
border: 2px solid #FFFFFF; border-radius: 20px;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
background-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
border-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
right: 0px;
}

+ 39
- 5
public/flock-botnet.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="Developing a twitter botnet with autonomous bots replying tweets with text generated based on probabilities in Markov chains" />
<meta charset="utf-8">
<title>Auto generated tweets from Markov chains - arnaucube</title>
<meta name="title" content="Auto generated tweets from Markov chains - arnaucube">
<title> Auto generated tweets from Markov chains - arnaucube - blog</title>
<meta name="title" content=" Auto generated tweets from Markov chains - arnaucube - blog">
<meta name="description" content="Developing a twitter botnet with autonomous bots replying tweets with text generated based on probabilities in Markov chains">
<meta property="og:title" content="Auto generated tweets from Markov chains - arnaucube" />
<meta property="og:title" content=" Auto generated tweets from Markov chains - arnaucube - blog" />
<meta property="og:description" content="Developing a twitter botnet with autonomous bots replying tweets with text generated based on probabilities in Markov chains" />
<meta property="og:url" content="https://arnaucube.com/blog/flock-botnet.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/img/posts/flock-botnet/markovchain.png" />
<meta name="twitter:title" content="Auto generated tweets from Markov chains - arnaucube">
<meta name="twitter:title" content=" Auto generated tweets from Markov chains - arnaucube - blog">
<meta name="twitter:description" content="Developing a twitter botnet with autonomous bots replying tweets with text generated based on probabilities in Markov chains">
<meta name="twitter:image" content="https://arnaucube.com/blog/img/posts/flock-botnet/markovchain.png">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -370,6 +377,33 @@
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 53
- 15
public/index.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="arnaucube blog" />
<meta charset="utf-8">
<title>arnaucube</title>
<meta name="title" content="arnaucube">
<title>arnaucube - blog</title>
<meta name="title" content="arnaucube - blog">
<meta name="description" content="arnaucube blog">
<meta property="og:title" content="arnaucube" />
<meta property="og:title" content="arnaucube - blog" />
<meta property="og:description" content="arnaucube blog" />
<meta property="og:url" content="https://arnaucube.com/blog" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/img/logoArnauCube.png" />
<meta name="twitter:title" content="arnaucube">
<meta name="twitter:title" content="arnaucube - blog">
<meta name="twitter:description" content="arnaucube blog">
<meta name="twitter:image" content="https://arnaucube.com/blog/img/logoArnauCube.png">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -48,54 +55,58 @@
<div class="container" style="margin-top:40px;max-width:800px;">
<a href='/blog/kzg-commitments.html'><div class="row" style="color:#000000;text-decoration:none;">
<a href='/blog/kzg-batch-proof.html'><div class="row postThumb">
<h3>Batch proof in KZG Commitments</h3>
<p>The benefit of <em>batch proof</em> is that allows us to proof multiple points while the proof size remains constant to one $\mathbb{G}_1$ point.</p>
<p><em>2021-08-14</em></p>
</div>
</a><a href='/blog/kzg-commitments.html'><div class="row postThumb">
<h3>Notes on KZG polynomial commitments</h3>
<p>In the following notes I&rsquo;ve tried to summarize the KZG Commitments scheme with the concepts that helped me to follow the reasoning.</p>
<p><em>2021-08-05</em></p>
<hr>
</div>
</a><a href='/blog/blind-signatures-ec.html'><div class="row" style="color:#000000;text-decoration:none;">
</a><a href='/blog/blind-signatures-ec.html'><div class="row postThumb">
<h3>Notes on blind signatures over elliptic curves</h3>
<p>In this notes, we will cover the scheme proposed at <em>&ldquo;New Blind Signature Schemes Based on the (Elliptic Curve) Discrete Logarithm Problem&rdquo;</em> paper by Hamid Mala &amp; Nafiseh Nezhadansari.</p>
<p><em>2021-07-30</em></p>
<hr>
</div>
</a><a href='/blog/coffeeminer-hacking-wifi-cryptocurrency-miner.html'><div class="row" style="color:#000000;text-decoration:none;">
</a><a href='/blog/coffeeminer-hacking-wifi-cryptocurrency-miner.html'><div class="row postThumb">
<h3>CoffeeMiner: Hacking WiFi to inject cryptocurrency miner to HTML requests</h3>
<p>The goal of this post, is to explain how can be done the attack of MITM (Machine-In-The-Middle) to inject some javascript in the html pages, to force all the machines connected to a WiFi network to be mining a cryptocurrency for the attacker.</p>
<p><em>2018-01-04</em></p>
<hr>
</div>
</a><a href='/blog/flock-botnet.html'><div class="row" style="color:#000000;text-decoration:none;">
</a><a href='/blog/flock-botnet.html'><div class="row postThumb">
<h3>Auto generated tweets from Markov chains</h3>
<p>Developing a twitter botnet with autonomous bots replying tweets with text generated based on probabilities in Markov chains</p>
<p><em>2017-12-29</em></p>
<hr>
</div>
</a><a href='/blog/blogo.html'><div class="row" style="color:#000000;text-decoration:none;">
</a><a href='/blog/blogo.html'><div class="row postThumb">
<h3>Static blog template engine implementation in Go</h3>
<p>How has this blog been made? In this post we will see how to develop a minimalistic static blog template engine with Go.</p>
<p><em>2017-12-26</em></p>
<hr>
</div>
</a>
@ -142,6 +153,33 @@
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

+ 196
- 0
public/kzg-batch-proof.html

@ -0,0 +1,196 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="description" content="The benefit of batch proof is that allows us to proof multiple points while the proof size remains constant to one G1 point." />
<meta charset="utf-8">
<title> Batch proof in KZG Commitments - arnaucube - blog</title>
<meta name="title" content=" Batch proof in KZG Commitments - arnaucube - blog">
<meta name="description" content="The benefit of batch proof is that allows us to proof multiple points while the proof size remains constant to one G1 point.">
<meta property="og:title" content=" Batch proof in KZG Commitments - arnaucube - blog" />
<meta property="og:description" content="The benefit of batch proof is that allows us to proof multiple points while the proof size remains constant to one G1 point." />
<meta property="og:url" content="https://arnaucube.com/blog/kzg-batch-proof.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/" />
<meta name="twitter:title" content=" Batch proof in KZG Commitments - arnaucube - blog">
<meta name="twitter:description" content="The benefit of batch proof is that allows us to proof multiple points while the proof size remains constant to one G1 point.">
<meta name="twitter:image" content="https://arnaucube.com/blog/">
<meta name="twitter:card" content="summary_large_image">
<meta name="author" content="arnaucube">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<!-- highlightjs -->
<!-- <link rel="stylesheet" href="js/highlightjs/atom-one-dark.css"> -->
<link rel="stylesheet" href="js/highlightjs/gruvbox-dark.css">
<script src="js/highlightjs/highlight.pack.js"></script>
<!-- katex -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css" integrity="sha384-Um5gpz1odJg5Z4HAmzPtgZKdTBHZdw8S29IecapCSB31ligYPhHQZMIlWLYQGVoc" crossorigin="anonymous">
</head>
<body>
<!-- o_gradient_background" -->
<nav id="mainNav" class="navbar navbar-default navbar-fixed-top"
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
<div class="container" style="margin-top:40px;max-width:800px;">
<h2>Batch proof in KZG Commitments</h2>
<p><em>2021-08-14</em></p>
<blockquote>
<p><strong>Warning</strong>: I want to state clearly that I&rsquo;m not a mathematician, I&rsquo;m just an amateur on math studying in my free time, and this article is just an attempt to try to sort the notes that I took while reading about the KZG Commitments.</p>
</blockquote>
<p>Last week I posted some <em><a href="https://arnaucube.com/blog/kzg-commitments.html">notes on KZG Commitmens</a></em>, which overviews the scheme for single proofs. The current notes, try to overview the <em>batch proof</em> iteraton on KZG Commitments, and the <em>vector commitment</em> usage of it. Again (as in the previous post), big thanks to <a href="https://dankradfeist.de/ethereum/2020/06/16/kate-polynomial-commitments.html">Dankrad Feist</a> and <a href="https://alinush.github.io/2020/05/06/kzg-polynomial-commitments.html">Alin Tomescu</a> for their articles which helped me to follow a bit the reasoing behind this, and again, I recommend spending the time reading their articles instead of this current notes.</p>
<h4>Batch proof</h4>
<p>The benefit of <em>batch proof</em> is that allows us to proof multiple points while the proof size remains constant to one $\mathbb{G}_1$ point.
Let $(z_0, y_0), (z_1, y_1), &hellip;, (z_k, y_k)$ be the points that we want to proof, and that we have a polynomial $p(x)$ that goes through the points.
The <em>commitment</em> to the polynomial stands the same than for single proofs: $c=[p(\tau)]_1$.</p>
<p>For the evaluation proof, while in the single proofs we compute $q(x) = \frac{p(x)-y}{x-z}$, we will replace $y$ and $x-z$ by the following two polynomials.
The constant $y$ is replaced by a polynomial that has roots at all the points that we want to prove. This is achieved by computing the <a href="https://en.wikipedia.org/wiki/Lagrange_polynomial">Lagrange interpolation</a> for the given set of points:</p>
<p>$$
I(x) = \sum_{j=0}^k y_j l_j(x)\newline
where \space\space\space l_j(x) = \prod_{0\leq m \leq k} \frac{x-x_m}{x_j - x_m}
$$</p>
<p>And the $x-z$, which was to ensure that $q(x)$ had a root at $z$, now, as we want to ensure that $q(x)$ has roots at all the points of the commitment, we will use the <em>zero polynomial</em>:
$$
Z(x) = \prod_{i=0}^{k} x-z_i =\newline
=(x-z_0)(x-z_1)&hellip;(x-z_k)
$$</p>
<p>This polynomial ensures that when $x=z_i$ ($z_i$ being one of our points), the polynomial evaluation will be zero.</p>
<p>Now we can put $I(x)$ and $Z(x)$ in place, obtaining $q(x)=\frac{p(x)-I(x)}{Z(x)}$. And the batch proof evaluation is obtained by $\pi=[q(\tau)]_1$.</p>
<p>The verification is quite similar than what we did for single proofs, but using the mentioned $z(x)$ and $I(x)$:
$$
\hat{e}(\pi, [Z(\tau)]_2) == \hat{e}(c - [I(\tau)]_1, H)
$$</p>
<p>Which, as we did with the single proofs in the previous post, we can unroll it and see that:
$$
\hat{e}(\pi, [Z(\tau)]_2) == \hat{e}(c - [I(\tau)]_1, H)\newline
\Rightarrow \hat{e}([q(\tau)]_1, [Z(\tau)]_2) == \hat{e}([p(\tau)]_1 - [I(\tau)]_1, H)\newline
\Rightarrow [q(\tau) \cdot Z(\tau)]_T == [p(\tau) - I(\tau)]_T
$$
From where we see that is the equation $q(x)\cdot Z(x)=p(x)-I(x)$, which can be expressed as $q(x) = \frac{p(x) - I(x)}{Z(x)}$, evaluated at $\tau$ from the trusted setup, which is not known: $q(\tau) = \frac{p(\tau) - I(\tau)}{Z(\tau)}$.</p>
<h4>Vector commitments</h4>
<p>As mentioned earlier, this scheme can be used as a <em>vector commitment</em> scheme.</p>
<p>A vector commitment allows a prover to commit to a vector and later proof that a certain value belongs to that vector. As a traditional example, we can think of <em>Merkle Trees</em>, where we can commit to a vector of values, which are placed in the tree leafs. Then we compute the <em>root</em> which acts as the commitment. Then we can provide a proof that a certain leaf belongs to the vector for the commitment (<em>root</em>) that we showed earlier.
The problem with Merkle Trees is that the proof size grows linearly with the size of the tree, as it contains the siblings from the leaf to the root. Here is where <em>KZG Commitments</em> can be benefitial, as the proof always stands with the same size, one $\mathbb{G}_1$ point, no matter of how many points we are batching.</p>
<p>We can use KZG Commitments as a vector commitment scheme by mapping the <em>vector</em> as a batch of points that build the polynomial, so when commiting to the polynomial we are commiting to the vector. Then, it&rsquo;s a matter of using the <em>batch proof</em> approach explained above in order to proof multiple elements of the vector in a single proof that can be verified later.</p>
<h4>Final note</h4>
<p>I&rsquo;m fascinated by this scheme and its potential. One next rabbit hole (related to KZG Commitments) to look at, would be the <a href="https://vitalik.ca/general/2019/09/22/plonk.html">Plonk</a> and other similar constructions. Also, another use case that is getting attention in the Ethereum community is the <a href="https://vitalik.ca/general/2021/06/18/verkle.html"><em>Verkle Trees</em></a>.</p>
<p>As in the previous notes, in order to try to put in practice the concepts, I&rsquo;ve added the <em>batch proof</em> logic at <a href="https://github.com/arnaucube/kzg-commitments-study">https://github.com/arnaucube/kzg-commitments-study</a>.</p>
</div>
<footer style="text-align:center; margin-top:100px;margin-bottom:50px;">
<div class="container">
<div class="row">
<ul class="list-inline">
<li><a href="https://twitter.com/arnaucube"
style="color:gray;text-decoration:none;"
target="_blank">twitter.com/arnaucube</a>
</li>
<li><a href="https://github.com/arnaucube"
style="color:gray;text-decoration:none;"
target="_blank">github.com/arnaucube</a>
</li>
</ul>
</div>
<div class="row" style="display:inline-block;">
Blog made with <a href="http://github.com/arnaucube/blogo/"
target="_blank" style="color: gray;text-decoration:none;">Blogo</a>
</div>
</div>
</footer>
<script>
</script>
<script src="js/external-links.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.js" integrity="sha384-YNHdsYkH6gMx9y3mRkmcJ2mFUjTd0qNQQvY9VYZgQd7DcN7env35GzlmFaZ23JGp" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/contrib/auto-render.min.js" integrity="sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
displayMode: false,
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
],
// • rendering keys, e.g.:
throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
</body>
</html>

+ 40
- 6
public/kzg-commitments.html

@ -4,16 +4,16 @@
<head>
<meta name="description" content="In the following notes I've tried to summarize the KZG Commitment scheme with the concepts that helped me to follow the reasoning." />
<meta charset="utf-8">
<title> Notes on KZG polynomial commitments - arnaucube</title>
<meta name="title" content=" Notes on KZG polynomial commitments - arnaucube">
<title> Notes on KZG polynomial commitments - arnaucube - blog</title>
<meta name="title" content=" Notes on KZG polynomial commitments - arnaucube - blog">
<meta name="description" content="In the following notes I've tried to summarize the KZG Commitment scheme with the concepts that helped me to follow the reasoning.">
<meta property="og:title" content=" Notes on KZG polynomial commitments - arnaucube" />
<meta property="og:title" content=" Notes on KZG polynomial commitments - arnaucube - blog" />
<meta property="og:description" content="In the following notes I've tried to summarize the KZG Commitment scheme with the concepts that helped me to follow the reasoning." />
<meta property="og:url" content="https://arnaucube.com/blog/kzg-commitments.html" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://arnaucube.com/blog/" />
<meta name="twitter:title" content=" Notes on KZG polynomial commitments - arnaucube">
<meta name="twitter:title" content=" Notes on KZG polynomial commitments - arnaucube - blog">
<meta name="twitter:description" content="In the following notes I've tried to summarize the KZG Commitment scheme with the concepts that helped me to follow the reasoning.">
<meta name="twitter:image" content="https://arnaucube.com/blog/">
<meta name="twitter:card" content="summary_large_image">
@ -40,7 +40,14 @@
style="height:50px;font-size:130%;">
<div class="container">
<a href="/blog" style="color:#000;">Blog index</a>
<a href="/" style="color:#000;float:right;">arnaucube.com</a>
<div style="float:right;">
<a href="/" style="color:#000;display:inline-block;">arnaucube.com</a>
<div class="onoffswitch" style="margin:10px;display:inline-block;" title="change theme">
<input onclick="switchTheme()" type="checkbox" name="onoffswitch" class="onoffswitch-checkbox"
id="themeSwitcher">
<label class="onoffswitch-label" for="themeSwitcher"></label>
</div>
</div>
</div>
<img style="height:5px; width:100%; margin-top:8px;" src="img/gradient-line.jpg" />
</nav>
@ -136,7 +143,7 @@ $$

<h3>Conclusions</h3>
<p>The content covered in this notes is just a quick overview, but allows us to see the potential of the scheme. One next iteration from what we&rsquo;ve seen is the approach to do batch proofs, which allows us to evaluate at multiple points with a single evaluation proof. This scheme can be used as a <em>vector commitment</em>, using a polynomial where the $p(i) = x_i$ for all values of $x_i$ of the vector, which can be obtained from the $x_i$ values and computing the <a href="https://en.wikipedia.org/wiki/Lagrange_polynomial">Lagrange interpolation</a>. This is quite useful combined with the mentioned batch proofs.</p>
<p>The content covered in this notes is just a quick overview, but allows us to see the potential of the scheme. One next iteration from what we&rsquo;ve seen is the approach to do batch proofs, which allows us to evaluate at multiple points with a single evaluation proof. This scheme can be used as a <em>vector commitment</em>, using a polynomial where the $p(i) = x_i$ for all values of $x_i$ of the vector, which can be obtained from the $x_i$ values and computing the <a href="https://en.wikipedia.org/wiki/Lagrange_polynomial">Lagrange interpolation</a>. This is quite useful combined with the mentioned batch proofs. The <em>batch proofs</em> logic can be found at the <a href="https://arnaucube.com/blog/kzg-batch-proof.html">blog/kzg-batch-proof</a> notes (kind of the continuation of the current notes).</p>
<p>As a final note, in order to try to digest the notes, I&rsquo;ve did a <em>toy implementation</em> of this scheme at <a href="https://github.com/arnaucube/kzg-commitments-study">https://github.com/arnaucube/kzg-commitments-study</a>. It&rsquo;s quite simple, but contains the logic overviewed in this notes.</p>
@ -183,6 +190,33 @@ $$

throwOnError : true
});
});
///
let theme = localStorage.getItem("theme");
if ((theme === "light-theme")||(theme==null)) {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
} else if (theme === "dark-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
function switchTheme() {
theme = localStorage.getItem("theme");
if (theme === "light-theme") {
theme = "dark-theme";
document.getElementById("themeSwitcher").checked = true;
} else {
theme = "light-theme";
document.getElementById("themeSwitcher").checked = false;
}
document.body.className = theme;
localStorage.setItem("theme", theme);
console.log(theme);
}
</script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

Loading…
Cancel
Save