[common] added controller 'modals' to embed

apps/common/embed/lib/controller/modals.js

@@ -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
+        };
+    });
+}();

apps/common/embed/lib/view/modals.js

@@ -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">' +
                         '<div class="modal-dialog" role="document">' +
                             '<div class="modal-content">' +

apps/documenteditor/embed/index.html

@@ -340,6 +340,7 @@
       <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/ApplicationController.js"></script>
       <script type="text/javascript" src="js/application.js"></script>

apps/documenteditor/embed/js/ApplicationController.js

@@ -38,9 +38,6 @@ var ApplicationController = new(function(){
         embedConfig = {},
         permissions = {},
         maxPages = 0,
-        minEmbedWidth = 400,
-        minEmbedHeight = 600,
-        embedCode = '<iframe allowtransparency="true" frameborder="0" scrolling="no" src="{embed-url}" width="{width}" height="{height}"></iframe>',
         created = false,
         ttOffset = [0, -10];
 
@@ -73,6 +70,7 @@ var ApplicationController = new(function(){
         config = $.extend(config, data.config);
         embedConfig = $.extend(embedConfig, data.config.embedded);
 
+        common.controller.modals.init(embedConfig);
         if ( !embedConfig.shareUrl )
             $('#idt-share').hide();
 
@@ -227,7 +225,10 @@ var ApplicationController = new(function(){
     function onDocumentContentReady() {
         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_onEndAction',             onLongActionEnd);
@@ -241,51 +242,6 @@ var ApplicationController = new(function(){
         Common.Gateway.on('processmouse',       onProcessMouse);
         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')
             .on('click', function(){
                 common.utils.openLink(embedConfig.fullscreenUrl);
@@ -485,25 +441,6 @@ var ApplicationController = new(function(){
         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(){
         if (created)
             return me;

apps/documenteditor/embed/js/ApplicationView.js

@@ -31,10 +31,7 @@
  *
 */
 var ApplicationView = new(function(){
-
     var $btnTools;
-    var $dlgEmbed,
-        $dlgShare;
 
     // Initialize view
 
@@ -55,33 +52,10 @@ var ApplicationView = new(function(){
         return $btnTools.parent().find(name);
     }
 
-    function getModal(name) {
-        switch (name) {
-        case 'embed': return $dlgEmbed;
-        case 'share': return $dlgShare;
-        }
-    }
-
     return {
         create: createView
         , tools: {
             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'));
-                }
-            }
-        }
     }
 })();