lizhen
/
lanjingling


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
							<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="../../third-party/mathquill/mathquill.css"/>
    <style>
        html, body, .main{
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        .main{
            width:1024px;
            height:1024px;
        }
        .mathquill-editable,
        .mathquill-rendered-math{
            border: 0px;
            padding: 0px;
            margin:4px;
        }
    </style>
</head>
<body>

<div class="main">
    <div class="mathquill-editable"></div>
</div>

<div>
    <input id="blurHelper" />
</div>

<script src="../../third-party/jquery.min.js"></script>
<script src="../../third-party/mathquill/mathquill.js"></script>
<script>
    $(function(){

        var UM = parent.UM,
            $iframe = $(getSelfIframe());

        /* 获得当前公式所在的iframe节点 */
        function getSelfIframe(){
            var iframes = parent.document.getElementsByTagName('iframe');
            for (var key in iframes) {
                if (iframes[key].contentWindow == window) {
                    return iframes[key];
                }
            }
            return null;
        }
        /* 获得当前url上的hash存储的参数值 */
        function getLatex() {
            return $iframe.attr('data-latex') || '';
        }
        /* 保存场景 */
        function saveScene(){

        }
        /* 设置编辑器可编辑 */
        function enableEditor(){
        }
        /* 设置编辑器不可编辑 */
        function disableEditor(){
        }

        /* 公式 */
        var Formula = function(){
            var _this = this,
                latex = getLatex();

            this.isFocus = false;
            this.isDisabled = false;

            /* 加载公式内容 */
            this.$mathquill = $('.mathquill-editable').mathquill('latex', latex);

            /* 设置活动状态的公式iframe */
            this.$mathquill.on('mousedown', function(){
                /* 编辑器不可用时,公式也不可用 */
                if(_this.disabled) return false;

                /* 第一次点击当前公式,设置公式活动 */
                if(!$iframe.hasClass('edui-formula-active')) {
                }
                _this.focus();
            });

            /* 设置更新外层iframe的大小和属性 */
            $(document.body).on('keydown', function(){
                _this.updateIframe();
            }).on('keyup', function(){
                _this.updateIframe();
            });

            /* 清除初始化的高亮状态 */
            this.$mathquill.removeClass('hasCursor');

            /* 初始化后延迟刷新外层iframe大小 */
            setTimeout(function(){
                _this.updateIframe();
            }, 300);
        };

        Formula.prototype = {
            focus:function(){
                $iframe.addClass('edui-formula-active');
                this.isFocus = true;
            },
            blur:function(){
                $iframe.removeClass('edui-formula-active');
                this.removeCursor();
                this.isFocus = false;
            },
            removeCursor: function(){
                this.$mathquill.find('span.cursor').hide();
                this.$mathquill.parent().find('.hasCursor').removeClass('hasCursor');
            },
            updateIframe: function(){
                $iframe.width(this.$mathquill.width()+8).height(this.$mathquill.height()+8);
                var latex = $iframe.attr('data-latex'),
                    newLatex = this.getLatex();
                if(latex != newLatex) {
                    $iframe.attr('data-latex', this.getLatex());
                    saveScene();
                }
            },
            insertLatex: function(latex){
                this.$mathquill.mathquill('write', latex);
                this.updateIframe();
                this.removeCursor();
            },
            setLatex: function(latex){
                this.$mathquill.mathquill('latex', latex);
                this.updateIframe();
            },
            getLatex: function(){
                return this.$mathquill.mathquill('latex');
            },
            redraw: function(){
                this.$mathquill.mathquill('redraw');
            },
            setDisabled: function(){
                this.blur();
                var latex = this.getLatex();
                this.$mathquill.mathquill('revert').text(latex).mathquill();
                this.updateIframe();
                this.isDisabled = true;
            },
            setEnabled: function(){
                this.$mathquill.removeClass('mathquill-rendered-math');
                this.refresh();
                this.isDisabled = false;
            },
            refresh: function(){
                var latex = this.getLatex();
                this.$mathquill.mathquill('revert').text(latex).mathquill('editable');
                this.updateIframe();
            }
        };

        /* 绑定到window上，给上级window调用 */
        window.formula = new Formula();
    });
</script>
</body>
</html>