mirror of
https://github.com/zserge/awfice.git
synced 2024-07-14 15:20:29 +03:00
new page: add calculator page 🧮 (#35)
* new page: add calculator page 🧮
* remove whitespaces
Co-authored-by: zhouLion <zhouquan147369@gamil.com>
This commit is contained in:
parent
4794cb95d1
commit
8120d641ed
14
README.md
14
README.md
@ -76,11 +76,23 @@ A simple code editor. You can type in HTML, CSS & Javascript.
|
||||
Copy and add to bookmarks or open in the URL bar:
|
||||
|
||||
```html
|
||||
data:text/html,<body oninput="i.srcdoc=h.value+'<style>'+c.value+'</style><script>'+j.value+'</script>'"><style>textarea,iframe{width:100%;height:50%;}body{margin:0;}textarea{width: 33.33%;font-size:18px;padding:0.5em}</style><textarea placeholder="HTML" id="h"></textarea><textarea placeholder="CSS" id="c"></textarea><textarea placeholder="JS" id="j"></textarea><iframe id="i"></iframe><script>document.querySelectorAll("textarea").forEach((t)=>t.addEventListener("keydown",function(t){var e,s;"Tab"==t.key&&(t.preventDefault(),e=this.selectionStart,s=this.selectionEnd,this.value=this.value.substring(0,e)+" "+this.value.substring(s),this.selectionStart=this.selectionEnd=e+1)}))</script></body>
|
||||
data:text/html,<body oninput="i.srcdoc=h.value+'<style>'+c.value+'</style><script>'+j.value+'</script>'"><style>textarea,iframe{width:100%;height:50%;}body{margin:0;}textarea{width: 33.33%;font-size:18px;padding:0.5em}</style><textarea placeholder="HTML" id="h"></textarea><textarea placeholder="CSS" id="c"></textarea><textarea placeholder="JS" id="j"></textarea><iframe id="i"></iframe><script>document.querySelectorAll("textarea").forEach((t)=>t.addEventListener("keydown",function(t){var e,s;"Tab"==t.key&&(t.preventDefault(),e=this.selectionStart,s=this.selectionEnd,this.value=this.value.substring(0,e)+" "+this.value.substring(s),this.selectionStart=this.selectionEnd=e+1)}))</script></body>
|
||||
```
|
||||
|
||||
[Try it!](https://htmlpreview.github.io/?https://github.com/zserge/awfice/blob/main/code.html)
|
||||
|
||||
## Calculator - 657 bytes!
|
||||
|
||||
A simple calculator which supports the basic operational symbol to calculate.
|
||||
|
||||
Copy and add to bookmarks or open in the URL bar:
|
||||
|
||||
```html
|
||||
data:text/html,<table style="text-align: center;width:80vw;margin: 0 auto;"><tbody><tr><td colspan="4"><textarea></textarea></td></tr></tbody><script>let d=document;let tbl=d.querySelector('tbody');let z=d.querySelector('textarea');let oc=(x)=>z.value+=x;let cl=()=>z.value='';let re=()=>{try{z.value=eval(z.value);}catch(error){cl();}};[[1,2,3,'+'],[4,5,6,'-'],[7,8,9,'*'],['C',0,'=','/']].forEach((a)=>{let r=d.createElement('tr');r.style.lineHeight='64px';tbl.appendChild(r);a.forEach((b)=>{let tb=d.createElement('tb');tb.innerText=b;tb.style.padding='16px';tb.style.border='1px solid';r.appendChild(tb);tb.onclick=b==='='?re:b==='C'?cl:()=>oc(b);})})</script></table>
|
||||
```
|
||||
|
||||
[Try it!](https://htmlpreview.github.io/?https://github.com/zserge/awfice/blob/main/calculator.html)
|
||||
|
||||
## Contributions
|
||||
|
||||
The code is distributed under MIT license. PRs are always welcome, especially if they fix something or make the code smaller, or add features that are valuable, but do not require a lot of code.
|
||||
|
12
README.sh
12
README.sh
@ -83,6 +83,18 @@ data:text/html,$(cat code.html)
|
||||
|
||||
[Try it!](https://htmlpreview.github.io/?https://github.com/zserge/awfice/blob/main/code.html)
|
||||
|
||||
## Calculator - $(wc -c < calculator.html) bytes!
|
||||
|
||||
A simple calculator which supports the basic operational symbol to calculate.
|
||||
|
||||
Copy and add to bookmarks or open in the URL bar:
|
||||
|
||||
\`\`\`html
|
||||
data:text/html,$(cat calculator.html)
|
||||
\`\`\`
|
||||
|
||||
[Try it!](https://htmlpreview.github.io/?https://github.com/zserge/awfice/blob/main/calculator.html)
|
||||
|
||||
## Contributions
|
||||
|
||||
The code is distributed under MIT license. PRs are always welcome, especially if they fix something or make the code smaller, or add features that are valuable, but do not require a lot of code.
|
||||
|
1
calculator.html
Normal file
1
calculator.html
Normal file
@ -0,0 +1 @@
|
||||
<table style="text-align: center;width:80vw;margin: 0 auto;"><tbody><tr><td colspan="4"><textarea></textarea></td></tr></tbody><script>let d=document;let tbl=d.querySelector('tbody');let z=d.querySelector('textarea');let oc=(x)=>z.value+=x;let cl=()=>z.value='';let re=()=>{try{z.value=eval(z.value);}catch(error){cl();}};[[1,2,3,'+'],[4,5,6,'-'],[7,8,9,'*'],['C',0,'=','/']].forEach((a)=>{let r=d.createElement('tr');r.style.lineHeight='64px';tbl.appendChild(r);a.forEach((b)=>{let tb=d.createElement('tb');tb.innerText=b;tb.style.padding='16px';tb.style.border='1px solid';r.appendChild(tb);tb.onclick=b==='='?re:b==='C'?cl:()=>oc(b);})})</script></table>
|
Loading…
Reference in New Issue
Block a user