Skip to content
This repository has been archived by the owner on May 13, 2019. It is now read-only.

Commit

Permalink
Merge pull request #145 from flyskywhy/master
Browse files Browse the repository at this point in the history
直接使用 Libraries/ 而非 babel 转换过的 lib/
  • Loading branch information
yuanyan authored Aug 23, 2016
2 parents eb83870 + 7dcbb5c commit 4168053
Show file tree
Hide file tree
Showing 12 changed files with 91 additions and 29 deletions.
1 change: 0 additions & 1 deletion .npmignore
Original file line number Diff line number Diff line change
Expand Up @@ -41,4 +41,3 @@ npm-debug.log
pages
react-web-cli
Examples
Libraries
29 changes: 29 additions & 0 deletions Libraries/Image/Image.web.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,35 @@ class Image extends Component {
isInAParentText: React.PropTypes.bool
}

static getSize = function(
url: string,
success: (width: number, height: number) => void,
failure: (error: any) => void,
) {
let wrap = document.createElement('div'),
img = new window.Image(),
loadedHandler = function loadedHandler() {
img.removeEventListener('load', loadedHandler);
success && success(img.offsetWidth, img.offsetHeight);
},
errorHandler = function errorHandler() {
img.removeEventListener('error', errorHandler);
failure && failure();
};

wrap.style.cssText = 'height:0px;width:0px;overflow:hidden;visibility:hidden;';

wrap.appendChild(img);
document.body.appendChild(wrap);
img.src = url;
if (!img.complete) {
img.addEventListener('error', errorHandler);
img.addEventListener('load', loadedHandler);
} else {
loadedHandler();
}
}

render() {

let props = {...this.props};
Expand Down
17 changes: 17 additions & 0 deletions Libraries/LayoutAnimation/LayoutAnimation.web.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
/**
* Copyright (c) 2015-present, Alibaba Group Holding Limited.
* All rights reserved.
*
* Copyright (c) 2015, Facebook, Inc. All rights reserved.
*
* @providesModule ReactLayoutAnimation
*/
"use strict";

var LayoutAnimation = {
Types: {},
Properties: {},
configureNext: function configureNext() {}
};

module.exports = LayoutAnimation;
14 changes: 7 additions & 7 deletions Libraries/RefreshControl/RefreshControl.web.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
/**
* Copyright (c) 2015-present, Alibaba Group Holding Limited.
* All rights reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
8
*
* Copyright (c) 2015, Facebook, Inc. All rights reserved.
*
* @providesModule ReactRefreshControl
*/
'use strict';
Expand All @@ -18,7 +18,7 @@ let RefreshLayoutConsts = {SIZE: {}};

class RefreshControl extends Component {

static SIZE = RefreshLayoutConsts.SIZE,
static SIZE = RefreshLayoutConsts.SIZE

componentDidMount() {
this._lastNativeRefreshing = this.props.refreshing;
Expand All @@ -45,7 +45,7 @@ class RefreshControl extends Component {
onRefresh={this._onRefresh}
/>
);
},
}

_onRefresh() {
this._lastNativeRefreshing = true;
Expand All @@ -55,8 +55,8 @@ class RefreshControl extends Component {
// The native component will start refreshing so force an update to
// make sure it stays in sync with the js component.
this.forceUpdate();
},
});
}
}

mixin.onClass(RefreshControl, NativeMethodsMixin);
autobind(RefreshControl);
Expand Down
14 changes: 9 additions & 5 deletions Libraries/Touchable/TouchableHighlight.web.js
Original file line number Diff line number Diff line change
Expand Up @@ -126,12 +126,16 @@ class TouchableHighlight extends Component {
this._showUnderlay();
this._hideTimeout = this.setTimeout(this._hideUnderlay,
this.props.delayPressOut || 100);

var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
if (touchBank) {
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
} else {
this.props.onPress && this.props.onPress(e);
}
}

touchableHandleLongPress(e: Event) {
Expand Down
14 changes: 9 additions & 5 deletions Libraries/Touchable/TouchableOpacity.web.js
Original file line number Diff line number Diff line change
Expand Up @@ -107,12 +107,16 @@ class TouchableOpacity extends React.Component {
this._opacityInactive,
this.props.delayPressOut || 100
);

var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
if (touchBank) {
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
} else {
this.props.onPress && this.props.onPress(e);
}
}

