[SSE mobile] repaired Add Hyperlink page

apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js

@@ -68,6 +68,8 @@ define([
                         'page:show' : this.onPageShow
                         , 'link:insert': this.onInsertLink
                         , 'image:insert': this.onInsertImage
+                        , 'link:changetype': this.onChangeLinkType
+                        , 'link:changesheet': this.onChangeLinkSheet
                     }
                 });
             },
@@ -85,35 +87,64 @@ define([
             },
 
             initEvents: function () {
+                var me = this;
+                var wc = me.api.asc_getWorksheetsCount(), items = null;
+                if (wc > 0) {
+                    items = [];
+                    while ( !(--wc < 0) ) {
+                        if ( !this.api.asc_isWorksheetHidden(wc) ) {
+                            items.unshift({
+                                value: wc,
+                                caption: me.api.asc_getWorksheetName(wc)
+                            });
+                        }
+                    }
+                }
+
+                this.optsLink = {
+                    type: 'ext',
+                    sheets: items
+                };
+
+                _.defer(function () {
+                    me.getView('AddOther')
+                        .acceptWorksheets( items )
+                        .setActiveWorksheet( me.api.asc_getActiveWorksheetIndex(),
+                            me.api.asc_getWorksheetName(me.api.asc_getActiveWorksheetIndex()) );
+                });
             },
 
             onPageShow: function (view, pageId) {
                 var me = this;
 
                 if (pageId == '#addother-link') {
-                    if ($('#addother-link-view')) {
+                    var cell = me.api.asc_getCellInfo(),
-                        _.defer(function () {
+                        celltype = cell.asc_getFlags().asc_getSelectionType();
-                            var props = me.api.asc_getCellInfo().asc_getHyperlink();
+                    var allowinternal = (celltype!==Asc.c_oAscSelectionType.RangeImage && celltype!==Asc.c_oAscSelectionType.RangeShape &&
+                    celltype!==Asc.c_oAscSelectionType.RangeShapeText && celltype!==Asc.c_oAscSelectionType.RangeChart &&
+                    celltype!==Asc.c_oAscSelectionType.RangeChartText);
 
-                            // var text = props.asc_getText();
+                    view.optionDisplayText(cell.asc_getFlags().asc_getLockText() ? 'locked' : cell.asc_getText());
-                            // $('#add-link-display input').val(_.isString(text) ? text : '');
+                    view.optionAllowInternal(allowinternal);
-                        });
+                    allowinternal && view.optionLinkType( this.optsLink.type );
-                    }
+                } else
+                if (pageId == '#addother-change-linktype') {
+                    view.optionLinkType( this.optsLink.type );
                 }
             },
 
             // Handlers
 
             onInsertLink: function (args) {
-                return;
+                var link = new Asc.asc_CHyperlink();
 
-                var me      = this,
+                if ( args.type == 'ext' ) {
-                    url     = args.url,
+                    var url     = args.url,
-                    urltype = me.api.asc_getUrlType($.trim(url)),
+                        urltype = this.api.asc_getUrlType($.trim(url)),
                         isEmail = (urltype == 2);
 
                     if (urltype < 1) {
-                    uiApp.alert(me.txtNotUrl);
+                        uiApp.alert(this.txtNotUrl);
                         return;
                     }
 
@@ -124,16 +155,41 @@ define([
 
                     url = url.replace(new RegExp("%20",'g')," ");
 
-                var props = new Asc.CHyperlink();
+                    link.asc_setType(Asc.c_oAscHyperlinkType.WebLink);
-                props.asc_setHyperlinkUrl(url);
+                    link.asc_setHyperlinkUrl(url);
-                props.asc_setText(_.isEmpty(args.text) ? url : args.text);
+                    display = url;
-                props.asc_setTooltip(args.tooltip);
+                } else {
+                     if ( !/^[A-Z]+[1-9]\d*:[A-Z]+[1-9]\d*$/.test(args.url) ||
+                                !/^[A-Z]+[1-9]\d*$/.test(args.url) )
+                     {
+                         uiApp.alert(this.textInvalidRange);
+                         return;
+                     }
 
-                me.api.asc_insertHyperlink(props);
+                    link.asc_setType(Asc.c_oAscHyperlinkType.RangeLink);
+                    link.asc_setSheet(args.sheet);
+                    link.asc_setRange(args.url);
+
+                    var display = args.sheet + '!' + args.url;
+                }
+
+                link.asc_setText(args.text == null ? null : !!args.text ? args.text : display);
+                link.asc_setTooltip(args.tooltip);
+
+                this.api.asc_insertHyperlink(link);
 
                 SSE.getController('AddContainer').hideModal();
             },
 
+            onChangeLinkType: function (view, type) {
+                this.optsLink.type = type;
+
+                view.optionLinkType( this.optsLink.type, 'caption' );
+            },
+
+            onChangeLinkSheet: function (view, index) {
+            },
+
             onInsertImage: function (args) {
                 SSE.getController('AddContainer').hideModal();
 
@@ -158,6 +214,7 @@ define([
                 }
             },
 
+            textInvalidRange: 'ERROR! Invalid cells range',
             textEmptyImgUrl : 'You need to specify image URL.',
             txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"'
         }

apps/spreadsheeteditor/mobile/app/template/AddOther.template

@@ -54,12 +54,46 @@
         <div class="page-content">
             <div class="list-block">
                 <ul>
+                    <li>
+                        <a id="add-link-type" class="item-link smart-select">
+                            <select name="linktype">
+                                <option value="ext"><%= scope.textExternalLink %></option>
+                                <option value="int"><%= scope.textInternalLink %></option>
+                            </select>
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title label"><%= scope.textLinkType %></div>
+                                    <div class="item-after"><%= scope.textExternalLink %></div>
+                                </div>
+                            </div>
+                        </a>
+                    </li>
+                    <li>
+                        <a id="add-link-sheet" class="item-link smart-select">
+                            <select>
+                            </select>
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title label"><%= scope.textSheet %></div>
+                                    <div class="item-after">Sheet 5</div>
+                                </div>
+                            </div>
+                        </a>
+                    </li>
+                        <div id="add-link-range" class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title label"><%= scope.textRange %></div>
+                                <div class="item-input">
+                                    <input type="text" class="field right range" placeholder="<%= scope.textRange %>">
+                                </div>
+                            </div>
+                        </div>
                     <li>
                         <div id="add-link-url" class="item-content">
                             <div class="item-inner">
                                 <div class="item-title label"><%= scope.textLink %></div>
                                 <div class="item-input">
-                                    <input type="url" placeholder="<%= scope.textLink %>">
+                                    <input type="url" class="field right" placeholder="<%= scope.textLink %>">
                                 </div>
                             </div>
                         </div>
@@ -69,7 +103,7 @@
                             <div class="item-inner">
                                 <div class="item-title label"><%= scope.textDisplay %></div>
                                 <div class="item-input">
-                                    <input type="text" placeholder="<%= scope.textDisplay %>">
+                                    <input type="text" class="field right" placeholder="<%= scope.textDisplay %>">
                                 </div>
                             </div>
                         </div>
@@ -79,7 +113,7 @@
                             <div class="item-inner">
                                 <div class="item-title label"><%= scope.textTip %></div>
                                 <div class="item-input">
-                                    <input type="text" placeholder="<%= scope.textTip %>">
+                                    <input type="text" class="field right" placeholder="<%= scope.textTip %>">
                                 </div>
                             </div>
                         </div>

apps/spreadsheeteditor/mobile/app/view/add/AddOther.js

@@ -64,9 +64,10 @@ define([
 
                 var $page = $('#add-other');
                 $page.find('#add-other-insimage').single('click', _.bind(me.showInsertImage, me));
-                $page.find('#add-other-link').single('click', _.bind(me.showLink, me));
+                $page.find('#add-other-link').single('click', _.bind(me.showInsertLink, me));
                 $page.find('#add-other-sort').single('click', _.bind(me.showSortPage, me));
 
+                this.link = {type:'ext', internal:{}};
                 me.initControls();
             },
 
@@ -123,18 +124,30 @@ define([
                 }.bind(this));
             },
 
-            showLink: function () {
+            showInsertLink: function () {
                 this.showPage('#addother-link');
 
-                $('.page[data-page=addother-link] input[type=url]').single('input', _.bind(function(e) {
+                var me = this;
-                    $('#add-link-insert').toggleClass('disabled', _.isEmpty($('#add-link-url input').val()));
+                var $view = $('.settings');
-                }, this));
+                $('.page[data-page=addother-link]').find('input[type=url], input.range')
+                    .single('input', function(e) {
+                        $view.find('#add-link-insert').toggleClass('disabled', _.isEmpty($(e.target).val()));
+                });
 
                 _.delay(function () {
-                    $('.page[data-page=addother-link] input[type=url]').focus();
+                    $view.find('.page[data-page=addother-link] input[type=url]').focus();
                 }, 1000);
 
-                $('#add-link-insert').single('click', _.buffered(this.clickInsertLink, 100, this));
+                $view.find('#add-link-insert').single('click', _.buffered(this.clickInsertLink, 100, this));
+                $view.find('#add-link-type select').single('change', function (e) {
+                    me.fireEvent('link:changetype', [me, $(e.currentTarget).val()]);
+                });
+                $view.find('#add-link-sheet select').single('change', function (e) {
+                    var index = $(e.currentTarget).val(),
+                        caption = $(e.currentTarget[e.currentTarget.selectedIndex]).text();
+                    me.link.internal = { sheet: {index: index, caption: caption}};
+                    me.fireEvent('link:changesheet', [me, $(e.currentTarget).val()]);
+                }).val(me.link.internal.sheet.index);
             },
 
             showSortPage: function (e) {
@@ -142,11 +155,17 @@ define([
             },
 
             clickInsertLink: function (e) {
-                var url     = $('#add-link-url input').val(),
+                var $view = $('.settings');
-                    display = $('#add-link-display input').val(),
+                var type = this.link.type;
-                    tip     = $('#add-link-tip input').val();
+                var $text = $view.find('#add-link-display input');
 
-                this.fireEvent('link:insert', [{url:url, text:display, tooltip:tip}]);
+                this.fireEvent('link:insert', [{
+                    type    : type,
+                    sheet   : type == 'ext' ? undefined : this.link.internal.sheet.index,
+                    url     : $view.find(type == 'ext' ? '#add-link-url input' : '#add-link-range input').val(),
+                    text    : $text.is(':disabled') ? null : $text.val(),
+                    tooltip : $view.find('#add-link-tip input').val()
+                }]);
             },
 
             showImageFromUrl: function () {
@@ -168,6 +187,82 @@ define([
                 _.delay(function () { $input.focus(); }, 1000);
             },
 
+            optionLinkType: function (type, opts) {
+                this.link.type = type;
+
+                var $view = $('.settings');
+
+                if ( !(opts == 'caption') ) {
+                    $view.find('#add-link-type select').val(type);
+                    $view.find('#add-link-type .item-after').html(
+                        type == 'int' ? this.textInternalLink : this.textExternalLink );
+                }
+
+                var $btnInsertLink = $view.find('#add-link-insert');
+                if ( type == 'int' ) {
+                    $view.find('#add-link-url').hide();
+
+                    $view.find('#add-link-sheet').show()
+                        .find('.item-after').html(this.link.internal.sheet.caption);
+
+                    $view.find('#add-link-range').show();
+                    $btnInsertLink.toggleClass('disabled', _.isEmpty($view.find('#add-link-range input').val()));
+                } else {
+                    $view.find('#add-link-url').show();
+                    $view.find('#add-link-sheet').hide();
+                    $view.find('#add-link-range').hide();
+
+                    $btnInsertLink.toggleClass('disabled', _.isEmpty($view.find('#add-link-url input').val()));
+                }
+            },
+
+            optionAllowInternal: function(allow) {
+                var $view = $('.settings');
+
+                if ( allow )
+                    $view.find('#add-link-type').show();
+                else {
+                    this.optionLinkType('ext');
+                    $view.find('#add-link-type').hide();
+                }
+            },
+
+            optionDisplayText: function (text) {
+                var $view = $('.settings');
+                var disabled = text == 'locked';
+
+                disabled && (text = ' ');
+                $view.find('#add-link-display input').prop('disabled', disabled).val(text);
+                $view.find('#add-link-display .label').toggleClass('disabled', disabled);
+            },
+
+            acceptWorksheets: function (sheets) {
+                this.worksheets = sheets;
+
+                var tpl = '<% _.each(worksheets, function(item){ %>' +
+                            '<option value="<%= item.value %>"><%= item.caption %></option>' +
+                        '<% }) %>';
+
+                this.layout.find('#add-link-sheet select').html(
+                    _.template(tpl, {
+                        worksheets: sheets
+                    })
+                );
+
+                return this;
+            },
+
+            setActiveWorksheet: function (index, caption) {
+                this.link.internal = { sheet: {index: index, caption: caption}};
+
+                var $view = $('.settings');
+                // $view.find('#add-link-sheet .item-after').html(this.link.internal.sheet.caption);
+                $view.find('#add-link-sheet select').val(index);
+                $view.find('#add-link-sheet .item-after').text(caption);
+
+                return this;
+            },
+
             textInsertImage: 'Insert Image',
             textSort: 'Sort and Filter',
             textLink: 'Link',
@@ -181,7 +276,12 @@ define([
             textLinkSettings: 'Link Settings',
             textAddress: 'Address',
             textImageURL: 'Image URL',
-            textFilter: 'Filter'
+            textFilter: 'Filter',
+            textLinkType: 'Link Type',
+            textExternalLink: 'External Link',
+            textInternalLink: 'Internal Data Range',
+            textSheet: 'Sheet',
+            textRange: 'Range'
         }
     })(), SSE.Views.AddOther || {}))
 });