From a82e951bcb75048c7e1075796266b96e8a217e02 Mon Sep 17 00:00:00 2001 From: Jotron Date: Sat, 24 Feb 2018 20:31:49 +0100 Subject: [PATCH] Refresh + Reload --- package.json | 1 + src/components/home/index.js | 2 +- src/components/home/logic.js | 65 ++++++++++++++++++++-------- src/components/oneset/index.js | 73 ++++++++++++++++++++++++-------- src/components/oneset/oneset.css | 13 +++++- src/pouch.js | 9 ++-- yarn.lock | 12 ++++++ 7 files changed, 131 insertions(+), 44 deletions(-) diff --git a/package.json b/package.json index c42fb0d..17c9f26 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "dependencies": { "electron-compile": "^6.4.2", "electron-squirrel-startup": "^1.0.0", + "immutability-helper": "^2.6.5", "markdown-it": "^8.4.0", "markdown-it-katex": "^2.0.3", "mousetrap": "^1.6.1", diff --git a/src/components/home/index.js b/src/components/home/index.js index cbf25ef..0381f03 100644 --- a/src/components/home/index.js +++ b/src/components/home/index.js @@ -61,7 +61,7 @@ class Addset extends Component { } submit() { if (this.state.clickable !== "") { - logic.process(this.state.setpath, this.state.setname, this.state.selected, this.props.actualize); + logic.make_new(this.state.setpath, this.state.setname, this.state.selected, this.props.actualize); //console.log(this.state.setpath, this.state.setname, this.state.selected, this.props.actualize); this.closeModal(); } diff --git a/src/components/home/logic.js b/src/components/home/logic.js index 34d6448..de7df0b 100644 --- a/src/components/home/logic.js +++ b/src/components/home/logic.js @@ -12,24 +12,59 @@ var md = require('markdown-it')({ typographer: true, }).use(require('markdown-it-katex')); +/*Function to actualize document*/ +export function refresh(doc_id, actualize) { + mypouch.getset(doc_id).then( doc => { + console.log(doc); + fs.readFile(doc.setpath, 'utf-8', (err, new_data) => { + if(err){ + alert("An error ocurred reading the file :" + err.message); + return; + } + var new_cards = parseMD(new_data, doc.setlevel); + doc.cards = new_cards; + mypouch.updateset(doc).then( result => { + actualize(); + }).catch(function (err) { + console.log(err); + }); + }); + }).catch(function(err) { + console.log(err); + }); + return; +} + +/* Function to create new document*/ export function get() { //getfile return remote_dialog.showOpenDialog({ filters: [ { name: 'markdown', extensions: ['md', 'txt'] } ]}); } - -export function process(filepath, setname, headerlevel, actualize) { +export function make_new(filepath, setname, headerlevel, actualize) { fs.readFile(filepath, 'utf-8', (err, data) => { if(err){ alert("An error ocurred reading the file :" + err.message); return; } - parseMD(data, setname, headerlevel, actualize); + // create + var new_doc = { + title: setname, + setpath: filepath, + setlevel: headerlevel, + cards: parseMD(data, headerlevel) + }; + mypouch.addset(new_doc).then( result => { + actualize(); + }).catch(function (err) { + console.log(err); + }); }); } -function parseMD(data, setname, headerlevel, actualize) { +/* Function to do all the work*/ +function parseMD(data, headerlevel) { //to HTML var parsed = md.render(data); @@ -37,13 +72,11 @@ function parseMD(data, setname, headerlevel, actualize) { var div = document.createElement("div"), nodes; div.innerHTML = parsed; nodes = [].slice.call(div.children); // slice in array of all childnodes(childNodes) - console.log(nodes); + //console.log(nodes); //cards format: {"f" : "frontside1", "b" : "backside1"} - var set = { - title: setname, - cards: [] - }; + var cards = []; + var active = false; var length = nodes.length; var regex1 = new RegExp('^h[1-' + headerlevel.toString() + ']$', 'i'), @@ -54,24 +87,20 @@ function parseMD(data, setname, headerlevel, actualize) { active = false; } else { - set.cards[set.cards.length-1].b += node.outerHTML; + cards[cards.length-1].b += node.outerHTML; } } if (regex2.test(node.nodeName)) { active = true; - set.cards.push({"f" : node.innerHTML, "b" : ""}); + cards.push({"f" : node.innerHTML, "b" : ""}); } }); - console.log(set); + console.log(cards); //add set to database - if (set.cards.length === 0) { + if (cards.length === 0) { console.log("no cards"); return; } - mypouch.addset(set).then( result => { - actualize(); - }).catch(function (err) { - console.log(err); - }); + return cards; }; diff --git a/src/components/oneset/index.js b/src/components/oneset/index.js index 7f717a5..375e442 100644 --- a/src/components/oneset/index.js +++ b/src/components/oneset/index.js @@ -1,14 +1,17 @@ import React, { Component } from 'react'; +import update from 'immutability-helper'; import * as Mousetrap from 'mousetrap' import './oneset.css'; import './markdown.css'; import { Link, Redirect } from 'react-router-dom' import * as mypouch from '../../pouch.js'; +import * as logic from '../home/logic.js'; class Card extends Component { constructor(props) { super(props); this.state = { + cards: this.props.cards, index: 0, hidden: true }; @@ -18,6 +21,12 @@ class Card extends Component { this.forward = this.forward.bind(this); this.backward = this.backward.bind(this); } + componentWillReceiveProps(nextProps){ + if (nextProps.cards !== this.props.cards) { + this.setState({ cards: nextProps.cards }) + } + } + componentDidMount() { Mousetrap.bind('space', this.hide); Mousetrap.bind('left', this.backward); @@ -50,26 +59,29 @@ class Card extends Component { }); } render() { + //console.log("State ", this.state.cards); + //console.log("Props ", this.props.cards); + console.log("render: ", this.state.cards) return (
this.hide()}> -

+

{ (!this.state.hidden)? (
-
+
) : (null) } @@ -83,23 +95,18 @@ class Oneset extends Component { super(props); this.state = { loaded: false, + doc: {}, redirect: false }; - mypouch.getset(props.match.params.path_id).then( data => { - console.log("Successfully got doc!"); - this.doc = data; - this.setState({ - loaded: true - }); - this.render(); - }).catch(function(err) { - console.log(err); - }); this.render = this.render.bind(this); this.componentDidMount = this.componentDidMount.bind(this); this.componentWillUnmount = this.componentWillUnmount.bind(this); this.setRedirect = this.setRedirect.bind(this); this.renderRedirect = this.renderRedirect.bind(this); + this.getdoc = this.getdoc.bind(this); + this.refresh = this.refresh.bind(this); + + this.getdoc() } componentDidMount() { Mousetrap.bind('esc', this.setRedirect); @@ -117,21 +124,51 @@ class Oneset extends Component { return ; } } + randomize() { + this.setState(update(this.state, { + doc: { + cards: {$set: this.state.doc.cards.sort(function(a, b){ + return 0.5 - Math.random(); + })} + } + })); + } + getdoc() { + console.log("getdoc"); + mypouch.getset(this.props.match.params.path_id).then( data => { + console.log("Successfully got doc!"); + this.setState({ + loaded: true, + doc: data + }); + this.render(); + }).catch(function(err) { + console.log(err); + }); + } + refresh() { + logic.refresh(this.props.match.params.path_id, this.getdoc); + } render() { if (this.state.loaded) { return (
- - {this.renderRedirect()}
- +
); diff --git a/src/components/oneset/oneset.css b/src/components/oneset/oneset.css index afe49b6..4994d41 100644 --- a/src/components/oneset/oneset.css +++ b/src/components/oneset/oneset.css @@ -1,15 +1,26 @@ /* Application */ -.arrows { +.click { cursor: pointer; + user-select: none; } #arrow-container { text-align: center; + user-select: none; } #back { position: fixed; top: 30px; left: 30px; text-decoration:none; + user-select: none; +} +#actions { + position: fixed; + top: 30px; + right: 30px; + text-decoration:none; + user-select: none; + cursor: default; } /* Cards*/ .cardside { diff --git a/src/pouch.js b/src/pouch.js index 9425c8e..7294920 100644 --- a/src/pouch.js +++ b/src/pouch.js @@ -4,6 +4,9 @@ var db = new PouchDB('./pouch'); export async function addset(set) { return await db.post(set); } +export async function updateset(doc) { + return await db.put(doc); +} export async function showsets() { try { @@ -24,12 +27,6 @@ export async function showsets() { } export async function deleteid(id) { - /*console.log(set); - db.remove(set.doc).then( result => { - console.log(result); - }).catch(function (err) { - console.log(err); - });*/ return await db.get(id).then(function(doc) { return db.remove(doc); }); diff --git a/yarn.lock b/yarn.lock index dc04943..d87d880 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3886,6 +3886,12 @@ immediate@3.0.6, immediate@~3.0.5: version "3.0.6" resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b" +immutability-helper@^2.6.5: + version "2.6.5" + resolved "https://registry.yarnpkg.com/immutability-helper/-/immutability-helper-2.6.5.tgz#94a10f18f1196244b2dea92d46522d2b4dce7b73" + dependencies: + invariant "^2.2.0" + import-lazy@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/import-lazy/-/import-lazy-2.1.0.tgz#05698e3d45c88e8d7e9d92cb0584e77f096f3e43" @@ -3967,6 +3973,12 @@ interpret@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614" +invariant@^2.2.0: + version "2.2.3" + resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.3.tgz#1a827dfde7dcbd7c323f0ca826be8fa7c5e9d688" + dependencies: + loose-envify "^1.0.0" + invariant@^2.2.1, invariant@^2.2.2: version "2.2.2" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.2.tgz#9e1f56ac0acdb6bf303306f338be3b204ae60360"