touchableHandleLongPress(e: Event) {
Expand Down
12 changes: 8 additions & 4 deletions Libraries/Touchable/TouchableWithoutFeedback.web.js
Original file line number Diff line number Diff line change
Expand Up @@ -76,10 +76,14 @@ class TouchableWithoutFeedback extends Component {
*/
touchableHandlePress(e: Event) {
var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
if (touchBank) {
var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+ Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
if (velocity < 100) this.props.onPress && this.props.onPress(e);
} else {
this.props.onPress && this.props.onPress(e);
}
}

touchableHandleActivePressIn(e: Event) {
Expand Down
4 changes: 3 additions & 1 deletion Libraries/react-web.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ export * from 'react';

// Components
export ActivityIndicatorIOS from 'ReactActivityIndicator';
export ActivityIndicator from 'ReactActivityIndicator';
// export DatePicker from 'ReactDatePicker';
export DrawerLayoutAndroid from 'ReactDrawerLayout';
export Image from 'ReactImage';
Expand All @@ -42,7 +43,7 @@ export TouchableHighlight from 'ReactTouchableHighlight';
export TouchableOpacity from 'ReactTouchableOpacity';
export TouchableWithoutFeedback from 'ReactTouchableWithoutFeedback';
export TouchableBounce from 'ReactTouchableBounce';
// export RefreshControl from 'ReactRefreshControl';
export RefreshControl from 'ReactRefreshControl';
export View from 'ReactView';
export ViewPagerAndroid from 'ReactViewPager';
export ViewPager from 'ReactViewPager';
Expand All @@ -57,6 +58,7 @@ export AsyncStorage from 'ReactAsyncStorage';
export Dimensions from 'ReactDimensions';
export Easing from 'animated/lib/Easing';
export InteractionManager from 'ReactInteractionManager';
export LayoutAnimation from 'ReactLayoutAnimation';
export PanResponder from 'ReactPanResponder';
export PixelRatio from 'ReactPixelRatio';
export StyleSheet from 'ReactStyleSheet';
Expand Down
2 changes: 1 addition & 1 deletion README-zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
## 安装

```
npm install react-web --save
npm install --save git+https://github.com/taobaofed/react-web.git
```

## 使用
Expand Down
7 changes: 5 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ If you already have a React Native project and want to add web support, you need
1. Install `npm install react-web-cli -g`
2. Execute `react-web init <ExistedProjectDir>`. That install `react-web` and `devDependencies` to your project and make a `web` directory with `webpack.config.js` file under your project
3. Register your app into a web platform. To do so, add the code from **Fix platform differences. 2. Should run application on web platform** to your index.ios.js file
4. Execute `npm start`
4. Execute `npm install --save git+https://github.com/taobaofed/react-web.git` that replace react-web npm version to develope react-web itself easier
5. Execute `react-web start` that starts the web dev server
6. Execute `react-web bundle` that builds the output

Expand All @@ -36,7 +36,7 @@ If you already have a React Native project and want to add web support, you need
### Install

```sh
npm install react-web --save
npm install --save git+https://github.com/taobaofed/react-web.git
```

### Add Webpack configuration
Expand Down Expand Up @@ -163,6 +163,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
#### Components

* ActivityIndicatorIOS - ReactActivityIndicator
* ActivityIndicator - ReactActivityIndicator
* DatePickerIOS - ReactDatePicker *TODO*
* DrawerLayoutAndroid - ReactDrawerLayout
* Image - ReactImage
Expand All @@ -177,6 +178,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
* Switch - ReactSwitch
* SwitchAndroid - ReactSwitch
* SwitchIOS - ReactSwitch
* RefreshControl - ReactRefreshControl
* TabBarIOS - ReactTabBar
* Text - ReactText
* TextInput - ReactTextInput
Expand All @@ -198,6 +200,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
* Dimensions - ReactDimensions
* Easing - ReactEasing
* InteractionManager - ReactInteractionManager
* LayoutAnimation - ReactLayoutAnimation
* PanResponder - ReactPanResponder
* PixelRatio - ReactPixelRatio
* StyleSheet - ReactStyleSheet
Expand Down
4 changes: 2 additions & 2 deletions local-cli/generator-web/templates/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ var config = {
var webpackConfig = {
ip: IP,
port: PORT,
devtool: 'source-map',
devtool: 'cheap-module-eval-source-map',
resolve: {
alias: {
'react-native': 'ReactWeb',
Expand Down Expand Up @@ -73,7 +73,7 @@ var webpackConfig = {
presets: ['es2015', 'react', 'stage-1']
},
include: [config.paths.src],
exclude: [/node_modules/]
exclude: /(node_modules\/(?!react))/
}]
}
};
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"type": "git",
"url": "git@github.com:taobaofed/react-web.git"
},
"main": "./lib/react-web.js",
"main": "./Libraries/react-web.js",
"keywords": [
"react-native",
"react-web",
Expand Down

0 comments on commit 4168053

Please sign in to comment.