reactize/reactize.js at master · hallgren/reactize · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
/**
 * Reactize v0.4.2
 */
(function(exports){
varReactize={};

varCLASS_NAME_REGEX=/\sclass=/g;
varINPUT_TAG_WITH_VALUE_REGEX=/\s<input([^>]*)(.*value.*)(>)/g;
varCLOSING_INPUT_TAG_REGEX=/\s(<input[^>]*)(>)/g;

Reactize.reactize=function(element){
varcode=JSXTransformer.transform(
"/** @jsx React.DOM */"+
this.htmlToJsx(element.innerHTML)).code;

returneval(code);
};

Reactize.applyDiffOnHTMLString=function(targetElement,htmlString){
vardiv=document.createElement('div');
div.innerHTML=htmlString
Reactize.applyDiff(targetElement,div)
};

Reactize.applyDiff=function(targetElement,replacementElement){
varbod=Reactize.reactize(replacementElement);
React.render(bod,targetElement);
};

Reactize.applyBodyDiff=function(){
Reactize.applyDiff(document.body,document.body)
};

// Converts an HTML string into a JSX-compliant string.
Reactize.htmlToJsx=function(html){
html=html.replace(CLASS_NAME_REGEX," className=");
html=html.replace(INPUT_TAG_WITH_VALUE_REGEX,"<ReactInput $1 $2 /$3")
returnhtml=html.replace(CLOSING_INPUT_TAG_REGEX,"$1 /$2")
};

varReactInput=React.createClass({
getInitialState: function(){
this.props.onChange=this.handleChange
returnthis.props;
},

handleChange: function(event){
this.setState({value: event.currentTarget.value});
},

render: function(){
returnReact.createElement("input",this.state);
}
});

Reactize.version="0.4.2";

exports.Reactize=Reactize;
})(window);