[PE embed] updated embed viewer
This commit is contained in:
Maxim Kadushkin
parent
83a9f5ee5d
commit
960d5850d4
|
|
@ -1,51 +1,50 @@
|
||||||
<?xml version="1.0" encoding="utf-8"?>
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
viewBox="44 0 198 44" style="enable-background:new 0 0 198 44;" xml:space="preserve">
|
viewBox="88 -11 242 44" style="enable-background:new 88 -11 242 44;" xml:space="preserve">
|
||||||
<defs>
|
|
||||||
<path id="imgtools" class="_st0" d="M46,5v2h18V5H46z M46,12h18v-2H46V12z M46,17h18v-2H46V17z"/>
|
|
||||||
<path id="imgplus" d="M166,3h-2v7h-7v2h7v7h2v-7h7v-2h-7V3z"/>
|
|
||||||
<rect id="imgminus" x="179" y="10" width="16" height="2"/>
|
|
||||||
</defs>
|
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
.st0{fill:#010202;}
|
.st0{fill:#fff;}
|
||||||
.st1{fill:#1E1E1C;}
|
.st2{fill-rule:evenodd;clip-rule:evenodd;}
|
||||||
</style>
|
</style>
|
||||||
<g id="XMLID_7_">
|
<g id="XMLID_7_">
|
||||||
<path id="XMLID_9_" class="st1" d="M84,17H70c-0.6,0-1,0.4-1,1s0.4,1,1,1h14c0.6,0,1-0.4,1-1S84.6,17,84,17z"/>
|
<path id="XMLID_9_" d="M128,6h-14c-0.6,0-1,0.4-1,1s0.4,1,1,1h14c0.6,0,1-0.4,1-1S128.6,6,128,6z"/>
|
||||||
<path id="XMLID_8_" class="st1" d="M76.1,14.6c0.1,0.1,0.2,0.2,0.4,0.2c0.1,0.1,0.3,0.1,0.5,0.1s0.3-0.1,0.5-0.1
|
<path id="XMLID_8_" d="M120.1,3.6c0.1,0.1,0.2,0.2,0.4,0.2c0.1,0.1,0.3,0.1,0.5,0.1s0.3-0.1,0.5-0.1
|
||||||
c0.1,0,0.3-0.1,0.4-0.2l3.5-3.5c0.4-0.4,0.4-1,0-1.4s-1-0.4-1.4,0l-2,2V4c0-0.6-0.4-1-1-1s-1,0.4-1,1v7.7l-2-2
|
c0.1,0,0.3-0.1,0.4-0.2l3.5-3.5c0.4-0.4,0.4-1,0-1.4s-1-0.4-1.4,0l-2,2V-7c0-0.6-0.4-1-1-1s-1,0.4-1,1v7.7l-2-2
|
||||||
c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4L76.1,14.6z"/>
|
c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4L120.1,3.6z"/>
|
||||||
</g>
|
</g>
|
||||||
<path id="XMLID_14_" d="M103.3,14c-0.8,0-1.5,0.3-2.1,0.8l-4.7-2.7c0.1-0.3,0.2-0.7,0.2-1.1s-0.1-0.8-0.2-1.1l4.7-2.7
|
<path id="XMLID_14_" d="M147.3,3c-0.8,0-1.5,0.3-2.1,0.8l-4.7-2.7c0.1-0.3,0.2-0.7,0.2-1.1s-0.1-0.8-0.2-1.1l4.7-2.7
|
||||||
c0.6,0.5,1.3,0.8,2.1,0.8c1.7,0,3.1-1.4,3.1-3.1s-1.4-3.1-3.1-3.1c-1.7,0-3.1,1.4-3.1,3.1c0,0.3,0,0.5,0.1,0.8l-4.9,2.8
|
c0.6,0.5,1.3,0.8,2.1,0.8c1.7,0,3.1-1.4,3.1-3.1s-1.4-3.1-3.1-3.1s-3.1,1.4-3.1,3.1c0,0.3,0,0.5,0.1,0.8l-4.9,2.8
|
||||||
c-0.5-0.4-1.1-0.6-1.8-0.6c-1.7,0-3.1,1.4-3.1,3.1s1.4,3.1,3.1,3.1c0.7,0,1.3-0.2,1.8-0.6l4.8,2.8c-0.1,0.3-0.1,0.5-0.1,0.8
|
c-0.5-0.4-1.1-0.6-1.8-0.6c-1.7,0-3.1,1.4-3.1,3.1s1.4,3.1,3.1,3.1c0.7,0,1.3-0.2,1.8-0.6l4.8,2.8c-0.1,0.3-0.1,0.5-0.1,0.8
|
||||||
c0,1.7,1.4,3.1,3.1,3.1s3.1-1.4,3.1-3.1C106.4,15.4,105,14,103.3,14z"/>
|
c0,1.7,1.4,3.1,3.1,3.1c1.7,0,3.1-1.4,3.1-3.1C150.4,4.4,149,3,147.3,3z"/>
|
||||||
<g>
|
<g>
|
||||||
<path d="M112.6,10c0.5-0.5,1.2-0.5,1.7,0l5,5c0.5,0.5,0.5,1.2,0,1.7s-1.2,0.5-1.7,0l-5-5C112.1,11.2,112.1,10.5,112.6,10z"/>
|
<path d="M159.3,0l4-4c0.5-0.5,0.5-1.2,0-1.7s-1.2-0.5-1.7,0l-4.4,4.4c-0.2,0-0.4,0.1-0.6,0.3c-0.3,0.3-0.4,0.7-0.3,1
|
||||||
<path d="M112.6,12c0.5,0.5,1.2,0.5,1.7,0l5-5c0.5-0.5,0.5-1.2,0-1.7s-1.2-0.5-1.7,0l-5,5C112.1,10.8,112.1,11.5,112.6,12z"/>
|
c0,0.3,0.1,0.7,0.3,1c0.2,0.2,0.4,0.3,0.6,0.3l4.4,4.4c0.5,0.5,1.2,0.5,1.7,0s0.5-1.2,0-1.7L159.3,0z"/>
|
||||||
<path id="XMLID_13_" d="M129.4,12c-0.5,0.5-1.2,0.5-1.7,0l-5-5c-0.5-0.5-0.5-1.2,0-1.7s1.2-0.5,1.7,0l5,5
|
<path d="M173.4-1c-0.2-0.2-0.4-0.3-0.6-0.3l-4.4-4.4c-0.5-0.5-1.2-0.5-1.7,0s-0.5,1.2,0,1.7l4,4l-4,4c-0.5,0.5-0.5,1.2,0,1.7
|
||||||
C129.9,10.8,129.9,11.5,129.4,12z"/>
|
s1.2,0.5,1.7,0l4.4-4.4c0.2,0,0.4-0.1,0.6-0.3c0.3-0.3,0.4-0.7,0.3-1C173.8-0.3,173.7-0.7,173.4-1z"/>
|
||||||
<path d="M129.4,10c-0.5-0.5-1.2-0.5-1.7,0l-5,5c-0.5,0.5-0.5,1.2,0,1.7s1.2,0.5,1.7,0l5-5C129.9,11.2,129.9,10.5,129.4,10z"/>
|
|
||||||
<g id="XMLID_4_">
|
<g id="XMLID_4_">
|
||||||
<path id="XMLID_21_" d="M150.9,3.7c0-0.1-0.1-0.2-0.2-0.3c-0.1-0.1-0.2-0.2-0.3-0.2C150.2,3,150.1,3,150,3h-4.2
|
<path id="XMLID_21_" d="M194.9-7.3c0-0.1-0.1-0.2-0.2-0.3c-0.1-0.1-0.2-0.2-0.3-0.2C194.2-8,194.1-8,194-8h-4.2
|
||||||
c-0.5,0-0.8,0.4-0.8,0.8c0,0.5,1,1.2,1,1.2l0.8,0.8l-2.6,2.6c-0.4,0.4-0.4,1,0,1.4c0.4,0.4,1,0.4,1.4,0l2.6-2.6l1.3,1.4
|
c-0.5,0-0.8,0.4-0.8,0.8c0,0.5,1,1.2,1,1.2l0.8,0.8l-2.6,2.6c-0.4,0.4-0.4,1,0,1.4s1,0.4,1.4,0l2.6-2.6l1.3,1.4
|
||||||
c0.1,0.2,0.4,0.4,0.7,0.4c0.5,0,0.8-0.4,0.8-0.8V4C151,3.9,151,3.8,150.9,3.7z"/>
|
c0.1,0.2,0.4,0.4,0.7,0.4c0.5,0,0.8-0.4,0.8-0.8V-7C195-7.1,195-7.2,194.9-7.3z"/>
|
||||||
<path id="XMLID_22_" d="M140.4,12.2l-2.6,2.6l-1.3-1.4c-0.1-0.2-0.4-0.4-0.7-0.4c-0.5,0-0.8,0.4-0.8,0.8V18c0,0.1,0,0.3,0.1,0.4
|
<path id="XMLID_22_" d="M184.4,1.2l-2.6,2.6l-1.3-1.4c-0.1-0.2-0.4-0.4-0.7-0.4c-0.5,0-0.8,0.4-0.8,0.8V7c0,0.1,0,0.3,0.1,0.4
|
||||||
c0,0.1,0.1,0.2,0.2,0.3c0.1,0.1,0.2,0.2,0.3,0.2c0.2,0.1,0.3,0.1,0.4,0.1h4.2c0.5,0,0.8-0.4,0.8-0.8s-1-1.2-1-1.2l-0.8-0.8
|
c0,0.1,0.1,0.2,0.2,0.3c0.1,0.1,0.2,0.2,0.3,0.2C179.8,8,179.9,8,180,8h4.2c0.5,0,0.8-0.4,0.8-0.8S184,6,184,6l-0.8-0.8l2.6-2.6
|
||||||
l2.6-2.6c0.4-0.4,0.4-1,0-1.4C141.4,11.8,140.8,11.8,140.4,12.2z"/>
|
c0.4-0.4,0.4-1,0-1.4C185.4,0.8,184.8,0.8,184.4,1.2z"/>
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<path id="imgtools" d="M90-6v2h18v-2H90z M90,1h18v-2H90V1z M90,6h18V4H90V6z"/>
|
||||||
<path d="M237.9,11L224,3v16L237.9,11z"/>
|
<path id="imgplus" d="M210-8h-2v7h-7v2h7v7h2V1h7v-2h-7V-8z"/>
|
||||||
|
<rect id="imgminus" x="223" y="-1" width="16" height="2"/>
|
||||||
|
<path id="play" d="M305,0l-16-7V6.9L305,0z"/>
|
||||||
|
<polygon id="rmove" class="st2" points="279.9,-0.2 272.1,-8 270,-5.9 275.8,-0.1 270,5.8 272.1,7.9 279.9,0.1 280,-0.1"/>
|
||||||
|
<polygon id="lmove" class="st2" points="258,-5.8 255.9,-7.9 248.1,-0.1 248,0.1 248.1,0.2 255.9,8 258,5.9 252.2,0.1 "/>
|
||||||
|
<g id="pause">
|
||||||
|
<rect x="313" y="-7" width="4" height="14"/>
|
||||||
|
<rect x="321" y="-7" width="4" height="14"/>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<use xlink:href="#imgtools" class="st0" y="22"></use>
|
||||||
<path d="M216,19V3l-13.9,8L216,19z"/>
|
<use xlink:href="#imgplus" class="st0" y="22"></use>
|
||||||
</g>
|
<use xlink:href="#imgminus" class="st0" y="22"></use>
|
||||||
<use xlink:href="#imgtools" fill="#010202"></use>
|
<use xlink:href="#play" class="st0" y="22" x="2"></use>
|
||||||
<use xlink:href="#imgtools" fill="#fff" y="22"></use>
|
<use xlink:href="#pause" class="st0" y="22"></use>
|
||||||
<use xlink:href="#imgplus"></use>
|
<use xlink:href="#rmove" class="st0" x="1" y="22"></use>
|
||||||
<use xlink:href="#imgplus" fill="#fff" y="22"></use>
|
<use xlink:href="#lmove" class="st0" x="-1" y="22"></use>
|
||||||
<use xlink:href="#imgminus"></use>
|
|
||||||
<use xlink:href="#imgminus" fill="#fff" y="22"></use>
|
|
||||||
</svg>
|
</svg>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 3 KiB After Width: | Height: | Size: 3.3 KiB |
|
|
@ -548,7 +548,7 @@
|
||||||
|
|
||||||
.svg-icon {
|
.svg-icon {
|
||||||
background: data-uri('../../../../common/embed/resources/img/icon-menu-sprite.svg') no-repeat;
|
background: data-uri('../../../../common/embed/resources/img/icon-menu-sprite.svg') no-repeat;
|
||||||
background-size: 22px*9 22px*2;
|
background-size: 22px*11 22px*2;
|
||||||
|
|
||||||
&.download {
|
&.download {
|
||||||
background-position: -22px 0;
|
background-position: -22px 0;
|
||||||
|
|
@ -568,6 +568,20 @@
|
||||||
&.zoom-down {
|
&.zoom-down {
|
||||||
background-position: -22px*6 -22px;
|
background-position: -22px*6 -22px;
|
||||||
}
|
}
|
||||||
|
&.slide-prev {
|
||||||
|
background-position: -22px*7 -22px;
|
||||||
|
}
|
||||||
|
&.slide-next {
|
||||||
|
background-position: -22px*8 -22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.play {
|
||||||
|
background-position: -22px*9 -22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.pause {
|
||||||
|
background-position: -22px*10 -22px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mi-icon {
|
.mi-icon {
|
||||||
|
|
|
||||||
|
|
@ -192,11 +192,6 @@
|
||||||
<script src="../../../vendor/less/dist/less-1.5.1.js" type="text/javascript"></script>
|
<script src="../../../vendor/less/dist/less-1.5.1.js" type="text/javascript"></script>
|
||||||
<!-- debug end -->
|
<!-- debug end -->
|
||||||
|
|
||||||
<!--facebook button-->
|
|
||||||
<div id="fb-root"></div>
|
|
||||||
|
|
||||||
<!--twitter button-->
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
var userAgent = navigator.userAgent.toLowerCase(),
|
var userAgent = navigator.userAgent.toLowerCase(),
|
||||||
check = function(regex){ return regex.test(userAgent); };
|
check = function(regex){ return regex.test(userAgent); };
|
||||||
|
|
@ -268,29 +263,33 @@
|
||||||
'</div>');
|
'</div>');
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="editor_sdk" class="viewer" style="overflow: hidden;"></div>
|
<div id="box-preview">
|
||||||
|
<div id="id-preview" tabindex="-1"></div>
|
||||||
|
</div>
|
||||||
|
<div id="editor_sdk" class="viewer" style="overflow: hidden;" tabindex="-1"></div>
|
||||||
|
|
||||||
<div class="overlay-controls" style="margin-left: -32px">
|
<div class="overlay-controls" style="margin-left: -32px">
|
||||||
<ul class="left">
|
<ul class="left">
|
||||||
<li id="id-btn-move-left"><button class="overlay"><i class="overlay-icon-move-left"></i></button></li>
|
<li id="btn-left"><button class="overlay svg-icon slide-prev"></button></li>
|
||||||
<li id="id-btn-move-right"><button class="overlay"><i class="overlay-icon-move-right"></i></button></li>
|
<li id="btn-play"><button class="overlay svg-icon play"></button></li>
|
||||||
|
<li id="btn-right"><button class="overlay svg-icon slide-next"></button></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="toolbar" id="toolbar">
|
<div class="toolbar" id="toolbar">
|
||||||
<ul class="left">
|
<div class="group left">
|
||||||
<li><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></li>
|
<div id="box-tools" class="dropdown">
|
||||||
<li class="separator"></li>
|
<button class="control-btn svg-icon tools"></button>
|
||||||
<li id="id-btn-copy"><button class="control-btn"><i class="control-icon-save"></i><span>Save Copy</span></button></li>
|
</div>
|
||||||
<li id="id-btn-share"><button class="control-btn"><i class="control-icon-share"></i><span>Share</span></button></li>
|
</div>
|
||||||
<li id="id-btn-embed"><button class="control-btn"><i class="control-icon-embed"></i><span>Embed</span></button></li>
|
<div class="group center">
|
||||||
</ul>
|
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
|
||||||
<ul class="right">
|
</div>
|
||||||
<li><input id="page-number" class="form-control input-sm" style="width: 25px;" type="text" value="0"><span class="text" id="pages">of 0</span></li>
|
<div class="group right">
|
||||||
<li class="separator"></li>
|
<div class="item"><input id="page-number" class="form-control input-xs masked" type="text" value="0"><span class="text" id="pages" tabindex="-1">of 0</span></div>
|
||||||
<li><button id="id-btn-fullscreen" class="control-btn no-caption"><i class="control-icon-fullscreen"></i></button></li>
|
<div class="item separator"></div>
|
||||||
<li><button id="id-btn-close" class="control-btn no-caption"><i class="control-icon-close"></i></button></li>
|
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">×</span></button></div>
|
||||||
</ul>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="error modal fade" id="id-critical-error-dialog" tabindex="-1" role="dialog">
|
<div class="error modal fade" id="id-critical-error-dialog" tabindex="-1" role="dialog">
|
||||||
|
|
@ -314,11 +313,12 @@
|
||||||
<div class="cmd-loader-title">Please wait...</div>
|
<div class="cmd-loader-title">Please wait...</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="hyperlink-tooltip" data-toggle="tooltip" title="Press Ctrl and click the link" style="display:none;"></div>
|
||||||
|
|
||||||
<!--vendor-->
|
<!--vendor-->
|
||||||
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
|
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
|
||||||
<script type="text/javascript" src="../../../vendor/jquery.browser/dist/jquery.browser.min.js"></script>
|
<script type="text/javascript" src="../../../vendor/jquery.browser/dist/jquery.browser.min.js"></script>
|
||||||
<script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.js"></script>
|
<script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.js"></script>
|
||||||
<script type="text/javascript" src="../../../vendor/ZeroClipboard/ZeroClipboard.min.js"></script>
|
|
||||||
<script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script>
|
<script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script>
|
||||||
<script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script>
|
<script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script>
|
||||||
<script type="text/javascript" src="../../../vendor/jszip/jszip.min.js"></script>
|
<script type="text/javascript" src="../../../vendor/jszip/jszip.min.js"></script>
|
||||||
|
|
@ -335,6 +335,9 @@
|
||||||
<!--application-->
|
<!--application-->
|
||||||
<script type="text/javascript" src="../../common/Gateway.js"></script>
|
<script type="text/javascript" src="../../common/Gateway.js"></script>
|
||||||
<script type="text/javascript" src="../../common/Analytics.js"></script>
|
<script type="text/javascript" src="../../common/Analytics.js"></script>
|
||||||
|
<script type="text/javascript" src="../../common/embed/lib/util/utils.js"></script>
|
||||||
|
<script type="text/javascript" src="../../common/embed/lib/view/modals.js"></script>
|
||||||
|
<script type="text/javascript" src="../../common/embed/lib/controller/modals.js"></script>
|
||||||
<script type="text/javascript" src="js/ApplicationView.js"></script>
|
<script type="text/javascript" src="js/ApplicationView.js"></script>
|
||||||
<script type="text/javascript" src="js/ApplicationController.js"></script>
|
<script type="text/javascript" src="js/ApplicationController.js"></script>
|
||||||
<script type="text/javascript" src="js/application.js"></script>
|
<script type="text/javascript" src="js/application.js"></script>
|
||||||
|
|
|
||||||
|
|
@ -38,14 +38,9 @@ var ApplicationController = new(function(){
|
||||||
embedConfig = {},
|
embedConfig = {},
|
||||||
permissions = {},
|
permissions = {},
|
||||||
maxPages = 0,
|
maxPages = 0,
|
||||||
minToolbarWidth = 550,
|
|
||||||
minEmbedWidth = 400,
|
|
||||||
minEmbedHeight = 600,
|
|
||||||
embedCode = '<iframe allowtransparency="true" frameborder="0" scrolling="no" src="{embed-url}" width="{width}" height="{height}"></iframe>',
|
|
||||||
maxZIndex = 9090,
|
|
||||||
created = false,
|
created = false,
|
||||||
currentPage = 0,
|
currentPage = 0,
|
||||||
iframePrint = null;
|
ttOffset = [0, -10];
|
||||||
|
|
||||||
// Initialize analytics
|
// Initialize analytics
|
||||||
// -------------------------
|
// -------------------------
|
||||||
|
|
@ -61,52 +56,6 @@ var ApplicationController = new(function(){
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Initialize ZeroClipboard
|
|
||||||
// -------------------------
|
|
||||||
|
|
||||||
ZeroClipboard.setMoviePath('../../../vendor/ZeroClipboard/ZeroClipboard10.swf');
|
|
||||||
var clipShortUrl = new ZeroClipboard.Client();
|
|
||||||
var clipEmbedObj = new ZeroClipboard.Client();
|
|
||||||
clipShortUrl.zIndex = maxZIndex;
|
|
||||||
clipEmbedObj.zIndex = maxZIndex;
|
|
||||||
|
|
||||||
|
|
||||||
// Utils
|
|
||||||
// -------------------------
|
|
||||||
|
|
||||||
function emptyFn(){}
|
|
||||||
|
|
||||||
function createBuffered(fn, buffer, scope, args) {
|
|
||||||
return function(){
|
|
||||||
var timerId;
|
|
||||||
return function() {
|
|
||||||
var me = this;
|
|
||||||
if (timerId) {
|
|
||||||
clearTimeout(timerId);
|
|
||||||
timerId = null;
|
|
||||||
}
|
|
||||||
timerId = setTimeout(function(){
|
|
||||||
fn.apply(scope || me, args || arguments);
|
|
||||||
}, buffer);
|
|
||||||
};
|
|
||||||
}();
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateSocial() {
|
|
||||||
var $socialPanel = $('#id-popover-social-container');
|
|
||||||
|
|
||||||
if ($socialPanel.length > 0) {
|
|
||||||
if ($socialPanel.attr('data-loaded') == 'false') {
|
|
||||||
typeof FB !== 'undefined' && FB.XFBML && FB.XFBML.parse();
|
|
||||||
typeof twttr !== 'undefined' && twttr.widgets && twttr.widgets.load();
|
|
||||||
|
|
||||||
$socialPanel.attr('data-loaded', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Handlers
|
// Handlers
|
||||||
// -------------------------
|
// -------------------------
|
||||||
|
|
||||||
|
|
@ -114,37 +63,7 @@ var ApplicationController = new(function(){
|
||||||
config = $.extend(config, data.config);
|
config = $.extend(config, data.config);
|
||||||
embedConfig = $.extend(embedConfig, data.config.embedded);
|
embedConfig = $.extend(embedConfig, data.config.embedded);
|
||||||
|
|
||||||
$('#id-short-url').val(embedConfig.shareUrl || 'Unavailable');
|
common.controller.modals.init(embedConfig);
|
||||||
$('#id-textarea-embed').text(embedCode.replace('{embed-url}', embedConfig.embedUrl).replace('{width}', minEmbedWidth).replace('{height}', minEmbedHeight));
|
|
||||||
|
|
||||||
if (typeof embedConfig.shareUrl !== 'undefined' && embedConfig.shareUrl != ''){
|
|
||||||
(function(d, s, id) {
|
|
||||||
var js, fjs = d.getElementsByTagName(s)[0];
|
|
||||||
if (d.getElementById(id)) return;
|
|
||||||
js = d.createElement(s); js.id = id;
|
|
||||||
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
|
|
||||||
fjs.parentNode.insertBefore(js, fjs);
|
|
||||||
}(document, 'script', 'facebook-jssdk'));
|
|
||||||
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
|
|
||||||
|
|
||||||
if ($('#id-popover-social-container ul')){
|
|
||||||
$('#id-popover-social-container ul').append('<li><div class="fb-like" data-href="' + embedConfig.shareUrl + '" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div></li>');
|
|
||||||
$('#id-popover-social-container ul').append('<li class="share-twitter"><a href="https://twitter.com/share" class="twitter-share-button" data-url="' + embedConfig.shareUrl + '">Tweet</a></li>'); //data-count="none"
|
|
||||||
$('#id-popover-social-container ul').append('<li class="share-mail"><a class="btn btn-xs btn-default" href="mailto:?subject=I have shared a document with you: ' + embedConfig.docTitle + '&body=I have shared a document with you: ' + embedConfig.shareUrl + '"><span class="glyphicon glyphicon-envelope"></span>Email</a></li>');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (typeof embedConfig.shareUrl === 'undefined')
|
|
||||||
$('#id-btn-share').hide();
|
|
||||||
|
|
||||||
if (typeof embedConfig.embedUrl === 'undefined')
|
|
||||||
$('#id-btn-embed').hide();
|
|
||||||
|
|
||||||
if (typeof embedConfig.fullscreenUrl === 'undefined')
|
|
||||||
$('#id-btn-fullscreen').hide();
|
|
||||||
|
|
||||||
if (config.canBackToFolder === false || !(config.customization && config.customization.goback && config.customization.goback.url))
|
|
||||||
$('#id-btn-close').hide();
|
|
||||||
|
|
||||||
|
|
||||||
// Docked toolbar
|
// Docked toolbar
|
||||||
if (embedConfig.toolbarDocked === 'top') {
|
if (embedConfig.toolbarDocked === 'top') {
|
||||||
|
|
@ -153,10 +72,14 @@ var ApplicationController = new(function(){
|
||||||
} else {
|
} else {
|
||||||
$('#toolbar').addClass('bottom');
|
$('#toolbar').addClass('bottom');
|
||||||
$('#editor_sdk').addClass('bottom');
|
$('#editor_sdk').addClass('bottom');
|
||||||
|
$('#box-tools').removeClass('dropdown').addClass('dropup');
|
||||||
|
ttOffset[1] = -40;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (config.canBackToFolder === false || !(config.customization && config.customization.goback && config.customization.goback.url)) {
|
||||||
|
$('#id-btn-close').hide();
|
||||||
|
|
||||||
// Hide last separator
|
// Hide last separator
|
||||||
if (!$('#id-btn-fullscreen').is(":visible") && !$('#id-btn-close').is(":visible")) {
|
|
||||||
$('#toolbar .right .separator').hide();
|
$('#toolbar .right .separator').hide();
|
||||||
$('#pages').css('margin-right', '12px');
|
$('#pages').css('margin-right', '12px');
|
||||||
}
|
}
|
||||||
|
|
@ -184,11 +107,8 @@ var ApplicationController = new(function(){
|
||||||
Common.Analytics.trackEvent('Load', 'Start');
|
Common.Analytics.trackEvent('Load', 'Start');
|
||||||
}
|
}
|
||||||
|
|
||||||
if (typeof embedConfig.saveUrl === 'undefined' && permissions.print === false)
|
if (!embedConfig.saveUrl && permissions.print === false)
|
||||||
$('#id-btn-copy').hide();
|
$('#idt-copy').hide();
|
||||||
|
|
||||||
if (!$('#id-btn-copy').is(":visible") && !$('#id-btn-share').is(":visible") && !$('#id-btn-embed').is(":visible") )
|
|
||||||
$('#toolbar .left .separator').hide();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -202,14 +122,6 @@ var ApplicationController = new(function(){
|
||||||
currentPage = number;
|
currentPage = number;
|
||||||
}
|
}
|
||||||
|
|
||||||
function onHyperlinkClick(url) {
|
|
||||||
if (url) {
|
|
||||||
var newDocumentPage = window.open(url, '_blank');
|
|
||||||
if (newDocumentPage)
|
|
||||||
newDocumentPage.focus();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function onLongActionBegin(type, id) {
|
function onLongActionBegin(type, id) {
|
||||||
var text = '';
|
var text = '';
|
||||||
switch (id)
|
switch (id)
|
||||||
|
|
@ -236,12 +148,12 @@ var ApplicationController = new(function(){
|
||||||
me.isHideBodyTip = true;
|
me.isHideBodyTip = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var $ttEl, $tooltip;
|
||||||
function onDocMouseMoveEnd() {
|
function onDocMouseMoveEnd() {
|
||||||
if (me.isHideBodyTip) {
|
if (me.isHideBodyTip) {
|
||||||
var $tipHyperlink = $('#id-tip-hyperlink');
|
if ( $tooltip ) {
|
||||||
|
$tooltip.tooltip('hide');
|
||||||
if ($tipHyperlink.length > 0) {
|
$tooltip = false;
|
||||||
$tipHyperlink.hide();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -251,19 +163,30 @@ var ApplicationController = new(function(){
|
||||||
if (data.get_Type() == 1) { // hyperlink
|
if (data.get_Type() == 1) { // hyperlink
|
||||||
me.isHideBodyTip = false;
|
me.isHideBodyTip = false;
|
||||||
|
|
||||||
var $tipHyperlink = $('#id-tip-hyperlink'),
|
if ( !$ttEl ) {
|
||||||
hyperProps = data.get_Hyperlink(),
|
$ttEl = $('.hyperlink-tooltip');
|
||||||
toolTip = (hyperProps.get_ToolTip()) ? hyperProps.get_ToolTip() : hyperProps.get_Value();
|
$ttEl.tooltip({'container':'body', 'trigger':'manual'});
|
||||||
|
$ttEl.on('shown.bs.tooltip', function(e) {
|
||||||
|
$tooltip = $ttEl.data('bs.tooltip').tip();
|
||||||
|
|
||||||
if ($tipHyperlink.length > 0) {
|
$tooltip.css({
|
||||||
$tipHyperlink.find('.popover-content p').html(htmlEncode(toolTip) + '<br><b>Press Ctrl and click link</b>');
|
left: $ttEl.ttpos[0] + ttOffset[0],
|
||||||
$tipHyperlink.show();
|
top: $ttEl.ttpos[1] + ttOffset[1]
|
||||||
|
});
|
||||||
|
|
||||||
|
$tooltip.find('.tooltip-arrow').css({left: 10});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$tipHyperlink.css({
|
if ( !$tooltip ) {
|
||||||
left: data.get_X() - 10,
|
$ttEl.ttpos = [data.get_X(), data.get_Y()];
|
||||||
top : data.get_Y() - 25
|
$ttEl.tooltip('show');
|
||||||
})
|
} else {
|
||||||
|
$tooltip.css({
|
||||||
|
left:data.get_X() + ttOffset[0],
|
||||||
|
top:data.get_Y() + ttOffset[1]
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -273,32 +196,12 @@ var ApplicationController = new(function(){
|
||||||
}
|
}
|
||||||
|
|
||||||
function onPrint() {
|
function onPrint() {
|
||||||
if (api && permissions.print!==false)
|
if (permissions.print!==false)
|
||||||
api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
|
api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
|
||||||
}
|
}
|
||||||
|
|
||||||
function onPrintUrl(url) {
|
function onPrintUrl(url) {
|
||||||
if (iframePrint) {
|
common.utils.dialogPrint(url);
|
||||||
iframePrint.parentNode.removeChild(iframePrint);
|
|
||||||
iframePrint = null;
|
|
||||||
}
|
|
||||||
if (!iframePrint) {
|
|
||||||
iframePrint = document.createElement("iframe");
|
|
||||||
iframePrint.id = "id-print-frame";
|
|
||||||
iframePrint.style.display = 'none';
|
|
||||||
iframePrint.style.visibility = "hidden";
|
|
||||||
iframePrint.style.position = "fixed";
|
|
||||||
iframePrint.style.right = "0";
|
|
||||||
iframePrint.style.bottom = "0";
|
|
||||||
document.body.appendChild(iframePrint);
|
|
||||||
iframePrint.onload = function() {
|
|
||||||
iframePrint.contentWindow.focus();
|
|
||||||
iframePrint.contentWindow.print();
|
|
||||||
iframePrint.contentWindow.blur();
|
|
||||||
window.focus();
|
|
||||||
};
|
|
||||||
}
|
|
||||||
if (url) iframePrint.src = url;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function hidePreloader() {
|
function hidePreloader() {
|
||||||
|
|
@ -306,19 +209,170 @@ var ApplicationController = new(function(){
|
||||||
}
|
}
|
||||||
|
|
||||||
function onDocumentContentReady() {
|
function onDocumentContentReady() {
|
||||||
setVisiblePopover($('#id-popover-share'), false);
|
|
||||||
setVisiblePopover($('#id-popover-embed'), false);
|
|
||||||
$('#id-tip-hyperlink').hide();
|
|
||||||
|
|
||||||
handlerToolbarSize();
|
|
||||||
|
|
||||||
if (api) {
|
|
||||||
api.ShowThumbnails(false);
|
api.ShowThumbnails(false);
|
||||||
api.asc_DeleteVerticalScroll();
|
api.asc_DeleteVerticalScroll();
|
||||||
}
|
|
||||||
|
|
||||||
hidePreloader();
|
hidePreloader();
|
||||||
|
|
||||||
|
if ( !embedConfig.shareUrl )
|
||||||
|
$('#idt-share').hide();
|
||||||
|
|
||||||
|
if ( !embedConfig.embedUrl )
|
||||||
|
$('#idt-embed').hide();
|
||||||
|
|
||||||
|
if ( !embedConfig.fullscreenUrl )
|
||||||
|
$('#idt-fullscr').hide();
|
||||||
|
|
||||||
|
common.controller.modals.attach({
|
||||||
|
share: '#idt-share',
|
||||||
|
embed: '#idt-embed'
|
||||||
|
});
|
||||||
|
|
||||||
|
api.asc_registerCallback('asc_onMouseMoveStart', onDocMouseMoveStart);
|
||||||
|
api.asc_registerCallback('asc_onMouseMoveEnd', onDocMouseMoveEnd);
|
||||||
|
api.asc_registerCallback('asc_onMouseMove', onDocMouseMove);
|
||||||
|
|
||||||
|
api.asc_registerCallback('asc_onDownloadUrl', onDownloadUrl);
|
||||||
|
api.asc_registerCallback('asc_onPrint', onPrint);
|
||||||
|
api.asc_registerCallback('asc_onPrintUrl', onPrintUrl);
|
||||||
|
api.asc_registerCallback('asc_onHyperlinkClick', common.utils.openLink);
|
||||||
|
api.asc_registerCallback('asc_onStartAction', onLongActionBegin);
|
||||||
|
api.asc_registerCallback('asc_onEndAction', onLongActionEnd);
|
||||||
|
|
||||||
|
api.asc_registerCallback('asc_onEndDemonstration', onPlayStop);
|
||||||
|
api.asc_registerCallback('asc_onDemonstrationSlideChanged', onPlaySlideChanged);
|
||||||
|
|
||||||
|
Common.Gateway.on('processmouse', onProcessMouse);
|
||||||
|
Common.Gateway.on('downloadas', onDownloadAs);
|
||||||
|
|
||||||
|
ApplicationView.tools.get('#idt-fullscreen')
|
||||||
|
.on('click', function(){
|
||||||
|
common.utils.openLink(embedConfig.fullscreenUrl);
|
||||||
|
});
|
||||||
|
|
||||||
|
ApplicationView.tools.get('#idt-download')
|
||||||
|
.on('click', function(){
|
||||||
|
if ( !!embedConfig.saveUrl ){
|
||||||
|
common.utils.openLink(embedConfig.saveUrl);
|
||||||
|
} else
|
||||||
|
if (api && permissions.print!==false){
|
||||||
|
api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
|
||||||
|
}
|
||||||
|
|
||||||
|
Common.Analytics.trackEvent('Save');
|
||||||
|
});
|
||||||
|
|
||||||
|
var $pagenum = $('#page-number');
|
||||||
|
$pagenum.on({
|
||||||
|
'keyup': function(e){
|
||||||
|
if ( e.keyCode == 13 ){
|
||||||
|
var newPage = parseInt($('#page-number').val());
|
||||||
|
|
||||||
|
if ( newPage > maxPages ) newPage = maxPages; else
|
||||||
|
if ( newPage < 2 || isNaN(newPage) ) newPage = 1;
|
||||||
|
|
||||||
|
if ( isplaymode )
|
||||||
|
api.DemonstrationGoToSlide(newPage-1); else
|
||||||
|
api.goToPage(newPage-1);
|
||||||
|
|
||||||
|
$pagenum.blur();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
, 'focusin' : function(e) {
|
||||||
|
$pagenum.removeClass('masked');
|
||||||
|
}
|
||||||
|
, 'focusout': function(e){
|
||||||
|
!$pagenum.hasClass('masked') && $pagenum.addClass('masked');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#pages').on('click', function(e) {
|
||||||
|
$pagenum.focus();
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#id-btn-close').on('click', function(){
|
||||||
|
if (config.customization && config.customization.goback && config.customization.goback.url)
|
||||||
|
window.parent.location.href = config.customization.goback.url;
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#btn-left').on('click', function(){
|
||||||
|
if ( isplaymode ) {
|
||||||
|
api.DemonstrationPrevSlide();
|
||||||
|
} else
|
||||||
|
if (currentPage > 0) {
|
||||||
|
api.goToPage(currentPage - 1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#btn-right').on('click', function(){
|
||||||
|
if ( isplaymode ) {
|
||||||
|
api.DemonstrationNextSlide();
|
||||||
|
} else
|
||||||
|
if (currentPage < maxPages - 1) {
|
||||||
|
api.goToPage(currentPage + 1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var documentMoveTimer;
|
||||||
|
var ismoved = false;
|
||||||
|
$(document).on({
|
||||||
|
'click': function(e) {
|
||||||
|
clearTimeout(documentMoveTimer);
|
||||||
|
documentMoveTimer = undefined;
|
||||||
|
},
|
||||||
|
'mousemove': function (e) {
|
||||||
|
$('#btn-left').fadeIn();
|
||||||
|
$('#btn-right').fadeIn();
|
||||||
|
|
||||||
|
ismoved = true;
|
||||||
|
if ( !documentMoveTimer ) {
|
||||||
|
documentMoveTimer = setInterval(function(){
|
||||||
|
if ( !ismoved ) {
|
||||||
|
// $('#btn-left').fadeOut();
|
||||||
|
// $('#btn-right').fadeOut();
|
||||||
|
clearInterval(documentMoveTimer);
|
||||||
|
documentMoveTimer = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
ismoved = false;
|
||||||
|
}, 2000);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var ismodalshown = false;
|
||||||
|
$(document.body).on('show.bs.modal', '.modal',
|
||||||
|
function(e) {
|
||||||
|
ismodalshown = true;
|
||||||
|
api.asc_enableKeyEvents(false);
|
||||||
|
}
|
||||||
|
).on('hidden.bs.modal', '.modal',
|
||||||
|
function(e) {
|
||||||
|
ismodalshown = false;
|
||||||
|
api.asc_enableKeyEvents(true);
|
||||||
|
}
|
||||||
|
).on('hidden.bs.dropdown', '.dropdown',
|
||||||
|
function(e) {
|
||||||
|
if ( !ismodalshown )
|
||||||
|
api.asc_enableKeyEvents(true);
|
||||||
|
}
|
||||||
|
).on('blur', 'input, textarea',
|
||||||
|
function(e) {
|
||||||
|
if ( !ismodalshown ) {
|
||||||
|
if (!/area_id/.test(e.target.id) ) {
|
||||||
|
api.asc_enableKeyEvents(true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
$('#editor_sdk').on('click', function(e) {
|
||||||
|
if ( e.target.localName == 'canvas' ) {
|
||||||
|
e.currentTarget.focus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#btn-play').on('click', onPlayStart);
|
||||||
Common.Analytics.trackEvent('Load', 'Complete');
|
Common.Analytics.trackEvent('Load', 'Complete');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -342,6 +396,40 @@ var ApplicationController = new(function(){
|
||||||
api.zoomFitToPage();
|
api.zoomFitToPage();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onOpenDocument(progress) {
|
||||||
|
var proc = (progress.asc_getCurrentFont() + progress.asc_getCurrentImage())/(progress.asc_getFontsCount() + progress.asc_getImagesCount());
|
||||||
|
$('#loadmask-text').html('Loading document: ' + Math.min(Math.round(proc * 100), 100) + '%');
|
||||||
|
}
|
||||||
|
|
||||||
|
var isplaymode;
|
||||||
|
function onPlayStart(e) {
|
||||||
|
if ( !isplaymode ) {
|
||||||
|
if ( isplaymode === undefined ) {
|
||||||
|
$('#box-preview').show();
|
||||||
|
api.StartDemonstration('id-preview', currentPage);
|
||||||
|
} else
|
||||||
|
api.DemonstrationPlay();
|
||||||
|
|
||||||
|
$('#btn-play button').addClass('pause');
|
||||||
|
} else {
|
||||||
|
$('#btn-play button').removeClass('pause');
|
||||||
|
api.DemonstrationPause();
|
||||||
|
}
|
||||||
|
isplaymode = !isplaymode;
|
||||||
|
}
|
||||||
|
|
||||||
|
function onPlayStop() {
|
||||||
|
isplaymode = undefined;
|
||||||
|
$('#page-number').val(currentPage + 1);
|
||||||
|
$('#btn-play button').removeClass('pause');
|
||||||
|
$('#box-preview').hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
function onPlaySlideChanged(number) {
|
||||||
|
if ( number++ < maxPages)
|
||||||
|
$('#page-number').val(number);
|
||||||
|
}
|
||||||
|
|
||||||
function showMask() {
|
function showMask() {
|
||||||
$('#id-loadmask').modal({
|
$('#id-loadmask').modal({
|
||||||
backdrop: 'static',
|
backdrop: 'static',
|
||||||
|
|
@ -353,11 +441,6 @@ var ApplicationController = new(function(){
|
||||||
$('#id-loadmask').modal('hide');
|
$('#id-loadmask').modal('hide');
|
||||||
}
|
}
|
||||||
|
|
||||||
function onOpenDocument(progress) {
|
|
||||||
var proc = (progress.asc_getCurrentFont() + progress.asc_getCurrentImage())/(progress.asc_getFontsCount() + progress.asc_getImagesCount());
|
|
||||||
$('#loadmask-text').html('Loading document: ' + Math.min(Math.round(proc * 100), 100) + '%');
|
|
||||||
}
|
|
||||||
|
|
||||||
function onError(id, level, errData) {
|
function onError(id, level, errData) {
|
||||||
hidePreloader();
|
hidePreloader();
|
||||||
|
|
||||||
|
|
@ -442,114 +525,11 @@ var ApplicationController = new(function(){
|
||||||
// Helpers
|
// Helpers
|
||||||
// -------------------------
|
// -------------------------
|
||||||
|
|
||||||
var handlerToolbarSize = createBuffered(function(size){
|
|
||||||
var visibleCaption = function(btn, visible){
|
|
||||||
if (visible){
|
|
||||||
$(btn + ' button').addClass('no-caption');
|
|
||||||
$(btn + ' button span').css('display', 'none');
|
|
||||||
} else {
|
|
||||||
$(btn + ' button').removeClass('no-caption');
|
|
||||||
$(btn + ' button span').css('display', 'inline');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var isMinimize = $('#toolbar').width() < minToolbarWidth;
|
|
||||||
|
|
||||||
visibleCaption('#id-btn-copy', isMinimize);
|
|
||||||
visibleCaption('#id-btn-share', isMinimize);
|
|
||||||
visibleCaption('#id-btn-embed', isMinimize);
|
|
||||||
}, 10);
|
|
||||||
|
|
||||||
function onDocumentResize() {
|
function onDocumentResize() {
|
||||||
if (api) {
|
if (api) {
|
||||||
api.Resize();
|
api.Resize();
|
||||||
api.zoomFitToPage();
|
api.zoomFitToPage();
|
||||||
}
|
}
|
||||||
|
|
||||||
handlerToolbarSize();
|
|
||||||
}
|
|
||||||
|
|
||||||
function isVisiblePopover(popover){
|
|
||||||
return popover.hasClass('in');
|
|
||||||
}
|
|
||||||
|
|
||||||
function setVisiblePopover(popover, visible, owner){
|
|
||||||
api && api.asc_enableKeyEvents(!visible);
|
|
||||||
|
|
||||||
if (visible){
|
|
||||||
if (owner){
|
|
||||||
popover.css('display', 'block');
|
|
||||||
|
|
||||||
var popoverData = owner.data('bs.popover'),
|
|
||||||
$tip = popoverData.tip(),
|
|
||||||
pos = popoverData.getPosition(false),
|
|
||||||
actualHeight = $tip[0].offsetHeight,
|
|
||||||
placement = (embedConfig.toolbarDocked === 'top') ? 'bottom' : 'top',
|
|
||||||
tp;
|
|
||||||
|
|
||||||
$tip.removeClass('fade in top bottom left right');
|
|
||||||
|
|
||||||
switch (placement) {
|
|
||||||
case 'bottom':
|
|
||||||
tp = {
|
|
||||||
top : pos.top + pos.height,
|
|
||||||
left: owner.position().left + (owner.width() - popover.width()) * 0.5
|
|
||||||
};
|
|
||||||
break;
|
|
||||||
|
|
||||||
default:
|
|
||||||
case 'top':
|
|
||||||
tp = {
|
|
||||||
top : pos.top - actualHeight,
|
|
||||||
left: owner.position().left + (owner.width() - popover.width()) * 0.5
|
|
||||||
};
|
|
||||||
break;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
$tip
|
|
||||||
.css(tp)
|
|
||||||
.addClass(placement)
|
|
||||||
.addClass('in')
|
|
||||||
}
|
|
||||||
|
|
||||||
if (popover.hasClass('embed')) {
|
|
||||||
clipEmbedObj.show();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (popover.hasClass('share')) {
|
|
||||||
clipShortUrl.show();
|
|
||||||
updateSocial();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
popover.removeClass('in');
|
|
||||||
popover.css('display', 'none');
|
|
||||||
|
|
||||||
popover.hasClass('embed') && clipEmbedObj.hide();
|
|
||||||
popover.hasClass('share') && clipShortUrl.hide();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateEmbedCode(){
|
|
||||||
var newWidth = parseInt($('#id-input-embed-width').val()),
|
|
||||||
newHeight = parseInt($('#id-input-embed-height').val());
|
|
||||||
|
|
||||||
if (newWidth < minEmbedWidth)
|
|
||||||
newWidth = minEmbedWidth;
|
|
||||||
|
|
||||||
if (newHeight < minEmbedHeight)
|
|
||||||
newHeight = minEmbedHeight;
|
|
||||||
|
|
||||||
$('#id-textarea-embed').text(embedCode.replace('{embed-url}', embedConfig.embedUrl).replace('{width}', newWidth).replace('{height}', newHeight));
|
|
||||||
|
|
||||||
$('#id-input-embed-width').val(newWidth + 'px');
|
|
||||||
$('#id-input-embed-height').val(newHeight + 'px');
|
|
||||||
}
|
|
||||||
|
|
||||||
function openLink(url){
|
|
||||||
var newDocumentPage = window.open(url);
|
|
||||||
if (newDocumentPage)
|
|
||||||
newDocumentPage.focus();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function createController(){
|
function createController(){
|
||||||
|
|
@ -559,165 +539,12 @@ var ApplicationController = new(function(){
|
||||||
me = this;
|
me = this;
|
||||||
created = true;
|
created = true;
|
||||||
|
|
||||||
var documentMoveTimer;
|
|
||||||
|
|
||||||
// Initialize clipboard objects
|
|
||||||
|
|
||||||
clipShortUrl.addEventListener('mousedown', function() {
|
|
||||||
if ($('#id-btn-copy-short').hasClass('copied'))
|
|
||||||
return;
|
|
||||||
|
|
||||||
$('#id-btn-copy-short').button('copied');
|
|
||||||
$('#id-btn-copy-short').addClass('copied');
|
|
||||||
|
|
||||||
clipShortUrl.setText($('#id-short-url').val());
|
|
||||||
|
|
||||||
setTimeout(function(){
|
|
||||||
$('#id-btn-copy-short').button('reset');
|
|
||||||
$('#id-btn-copy-short').removeClass('copied');
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
|
|
||||||
clipEmbedObj.addEventListener('mousedown', function(){
|
|
||||||
if ($('#id-btn-copy-embed').hasClass('copied'))
|
|
||||||
return;
|
|
||||||
|
|
||||||
$('#id-btn-copy-embed').button('copied');
|
|
||||||
$('#id-btn-copy-embed').addClass('copied');
|
|
||||||
|
|
||||||
clipEmbedObj.setText($('#id-textarea-embed').text());
|
|
||||||
|
|
||||||
setTimeout(function(){
|
|
||||||
$('#id-btn-copy-embed').button('reset');
|
|
||||||
$('#id-btn-copy-embed').removeClass('copied');
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
|
|
||||||
clipShortUrl.glue('id-btn-copy-short');
|
|
||||||
clipEmbedObj.glue('id-btn-copy-embed');
|
|
||||||
|
|
||||||
|
|
||||||
// popover ui handlers
|
// popover ui handlers
|
||||||
|
|
||||||
$('#id-btn-copy').on('click', function(){
|
|
||||||
var saveUrl = embedConfig.saveUrl;
|
|
||||||
if (typeof saveUrl !== 'undefined' && saveUrl.length > 0){
|
|
||||||
openLink(saveUrl);
|
|
||||||
} else if (api && permissions.print!==false){
|
|
||||||
api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
|
|
||||||
}
|
|
||||||
|
|
||||||
Common.Analytics.trackEvent('Save');
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-share').on('click', function(event){
|
|
||||||
setVisiblePopover($('#id-popover-share'), !isVisiblePopover($('#id-popover-share')), $('#id-btn-share'));
|
|
||||||
setVisiblePopover($('#id-popover-embed'), false);
|
|
||||||
|
|
||||||
event.preventDefault();
|
|
||||||
event.stopPropagation();
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-embed').on('click', function(event){
|
|
||||||
setVisiblePopover($('#id-popover-embed'), !isVisiblePopover($('#id-popover-embed')), $('#id-btn-embed'));
|
|
||||||
setVisiblePopover($('#id-popover-share'), false);
|
|
||||||
|
|
||||||
event.preventDefault();
|
|
||||||
event.stopPropagation();
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-width').on('keypress', function(e){
|
|
||||||
if (e.keyCode == 13)
|
|
||||||
updateEmbedCode();
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-height').on('keypress', function(e){
|
|
||||||
if (e.keyCode == 13)
|
|
||||||
updateEmbedCode();
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-width').on('focusin', function(e){
|
|
||||||
api && api.asc_enableKeyEvents(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-height').on('focusin', function(e){
|
|
||||||
api && api.asc_enableKeyEvents(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-width').on('focusout', function(e){
|
|
||||||
updateEmbedCode();
|
|
||||||
api && api.asc_enableKeyEvents(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-input-embed-height').on('focusout', function(e){
|
|
||||||
updateEmbedCode();
|
|
||||||
api && api.asc_enableKeyEvents(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#page-number').on('keypress', function(e){
|
|
||||||
if (e.keyCode == 13){
|
|
||||||
var newPage = parseInt($('#page-number').val());
|
|
||||||
|
|
||||||
if (newPage > maxPages)
|
|
||||||
newPage = maxPages;
|
|
||||||
if (newPage < 2 || isNaN(newPage))
|
|
||||||
newPage = 1;
|
|
||||||
|
|
||||||
if (api)
|
|
||||||
api.goToPage(newPage-1);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-fullscreen').on('click', function(){
|
|
||||||
openLink(embedConfig.fullscreenUrl);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-close').on('click', function(){
|
|
||||||
if (config.customization && config.customization.goback && config.customization.goback.url)
|
|
||||||
window.parent.location.href = config.customization.goback.url;
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-move-left').on('click', function(){
|
|
||||||
if (api) {
|
|
||||||
if (currentPage > 0) {
|
|
||||||
api.goToPage(currentPage - 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#id-btn-move-right').on('click', function(){
|
|
||||||
if (api) {
|
|
||||||
if (currentPage < maxPages - 1) {
|
|
||||||
api.goToPage(currentPage + 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$(window).resize(function(){
|
$(window).resize(function(){
|
||||||
onDocumentResize();
|
onDocumentResize();
|
||||||
});
|
});
|
||||||
|
|
||||||
$(document).click(function(event){
|
|
||||||
if (event && event.target && $(event.target).closest('.popover').length > 0)
|
|
||||||
return;
|
|
||||||
|
|
||||||
setVisiblePopover($('#id-popover-share'), false);
|
|
||||||
setVisiblePopover($('#id-popover-embed'), false);
|
|
||||||
|
|
||||||
clearTimeout(documentMoveTimer);
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).mousemove(function(event){
|
|
||||||
$('#id-btn-move-left').fadeIn();
|
|
||||||
$('#id-btn-move-right').fadeIn();
|
|
||||||
|
|
||||||
clearTimeout(documentMoveTimer);
|
|
||||||
documentMoveTimer = setTimeout(function(){
|
|
||||||
$('#id-btn-move-left').fadeOut();
|
|
||||||
$('#id-btn-move-right').fadeOut();
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
|
|
||||||
api = new Asc.asc_docs_api({
|
api = new Asc.asc_docs_api({
|
||||||
'id-view' : 'editor_sdk'
|
'id-view' : 'editor_sdk'
|
||||||
});
|
});
|
||||||
|
|
@ -729,26 +556,12 @@ var ApplicationController = new(function(){
|
||||||
api.asc_registerCallback('asc_onDocumentContentReady', onDocumentContentReady);
|
api.asc_registerCallback('asc_onDocumentContentReady', onDocumentContentReady);
|
||||||
api.asc_registerCallback('asc_onOpenDocumentProgress', onOpenDocument);
|
api.asc_registerCallback('asc_onOpenDocumentProgress', onOpenDocument);
|
||||||
api.asc_registerCallback('asc_onCountPages', onCountPages);
|
api.asc_registerCallback('asc_onCountPages', onCountPages);
|
||||||
// api.asc_registerCallback('OnCurrentVisiblePage', onCurrentPage);
|
|
||||||
api.asc_registerCallback('asc_onCurrentPage', onCurrentPage);
|
api.asc_registerCallback('asc_onCurrentPage', onCurrentPage);
|
||||||
api.asc_registerCallback('asc_onHyperlinkClick', onHyperlinkClick);
|
|
||||||
api.asc_registerCallback('asc_onStartAction', onLongActionBegin);
|
|
||||||
api.asc_registerCallback('asc_onEndAction', onLongActionEnd);
|
|
||||||
|
|
||||||
api.asc_registerCallback('asc_onMouseMoveStart', onDocMouseMoveStart);
|
|
||||||
api.asc_registerCallback('asc_onMouseMoveEnd', onDocMouseMoveEnd);
|
|
||||||
api.asc_registerCallback('asc_onMouseMove', onDocMouseMove);
|
|
||||||
|
|
||||||
api.asc_registerCallback('asc_onDownloadUrl', onDownloadUrl);
|
|
||||||
api.asc_registerCallback('asc_onPrint', onPrint);
|
|
||||||
api.asc_registerCallback('asc_onPrintUrl', onPrintUrl);
|
|
||||||
|
|
||||||
// Initialize api gateway
|
// Initialize api gateway
|
||||||
Common.Gateway.on('init', loadConfig);
|
Common.Gateway.on('init', loadConfig);
|
||||||
Common.Gateway.on('opendocument', loadDocument);
|
Common.Gateway.on('opendocument', loadDocument);
|
||||||
Common.Gateway.on('showerror', onExternalError);
|
Common.Gateway.on('showerror', onExternalError);
|
||||||
Common.Gateway.on('processmouse', onProcessMouse);
|
|
||||||
Common.Gateway.on('downloadas', onDownloadAs);
|
|
||||||
Common.Gateway.ready();
|
Common.Gateway.ready();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -31,50 +31,31 @@
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
var ApplicationView = new(function(){
|
var ApplicationView = new(function(){
|
||||||
|
var $btnTools;
|
||||||
|
|
||||||
// Initialize view
|
// Initialize view
|
||||||
|
|
||||||
function createView(){
|
function createView(){
|
||||||
$('#id-btn-share').popover({
|
$btnTools = $('#box-tools button');
|
||||||
trigger : 'manual',
|
|
||||||
html : true,
|
|
||||||
template : '<div class="popover share" id="id-popover-share"><div class="arrow"></div><div class="popover-inner"><div class="popover-content"><p></p></div></div></div>',
|
|
||||||
content : '<div class="share-link">' +
|
|
||||||
'<span class="caption">Link:</span>' +
|
|
||||||
'<input id="id-short-url" class="input-xs form-control" readonly/>' +
|
|
||||||
'<button id="id-btn-copy-short" type="button" class="btn btn-xs btn-primary" style="width: 65px;" data-copied-text="Copied">Copy</button>' +
|
|
||||||
'</div> ' +
|
|
||||||
'<div class="share-buttons" style="height: 25px" id="id-popover-social-container" data-loaded="false">' +
|
|
||||||
'<ul></ul>' +
|
|
||||||
'</div>'
|
|
||||||
}).popover('show');
|
|
||||||
|
|
||||||
$('#id-btn-embed').popover({
|
$btnTools.addClass('dropdown-toggle').attr('data-toggle', 'dropdown').attr('aria-expanded', 'true');
|
||||||
trigger : 'manual',
|
$btnTools.parent().append(
|
||||||
html : true,
|
'<ul class="dropdown-menu">' +
|
||||||
template : '<div class="popover embed" id="id-popover-embed"><div class="arrow"></div><div class="popover-inner"><div class="popover-content"><p></p></div></div></div>',
|
'<li><a id="idt-download" href="#"><span class="mi-icon svg-icon download"></span>Download</a></li>' +
|
||||||
content : '<div class="size-manual">' +
|
'<li><a id="idt-share" href="#" data-toggle="modal"><span class="mi-icon svg-icon share"></span>Share</a></li>' +
|
||||||
'<span class="caption">Width:</span>' +
|
'<li><a id="idt-embed" href="#" data-toggle="modal"><span class="mi-icon svg-icon embed"></span>Embed</a></li>' +
|
||||||
'<input id="id-input-embed-width" class="form-control input-xs" type="text" value="400px">' +
|
'<li><a id="idt-fullscreen" href="#"><span class="mi-icon svg-icon fullscr"></span>Full Screen</a></li>' +
|
||||||
'<input id="id-input-embed-height" class="form-control input-xs right" type="text" value="600px">' +
|
'</ul>');
|
||||||
'<span class="right caption">Height:</span>' +
|
}
|
||||||
'</div>' +
|
|
||||||
'<textarea id="id-textarea-embed" rows="4" class="form-control" readonly></textarea>' +
|
|
||||||
'<button id="id-btn-copy-embed" type="button" class="btn btn-xs btn-primary" data-copied-text="Copied">Copy</button>'
|
|
||||||
|
|
||||||
|
function getTools(name) {
|
||||||
}).popover('show');
|
return $btnTools.parent().find(name);
|
||||||
|
|
||||||
$('body').popover({
|
|
||||||
trigger : 'manual',
|
|
||||||
html : true,
|
|
||||||
animation : false,
|
|
||||||
template : '<div class="popover hyperlink" id="id-tip-hyperlink"><div class="popover-inner"><div class="popover-content"><p></p></div></div></div>',
|
|
||||||
content : '<br><b>Press Ctrl and click link</b>'
|
|
||||||
}).popover('show');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
create: createView
|
create: createView
|
||||||
|
, tools: {
|
||||||
|
get: getTools
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
|
|
@ -32,9 +32,7 @@
|
||||||
*/
|
*/
|
||||||
(function ($) {
|
(function ($) {
|
||||||
|
|
||||||
$(function(){
|
|
||||||
ApplicationView.create();
|
ApplicationView.create();
|
||||||
ApplicationController.create();
|
ApplicationController.create();
|
||||||
})
|
|
||||||
|
|
||||||
})(window.jQuery);
|
})(window.jQuery);
|
||||||
|
|
|
||||||
|
|
@ -2,8 +2,33 @@
|
||||||
@import "../../../../common/embed/resources/less/common.less";
|
@import "../../../../common/embed/resources/less/common.less";
|
||||||
|
|
||||||
.overlay-controls {
|
.overlay-controls {
|
||||||
bottom: 15px;
|
/*bottom: 15px;*/
|
||||||
}
|
}
|
||||||
|
|
||||||
.overlay-icon-move-left { background-position: -64px -120px; }
|
.overlay-icon-move-left { background-position: -64px -120px; }
|
||||||
.overlay-icon-move-right { background-position: -96px -120px; }
|
.overlay-icon-move-right { background-position: -96px -120px; }
|
||||||
|
|
||||||
|
#box-preview {
|
||||||
|
position:absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
display:none;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
z-index: 10;
|
||||||
|
padding: 32px 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#id-preview {
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.svg-icon {
|
||||||
|
&.play {
|
||||||
|
&.pause {
|
||||||
|
background-position: -22px*10 -22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue