2015-07-07 17:31:56 +08:00
function init ( React ) {
var Filter = React . createClass ( { displayName : "Filter" ,
dealChange : function ( ) {
var self = this ,
userInput = React . findDOMNode ( self . refs . keywordInput ) . value ;
self . props . onChangeKeyword && self . props . onChangeKeyword . call ( null , userInput ) ;
} ,
setFocus : function ( ) {
var self = this ;
React . findDOMNode ( self . refs . keywordInput ) . focus ( ) ;
} ,
componentDidUpdate : function ( ) {
this . setFocus ( ) ;
} ,
render : function ( ) {
var self = this ;
return (
2015-07-08 11:55:13 +08:00
React . createElement ( "div" , null ,
2015-07-07 17:31:56 +08:00
React . createElement ( "h4" , { className : "subTitle" } , "Log Filter" ) ,
2015-07-08 11:55:13 +08:00
React . createElement ( "div" , { className : "filterSection" } ,
React . createElement ( "form" , { className : "uk-form" } ,
React . createElement ( "input" , { className : "uk-form-large" , ref : "keywordInput" , onChange : self . dealChange , type : "text" , placeholder : "keywords or /^regExp$/" , width : "300" } )
)
) ,
2015-07-11 20:19:41 +08:00
React . createElement ( "dl" , { className : "uk-description-list-horizontal" } ,
2015-07-08 11:55:13 +08:00
React . createElement ( "dt" , null , "wrap your RegExp between two slashes" ) ,
React . createElement ( "dd" , null ,
"e.g. " , React . createElement ( "br" , null ) ,
"type " , React . createElement ( "strong" , null , "/id=\\d" , 3 , "/" ) , " will give you all the logs containing " , React . createElement ( "strong" , null , "id=123" )
)
2015-07-07 17:31:56 +08:00
)
)
) ;
} ,
componentDidMount : function ( ) {
this . setFocus ( ) ;
}
} ) ;
return Filter ;
}
module . exports . init = init ;