/**
 * 全屏组件
 */
import React from "react";
import styles from "./index.css";
export const fullScreen = props =>{
    let runPrefixMethod = (element, method) =>{
        let usablePrefixMethod = null;
        ["webkit", "moz", "ms", "o", ""].forEach((prefix)=> {
            if (usablePrefixMethod) return;
            if (prefix === "") {
                // 无前缀，方法首字母小写
                method = method.slice(0, 1).toLowerCase() + method.slice(1);
            }
            var typePrefixMethod = typeof element[prefix + method];
            if (typePrefixMethod + "" !== "undefined") {
                if (typePrefixMethod === "function") {
                    usablePrefixMethod = element[prefix + method]();
                } else {
                    usablePrefixMethod = element[prefix + method];
                }
            }
        });
        return usablePrefixMethod;
    };
    if (typeof screenX === "number") {
        if (runPrefixMethod(document, "FullScreen") || runPrefixMethod(document, "IsFullScreen")) {
            runPrefixMethod(document, "CancelFullScreen");
        } else if (runPrefixMethod(document.body, "RequestFullScreen")) {
            
        }
    } else {
        alert("浏览器太老了!!");
    }
}
export const FullScreen = props =>{
    const {children,className,style = {},...oth} = props;
    return (
        <div {...oth} className={`${styles.fullScreen} ${className}`} style={style} onClick={fullScreen}>
            {children || <i className={`iconfont icon-quanping ${styles.Icon}`} style={{fontSize:style.fontSize || '30px'}}></i>}
        </div>
    )
}
export default FullScreen;
