import { StrivenEditor } from 'striven-editor';

const editor = new StrivenEditor(editorEl);

import StrivenEditor from 'striven-editor';

const editor = new StrivenEditor(editorEl, { toolbarHide: true, toolbarBottom: true });

const got = require('got');
const app = require('express')();
const bodyParser = require('body-parser');
const metascraper = require('metascraper')([
    require('metascraper-description')(),
    require('metascraper-image')(),
    require('metascraper-title')(),
    require('metascraper-url')()
]);

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/meta', (req, res) => {
    const targetUrl = req.body.targetUrl;
    if(targetUrl) {
        (async () => {
            const { body: html, url } = await got(targetUrl);
            const metadata = await metascraper({ html, url });
            res.send(metadata);
        })()
    } else {
        res.sendStatus(400);
    }
})

app.listen(8080, () => console.log('Server is on.'));

const editor = new StrivenEditor(editorEl, { metaUrl: 'http://localhost:8080/meta' });

fetch(this.options.metaUrl, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ targetUrl: url })
}).then((res) => res.json())

const express = require('express');
const app = express();
const PORT = 4200;
const path = require('path');
const bodyParser = require('body-parser');
const cors = require('cors');
const fs = require('fs');
const shortid = require('shortid');

app.use(bodyParser.json());
app.use(cors());

app.get('/images/:name', (req, res) => {
    res.sendFile(path.join(__dirname, 'images', req.params.name));
})

app.post('/image', (req, res) => {
    const imageEncoding = req.body.imageEncoding;
    try {
        const base64Image = imageEncoding.split(';base64,').pop();
        const imageId = shortid.generate();

        fs.writeFile(path.join(__dirname, 'images', `${imageId}.png`), base64Image, {encoding: 'base64'}, function(err) {
            console.log('File created');
            res.send({ imageRef: `http://localhost:${PORT}/images/${imageId}.png` });
            err && console.log(err);
        });
    } 
    catch (e) {
        res.sendStatus(400);
    }
})

app.listen(PORT, () => console.log(`Image server open on port: ${PORT}`))

fetch(this.options.imageUrl, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ imageEncoding })
}).then((res) => res.json())

const editor = new StrivenEditor(editorEl, { toolbarOptions: ["bold", "italic", "underline"] })

const customToolbarOption = { 
    icon: { 
        viewBox: "0 0 1792 1792", 
        d: "M1600 736v192q0 40-28 68t-68 28h-416v416q0 40-28 68t-68 28h-192q-40 0-68-28t-28-68v-416h-416q-40 0-68-28t-28-68v-192q0-40 28-68t68-28h416v-416q0-40 28-68t68-28h192q40 0 68 28t28 68v416h416q40 0 68 28t28 68z"
    },
    handler: () => this.editor.getRange().insertNode(document.createTextNode("hello world"))
};

const editor = new StrivenEditor(editorEl, { toolbarOptions: ["bold", "italic", "underline", customToolbarOption] });