Ark/leporello-js
1
0
Fork 0
mirror of https://github.com/leporello-js/leporello-js synced 2026-01-13 13:04:30 -08:00
Code Issues Packages Projects Releases Wiki Activity

finish redux example

Browse Source
This commit is contained in:
Dmitry Vasilev
2023-06-16 00:22:31 +03:00
parent 42b3c9a292
commit af2ea7ea57
6 changed files with 50 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docs/examples/todos/public/index.html
View File

@@ -10,7 +10,11 @@
<script src='https://unpkg.com/redux'></script>
<script src='https://unpkg.com/react-redux'></script>
<script type='module' src='../src/index.js'></script>
<script type='module'>
if(new URLSearchParams(window.location.search).get('leporello') == null) {
await import('../src/index.js');
}
</script>
</head>
<body>
<div id="root"></div>

10
docs/examples/todos/src/actions/index.js
View File

@@ -1,7 +1,13 @@
let nextTodoId = 0
const nextTodoId = new Function(`
let nextId = 0
return function() {
return nextId++
}
`)()
export const addTodo = text => ({
type: 'ADD_TODO',
id: nextTodoId++,
id: nextTodoId(),
text
})

14
docs/examples/todos/src/containers/AddTodo.js
View File

@@ -3,20 +3,20 @@ import { addTodo } from '../actions/index.js'
const h = React.createElement
const AddTodo = ({ dispatch }) => {
let input
const inputref = {}
return (
h('div', null,
h('form', { onSubmit: e => {
h('form', {
onSubmit: e => {
e.preventDefault()
if (!input.value.trim()) {
return
if (inputref.input.value.trim()) {
dispatch(addTodo(inputref.input.value))
Object.assign(inputref.input, {value: ''})
}
dispatch(addTodo(input.value))
input.value = ''
}
},
h('input', {ref: node => {input = node}}),
h('input', {ref: input => Object.assign(inputref, {input})}),
h('button', {type: 'submit'}, 'Add Todo')
)
)

14
docs/examples/todos/src/containers/VisibleTodoList.js
View File

@@ -3,11 +3,15 @@ import TodoList from '../components/TodoList.js'
import { VisibilityFilters } from '../actions/index.js'
const getVisibleTodos = (todos, filter) => {
return {
[VisibilityFilters.SHOW_ALL]: todos,
[VisibilityFilters.SHOW_COMPLETED]: todos.filter(t => t.completed),
[VisibilityFilters.SHOW_ACTIVE]: todos.filter(t => !t.completed),
}[filter]
if(filter == VisibilityFilters.SHOW_ALL) {
return todos
} else if(filter == VisibilityFilters.SHOW_COMPLETED) {
return todos.filter(t => t.completed)
} else if(filter == VisibilityFilters.SHOW_ACTIVE) {
return todos.filter(t => !t.completed)
} else {
throw new Error('Unknown filter: ' + filter)
}
}
const mapStateToProps = state => ({

35
docs/examples/todos/src/reducers/todos.js
View File

@@ -1,22 +1,21 @@
const todos = (state = [], action) => {
switch (action.type) {
case 'ADD_TODO':
return [
...state,
{
id: action.id,
text: action.text,
completed: false
}
]
case 'TOGGLE_TODO':
return state.map(todo =>
(todo.id === action.id)
? {...todo, completed: !todo.completed}
: todo
)
default:
return state
if(action.type == 'ADD_TODO') {
return [
...state,
{
id: action.id,
text: action.text,
completed: false
}
]
} else if(action.type == 'TOGGLE_TODO') {
return state.map(todo =>
(todo.id === action.id)
? {...todo, completed: !todo.completed}
: todo
)
} else {
return state
}
}

9
docs/examples/todos/src/reducers/visibilityFilter.js
View File

@@ -1,11 +1,10 @@
import { VisibilityFilters } from '../actions/index.js'
const visibilityFilter = (state = VisibilityFilters.SHOW_ALL, action) => {
switch (action.type) {
case 'SET_VISIBILITY_FILTER':
return action.filter
default:
return state
if(action.type == 'SET_VISIBILITY_FILTER') {
return action.filter
} else {
return state
}
}