Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[PE mobile] Add Settings view

Browse source
This commit is contained in:
Alexander Yuzhin 2016-11-22 13:40:00 +03:00
parent d264753c6b
commit b0eafed82a
5 changed files with 648 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
apps/presentationeditor/mobile/app-dev.js
View file

@ -136,9 +136,9 @@ require([
'Editor',
'Toolbar',
'Search',
'Main'
'Main',
// 'DocumentHolder',
// 'Settings',
'Settings'
// 'EditContainer',
// 'EditText',
// 'EditParagraph',
@ -201,9 +201,9 @@ require([
'presentationeditor/mobile/app/controller/Editor',
'presentationeditor/mobile/app/controller/Toolbar',
'presentationeditor/mobile/app/controller/Search',
'presentationeditor/mobile/app/controller/Main'
'presentationeditor/mobile/app/controller/Main',
// 'presentationeditor/mobile/app/controller/DocumentHolder',
// 'presentationeditor/mobile/app/controller/Settings',
'presentationeditor/mobile/app/controller/Settings'
// 'presentationeditor/mobile/app/controller/edit/EditContainer',
// 'presentationeditor/mobile/app/controller/edit/EditText',
// 'presentationeditor/mobile/app/controller/edit/EditParagraph',

203
apps/presentationeditor/mobile/app/controller/Settings.js Normal file
View file

@ -0,0 +1,203 @@
/*
*
* (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
*
*/
/**
* Settings.js
* Presentation Editor
*
* Created by Alexander Yuzhin on 11/22/16
* Copyright (c) 2016 Ascensio System SIA. All rights reserved.
*
*/
define([
'core',
'presentationeditor/mobile/app/view/Settings'
], function (core) {
'use strict';
PE.Controllers.Settings = Backbone.Controller.extend(_.extend((function() {
// private
var rootView,
inProgress,
infoObj,
modalView;
return {
models: [],
collections: [],
views: [
'Settings'
],
initialize: function () {
Common.SharedSettings.set('readerMode', false);
Common.NotificationCenter.on('settingscontainer:show', _.bind(this.initEvents, this));
this.addListeners({
'Settings': {
'page:show' : this.onPageShow
}
});
},
setApi: function (api) {
this.api = api;
},
onLaunch: function () {
this.createView('Settings').render();
},
setMode: function (mode) {
this.getView('Settings').setMode(mode);
},
initEvents: function () {
},
rootView : function() {
return rootView;
},
showModal: function() {
if (Common.SharedSettings.get('phone')) {
modalView = uiApp.popup(
'<div class="popup settings container-settings">' +
'<div class="content-block">' +
'<div class="view settings-root-view navbar-through">' +
this.getView('Settings').rootLayout() +
'</div>' +
'</div>' +
'</div>'
);
} else {
modalView = uiApp.popover(
'<div class="popover settings container-settings">' +
'<div class="popover-angle"></div>' +
'<div class="popover-inner">' +
'<div class="content-block">' +
'<div class="view popover-view settings-root-view navbar-through">' +
this.getView('Settings').rootLayout() +
'</div>' +
'</div>' +
'</div>' +
'</div>',
$$('#toolbar-settings')
);
}
if (Framework7.prototype.device.android === true) {
$$('.view.settings-root-view.navbar-through').removeClass('navbar-through').addClass('navbar-fixed');
$$('.view.settings-root-view .navbar').prependTo('.view.settings-root-view > .pages > .page');
}
rootView = uiApp.addView('.settings-root-view', {
dynamicNavbar: true
});
Common.NotificationCenter.trigger('settingscontainer:show');
this.onPageShow(this.getView('Settings'));
},
hideModal: function() {
if (modalView) {
uiApp.closeModal(modalView);
}
},
onPageShow: function(view) {
var me = this;
$('#settings-search').single('click', _.bind(me._onSearch, me));
$('#settings-readermode input:checkbox').single('change', _.bind(me._onReaderMode, me));
$('#settings-edit-presentation').single('click', _.bind(me._onEditPresentation, me));
$(modalView).find('.formats a').single('click', _.bind(me._onSaveFormat, me));
},
// API handlers
_onApiDocumentName: function(name) {
$('#settings-presentation-title').html(name ? name : '-');
},
_onEditPresentation: function() {
Common.Gateway.requestEditRights();
},
_onSearch: function (e) {
var toolbarView = PE.getController('Toolbar').getView('Toolbar');
if (toolbarView) {
toolbarView.showSearch();
}
this.hideModal();
},
_onReaderMode: function (e) {
var me = this;
Common.SharedSettings.set('readerMode', !Common.SharedSettings.get('readerMode'));
me.api && me.api.ChangeReaderMode();
if (Common.SharedSettings.get('phone')) {
_.defer(function () {
me.hideModal();
}, 1000);
}
Common.NotificationCenter.trigger('readermode:change', Common.SharedSettings.get('readerMode'));
},
_onSaveFormat: function(e) {
var me = this,
format = $(e.currentTarget).data('format');
if (format) {
_.defer(function () {
me.api.asc_DownloadAs(format);
});
}
me.hideModal();
},
txtLoading : 'Loading...',
notcriticalErrorTitle : 'Warning',
warnDownloadAs : 'If you continue saving in this format all features except the text will be lost.<br>Are you sure you want to continue?'
}
})(), PE.Controllers.Settings || {}))
});

238
apps/presentationeditor/mobile/app/template/Settings.template Normal file
View file

@ -0,0 +1,238 @@
<!-- Root view -->
<div id="settings-root-view">
<div class="navbar">
<div class="navbar-inner">
<div class="center sliding"><%= scope.textSettings %></div>
<div class="right"><% if (phone) { %><a href="#" class="link close-popup"><%= scope.textDone %></a><% } %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="settings-root-view">
<div class="page-content">
<div class="list-block">
<ul>
<% if (phone) { %>
<li>
<a id="settings-search" class="item-link no-indicator">
<div class="item-content">
<div class="item-media">
<i class="icon icon-search"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textFind %></div>
</div>
</div>
</a>
</li>
<% } %>
<li>
<a id="settings-edit-presentation" class="item-link no-indicator">
<div class="item-content">
<div class="item-media">
<i class="icon icon-edit"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textEditPresent %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-presentation-setup" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-info"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textPresentSetup %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-download" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-download"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textDownload %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-presentation-info" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-info"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textPresentInfo %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-help" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-help"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textHelp %></div>
</div>
</div>
</a>
</li>
<li>
<a id="settings-about" class="item-link">
<div class="item-content">
<div class="item-media">
<i class="icon icon-about"></i>
</div>
<div class="item-inner">
<div class="item-title"><%= scope.textAbout %></div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Presentation Info view -->
<div id="settings-info-view">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding">
<a href="#" class="back link">
<i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %>
</a>
</div>
<div class="center sliding"><%= scope.textPresentInfo %></div>
</div>
</div>
<div class="pages">
<div class="page" data-page="settings-info-view">
<div class="page-content">
<div class="content-block-title"><%= scope.textPresentTitle %></div>
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div id="settings-presentation-title" class="item-title"><%= scope.textLoading %></div>
</div>
</li>
</ul>
</div>
<div class="content-block-title"><%= scope.textAuthor %></div>
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div id="settings-presentation-autor" class="item-title"><%= scope.textLoading %></div>
</div>
</li>
</ul>
</div>
<div class="content-block-title"><%= scope.textCreateDate %></div>
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div id="settings-presentation-date" class="item-title"><%= scope.textLoading %></div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Download view -->
<div id="settings-download-view">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding">
<a href="#" class="back link">
<i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %>
</a>
</div>
<div class="center sliding"><%= scope.textDownload %></div>
</div>
</div>
<div class="pages">
<div class="page formats" data-page="settings-download-view">
<div class="page-content">
<div class="content-block-title"><%= scope.textDownloadAs %></div>
<div class="list-block">
<ul>
<li>
<a data-format="129" class="item-link no-indicator">
<div class="item-content">
<div class="item-media">
<i class="icon icon-search"></i>
</div>
<div class="item-inner">
<div class="item-title">PPTX</div>
</div>
</div>
</a>
</li>
<li>
<a data-format="513" class="item-link no-indicator">
<div class="item-content">
<div class="item-media">
<i class="icon icon-search"></i>
</div>
<div class="item-inner">
<div class="item-title">PDF</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- About view -->
<div id="settings-about-view">
<div class="navbar">
<div class="navbar-inner">
<div class="left sliding">
<a href="#" class="back link">
<i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %>
</a>
</div>
<div class="center sliding"><%= scope.textAbout %></div>
</div>
</div>
<div class="pages">
<div class="page about" data-page="settings-about-view">
<div class="page-content">
<div class="content-block">
<div class="logo" style="display: inline-block; width: 100%; height: 55px;"></div>
</div>
<div class="content-block">
<h3>PRESENTATION EDITOR</h3>
<h3><%= scope.textVersion %> 4.2</h3>
</div>
<div class="content-block">
<h3 class="vendor">Ascensio System SIA</h3>
<p><label><%= scope.textAddress %>:</label><a class="external" href="#">Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021</a></p>
<p><label><%= scope.textEmail %>:</label><a class="external" target="_blank" href="mailto:support@onlyoffice.com">support@onlyoffice.com</a></p>
<p><label><%= scope.textTel %>:</label><a class="external" target="_blank" href="tel:+371 660-16425">+371 660-16425</a></p>
<p><a class="external" target="_blank" href="http://www.onlyoffice.com">www.onlyoffice.com</a></p>
</div>
</div>
</div>
</div>
</div>

201
apps/presentationeditor/mobile/app/view/Settings.js Normal file
View file

@ -0,0 +1,201 @@
/*
*
* (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
*
*/
/**
* Settings.js
* Presentation Editor
*
* Created by Alexander Yuzhin on 11/22/16
* Copyright (c) 2016 Ascensio System SIA. All rights reserved.
*
*/
define([
'text!presentationeditor/mobile/app/template/Settings.template',
'jquery',
'underscore',
'backbone'
], function (settingsTemplate, $, _, Backbone) {
'use strict';
PE.Views.Settings = Backbone.View.extend(_.extend((function() {
// private
var isEdit;
return {
// el: '.view-main',
template: _.template(settingsTemplate),
events: {
//
},
initialize: function () {
Common.NotificationCenter.on('settingscontainer:show', _.bind(this.initEvents, this));
Common.Gateway.on('opendocument', _.bind(this.loadDocument, this));
},
initEvents: function () {
var me = this;
$('#settings-presentation-info').single('click', _.bind(me.showInfo, me));
$('#settings-download').single('click', _.bind(me.showDownload, me));
$('#settings-history').single('click', _.bind(me.showHistory, me));
$('#settings-help').single('click', _.bind(me.showHelp, me));
$('#settings-about').single('click', _.bind(me.showAbout, me));
me.initControls();
},
// Render layout
render: function () {
this.layout = $('<div/>').append(this.template({
android: Common.SharedSettings.get('android'),
phone: Common.SharedSettings.get('phone'),
scope: this
}));
return this;
},
setMode: function (mode) {
isEdit = (mode === 'edit')
},
rootLayout: function () {
if (this.layout) {
var $layour = this.layout.find('#settings-root-view'),
isPhone = Common.SharedSettings.get('phone');
if (isEdit) {
$layour.find('#settings-edit-presentation').hide();
$layour.find('#settings-readermode').hide();
$layour.find('#settings-search .item-title').text(this.textFindAndReplace)
} else {
$layour.find('#settings-readermode input:checkbox')
.attr('checked', Common.SharedSettings.get('readerMode'))
.prop('checked', Common.SharedSettings.get('readerMode'));
}
return $layour.html();
}
return '';
},
initControls: function () {
//
},
showPage: function (templateId) {
var rootView = PE.getController('Settings').rootView();
if (rootView && this.layout) {
var $content = this.layout.find(templateId);
// Android fix for navigation
if (Framework7.prototype.device.android) {
$content.find('.page').append($content.find('.navbar'));
}
rootView.router.load({
content: $content.html()
});
this.fireEvent('page:show', this);
}
},
showInfo: function () {
this.showPage('#settings-info-view');
var document = Common.SharedSettings.get('document') || {},
info = document.info || {};
$('#settings-presentation-title').html(document.title ? document.title : this.unknownText);
$('#settings-presentation-autor').html(info.author ? info.author : this.unknownText);
$('#settings-presentation-date').html(info.created ? info.created : this.unknownText);
},
showDownload: function () {
this.showPage('#settings-download-view');
},
showHistory: function () {
this.showPage('#settings-history-view');
},
showHelp: function () {
window.open('http://support.onlyoffice.com/', "_blank");
PE.getController('Settings').hideModal();
},
showAbout: function () {
this.showPage('#settings-about-view');
},
loadDocument: function (data) {
var permissions = {};
if (data.doc) {
permissions = _.extend(permissions, data.doc.permissions);
if (permissions.edit === false) {
$('#settings-edit-presentation').hide();
}
}
},
unknownText: 'Unknown',
textSettings: 'Settings',
textDone: 'Done',
textEditPresent: 'Edit Presentation',
textPresentSetup: 'Presentation Setup',
textDownload: 'Download',
textPresentInfo: 'Presentation Info',
textHelp: 'Help',
textAbout: 'About',
textBack: 'Back',
textPresentTitle: 'Presentation Title',
textLoading: 'Loading...',
textAuthor: 'Author',
textCreateDate: 'Create date',
textDownloadAs: 'Download As...',
textVersion: 'Version',
textAddress: 'address',
textEmail: 'email',
textTel: 'tel'
}
})(), PE.Views.Settings || {}))
});

4
apps/presentationeditor/mobile/app/view/Toolbar.js
View file

@ -120,13 +120,13 @@ define([
// Editor
showEdition: function () {
PE.getController('EditContainer').showModal();
// PE.getController('EditContainer').showModal();
},
// Inserts
showInserts: function () {
PE.getController('AddContainer').showModal();
// PE.getController('AddContainer').showModal();
},
// Settings