diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..73a7621 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,33 @@ +{ + "parser": "@typescript-eslint/parser", + "extends": [ + "standard", + "standard-react", + "plugin:prettier/recommended", + "prettier/standard", + "prettier/react", + "plugin:@typescript-eslint/eslint-recommended" + ], + "env": { + "node": true + }, + "parserOptions": { + "ecmaVersion": 2020, + "ecmaFeatures": { + "legacyDecorators": true, + "jsx": true + } + }, + "settings": { + "react": { + "version": "16" + } + }, + "rules": { + "space-before-function-paren": 0, + "react/jsx-handler-names": 0, + "react/jsx-fragments": 0, + "import/export": 0, + "camelcase": 0 + } +} diff --git a/.gitignore b/.gitignore index a22b528..bcdb8e1 100644 --- a/.gitignore +++ b/.gitignore @@ -36,3 +36,5 @@ jspm_packages # Optional REPL history .node_repl_history /.idea/ + +/dist \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..a9646d4 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,10 @@ +{ + "singleQuote": true, + "jsxSingleQuote": true, + "semi": false, + "tabWidth": 2, + "bracketSpacing": true, + "jsxBracketSameLine": false, + "arrowParens": "always", + "trailingComma": "none" +} diff --git a/CachedImage.js b/CachedImage.js deleted file mode 100644 index daf03c8..0000000 --- a/CachedImage.js +++ /dev/null @@ -1,232 +0,0 @@ -'use strict'; - -const _ = require('lodash'); -const React = require('react'); -const ReactNative = require('react-native'); - -const PropTypes = require('prop-types'); - -const ImageCacheManagerOptionsPropTypes = require('./ImageCacheManagerOptionsPropTypes'); - -const flattenStyle = ReactNative.StyleSheet.flatten; - -const ImageCacheManager = require('./ImageCacheManager'); - -const { - View, - ImageBackground, - ActivityIndicator, - NetInfo, - Platform, - StyleSheet, -} = ReactNative; - -const styles = StyleSheet.create({ - image: { - backgroundColor: 'transparent' - }, - loader: { - backgroundColor: 'transparent', - }, - loaderPlaceholder: { - backgroundColor: 'transparent', - alignItems: 'center', - justifyContent: 'center' - } -}); - -function getImageProps(props) { - return _.omit(props, ['source', 'defaultSource', 'fallbackSource', 'LoadingIndicator', 'activityIndicatorProps', 'style', 'useQueryParamsInCacheKey', 'renderImage', 'resolveHeaders']); -} - -const CACHED_IMAGE_REF = 'cachedImage'; - -class CachedImage extends React.Component { - - static propTypes = { - renderImage: PropTypes.func.isRequired, - activityIndicatorProps: PropTypes.object.isRequired, - - // ImageCacheManager options - ...ImageCacheManagerOptionsPropTypes, - }; - - static defaultProps = { - renderImage: props => (), - activityIndicatorProps: {}, - }; - - static contextTypes = { - getImageCacheManager: PropTypes.func, - }; - - constructor(props) { - super(props); - this._isMounted = false; - this.state = { - isCacheable: true, - cachedImagePath: null, - networkAvailable: true - }; - - this.getImageCacheManagerOptions = this.getImageCacheManagerOptions.bind(this); - this.getImageCacheManager = this.getImageCacheManager.bind(this); - this.safeSetState = this.safeSetState.bind(this); - this.handleConnectivityChange = this.handleConnectivityChange.bind(this); - this.processSource = this.processSource.bind(this); - this.renderLoader = this.renderLoader.bind(this); - } - - componentWillMount() { - this._isMounted = true; - NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectivityChange); - // initial - NetInfo.isConnected.fetch() - .then(isConnected => { - this.safeSetState({ - networkAvailable: isConnected - }); - }); - - this.processSource(this.props.source); - } - - componentWillUnmount() { - this._isMounted = false; - NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectivityChange); - } - - componentWillReceiveProps(nextProps) { - if (!_.isEqual(this.props.source, nextProps.source)) { - this.processSource(nextProps.source); - } - } - - setNativeProps(nativeProps) { - try { - this.refs[CACHED_IMAGE_REF].setNativeProps(nativeProps); - } catch (e) { - console.error(e); - } - } - - getImageCacheManagerOptions() { - return _.pick(this.props, _.keys(ImageCacheManagerOptionsPropTypes)); - } - - getImageCacheManager() { - // try to get ImageCacheManager from context - if (this.context && this.context.getImageCacheManager) { - return this.context.getImageCacheManager(); - } - // create a new one if context is not available - const options = this.getImageCacheManagerOptions(); - return ImageCacheManager(options); - } - - safeSetState(newState) { - if (!this._isMounted) { - return; - } - return this.setState(newState); - } - - handleConnectivityChange(isConnected) { - this.safeSetState({ - networkAvailable: isConnected - }); - } - - processSource(source) { - const url = _.get(source, ['uri'], null); - const options = this.getImageCacheManagerOptions(); - const imageCacheManager = this.getImageCacheManager(); - - imageCacheManager.downloadAndCacheUrl(url, options) - .then(cachedImagePath => { - this.safeSetState({ - cachedImagePath - }); - }) - .catch(err => { - // console.warn(err); - this.safeSetState({ - cachedImagePath: null, - isCacheable: false - }); - }); - } - - render() { - if (this.state.isCacheable && !this.state.cachedImagePath) { - return this.renderLoader(); - } - const props = getImageProps(this.props); - const style = this.props.style || styles.image; - const source = (this.state.isCacheable && this.state.cachedImagePath) ? { - uri: 'file://' + this.state.cachedImagePath - } : this.props.source; - if (this.props.fallbackSource && !this.state.cachedImagePath) { - return this.props.renderImage({ - ...props, - key: `${props.key || source.uri}error`, - style, - source: this.props.fallbackSource - }); - } - return this.props.renderImage({ - ...props, - key: props.key || source.uri, - style, - source - }); - } - - renderLoader() { - const imageProps = getImageProps(this.props); - const imageStyle = [this.props.style, styles.loaderPlaceholder]; - - const activityIndicatorProps = _.omit(this.props.activityIndicatorProps, ['style']); - const activityIndicatorStyle = this.props.activityIndicatorProps.style || styles.loader; - - const LoadingIndicator = this.props.loadingIndicator; - - const source = this.props.defaultSource; - - // if the imageStyle has borderRadius it will break the loading image view on android - // so we only show the ActivityIndicator - if (!source || (Platform.OS === 'android' && flattenStyle(imageStyle).borderRadius)) { - if (LoadingIndicator) { - return ( - - - - ); - } - return ( - - ); - } - // otherwise render an image with the defaultSource with the ActivityIndicator on top of it - return this.props.renderImage({ - ...imageProps, - style: imageStyle, - key: source.uri, - source, - children: ( - LoadingIndicator - ? - - - : - ) - }); - } - -} - -module.exports = CachedImage; diff --git a/CachedImageExample/.babelrc b/CachedImageExample/.babelrc deleted file mode 100644 index a9ce136..0000000 --- a/CachedImageExample/.babelrc +++ /dev/null @@ -1,3 +0,0 @@ -{ - "presets": ["react-native"] -} diff --git a/CachedImageExample/.flowconfig b/CachedImageExample/.flowconfig deleted file mode 100644 index 218cce9..0000000 --- a/CachedImageExample/.flowconfig +++ /dev/null @@ -1,49 +0,0 @@ -[ignore] -; We fork some components by platform -.*/*[.]android.js - -; Ignore "BUCK" generated dirs -/\.buckd/ - -; Ignore unexpected extra "@providesModule" -.*/node_modules/.*/node_modules/fbjs/.* - -; Ignore duplicate module providers -; For RN Apps installed via npm, "Libraries" folder is inside -; "node_modules/react-native" but in the source repo it is in the root -.*/Libraries/react-native/React.js -.*/Libraries/react-native/ReactNative.js - -[include] - -[libs] -node_modules/react-native/Libraries/react-native/react-native-interface.js -node_modules/react-native/flow -flow/ - -[options] -emoji=true - -module.system=haste - -experimental.strict_type_args=true - -munge_underscores=true - -module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub' -module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub' - -suppress_type=$FlowIssue -suppress_type=$FlowFixMe -suppress_type=$FixMe - -suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\) -suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+ - -suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy -suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError - -unsafe.enable_getters_and_setters=true - -[version] -^0.47.0 \ No newline at end of file diff --git a/CachedImageExample/.gitignore b/CachedImageExample/.gitignore deleted file mode 100644 index 9b51814..0000000 --- a/CachedImageExample/.gitignore +++ /dev/null @@ -1,43 +0,0 @@ -# OSX -# -.DS_Store - -# Xcode -# -build/ -*.pbxuser -!default.pbxuser -*.mode1v3 -!default.mode1v3 -*.mode2v3 -!default.mode2v3 -*.perspectivev3 -!default.perspectivev3 -xcuserdata -*.xccheckout -*.moved-aside -DerivedData -*.hmap -*.ipa -*.xcuserstate -project.xcworkspace - -# Android/IntelliJ -# -build/ -.idea -.gradle -local.properties -*.iml - -# node.js -# -node_modules/ -npm-debug.log -yarn-error.log - -# BUCK -buck-out/ -\.buckd/ -android/app/libs -*.keystore diff --git a/CachedImageExample/android/app/proguard-rules.pro b/CachedImageExample/android/app/proguard-rules.pro deleted file mode 100644 index 6e8516c..0000000 --- a/CachedImageExample/android/app/proguard-rules.pro +++ /dev/null @@ -1,70 +0,0 @@ -# Add project specific ProGuard rules here. -# By default, the flags in this file are appended to flags specified -# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt -# You can edit the include path and order by changing the proguardFiles -# directive in build.gradle. -# -# For more details, see -# http://developer.android.com/guide/developing/tools/proguard.html - -# Add any project specific keep options here: - -# If your project uses WebView with JS, uncomment the following -# and specify the fully qualified class name to the JavaScript interface -# class: -#-keepclassmembers class fqcn.of.javascript.interface.for.webview { -# public *; -#} - -# Disabling obfuscation is useful if you collect stack traces from production crashes -# (unless you are using a system that supports de-obfuscate the stack traces). --dontobfuscate - -# React Native - -# Keep our interfaces so they can be used by other ProGuard rules. -# See http://sourceforge.net/p/proguard/bugs/466/ --keep,allowobfuscation @interface com.facebook.proguard.annotations.DoNotStrip --keep,allowobfuscation @interface com.facebook.proguard.annotations.KeepGettersAndSetters --keep,allowobfuscation @interface com.facebook.common.internal.DoNotStrip - -# Do not strip any method/class that is annotated with @DoNotStrip --keep @com.facebook.proguard.annotations.DoNotStrip class * --keep @com.facebook.common.internal.DoNotStrip class * --keepclassmembers class * { - @com.facebook.proguard.annotations.DoNotStrip *; - @com.facebook.common.internal.DoNotStrip *; -} - --keepclassmembers @com.facebook.proguard.annotations.KeepGettersAndSetters class * { - void set*(***); - *** get*(); -} - --keep class * extends com.facebook.react.bridge.JavaScriptModule { *; } --keep class * extends com.facebook.react.bridge.NativeModule { *; } --keepclassmembers,includedescriptorclasses class * { native ; } --keepclassmembers class * { @com.facebook.react.uimanager.UIProp ; } --keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactProp ; } --keepclassmembers class * { @com.facebook.react.uimanager.annotations.ReactPropGroup ; } - --dontwarn com.facebook.react.** - -# TextLayoutBuilder uses a non-public Android constructor within StaticLayout. -# See libs/proxy/src/main/java/com/facebook/fbui/textlayoutbuilder/proxy for details. --dontwarn android.text.StaticLayout - -# okhttp - --keepattributes Signature --keepattributes *Annotation* --keep class okhttp3.** { *; } --keep interface okhttp3.** { *; } --dontwarn okhttp3.** - -# okio - --keep class sun.misc.Unsafe { *; } --dontwarn java.nio.file.* --dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement --dontwarn okio.** diff --git a/CachedImageExample/android/app/src/main/AndroidManifest.xml b/CachedImageExample/android/app/src/main/AndroidManifest.xml deleted file mode 100644 index 57628d4..0000000 --- a/CachedImageExample/android/app/src/main/AndroidManifest.xml +++ /dev/null @@ -1,35 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - diff --git a/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainActivity.java b/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainActivity.java deleted file mode 100644 index 8749f31..0000000 --- a/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainActivity.java +++ /dev/null @@ -1,15 +0,0 @@ -package com.cachedimageexample; - -import com.facebook.react.ReactActivity; - -public class MainActivity extends ReactActivity { - - /** - * Returns the name of the main component registered from JavaScript. - * This is used to schedule rendering of the component. - */ - @Override - protected String getMainComponentName() { - return "CachedImageExample"; - } -} diff --git a/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainApplication.java b/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainApplication.java deleted file mode 100644 index 3ac614f..0000000 --- a/CachedImageExample/android/app/src/main/java/com/cachedimageexample/MainApplication.java +++ /dev/null @@ -1,51 +0,0 @@ -package com.cachedimageexample; - -import android.util.Log; -import android.app.Application; - -import com.facebook.react.ReactApplication; -import com.facebook.react.ReactInstanceManager; -import com.facebook.react.ReactNativeHost; -import com.facebook.react.ReactPackage; -import com.facebook.react.shell.MainReactPackage; - -import com.facebook.soloader.SoLoader; - -import com.RNFetchBlob.RNFetchBlobPackage; - -import java.util.Arrays; -import java.util.List; - -public class MainApplication extends Application implements ReactApplication { - - private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { - @Override - public boolean getUseDeveloperSupport() { - return BuildConfig.DEBUG; - } - - @Override - protected String getJSMainModuleName() { - return "index"; - } - - @Override - protected List getPackages() { - return Arrays.asList( - new MainReactPackage(), - new RNFetchBlobPackage() - ); - } - }; - - @Override - public ReactNativeHost getReactNativeHost() { - return mReactNativeHost; - } - - @Override - public void onCreate() { - super.onCreate(); - SoLoader.init(this, /* native exopackage */ false); - } -} diff --git a/CachedImageExample/android/app/src/main/res/mipmap-hdpi/ic_launcher.png b/CachedImageExample/android/app/src/main/res/mipmap-hdpi/ic_launcher.png deleted file mode 100644 index cde69bc..0000000 Binary files a/CachedImageExample/android/app/src/main/res/mipmap-hdpi/ic_launcher.png and /dev/null differ diff --git a/CachedImageExample/android/app/src/main/res/mipmap-mdpi/ic_launcher.png b/CachedImageExample/android/app/src/main/res/mipmap-mdpi/ic_launcher.png deleted file mode 100644 index c133a0c..0000000 Binary files a/CachedImageExample/android/app/src/main/res/mipmap-mdpi/ic_launcher.png and /dev/null differ diff --git a/CachedImageExample/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png b/CachedImageExample/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png deleted file mode 100644 index bfa42f0..0000000 Binary files a/CachedImageExample/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png and /dev/null differ diff --git a/CachedImageExample/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png b/CachedImageExample/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png deleted file mode 100644 index 324e72c..0000000 Binary files a/CachedImageExample/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png and /dev/null differ diff --git a/CachedImageExample/android/gradle/wrapper/gradle-wrapper.jar b/CachedImageExample/android/gradle/wrapper/gradle-wrapper.jar deleted file mode 100644 index b5166da..0000000 Binary files a/CachedImageExample/android/gradle/wrapper/gradle-wrapper.jar and /dev/null differ diff --git a/CachedImageExample/android/keystores/BUCK b/CachedImageExample/android/keystores/BUCK deleted file mode 100644 index 88e4c31..0000000 --- a/CachedImageExample/android/keystores/BUCK +++ /dev/null @@ -1,8 +0,0 @@ -keystore( - name = "debug", - properties = "debug.keystore.properties", - store = "debug.keystore", - visibility = [ - "PUBLIC", - ], -) diff --git a/CachedImageExample/android/keystores/debug.keystore.properties b/CachedImageExample/android/keystores/debug.keystore.properties deleted file mode 100644 index 121bfb4..0000000 --- a/CachedImageExample/android/keystores/debug.keystore.properties +++ /dev/null @@ -1,4 +0,0 @@ -key.store=debug.keystore -key.alias=androiddebugkey -key.store.password=android -key.alias.password=android diff --git a/CachedImageExample/android/settings.gradle b/CachedImageExample/android/settings.gradle deleted file mode 100644 index 693eaa1..0000000 --- a/CachedImageExample/android/settings.gradle +++ /dev/null @@ -1,5 +0,0 @@ -rootProject.name = 'CachedImageExample' -include ':react-native-fetch-blob' -project(':react-native-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fetch-blob/android') - -include ':app' diff --git a/CachedImageExample/index.js b/CachedImageExample/index.js deleted file mode 100644 index 154c91e..0000000 --- a/CachedImageExample/index.js +++ /dev/null @@ -1,176 +0,0 @@ -'use strict'; - -const React = require('react'); -const ReactNative = require('react-native'); - -const _ = require('lodash'); - -const { - View, - ScrollView, - Button, - Dimensions, - StyleSheet, - AppRegistry, - ListView, -} = ReactNative; - -const { - CachedImage, - ImageCacheProvider, - ImageCacheManager, -} = require('react-native-cached-image'); - -const { - width -} = Dimensions.get('window'); - -const styles = StyleSheet.create({ - container: { - flex: 1, - marginTop: 20 - }, - buttons: { - flexDirection: 'row' - }, - button: { - flex: 1, - alignItems: 'center', - justifyContent: 'center' - }, - image: { - width, - height: 300 - } -}); - -const loading = require('./loading.jpg'); - -const image1 = 'https://wallpaperbrowse.com/media/images/bcf39e88-5731-43bb-9d4b-e5b3b2b1fdf2.jpg'; -const image2 = 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/baby-shower-full.jpg'; - -const images = [ - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/after-work-drinks-full.jpg', - 'https://i.ytimg.com/vi/b6m-XlOxjbk/hqdefault.jpg', - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/wrong-image.jpg', - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/bar-crawl-full.jpg', - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/cheeseburger-full.jpg', - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/friendsgiving-full.jpg', - 'https://d22cb02g3nv58u.cloudfront.net/0.676.0/assets/images/icons/fun-types/full/dogs-play-date-full.jpg' -]; - -function formatBytes(bytes, decimals) { - if (bytes === 0) { - return '0 B'; - } - const k = 1000; - const dm = decimals + 1 || 3; - const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; - const i = Math.floor(Math.log(bytes) / Math.log(k)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; -} - -const defaultImageCacheManager = ImageCacheManager(); - -class CachedImageExample extends React.Component { - - constructor(props) { - super(props); - - const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); - this.state = { - showNextImage: false, - dataSource: ds.cloneWithRows(images) - }; - - this.cacheImages = this.cacheImages.bind(this); - - } - - componentWillMount() { - defaultImageCacheManager.downloadAndCacheUrl(image1); - } - - clearCache() { - defaultImageCacheManager.clearCache() - .then(() => { - ReactNative.Alert.alert('Cache cleared'); - }); - } - - getCacheInfo() { - defaultImageCacheManager.getCacheInfo() - .then(({size, files}) => { - // console.log(size, files); - ReactNative.Alert.alert('Cache Info', `files: ${files.length}\nsize: ${formatBytes(size)}`); - }); - } - - cacheImages() { - this.setState({ - dataSource: this.state.dataSource.cloneWithRows([]) - }, () => { - this.setState({ - dataSource: this.state.dataSource.cloneWithRows(images) - }); - }); - } - - renderRow(uri) { - return ( - - ); - } - - render() { - return ( - - -