1.1.0 • Published 9 years ago

co-browser-storage v1.1.0

Weekly downloads
2
License
ISC
Repository
github
Last release
9 years ago

co-browser-storage

Manage browser storage variables in a convenient way using Angular 2 and @ngrx/store.

Try the example

Usage

  • npm install --save co-browser-storage

Create browser storage config file my-browser-storage-config.ts where you specify all your browser storage variables.

export const NAMESPACE = 'myBrowserStore'
export const DEBUG_MODE = 'debugMode'

export const myBrowserStorageConfig = {
  namespace: NAMESPACE,
  initialState: [
    // List storage variables here
    {
      key: DEBUG_MODE,
      value: 'true',
      storageType: 'localStorage',
      valueType: 'text'
    }
  ]
}

Initialize the store and provide the model

import {provideStore} from '@ngrx/store'
import {cbsReducer} from 'co-browser-storage/co-browser-storage'
import {
  initialzeCbs,
  getInitialCbsState,
  CbsModel
} from 'co-browser-storage/co-browser-storage'
import {myBrowserStorageConfig} from './my-browser-storage-config'

initializeCbs(myBrowserStorageConfig)

bootstrap(AppCmp, [
  CbsModel,
  provideStore({
    cbsReducer
  }, {
    cbsReducer: getInitialCbsState()
  })
])

Using the GUI component for managing browser storage variables

import {CbsCmp} from 'co-browser-storage/co-browser-storage'

@Component({
  directives: [CbsCmp],
  template: `
    <cbs-cmp></cbs-cmp>
  `
})
export class AppComponent {}

Only show selected items in GUI

<cbs-cmp [itemsToShow]="['debugMode', 'otherItem']"></cbs-cmp>

Get value

import {CbsModel} from 'co-browser-storage/co-browser-storage'
...
let debugMode$ = cbsModel.getItemByKey('debugMode')

Or using store directly

import {Store} from '@ngrx/store'
...
let cbsReducer$ = store.select('cbsReducer')
let debugMode$ = cbsReducer$.map(cbs => cbs.find(i => i.key === 'debugMode'))

Update value

import {CbsModel} from 'co-browser-storage/co-browser-storage'
...
cbsModel.updateItem({
  key: 'debugMode',
  value: 'false'
})

// Multiple at once
cbsModel.updateItems([
  {
    key: 'debugMode',
    value: 'false'
  },
  {
    key: 'otherItem',
    value: 'otherValue'
  }
])

Get boolean true if value is 'true'

import {CbsModel} from 'co-browser-storage/co-browser-storage'
...
// cbsModel.truthy takes a string or an array of strings
let isDebugMode$ = cbsModel.truthy('debugMode')

Developing

  • npm start
  • npm run watch (typescript compilation watcher)
1.1.0

9 years ago

1.0.1

9 years ago

1.0.0

9 years ago

0.7.4

9 years ago

0.7.3

9 years ago

0.7.2

9 years ago

0.7.1

9 years ago

0.7.0

9 years ago

0.6.3

9 years ago

0.6.2

9 years ago

0.6.1

9 years ago

0.6.0

9 years ago

0.5.6

9 years ago

0.5.5

9 years ago

0.5.4

9 years ago

0.5.3

9 years ago

0.5.2

9 years ago

0.5.1

9 years ago

0.5.0

9 years ago

0.4.7

9 years ago

0.4.6

9 years ago

0.4.5

9 years ago

0.4.4

9 years ago

0.4.3

9 years ago

0.4.2

9 years ago

0.4.1

9 years ago

0.4.0

9 years ago

0.3.9

9 years ago

0.3.8

9 years ago

0.3.7

9 years ago

0.3.6

9 years ago

0.3.5

9 years ago

0.3.4

9 years ago

0.3.3

9 years ago

0.3.2

9 years ago

0.3.1

9 years ago

0.3.0

9 years ago

0.2.1

9 years ago

0.2.0

9 years ago

0.1.7

9 years ago

0.1.6

9 years ago

0.1.5

9 years ago

0.1.4

9 years ago

0.1.3

9 years ago

0.1.2

9 years ago

0.1.1

9 years ago

0.1.0

10 years ago

0.0.9

10 years ago

0.0.8

10 years ago

0.0.7

10 years ago

0.0.6

10 years ago

0.0.5

10 years ago

0.0.4

10 years ago

0.0.3

10 years ago

0.0.2

10 years ago

0.0.1

10 years ago