1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00

Started note list

This commit is contained in:
Laurent Cozic 2017-11-04 16:40:34 +00:00
parent 243d6e9845
commit 18bb02244f
9 changed files with 90 additions and 37 deletions

View File

@ -67,13 +67,11 @@ class Application extends BaseApplication {
let application_ = null;
function app() {
console.info('AAAAAAAAA');
if (!application_) throw new Error('Application has not been initialized');
return application_;
}
function initApp(electronApp) {
console.info('INIT');
if (application_) throw new Error('Application has already been initialized');
application_ = new Application(electronApp);
return application_;

View File

@ -0,0 +1,20 @@
class ItemList extends React.Component {
render() {
const items = this.props.items;
let itemComps = [];
for (let i = 0; i < items.length; i++) {
const itemComp = this.props.itemRenderer(i, items[i]);
itemComps.push(itemComp);
}
return (
<div>
{ itemComps }
</div>
);
}
}
module.exports = { ItemList };

View File

@ -0,0 +1,33 @@
const { ItemList } = require('./ItemList.min.js');
class NoteListComponent extends React.Component {
itemRenderer(index, item) {
let classes = ['item'];
classes.push(index % 2 === 0 ? 'even' : 'odd');
return <div onClick={() => {console.info(item)}} className={classes.join(' ')} key={index}>{item.title}</div>
}
render() {
return (
<div className={"note-list"}>
<h1>Notes</h1>
<ItemList
items={this.props.notes}
itemRenderer={ (index, item) => { return this.itemRenderer(index, item) } }
/>
</div>
);
}
}
const mapStateToProps = (state) => {
return {
notes: state.notes,
};
};
const NoteList = connect(mapStateToProps)(NoteListComponent);
module.exports = { NoteList };

View File

@ -1,22 +1,30 @@
const React = require('react');
const { render } = require('react-dom');
const { createStore } = require('redux');
const { Provider } = require('react-redux');
const { connect, Provider } = require('react-redux');
const { NoteList } = require('./gui/NoteList.min.js');
const { app } = require('electron').remote.require('./app');
class ReactRoot extends React.Component {
class ReactRootComponent extends React.Component {
render() {
return (
<div>
Aaaa
<div style={{height: "1000px"}}>
<NoteList></NoteList>
</div>
)
}
}
const mapStateToProps = (state) => {
return {};
};
const ReactRoot = connect(mapStateToProps)(ReactRootComponent);
const store = app().store();
render(

View File

@ -3,13 +3,10 @@
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Hello World!</h1>
We are using node <script>document.write(process.versions.node)</script>,
Chrome <script>document.write(process.versions.chrome)</script>,
and Electron <script>document.write(process.versions.electron)</script>.
<div id="react-root"></div>
<script src="ReactRoot.min.js"></script>
<div style="height: '1000px';" id="react-root"></div>
<script src="gui/Root.min.js"></script>
</body>
</html>

View File

@ -0,0 +1,9 @@
.note-list .item {
height: 40px;
vertical-align: middle;
cursor: pointer;
}
.note-list .item.odd {
background-color: lightgray;
}

View File

@ -5,9 +5,12 @@ BUILD_DIR="$ROOT_DIR/app"
rsync -a "$ROOT_DIR/../ReactNativeClient/lib/" "$BUILD_DIR/lib/"
for JSX_FILE in "$BUILD_DIR"/*.jsx; do
JS_FILE="${JSX_FILE::-4}.min.js"
"$ROOT_DIR/app/node_modules/.bin/babel" --presets react "$JSX_FILE" > "$JS_FILE"
for JSX_FILE in "$BUILD_DIR"/gui/*.jsx; do
JS_FILE="${JSX_FILE::-4}.min.js"
"$ROOT_DIR/app/node_modules/.bin/babel" --presets react "$JSX_FILE" > "$JS_FILE"
if [[ $? != 0 ]]; then
exit 1
fi
done
TRANSLATION_BUILD_SCRIPT="$ROOT_DIR/../CliClient/build/build-translation.js"
@ -16,19 +19,4 @@ if [[ ! -f $TRANSLATION_BUILD_SCRIPT ]]; then
exit 1
fi
node "$TRANSLATION_BUILD_SCRIPT" --silent
# ROOT_DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
# BUILD_DIR="$ROOT_DIR/build"
# rsync -a app/ $BUILD_DIR/
# rsync -a "$ROOT_DIR/../ReactNativeClient/lib/" "$BUILD_DIR/lib/"
# TRANSLATION_BUILD_SCRIPT="$ROOT_DIR/../CliClient/build/build-translation.js"
# if [[ ! -f $TRANSLATION_BUILD_SCRIPT ]]; then
# echo "Build the CLI app first ($TRANSLATION_BUILD_SCRIPT missing)"
# exit 1
# fi
# node "$TRANSLATION_BUILD_SCRIPT" --silent
node "$TRANSLATION_BUILD_SCRIPT" --silent

View File

@ -1,6 +1,6 @@
#!/bin/bash
ROOT_DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
cd "$ROOT_DIR"
./build.sh
./build.sh || exit 1
cd "$ROOT_DIR/app"
node_modules/.bin/electron . --env dev --log-level debug "$@"

View File

@ -278,11 +278,11 @@ class AppComponent extends React.Component {
const mapStateToProps = (state) => {
return {
historyCanGoBack: state.historyCanGoBack,
showSideMenu: state.showSideMenu,
syncStarted: state.syncStarted,
appState: state.appState,
};
historyCanGoBack: state.historyCanGoBack,
showSideMenu: state.showSideMenu,
syncStarted: state.syncStarted,
appState: state.appState,
};
};
const App = connect(mapStateToProps)(AppComponent);