begin implementing paste function

index-web.js

@@ -1 +1,2 @@
+import "babel-polyfill"
 import "./src/web/index"

package-lock.json

@@ -1409,6 +1409,35 @@
         "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": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
@@ -2060,6 +2089,12 @@
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
       "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": {
       "version": "3.6.4",
       "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"
       }
     },
+    "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": {
       "version": "0.14.1",
       "resolved": "https://registry.npm.taobao.org/regenerator-transform/download/regenerator-transform-0.14.1.tgz",

package.json

@@ -18,6 +18,7 @@
     "@babel/preset-env": "^7.8.4",
     "@babel/preset-react": "^7.8.3",
     "babel-loader": "^8.0.6",
+    "babel-polyfill": "^6.26.0",
     "coffee-loader": "^0.9.0",
     "coffeescript": "^2.5.1",
     "css-loader": "^3.4.2",

src/web/pastebin.coffee

@@ -6,12 +6,37 @@ class Pastebin extends React.Component
     super props
     @state =
       text: ""
+      pasting: false
 
   onEditTextUpdate: (ev) =>
     console.log ev.target.value
     @setState
       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: ->
     <div className="content-pastebin">
       <ContentEditable
@@ -20,6 +45,14 @@ class Pastebin extends React.Component
         value={@state.text}
         highlightCode
         plainText/>
+      <div className="content-buttons">
+        <button
+          className="button-blue"
+          disabled={@state.pasting}
+          onClick={@paste}>
+          Paste
+        </button>
+      </div>
     </div>
 
 export default Pastebin

src/web/styles/index.scss

@@ -4,6 +4,7 @@
 @import './contentEditable.scss';
 @import './home.scss';
 @import './pastebin.scss';
+@import './buttons.scss';
 
 body, html {
     margin: 0px;

src/web/styles/pastebin.scss

@@ -1,13 +1,15 @@
 .content-pastebin {
-    display: block;
+    display: flex;
+    flex-flow: column;
     height: 100%;
     width: 100%;
 }
 
 .content-pastebin-edit {
-    display: block;
-    height: 100%;
-    width: 100%;
+    //display: block;
+    flex: 1;
+    //height: 100%;
+    //width: 100%;
     overflow-y: auto;
     text-align: left;
     box-sizing: border-box;

src/web/styles/vars.scss

@@ -2,6 +2,8 @@
 $editable-color: rgba(0, 0, 0, 0.1);
 $editable-color-active: rgba(0, 0, 0, 0.2);
 $editable-radius: 5px;
+// Button dimensions
+$button-radius: 5px;
 // Dimensions of main content card
 $content-padding: 100px;
 $content-width: 1000px;