[common] added controller 'modals' to embed
This commit is contained in:
parent
c2d14e0ff7
commit
aa58b8afdb
143
apps/common/embed/lib/controller/modals.js
Normal file
143
apps/common/embed/lib/controller/modals.js
Normal file
|
@ -0,0 +1,143 @@
|
||||||
|
/*
|
||||||
|
*
|
||||||
|
* (c) Copyright Ascensio System Limited 2010-2016
|
||||||
|
*
|
||||||
|
* This program is a free software product. You can redistribute it and/or
|
||||||
|
* modify it under the terms of the GNU Affero General Public License (AGPL)
|
||||||
|
* version 3 as published by the Free Software Foundation. In accordance with
|
||||||
|
* Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect
|
||||||
|
* that Ascensio System SIA expressly excludes the warranty of non-infringement
|
||||||
|
* of any third-party rights.
|
||||||
|
*
|
||||||
|
* This program is distributed WITHOUT ANY WARRANTY; without even the implied
|
||||||
|
* warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For
|
||||||
|
* details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
|
||||||
|
*
|
||||||
|
* You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia,
|
||||||
|
* EU, LV-1021.
|
||||||
|
*
|
||||||
|
* The interactive user interfaces in modified source and object code versions
|
||||||
|
* of the Program must display Appropriate Legal Notices, as required under
|
||||||
|
* Section 5 of the GNU AGPL version 3.
|
||||||
|
*
|
||||||
|
* Pursuant to Section 7(b) of the License you must retain the original Product
|
||||||
|
* logo when distributing the program. Pursuant to Section 7(e) we decline to
|
||||||
|
* grant you any rights under trademark law for use of our trademarks.
|
||||||
|
*
|
||||||
|
* All the Product's GUI elements, including illustrations and icon sets, as
|
||||||
|
* well as technical writing content are licensed under the terms of the
|
||||||
|
* Creative Commons Attribution-ShareAlike 4.0 International. See the License
|
||||||
|
* terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
+function () {
|
||||||
|
!window.common && (window.common = {});
|
||||||
|
!common.controller && (common.controller = {});
|
||||||
|
|
||||||
|
common.controller.modals = new(function() {
|
||||||
|
var $dlgShare, $dlgEmbed;
|
||||||
|
var appConfig;
|
||||||
|
var embedCode = '<iframe allowtransparency="true" frameborder="0" scrolling="no" src="{embed-url}" width="{width}" height="{height}"></iframe>',
|
||||||
|
minEmbedWidth = 400,
|
||||||
|
minEmbedHeight = 600;
|
||||||
|
|
||||||
|
function copytext(el, event) {
|
||||||
|
el.select();
|
||||||
|
if ( !document.execCommand('copy') ) {
|
||||||
|
window.alert('Browser\'s error! Use keyboard shortcut [Ctrl] + [C]');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var createDlgShare = function () {
|
||||||
|
$dlgShare = common.view.modals.create('share');
|
||||||
|
|
||||||
|
$dlgShare.find('#btn-copyshort').on('click', copytext.bind(this, $dlgShare.find('#id-short-url')));
|
||||||
|
$dlgShare.find('.share-buttons > span').on('click', function(e){
|
||||||
|
var _url;
|
||||||
|
switch ($(e.target).attr('data-name')) {
|
||||||
|
case 'facebook':
|
||||||
|
_url = 'https://www.facebook.com/sharer/sharer.php?u=' + appConfig.shareUrl + '&t=' + appConfig.docTitle;
|
||||||
|
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
|
||||||
|
break;
|
||||||
|
case 'twitter':
|
||||||
|
_url = 'https://twitter.com/share?url='+ appConfig.shareUrl;
|
||||||
|
!!appConfig.docTitle && (_url += '&text=' + appConfig.docTitle);
|
||||||
|
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
|
||||||
|
break;
|
||||||
|
case 'gplus':
|
||||||
|
_url = 'https://plus.google.com/share?url=' + appConfig.shareUrl;
|
||||||
|
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes');
|
||||||
|
break;
|
||||||
|
case 'email':
|
||||||
|
window.open('mailto:?subject=I have shared a document with you: ' + appConfig.docTitle + '&body=I have shared a document with you: ' + appConfig.shareUrl + '"', '_self');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$dlgShare.find('#id-short-url').val(appConfig.shareUrl);
|
||||||
|
};
|
||||||
|
|
||||||
|
var createDlgEmbed =function () {
|
||||||
|
$dlgEmbed = common.view.modals.create('embed');
|
||||||
|
|
||||||
|
var txtembed = $dlgEmbed.find('#txt-embed-url');
|
||||||
|
txtembed.text(embedCode.replace('{embed-url}', appConfig.embedUrl).replace('{width}', minEmbedWidth).replace('{height}', minEmbedHeight));
|
||||||
|
$dlgEmbed.find('#btn-copyembed').on('click', copytext.bind(this, txtembed));
|
||||||
|
$dlgEmbed.find('#txt-embed-width, #txt-embed-height').on({
|
||||||
|
'keypress': function(e){
|
||||||
|
if (e.keyCode == 13)
|
||||||
|
updateEmbedCode();
|
||||||
|
}
|
||||||
|
, 'focusout': function(e){
|
||||||
|
updateEmbedCode();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
function updateEmbedCode(){
|
||||||
|
var $txtwidth = $dlgEmbed.find('#txt-embed-width');
|
||||||
|
var $txtheight = $dlgEmbed.find('#txt-embed-height');
|
||||||
|
var newWidth = parseInt($txtwidth.val()),
|
||||||
|
newHeight = parseInt($txtheight.val());
|
||||||
|
|
||||||
|
if (newWidth < minEmbedWidth)
|
||||||
|
newWidth = minEmbedWidth;
|
||||||
|
|
||||||
|
if (newHeight < minEmbedHeight)
|
||||||
|
newHeight = minEmbedHeight;
|
||||||
|
|
||||||
|
$dlgEmbed.find('#txt-embed-url').text(embedCode.replace('{embed-url}', appConfig.embedUrl).replace('{width}', newWidth).replace('{height}', newHeight));
|
||||||
|
|
||||||
|
$txtwidth.val(newWidth + 'px');
|
||||||
|
$txtheight.val(newHeight + 'px');
|
||||||
|
}
|
||||||
|
|
||||||
|
var attachToView = function(config) {
|
||||||
|
if ( config.share && !!appConfig.shareUrl ) {
|
||||||
|
if ( !$dlgShare ) {
|
||||||
|
createDlgShare();
|
||||||
|
}
|
||||||
|
|
||||||
|
$(config.share).on('click', function(e){
|
||||||
|
$dlgShare.modal('show');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( config.embed && !!appConfig.embedUrl ) {
|
||||||
|
if ( !$dlgEmbed ) {
|
||||||
|
createDlgEmbed();
|
||||||
|
}
|
||||||
|
|
||||||
|
$(config.embed).on('click', function(e) {
|
||||||
|
$dlgEmbed.modal('show');
|
||||||
|
})
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return {
|
||||||
|
init: function(config) { appConfig = config; }
|
||||||
|
, attach: attachToView
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}();
|
|
@ -31,8 +31,9 @@
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
!window.utils && (window.utils = {});
|
!window.common && (window.common = {});
|
||||||
utils.modals = new(function() {
|
!common.view && (common.view = {});
|
||||||
|
common.view.modals = new(function() {
|
||||||
var tplDialog = '<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="idm-title" aria-hidden="true">' +
|
var tplDialog = '<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="idm-title" aria-hidden="true">' +
|
||||||
'<div class="modal-dialog" role="document">' +
|
'<div class="modal-dialog" role="document">' +
|
||||||
'<div class="modal-content">' +
|
'<div class="modal-content">' +
|
||||||
|
|
|
@ -340,6 +340,7 @@
|
||||||
<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/util/utils.js"></script>
|
||||||
<script type="text/javascript" src="../../common/embed/lib/view/modals.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,9 +38,6 @@ var ApplicationController = new(function(){
|
||||||
embedConfig = {},
|
embedConfig = {},
|
||||||
permissions = {},
|
permissions = {},
|
||||||
maxPages = 0,
|
maxPages = 0,
|
||||||
minEmbedWidth = 400,
|
|
||||||
minEmbedHeight = 600,
|
|
||||||
embedCode = '<iframe allowtransparency="true" frameborder="0" scrolling="no" src="{embed-url}" width="{width}" height="{height}"></iframe>',
|
|
||||||
created = false,
|
created = false,
|
||||||
ttOffset = [0, -10];
|
ttOffset = [0, -10];
|
||||||
|
|
||||||
|
@ -73,6 +70,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);
|
||||||
|
|
||||||
|
common.controller.modals.init(embedConfig);
|
||||||
if ( !embedConfig.shareUrl )
|
if ( !embedConfig.shareUrl )
|
||||||
$('#idt-share').hide();
|
$('#idt-share').hide();
|
||||||
|
|
||||||
|
@ -227,7 +225,10 @@ var ApplicationController = new(function(){
|
||||||
function onDocumentContentReady() {
|
function onDocumentContentReady() {
|
||||||
hidePreloader();
|
hidePreloader();
|
||||||
|
|
||||||
ApplicationView.modals.create(embedConfig);
|
common.controller.modals.attach({
|
||||||
|
share: '#idt-share',
|
||||||
|
embed: '#idt-embed'
|
||||||
|
});
|
||||||
|
|
||||||
api.asc_registerCallback('asc_onStartAction', onLongActionBegin);
|
api.asc_registerCallback('asc_onStartAction', onLongActionBegin);
|
||||||
api.asc_registerCallback('asc_onEndAction', onLongActionEnd);
|
api.asc_registerCallback('asc_onEndAction', onLongActionEnd);
|
||||||
|
@ -241,51 +242,6 @@ var ApplicationController = new(function(){
|
||||||
Common.Gateway.on('processmouse', onProcessMouse);
|
Common.Gateway.on('processmouse', onProcessMouse);
|
||||||
Common.Gateway.on('downloadas', onDownloadAs);
|
Common.Gateway.on('downloadas', onDownloadAs);
|
||||||
|
|
||||||
function _copytext(el, event) {
|
|
||||||
el.select();
|
|
||||||
if ( !document.execCommand('copy') ) {
|
|
||||||
window.alert('Browser\'s error! Use keyboard shortcut [Ctrl] + [C]');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
var m = ApplicationView.modals.get('share');
|
|
||||||
m.find('#btn-copyshort').on('click', _copytext.bind(this, m.find('#id-short-url')));
|
|
||||||
m.find('.share-buttons > span').on('click', function(e){
|
|
||||||
var _url;
|
|
||||||
switch ($(e.target).attr('data-name')) {
|
|
||||||
case 'facebook':
|
|
||||||
_url = 'https://www.facebook.com/sharer/sharer.php?u=' + embedConfig.shareUrl + '&t=' + embedConfig.docTitle;
|
|
||||||
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
|
|
||||||
break;
|
|
||||||
case 'twitter':
|
|
||||||
_url = 'https://twitter.com/share?url='+ embedConfig.shareUrl;
|
|
||||||
!!embedConfig.docTitle && (_url += '&text=' + embedConfig.docTitle);
|
|
||||||
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
|
|
||||||
break;
|
|
||||||
case 'gplus':
|
|
||||||
_url = 'https://plus.google.com/share?url=' + embedConfig.shareUrl;
|
|
||||||
window.open(_url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes');
|
|
||||||
break;
|
|
||||||
case 'email':
|
|
||||||
window.open('mailto:?subject=I have shared a document with you: ' + embedConfig.docTitle + '&body=I have shared a document with you: ' + embedConfig.shareUrl + '"', '_self');
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
var dlgembed = ApplicationView.modals.get('embed');
|
|
||||||
var txtembed = dlgembed.find('#txt-embed-url');
|
|
||||||
txtembed.text(embedCode.replace('{embed-url}', embedConfig.embedUrl).replace('{width}', minEmbedWidth).replace('{height}', minEmbedHeight));
|
|
||||||
dlgembed.find('#btn-copyembed').on('click', _copytext.bind(this, txtembed));
|
|
||||||
dlgembed.find('#txt-embed-width, #txt-embed-height').on({
|
|
||||||
'keypress': function(e){
|
|
||||||
if (e.keyCode == 13)
|
|
||||||
updateEmbedCode();
|
|
||||||
}
|
|
||||||
, 'focusout': function(e){
|
|
||||||
updateEmbedCode();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
ApplicationView.tools.get('#idt-fullscreen')
|
ApplicationView.tools.get('#idt-fullscreen')
|
||||||
.on('click', function(){
|
.on('click', function(){
|
||||||
common.utils.openLink(embedConfig.fullscreenUrl);
|
common.utils.openLink(embedConfig.fullscreenUrl);
|
||||||
|
@ -485,25 +441,6 @@ var ApplicationController = new(function(){
|
||||||
api && api.Resize();
|
api && api.Resize();
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateEmbedCode(){
|
|
||||||
var $dlg = ApplicationView.modals.get('emded');
|
|
||||||
var $txtwidth = $dlg.find('#txt-embed-width');
|
|
||||||
var $txtheight = $dlg.find('#txt-embed-height');
|
|
||||||
var newWidth = parseInt($txtwidth.val()),
|
|
||||||
newHeight = parseInt($txtheight.val());
|
|
||||||
|
|
||||||
if (newWidth < minEmbedWidth)
|
|
||||||
newWidth = minEmbedWidth;
|
|
||||||
|
|
||||||
if (newHeight < minEmbedHeight)
|
|
||||||
newHeight = minEmbedHeight;
|
|
||||||
|
|
||||||
$dlg.find('#txt-embed-url').text(embedCode.replace('{embed-url}', embedConfig.embedUrl).replace('{width}', newWidth).replace('{height}', newHeight));
|
|
||||||
|
|
||||||
$txtwidth.val(newWidth + 'px');
|
|
||||||
$txtheight.val(newHeight + 'px');
|
|
||||||
}
|
|
||||||
|
|
||||||
function createController(){
|
function createController(){
|
||||||
if (created)
|
if (created)
|
||||||
return me;
|
return me;
|
||||||
|
|
|
@ -31,10 +31,7 @@
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
var ApplicationView = new(function(){
|
var ApplicationView = new(function(){
|
||||||
|
|
||||||
var $btnTools;
|
var $btnTools;
|
||||||
var $dlgEmbed,
|
|
||||||
$dlgShare;
|
|
||||||
|
|
||||||
// Initialize view
|
// Initialize view
|
||||||
|
|
||||||
|
@ -55,33 +52,10 @@ var ApplicationView = new(function(){
|
||||||
return $btnTools.parent().find(name);
|
return $btnTools.parent().find(name);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getModal(name) {
|
|
||||||
switch (name) {
|
|
||||||
case 'embed': return $dlgEmbed;
|
|
||||||
case 'share': return $dlgShare;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
create: createView
|
create: createView
|
||||||
, tools: {
|
, tools: {
|
||||||
get: getTools
|
get: getTools
|
||||||
}
|
}
|
||||||
, modals: {
|
|
||||||
get: getModal
|
|
||||||
, create: function (config) {
|
|
||||||
if ( !$dlgShare && !!config.shareUrl ) {
|
|
||||||
$dlgShare = utils.modals.create('share');
|
|
||||||
$btnTools.parent().find('#idt-share').attr('data-target', "#" + $dlgShare.attr('id'));
|
|
||||||
|
|
||||||
$dlgShare.find('#id-short-url').val(config.shareUrl);
|
|
||||||
}
|
|
||||||
|
|
||||||
if ( !$dlgEmbed && !!config.embedUrl ) {
|
|
||||||
$dlgEmbed = utils.modals.create('embed');
|
|
||||||
$btnTools.parent().find('#idt-embed').attr('data-target', "#"+ $dlgEmbed.attr('id'));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
Loading…
Reference in a new issue