crn-cli/commands/init/template/ios/CRNDemo/webapp/rn_CRNTester/js-modules/666703.js

The Ctrip React Native CLI Tools

__d(function(g,r,i,a,m,e,d){'use strict';var t=r(d[0]),n=r(d[1]),o=r(d[2]),s=r(d[3]),l=r(d[4]),c=r(d[5]),u=r(d[6]),h=r(d[7]),f=r(d[8]),b=f.ActivityIndicator,p=f.Image,E=f.StyleSheet,y=f.Text,w=f.View,v=f.ImageBackground,z=r(d[9]),M='http://origami.design/public/images/bird-logo.png?r=1&t='+Date.now(),R=p.prefetch(M),S=(function(t){function f(){var t,s;o(this,f);for(var u=arguments.length,h=new Array(u),b=0;b<u;b++)h[b]=arguments[b];return(s=l(this,(t=c(f)).call.apply(t,[this].concat(h)))).state={events:[],startLoadPrefetched:!1,mountTime:new Date},s._loadEventFired=function(t){s.setState(function(o){return{events:[].concat(n(o.events),[t])}})},s}return u(f,t),s(f,[{key:"UNSAFE_componentWillMount",value:function(){this.setState({mountTime:new Date})}},{key:"render",value:function(){var t=this,n=this.state.mountTime;return h.createElement(w,null,h.createElement(p,{source:this.props.source,style:[A.base,{overflow:'visible'}],onLoadStart:function(){return t._loadEventFired("\u2714 onLoadStart (+"+(new Date-n)+"ms)")},onLoad:function(o){if(o.nativeEvent.source){var s=o.nativeEvent.source.url;t._loadEventFired("\u2714 onLoad (+"+(new Date-n)+"ms) for URL "+s)}else t._loadEventFired("\u2714 onLoad (+"+(new Date-n)+"ms)")},onLoadEnd:function(){t._loadEventFired("\u2714 onLoadEnd (+"+(new Date-n)+"ms)"),t.setState({startLoadPrefetched:!0},function(){R.then(function(){t._loadEventFired("\u2714 Prefetch OK (+"+(new Date-n)+"ms)"),p.queryCache([M]).then(function(o){var s=o.get(M);s?t._loadEventFired("\u2714 queryCache \""+s+"\" (+"+(new Date-n)+"ms)"):t._loadEventFired("\u2718 queryCache (+"+(new Date-n)+"ms)")})},function(o){t._loadEventFired("\u2718 Prefetch failed (+"+(new Date-n)+"ms)")})})}}),this.state.startLoadPrefetched?h.createElement(p,{source:this.props.prefetchedSource,style:[A.base,{overflow:'visible'}],onLoadStart:function(){return t._loadEventFired("\u2714 (prefetched) onLoadStart (+"+(new Date-n)+"ms)")},onLoad:function(o){if(o.nativeEvent.source){var s=o.nativeEvent.source.url;t._loadEventFired("\u2714 (prefetched) onLoad (+"+(new Date-n)+"ms) for URL "+s)}else t._loadEventFired("\u2714 (prefetched) onLoad (+"+(new Date-n)+"ms)")},onLoadEnd:function(){return t._loadEventFired("\u2714 (prefetched) onLoadEnd (+"+(new Date-n)+"ms)")}}):null,h.createElement(y,{style:{marginTop:20}},this.state.events.join('\n')))}}]),f})(h.Component),T=(function(t){function n(){var t,s;o(this,n);for(var u=arguments.length,h=new Array(u),f=0;f<u;f++)h[f]=arguments[f];return(s=l(this,(t=c(n)).call.apply(t,[this].concat(h)))).state={error:!1,loading:!1,progress:0},s}return u(n,t),s(n,[{key:"render",value:function(){var t=this,n=this.state.loading?h.createElement(w,{style:A.progress},h.createElement(y,null,this.state.progress,"%"),h.createElement(b,{style:{marginLeft:5}})):null;return this.state.error?h.createElement(y,null,this.state.error):h.createElement(v,{source:this.props.source,style:[A.base,{overflow:'visible'}],onLoadStart:function(n){return t.setState({loading:!0})},onError:function(n){return t.setState({error:n.nativeEvent.error,loading:!1})},onProgress:function(n){return t.setState({progress:Math.round(100*n.nativeEvent.loaded/n.nativeEvent.total)})},onLoad:function(){return t.setState({loading:!1,error:!1})}},n)}}]),n})(h.Component),L=(function(t){function n(){var t,s;o(this,n);for(var u=arguments.length,h=new Array(u),f=0;f<u;f++)h[f]=arguments[f];return(s=l(this,(t=c(n)).call.apply(t,[this].concat(h)))).state={width:0,height:0},s}return u(n,t),s(n,[{key:"componentDidMount",value:function(){var t=this;p.getSize(this.props.source.uri,function(n,o){t.setState({width:n,height:o})})}},{key:"render",value:function(){return h.createElement(w,{style:{flexDirection:'row'}},h.createElement(p,{style:{width:60,height:60,backgroundColor:'transparent',marginRight:10},source:this.props.source}),h.createElement(y,null,"Actual dimensions:",'\n',"Width: ",this.state.width,", Height: ",this.state.height))}}]),n})(h.Component),k=(function(t){function n(){var t,s;o(this,n);for(var u=arguments.length,h=new Array(u),f=0;f<u;f++)h[f]=arguments[f];return(s=l(this,(t=c(n)).call.apply(t,[this].concat(h)))).state={width:30,height:30},s.increaseImageSize=function(){s.state.width>=100||s.setState({width:s.state.width+10,height:s.state.height+10})},s.increaseImageSize=function(){s.state.width>=100||s.setState({width:s.state.width+10,height:s.state.height+10})},s.decreaseImageSize=function(){s.state.width<=10||s.setState({width:s.state.width-10,height:s.state.height-10})},s}return u(n,t),s(n,[{key:"render",value:function(){return h.createElement(w,null,h.createElement(w,{style:{flexDirection:'row',justifyContent:'space-between'}},h.createElement(y,{style:A.touchableText,onPress:this.decreaseImageSize},"Decrease image size"),h.createElement(y,{style:A.touchableText,onPress:this.increaseImageSize},"Increase image size")),h.createElement(y,null,"Container image size: ",this.state.width,"x",this.state.height,' '),h.createElement(w,{style:{height:this.state.height,width:this.state.width}},h.createElement(p,{style:{flex:1},source:[{uri:'https://facebook.github.io/react-native/img/favicon.png',width:38,height:38},{uri:'https://facebook.github.io/react-native/img/favicon.png',width:76,height:76},{uri:'https://facebook.github.io/react-native/img/opengraph.png',width:400,height:400}]})))}}]),n})(h.Component),C={uri:'https://facebook.github.io/react-native/img/opengraph.png'},I={uri:'https://facebook.github.io/react-native/img/favicon.png'},A=E.create({base:{width:38,height:38},progress:{flex:1,alignItems:'center',flexDirection:'row',width:100},leftMargin:{marginLeft:10},background:{backgroundColor:'#222222'},sectionText:{marginVertical:6},nestedText:{marginLeft:12,marginTop:20,backgroundColor:'transparent',color:'white'},resizeMode:{width:90,height:60,borderWidth:.5,borderColor:'black'},resizeModeText:{fontSize:11,marginBottom:3},icon:{width:15,height:15},horizontal:{flexDirection:'row'},gif:{flex:1,height:200},base64:{flex:1,height:50,resizeMode:'contain'},touchableText:{fontWeight:'500',color:'blue'}});e.displayName=void 0,e.framework='React',e.title='<Image>',e.description='Base component for displaying different types of images.',e.examples=[{title:'Plain Network Image',description:"If the `source` prop `uri` property is prefixed with \"http\", then it will be downloaded from the network.",render:function(){return h.createElement(p,{source:C,style:A.base})}},{title:'Plain Static Image',description:"Static assets should be placed in the source code tree, and required in the same way as JavaScript modules.",render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{source:r(d[10]),style:A.icon}),h.createElement(p,{source:r(d[11]),style:A.icon}),h.createElement(p,{source:r(d[12]),style:A.icon}),h.createElement(p,{source:r(d[13]),style:A.icon}))}},{title:'Image Loading Events',render:function(){return h.createElement(S,{source:{uri:'http://origami.design/public/images/bird-logo.png?r=1&t='+Date.now()},prefetchedSource:{uri:M}})}},{title:'Error Handler',render:function(){return h.createElement(T,{source:{uri:'https://TYPO_ERROR_facebook.github.io/react/logo-og.png'}})},platform:'ios'},{title:'Image Download Progress',render:function(){return h.createElement(T,{source:{uri:'http://origami.design/public/images/bird-logo.png?r=1'}})},platform:'ios'},{title:'defaultSource',description:'Show a placeholder image when a network image is loading',render:function(){return h.createElement(p,{defaultSource:r(d[14]),source:{uri:'https://facebook.github.io/origami/public/images/birds.jpg'},style:A.base})},platform:'ios'},{title:'Cache Policy',description:"First image has never been loaded before and is instructed not to load unless in cache.Placeholder image from above will stay. Second image is the same but forced to load regardless of local cache state.",render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{defaultSource:r(d[14]),source:{uri:I.uri+'?cacheBust=notinCache'+Date.now(),cache:'only-if-cached'},style:A.base}),h.createElement(p,{defaultSource:r(d[14]),source:{uri:I.uri+'?cacheBust=notinCache'+Date.now(),cache:'reload'},style:A.base}))},platform:'ios'},{title:'Border Color',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{source:I,style:[A.base,A.background,{borderWidth:3,borderColor:'#f099f0'}]}))}},{title:'Border Width',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{source:I,style:[A.base,A.background,{borderWidth:5,borderColor:'#f099f0'}]}))}},{title:'Border Radius',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{style:[A.base,{borderRadius:5}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{borderRadius:19}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{borderTopLeftRadius:20}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{borderWidth:10,borderTopLeftRadius:10,borderBottomRightRadius:20,borderColor:'green'}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{borderWidth:5,borderTopLeftRadius:10,borderTopRightRadius:20,borderBottomRightRadius:30,borderBottomLeftRadius:40,borderColor:'red'}],source:C}))}},{title:'Background Color',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{source:I,style:A.base}),h.createElement(p,{style:[A.base,A.leftMargin,{backgroundColor:'rgba(0, 0, 100, 0.25)'}],source:I}),h.createElement(p,{style:[A.base,A.leftMargin,{backgroundColor:'red'}],source:I}),h.createElement(p,{style:[A.base,A.leftMargin,{backgroundColor:'black'}],source:I}))}},{title:'Opacity',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{style:[A.base,{opacity:1}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{opacity:.8}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{opacity:.6}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{opacity:.4}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{opacity:.2}],source:C}),h.createElement(p,{style:[A.base,A.leftMargin,{opacity:0}],source:C}))}},{title:'Nesting content inside <Image> component',render:function(){return h.createElement(w,{style:{width:60,height:60}},h.createElement(p,{style:t({},E.absoluteFillObject),source:C}),h.createElement(y,{style:A.nestedText},"React"))}},{title:'Nesting content inside <ImageBackground> component',render:function(){return h.createElement(v,{style:{width:60,height:60,backgroundColor:'transparent'},source:C},h.createElement(y,{style:A.nestedText},"React"))}},{title:'Tint Color',description:"The `tintColor` style prop changes all the non-alpha pixels to the tint color.",render:function(){return h.createElement(w,null,h.createElement(w,{style:A.horizontal},h.createElement(p,{source:r(d[10]),style:[A.icon,{borderRadius:5,tintColor:'#5ac8fa'}]}),h.createElement(p,{source:r(d[10]),style:[A.icon,A.leftMargin,{borderRadius:5,tintColor:'#4cd964'}]}),h.createElement(p,{source:r(d[10]),style:[A.icon,A.leftMargin,{borderRadius:5,tintColor:'#ff2d55'}]}),h.createElement(p,{source:r(d[10]),style:[A.icon,A.leftMargin,{borderRadius:5,tintColor:'#8e8e93'}]})),h.createElement(y,{style:A.sectionText},"It also works with downloaded images:"),h.createElement(w,{style:A.horizontal},h.createElement(p,{source:I,style:[A.base,{borderRadius:5,tintColor:'#5ac8fa'}]}),h.createElement(p,{source:I,style:[A.base,A.leftMargin,{borderRadius:5,tintColor:'#4cd964'}]}),h.createElement(p,{source:I,style:[A.base,A.leftMargin,{borderRadius:5,tintColor:'#ff2d55'}]}),h.createElement(p,{source:I,style:[A.base,A.leftMargin,{borderRadius:5,tintColor:'#8e8e93'}]})))}},{title:'Resize Mode',description:"The `resizeMode` style prop controls how the image is rendered within the frame.",render:function(){return h.createElement(w,null,[I,C].map(function(t,n){return h.createElement(w,{key:n},h.createElement(w,{style:A.horizontal},h.createElement(w,null,h.createElement(y,{style:[A.resizeModeText]},"Contain"),h.createElement(p,{style:A.resizeMode,resizeMode:"contain",source:t})),h.createElement(w,{style:A.leftMargin},h.createElement(y,{style:[A.resizeModeText]},"Cover"),h.createElement(p,{style:A.resizeMode,resizeMode:"cover",source:t}))),h.createElement(w,{style:A.horizontal},h.createElement(w,null,h.createElement(y,{style:[A.resizeModeText]},"Stretch"),h.createElement(p,{style:A.resizeMode,resizeMode:"stretch",source:t})),h.createElement(w,{style:A.leftMargin},h.createElement(y,{style:[A.resizeModeText]},"Repeat"),h.createElement(p,{style:A.resizeMode,resizeMode:"repeat",source:t})),h.createElement(w,{style:A.leftMargin},h.createElement(y,{style:[A.resizeModeText]},"Center"),h.createElement(p,{style:A.resizeMode,resizeMode:"center",source:t}))))}))}},{title:'Animated GIF',render:function(){return h.createElement(p,{style:A.gif,source:{uri:'https://38.media.tumblr.com/9e9bd08c6e2d10561dd1fb4197df4c4e/tumblr_mfqekpMktw1rn90umo1_500.gif'}})},platform:'ios'},{title:'Base64 image',render:function(){return h.createElement(p,{style:A.base64,source:{uri:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAQAAACSR7JhAAADtUlEQVR4Ac3YA2Bj6QLH0XPT1Fzbtm29tW3btm3bfLZtv7e2ObZnms7d8Uw098tuetPzrxv8wiISrtVudrG2JXQZ4VOv+qUfmqCGGl1mqLhoA52oZlb0mrjsnhKpgeUNEs91Z0pd1kvihA3ULGVHiQO2narKSHKkEMulm9VgUyE60s1aWoMQUbpZOWE+kaqs4eLEjdIlZTcFZB0ndc1+lhB1lZrIuk5P2aib1NBpZaL+JaOGIt0ls47SKzLC7CqrlGF6RZ09HGoNy1lYl2aRSWL5GuzqWU1KafRdoRp0iOQEiDzgZPnG6DbldcomadViflnl/cL93tOoVbsOLVM2jylvdWjXolWX1hmfZbGR/wjypDjFLSZIRov09BgYmtUqPQPlQrPapecLgTIy0jMgPKtTeob2zWtrGH3xvjUkPCtNg/tm1rjwrMa+mdUkPd3hWbH0jArPGiU9ufCsNNWFZ40wpwn+62/66R2RUtoso1OB34tnLOcy7YB1fUdc9e0q3yru8PGM773vXsuZ5YIZX+5xmHwHGVvlrGPN6ZSiP1smOsMMde40wKv2VmwPPVXNut4sVpUreZiLBHi0qln/VQeI/LTMYXpsJtFiclUN+5HVZazim+Ky+7sAvxWnvjXrJFneVtLWLyPJu9K3cXLWeOlbMTlrIelbMDlrLenrjEQOtIF+fuI9xRp9ZBFp6+b6WT8RrxEpdK64BuvHgDk+vUy+b5hYk6zfyfs051gRoNO1usU12WWRWL73/MMEy9pMi9qIrR4ZpV16Rrvduxazmy1FSvuFXRkqTnE7m2kdb5U8xGjLw/spRr1uTov4uOgQE+0N/DvFrG/Jt7i/FzwxbA9kDanhf2w+t4V97G8lrT7wc08aA2QNUkuTfW/KimT01wdlfK4yEw030VfT0RtZbzjeMprNq8m8tnSTASrTLti64oBNdpmMQm0eEwvfPwRbUBywG5TzjPCsdwk3IeAXjQblLCoXnDVeoAz6SfJNk5TTzytCNZk/POtTSV40NwOFWzw86wNJRpubpXsn60NJFlHeqlYRbslqZm2jnEZ3qcSKgm0kTli3zZVS7y/iivZTweYXJ26Y+RTbV1zh3hYkgyFGSTKPfRVbRqWWVReaxYeSLarYv1Qqsmh1s95S7G+eEWK0f3jYKTbV6bOwepjfhtafsvUsqrQvrGC8YhmnO9cSCk3yuY984F1vesdHYhWJ5FvASlacshUsajFt2mUM9pqzvKGcyNJW0arTKN1GGGzQlH0tXwLDgQTurS8eIQAAAABJRU5ErkJggg==",scale:3}})},platform:'ios'},{title:'Cap Insets',description:"When the image is resized, the corners of the size specified by capInsets will stay a fixed size, but the center content and borders of the image will be stretched. This is useful for creating resizable rounded buttons, shadows, and other resizable assets.",render:function(){return h.createElement(z,null)},platform:'ios'},{title:'Image Size',render:function(){return h.createElement(L,{source:C})}},{title:'MultipleSourcesExample',description:"The `source` prop allows passing in an array of uris, so that native to choose which image to diplay based on the size of the of the target image",render:function(){return h.createElement(k,null)}},{title:'Legacy local image',description:"Images shipped with the native bundle, but not managed by the JS packager",render:function(){return h.createElement(p,{source:{uri:'legacy_image',width:120,height:120}})}},{title:'Bundled images',description:'Images shipped in a separate native bundle',render:function(){return h.createElement(w,{style:{flexDirection:'row'}},h.createElement(p,{source:{uri:'ImageInBundle',bundle:'RNTesterBundle',width:100,height:100},style:{borderColor:'yellow',borderWidth:4}}),h.createElement(p,{source:{uri:'ImageInAssetCatalog',bundle:'RNTesterBundle',width:100,height:100},style:{marginLeft:10,borderColor:'blue',borderWidth:4}}))},platform:'ios'},{title:'Blur Radius',render:function(){return h.createElement(w,{style:A.horizontal},h.createElement(p,{style:[A.base],source:C,blurRadius:0}),h.createElement(p,{style:[A.base,A.leftMargin],source:C,blurRadius:5}),h.createElement(p,{style:[A.base,A.leftMargin],source:C,blurRadius:10}),h.createElement(p,{style:[A.base,A.leftMargin],source:C,blurRadius:15}),h.createElement(p,{style:[A.base,A.leftMargin],source:C,blurRadius:20}),h.createElement(p,{style:[A.base,A.leftMargin],source:C,blurRadius:25}))}}]},666703,[51,30,3,4,5,8,9,11,15,666704,666706,666707,666708,666709,666710]);