Selaa lähdekoodia

checkpoint commit

vladislavaSim 1 vuosi sitten
vanhempi
commit
25831676c7
3 muutettua tiedostoa jossa 0 lisäystä ja 346 poistoa
  1. 0 0
      JsModule/Loading_icon.gif
  2. 0 58
      ModuleJS/index.html
  3. 0 288
      ModuleJS/main.js

ModuleJS/Loading_icon.gif → JsModule/Loading_icon.gif


Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 0 - 58
ModuleJS/index.html


+ 0 - 288
ModuleJS/main.js

@@ -1,288 +0,0 @@
-function createStore(reducer){
-    let state       = reducer(undefined, {}) //стартовая инициализация состояния, запуск редьюсера со state === undefined
-    let cbs         = []                     //массив подписчиков
-
-    const getState  = () => state            //функция, возвращающая переменную из замыкания
-    const subscribe = cb => (cbs.push(cb),   //запоминаем подписчиков в массиве
-        () => cbs = cbs.filter(c => c !== cb)) //возвращаем функцию unsubscribe, которая удаляет подписчика из списка
-
-    const dispatch  = action => {
-        if (typeof action === 'function'){ //если action - не объект, а функция
-            return action(dispatch, getState) //запускаем эту функцию и даем ей dispatch и getState для работы
-        }
-        const newState = reducer(state, action) //пробуем запустить редьюсер
-        if (newState !== state){ //проверяем, смог ли редьюсер обработать action
-            state = newState //если смог, то обновляем state
-            for (let cb of cbs)  cb() //и запускаем подписчиков
-        }
-    }
-
-    return {
-        getState, //добавление функции getState в результирующий объект
-        dispatch,
-        subscribe //добавление subscribe в объект
-    }
-}
-
-
-function jwtDecode(token){
-    try {
-        return JSON.parse(atob(token.split('.')[1]))
-    }
-    catch(e){
-    }
-}
-
-function authReducer(state={}, {type, token}){
-    //{
-    //  token, payload
-    //}
-
-    if (type === 'AUTH_LOGIN'){
-        //пытаемся токен раскодировать
-        const payload = jwtDecode(token)
-        if (payload){ //и если получилось
-            return {
-                token, payload //payload - раскодированный токен;
-            }
-        }
-    }
-    if (type === 'AUTH_LOGOUT'){
-        return {}
-    }
-    return state;
-}
-
-const actionAuthLogin = (token) =>
-    (dispatch, getState) => {
-        const oldState = getState()
-        dispatch({type: 'AUTH_LOGIN', token})
-        const newState = getState()
-        if (oldState !== newState)
-            localStorage.authToken = token
-    }
-
-const actionAuthLogout = () =>
-    dispatch => {
-        dispatch({type: 'AUTH_LOGOUT'})
-        localStorage.removeItem('authToken')
-    }
-
-const actionGoodById = _id =>
-    actionPromise('goodById', gql(backendURL,`query goodByID($id: String) {
-  GoodFindOne(query: $id) {
-    _id
-    name
-    description
-    price
-    images {
-      url
-    }
-    owner {
-      nick
-      avatar {
-        url
-        text
-      }
-    }
-    categories {
-      name
-      subCategories {
-        name
-        goods {
-          name
-          price
-        }
-      }
-    }
-  }
-}`, {"id": JSON.stringify([{_id}])}))
-
-
-function promiseReducer(state = {}, { type, name, status, payload, error }) {
-    if (type === "PROMISE") {
-        return {
-            ...state, //.......скопировать старый state
-            [name]: { status, payload, error }, //....... перекрыть в нем один name на новый объект со status, payload и error
-        };
-    }
-    return state;
-}
-
-const actionPending   = (name) => ({type: 'PROMISE', status: 'PENDING', name})
-const actionFulfilled = (name, payload) => ({type: 'PROMISE', status: 'FULFILLED', name, payload})
-const actionRejected  = (name, error) => ({type: 'PROMISE', status: 'REJECTED', name, error})
-
-const actionPromise   = (name, promise) =>
-    async dispatch => {
-        try {
-            dispatch(actionPending(name))
-            let payload = await promise
-            dispatch(actionFulfilled(name, payload))
-            return payload
-        }
-        catch(e){
-            dispatch(actionRejected(name, e))
-        }
-    }
-
-// const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
-
-
-function combineReducers(reducers){ //пачку редьюсеров как объект {auth: authReducer, promise: promiseReducer}
-    function combinedReducer(combinedState={}, action){ //combinedState - типа {auth: {...}, promise: {....}}
-        const newCombinedState = {}
-        for (const [reducerName, reducer] of Object.entries(reducers)){
-            const newSubState = reducer(combinedState[reducerName], action)
-            if (newSubState !== combinedState[reducerName]){
-                newCombinedState[reducerName] = newSubState
-            }
-        }
-        if (Object.keys(newCombinedState).length === 0){
-            return combinedState
-        }
-        return {...combinedState, ...newCombinedState}
-    }
-
-    return combinedReducer //нам возвращают один редьюсер, который имеет стейт вида {auth: {...стейт authReducer-а}, promise: {...стейт promiseReducer-а}}
-}
-
-
-const store = createStore(combineReducers({auth: authReducer, promise: promiseReducer})) //не забудьте combineReducers если он у вас уже есть
-if (localStorage.authToken){
-    store.dispatch(actionAuthLogin(localStorage.authToken))
-}
-//const store = createStore(combineReducers({promise: promiseReducer, auth: authReducer, cart: cartReducer}))
-// store.subscribe(() => console.log(store.getState()))
-
-
-
-const gql =    (url, query, variables) => fetch(url, {
-    method: 'POST',
-    headers: {
-        "Content-Type": "application/json",
-        Accept: "application/json",
-    },
-    body: JSON.stringify({query, variables})
-}).then(res => res.json())
-const url = 'http://shop-roles.node.ed.asmer.org.ua'
-const backendURL = 'http://shop-roles.node.ed.asmer.org.ua/graphql'
-
-const actionRootCats = () =>
-    actionPromise('rootCats', gql(backendURL, `query {
-        CategoryFind(query: "[{\\"parent\\":null}]"){
-            _id name
-        }
-    }`))
-const actionCatById = (_id) =>  //добавить подкатегории
-    actionPromise('catById', gql(backendURL,  `query catById($q: String){
-        CategoryFindOne(query: $q){
-            _id name goods {
-                _id name price images {
-                    url
-                }
-            }
-            subCategories {
-                name
-                _id
-            }
-        }
-    }`, {q: JSON.stringify([{_id}])}))
-
-
-const actionLogin = (login, password) =>
-    actionPromise('login', gql(backendURL,`query log($login:String, $password:String){
-                                              login(login:$login, password:$password)
-                                            }`, {login, password}))
-
-store.dispatch(actionRootCats())
-store.dispatch(actionLogin('test456', '123123'))
-
-//show root categories aside
-store.subscribe( () => {
-    const rootCats = store.getState().promise.rootCats?.payload?.data.CategoryFind
-    if (rootCats){
-        aside.innerHTML = ''
-        for (let {_id, name} of rootCats){
-            const a = document.createElement('a')
-            a.href  = `#/category/${_id}`
-            a.innerHTML = name
-            aside.append(a)
-        }
-    }
-})
-
-// store.subscribe(() => {
-//     const catById = store.getState().catById?.payload?.data.CategoryFindOne
-// })
-
-//cards showing
-store.subscribe( () => {
-    let {catById} = store.getState().promise;
-    const [,route, _id] = location.hash.split('/')
-let subCats = catById.payload?.data.CategoryFindOne.subCategories
-
-    if(catById?.status === 'PENDING') { // if pending, show loading gif
-        main.innerHTML = `<img src="Loading_icon.gif">`
-    } else if(catById?.payload && route === 'category'){ // if pending stopped
-        main.innerHTML = ''
-        const {name, id, goods} = catById.payload?.data.CategoryFindOne
-        main.innerHTML = `<h1>${name}</h1>`
-
-        if(subCats.length > 0) {
-            for(let sub of subCats) {
-                console.log(sub)
-                let subCat = document.createElement('a')
-                subCat.text = sub.name
-                subCat.href = `#/category/${sub._id}`
-                main.append(subCat)
-            }
-        }
-        // ask about showing subcats
-        console.log(store.getState().promise)
-        for(let good of goods) {
-            let {name, price, images} = good
-            let card = document.createElement('div')
-            card.className = 'card'
-            let cardBody = document.createElement('div')
-            let title = document.createElement('p')
-            title.className = 'title'
-            let img = document.createElement('img')
-            let desc = document.createElement('p')
-            let cardPrice = document.createElement('p')
-            title.innerHTML = name;
-            // img.src = `${url}/${images[0].url}`  //ACTIVATE THIS CODE AFTER FINISHING
-            cardPrice.innerHTML = `${price} UAH`
-            cardBody.append(title, desc, cardPrice) //ADD IMG
-            card.append(cardBody)
-            main.append(card);
-        }
-
-        }
-});
-//SHOW GOOD
-store.subscribe(() => {
-    // console.log(store.getState().promise)
-    let {goodById} = store.getState().promise
-})
-
-window.onhashchange = () => {
-    const [,route, _id] = location.hash.split('/')
-    const routes = {
-        category(){
-            store.dispatch(actionCatById(_id))
-        },
-        good(){
-            store.dispatch(actionGoodById(_id));
-        }
-    }
-    console.log(route)
-    if (route in routes) {
-        routes[route]()
-    }
-    routes.good()
-    console.log(route)
-}
-
-window.onhashchange()
-