begin implementing paste function
This commit is contained in:
parent
916502b56c
commit
4238027024
|
@ -1 +1,2 @@
|
||||||
|
import "babel-polyfill"
|
||||||
import "./src/web/index"
|
import "./src/web/index"
|
|
@ -1409,6 +1409,35 @@
|
||||||
"object.assign": "^4.1.0"
|
"object.assign": "^4.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"babel-polyfill": {
|
||||||
|
"version": "6.26.0",
|
||||||
|
"resolved": "https://registry.npm.taobao.org/babel-polyfill/download/babel-polyfill-6.26.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbabel-polyfill%2Fdownload%2Fbabel-polyfill-6.26.0.tgz",
|
||||||
|
"integrity": "sha1-N5k3q8Z9eJWXCtxiHyhM2WbPIVM=",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"babel-runtime": "^6.26.0",
|
||||||
|
"core-js": "^2.5.0",
|
||||||
|
"regenerator-runtime": "^0.10.5"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"babel-runtime": {
|
||||||
|
"version": "6.26.0",
|
||||||
|
"resolved": "https://registry.npm.taobao.org/babel-runtime/download/babel-runtime-6.26.0.tgz",
|
||||||
|
"integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"core-js": "^2.4.0",
|
||||||
|
"regenerator-runtime": "^0.11.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"regenerator-runtime": {
|
||||||
|
"version": "0.11.1",
|
||||||
|
"resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.11.1.tgz",
|
||||||
|
"integrity": "sha1-vgWtf5v30i4Fb5cmzuUBf78Z4uk=",
|
||||||
|
"dev": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"balanced-match": {
|
"balanced-match": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
|
||||||
|
@ -2060,6 +2089,12 @@
|
||||||
"integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
|
"integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"core-js": {
|
||||||
|
"version": "2.6.11",
|
||||||
|
"resolved": "https://registry.npm.taobao.org/core-js/download/core-js-2.6.11.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcore-js%2Fdownload%2Fcore-js-2.6.11.tgz",
|
||||||
|
"integrity": "sha1-OIMUafmSK97Y7iHJ3EaYXgOZMIw=",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"core-js-compat": {
|
"core-js-compat": {
|
||||||
"version": "3.6.4",
|
"version": "3.6.4",
|
||||||
"resolved": "https://registry.npm.taobao.org/core-js-compat/download/core-js-compat-3.6.4.tgz",
|
"resolved": "https://registry.npm.taobao.org/core-js-compat/download/core-js-compat-3.6.4.tgz",
|
||||||
|
@ -5717,6 +5752,12 @@
|
||||||
"regenerate": "^1.4.0"
|
"regenerate": "^1.4.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"regenerator-runtime": {
|
||||||
|
"version": "0.10.5",
|
||||||
|
"resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.10.5.tgz",
|
||||||
|
"integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg=",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"regenerator-transform": {
|
"regenerator-transform": {
|
||||||
"version": "0.14.1",
|
"version": "0.14.1",
|
||||||
"resolved": "https://registry.npm.taobao.org/regenerator-transform/download/regenerator-transform-0.14.1.tgz",
|
"resolved": "https://registry.npm.taobao.org/regenerator-transform/download/regenerator-transform-0.14.1.tgz",
|
||||||
|
|
|
@ -18,6 +18,7 @@
|
||||||
"@babel/preset-env": "^7.8.4",
|
"@babel/preset-env": "^7.8.4",
|
||||||
"@babel/preset-react": "^7.8.3",
|
"@babel/preset-react": "^7.8.3",
|
||||||
"babel-loader": "^8.0.6",
|
"babel-loader": "^8.0.6",
|
||||||
|
"babel-polyfill": "^6.26.0",
|
||||||
"coffee-loader": "^0.9.0",
|
"coffee-loader": "^0.9.0",
|
||||||
"coffeescript": "^2.5.1",
|
"coffeescript": "^2.5.1",
|
||||||
"css-loader": "^3.4.2",
|
"css-loader": "^3.4.2",
|
||||||
|
|
|
@ -6,12 +6,37 @@ class Pastebin extends React.Component
|
||||||
super props
|
super props
|
||||||
@state =
|
@state =
|
||||||
text: ""
|
text: ""
|
||||||
|
pasting: false
|
||||||
|
|
||||||
onEditTextUpdate: (ev) =>
|
onEditTextUpdate: (ev) =>
|
||||||
console.log ev.target.value
|
console.log ev.target.value
|
||||||
@setState
|
@setState
|
||||||
text: ev.target.value
|
text: ev.target.value
|
||||||
|
|
||||||
|
paste: =>
|
||||||
|
return if @state.text.trim() == ""
|
||||||
|
# Set the state first to disable the button
|
||||||
|
@setState
|
||||||
|
pasting: true
|
||||||
|
# For things pasted through the web interface,
|
||||||
|
# we always assume the name is `web_paste.txt`,
|
||||||
|
# and the content type is always `text/plain`.
|
||||||
|
resp = await fetch "/paste/web_paste.txt",
|
||||||
|
method: 'PUT'
|
||||||
|
headers:
|
||||||
|
'content-type': 'text/plain'
|
||||||
|
body: @state.text
|
||||||
|
console.log resp
|
||||||
|
# Ok reponse
|
||||||
|
if resp.ok
|
||||||
|
# Body is the paste url
|
||||||
|
url = await resp.text()
|
||||||
|
console.log url
|
||||||
|
# TODO: show a dialog or something
|
||||||
|
# Reset the button
|
||||||
|
@setState
|
||||||
|
pasting: false
|
||||||
|
|
||||||
render: ->
|
render: ->
|
||||||
<div className="content-pastebin">
|
<div className="content-pastebin">
|
||||||
<ContentEditable
|
<ContentEditable
|
||||||
|
@ -20,6 +45,14 @@ class Pastebin extends React.Component
|
||||||
value={@state.text}
|
value={@state.text}
|
||||||
highlightCode
|
highlightCode
|
||||||
plainText/>
|
plainText/>
|
||||||
|
<div className="content-buttons">
|
||||||
|
<button
|
||||||
|
className="button-blue"
|
||||||
|
disabled={@state.pasting}
|
||||||
|
onClick={@paste}>
|
||||||
|
Paste
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
export default Pastebin
|
export default Pastebin
|
|
@ -4,6 +4,7 @@
|
||||||
@import './contentEditable.scss';
|
@import './contentEditable.scss';
|
||||||
@import './home.scss';
|
@import './home.scss';
|
||||||
@import './pastebin.scss';
|
@import './pastebin.scss';
|
||||||
|
@import './buttons.scss';
|
||||||
|
|
||||||
body, html {
|
body, html {
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
|
|
|
@ -1,13 +1,15 @@
|
||||||
.content-pastebin {
|
.content-pastebin {
|
||||||
display: block;
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content-pastebin-edit {
|
.content-pastebin-edit {
|
||||||
display: block;
|
//display: block;
|
||||||
height: 100%;
|
flex: 1;
|
||||||
width: 100%;
|
//height: 100%;
|
||||||
|
//width: 100%;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
@ -2,6 +2,8 @@
|
||||||
$editable-color: rgba(0, 0, 0, 0.1);
|
$editable-color: rgba(0, 0, 0, 0.1);
|
||||||
$editable-color-active: rgba(0, 0, 0, 0.2);
|
$editable-color-active: rgba(0, 0, 0, 0.2);
|
||||||
$editable-radius: 5px;
|
$editable-radius: 5px;
|
||||||
|
// Button dimensions
|
||||||
|
$button-radius: 5px;
|
||||||
// Dimensions of main content card
|
// Dimensions of main content card
|
||||||
$content-padding: 100px;
|
$content-padding: 100px;
|
||||||
$content-width: 1000px;
|
$content-width: 1000px;
|
||||||
|
|
Loading…
Reference in New Issue