Merge branch 'master' into feature/74-dropbox-issue

ifrost · Sep 14, 2020 · ab33da4 · ab33da4
2 parents 515db6b + 9c30b19
commit ab33da4
Show file tree

Hide file tree

Showing 21 changed files with 1,062 additions and 829 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -190,6 +190,12 @@ module.exports = function(grunt) {
                     },
                     {
                         src: 'afterwriting.html'
+                    },
+                    {
+                        src: 'privacy.html'
+                    },
+                    {
+                        src: 'terms.html'
                     }
                 ]
             }

diff --git a/afterwriting.zip b/afterwriting.zip
diff --git a/bundle/css/afterwriting.css b/bundle/css/afterwriting.css
diff --git a/bundle/js/afterwriting.js b/bundle/js/afterwriting.js
diff --git a/css/layout.css b/css/layout.css
@@ -25,6 +25,28 @@ p {
     src: url('../fonts/dayroman.ttf');
 }
 
+.appInfo {
+    color: white;
+    font-family: 'Day Roman', Georgia, serif;
+    width: 700px;
+    padding: 10px;
+    margin-top: 200px;
+    position: absolute;
+    background-color: rgba(0,0,0,0.3);
+}
+
+.appInfo p {
+    text-align: center;
+}
+
+.appInfo a {
+    color: white;
+}
+.appInfo a:hover {
+    opacity: 0.8;
+    color: white;
+}
+
 /** loader - "Loading..." text displayed before the page is loaded */
 .loader {
     left: 50%;
@@ -222,6 +244,10 @@ p {
 /** small screens **/
 @media (max-device-width: 800px) {
 
+    .appInfo {
+        margin-top: 300px;
+    }
+
     .content-action--close {
         float: none;
         position: absolute;

diff --git a/html/afterwriting.html b/html/afterwriting.html
@@ -3,14 +3,14 @@
 		<title>'afterwriting offline</title>
 		<meta http-equiv="content-type" content="text/html;charset=UTF-8">
 		<link rel="icon" type="image/x-icon" href="gfx/favicon.ico">
-		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-04_18-26" />
+		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-11_21-15" />
 
 		<script src="bundle/js/pdfjs/pdf.min.js"></script>
 		<script type="text/javascript">
 			PDFJS.disableWorker = true;
 		</script>
 
-		<script src="bundle/js/afterwriting.js?last_update=2020-09-04_18-26" defer></script>
+		<script src="bundle/js/afterwriting.js?last_update=2020-09-11_21-15" defer></script>
 	</head>
 	<body>
 		<p class="loader">Loading...</p>

diff --git a/html/index.html b/html/index.html
@@ -4,15 +4,15 @@
 		<meta name="description" content="Post-processing Fountain screenplays - PDF creation and statistics">
 		<meta http-equiv="content-type" content="text/html;charset=UTF-8">
 		<link rel="icon" type="image/x-icon" href="gfx/favicon.ico">
-		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-04_18-26" />
+		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-11_21-15" />
 
 		<script src="bundle/js/pdfjs/pdf.min.js"></script>
 		<script type="text/javascript">
 			PDFJS.disableWorker = true;
             var JS_TREE_WORKERS_ENABLED = true;
 		</script>
 
-		<script src="bundle/js/afterwriting.js?last_update=2020-09-04_18-26" defer></script>
+		<script src="bundle/js/afterwriting.js?last_update=2020-09-11_21-15" defer></script>
 	</head>
 	<body>
 		<p class="loader">Loading...</p>

diff --git a/index.html b/index.html
@@ -4,15 +4,15 @@
 		<meta name="description" content="Post-processing Fountain screenplays - PDF creation and statistics">
 		<meta http-equiv="content-type" content="text/html;charset=UTF-8">
 		<link rel="icon" type="image/x-icon" href="gfx/favicon.ico">
-		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-04_18-26" />
+		<link rel="stylesheet" href="bundle/css/afterwriting.css?last_update=2020-09-11_21-15" />
 
 		<script src="bundle/js/pdfjs/pdf.min.js"></script>
 		<script type="text/javascript">
 			PDFJS.disableWorker = true;
             var JS_TREE_WORKERS_ENABLED = true;
 		</script>
 
-		<script src="bundle/js/afterwriting.js?last_update=2020-09-04_18-26" defer></script>
+		<script src="bundle/js/afterwriting.js?last_update=2020-09-11_21-15" defer></script>
 	</head>
 	<body>
 		<p class="loader">Loading...</p>

diff --git a/js/core/controller/app-controller.js b/js/core/controller/app-controller.js
@@ -2,6 +2,7 @@ define(function(require) {
 
     var common = require('utils/common'),
         Protoplast = require('protoplast'),
+        MainInfo = require('core/view/main-info'),
         ThemeModel = require('theme/aw-bubble/model/theme-model'),
         ThemeController = require('theme/aw-bubble/controller/theme-controller');
 
@@ -38,6 +39,8 @@ define(function(require) {
                 if (this.appModel.urlParams.fontFix) {
                     this.pdfController.fontFixEnabled = true;
                 }
+
+                this.themeController.setMainInfoComponent(MainInfo.create());
 
                 var footer = common.data.footer;
                 this.themeController.setFooter(footer);

diff --git a/js/core/presenter/main-info-presenter.js b/js/core/presenter/main-info-presenter.js
@@ -0,0 +1,36 @@
+define(function(require) {
+    var Protoplast = require('protoplast'),
+        ThemeController = require('theme/aw-bubble/controller/theme-controller'),
+        ThemeModel = require('theme/aw-bubble/model/theme-model');
+
+    var MainInfoPresenter = Protoplast.Object.extend({
+
+        scriptModel: {
+            inject: 'script'
+        },
+
+        themeController: {
+            inject: ThemeController
+        },
+
+        themeModel: {
+            inject: ThemeModel
+        },
+
+        init: function() {
+            Protoplast.utils.bind(this.scriptModel, 'script', function(){
+                this.themeController.setMainInfoComponent(null);
+            }.bind(this));
+
+            Protoplast.utils.bind(this, 'themeModel.height', this.updateContentSize.bind(this));
+            Protoplast.utils.bind(this, 'themeModel.width', this.updateContentSize.bind(this));
+        },
+
+        updateContentSize: function() {
+            this.view.left = (this.themeModel.width - this.view.outerWidth) / 2;
+        }
+
+    });
+
+    return MainInfoPresenter;
+});
diff --git a/js/core/view/main-info.js b/js/core/view/main-info.js
@@ -0,0 +1,53 @@
+define(function(require) {
+    var Switcher = require('theme/aw-bubble/view/switcher'),
+        BaseComponent = require('core/view/base-component'),
+        MainInfoPresenter = require('core/presenter/main-info-presenter');
+
+    var MainInfo = BaseComponent.extend({
+
+        html: '<div class="appInfo">' +
+            '<p><b>’afterwriting</b> turns <a href="https://fountain.io" target="_blank">.fountain</a> screenplays into beautiful PDFs. Free, open-source, offline-first. No registration, no ads, no fuss. ' +
+            '<p>Start by using the menu above to <span data-comp="switchToInfo" class="switch" href="#"></span> or <span data-comp="switchToOpen" class="switch" href="#" section="open"></span>.</p>' +
+            '<p style="padding-top: 30px"><a href="./privacy.html" target="_blank">Privacy Policy</a> | <a href="./terms.html" target="_blank">Terms of Service</a> | <a href="https://github.com/ifrost/afterwriting-labs" target="_blank">Source Code</a></p></p>' +
+            '</div>',
+
+        $meta: {
+            presenter: MainInfoPresenter
+        },
+
+        switchToInfo: {
+            component: Switcher
+        },
+
+        switchToOpen: {
+            component: Switcher
+        },
+
+        addInteractions: function() {
+            this.switchToOpen.sectionName = 'open';
+            this.switchToOpen.title = "open a new file";
+
+            this.switchToInfo.sectionName = 'info';
+            this.switchToInfo.title = "get more details";
+        },
+
+        left: {
+            set: function(value) {
+                this.$root.offset({left: value});
+            },
+            get: function() {
+                return this.$root && this.$root.offset().left;
+            }
+        },
+
+        outerWidth: {
+            get: function() {
+                return this.$root ? this.$root.outerWidth() : null;
+            }
+        },
+
+    });
+
+    return MainInfo;
+
+});
diff --git a/js/plugin/info/view/info.hbs b/js/plugin/info/view/info.hbs
@@ -1,7 +1,6 @@
 <p>
 	<span><em>'Afterwriting</em>&nbsp;is a place where you can play with some screenwriting tools. You can open screenplays written in <a href="http://fountain.io/" target="_blank"><strong>Fountain format</strong></a> or <a href="http://www.finaldraft.com/" target="_blank"><strong>Final Draft</strong></a> (it will be converted to fountain). You can also use one of the</span>
 	<span data-comp="switchToOpen" class="switch" href="#" section="open"></span><span>.</span></p>
-    <p>Privacy Policy can be found <a href="/privacy.html" target="_blank">here</a>.</p>
 <h2>Offline</h2>
 
 <p>There's an offline version too! Just download

diff --git a/js/theme/aw-bubble/controller/theme-controller.js b/js/theme/aw-bubble/controller/theme-controller.js
@@ -43,6 +43,10 @@ define(function(require) {
         selectedSectionFullyVisible: function() {
             this.themeModel.sections.selected.isFullyVisible = true;
         },
+
+        setMainInfoComponent: function(component) {
+            this.themeModel.mainInfoComponent = component;
+        },
 
         setFooter: function(content) {
             this.themeModel.footer = content;

diff --git a/js/theme/aw-bubble/model/theme-model.js b/js/theme/aw-bubble/model/theme-model.js
@@ -30,7 +30,9 @@ define(function(require) {
         showBackgroundImage: true,
 
         tooltip: null,
-
+
+        mainInfoComponent: null,
+
         backgroundImageVisible: {
             computed: ['showBackgroundImage', 'small'],
             value: function() {

diff --git a/js/theme/aw-bubble/presenter/main-presenter.js b/js/theme/aw-bubble/presenter/main-presenter.js
@@ -24,6 +24,7 @@ define(function(require) {
             Protoplast.utils.bind(this, 'themeModel.backgroundImageVisible', this._updateBackgroundImage);
             Protoplast.utils.bind(this, 'themeModel.nightMode', this._updateNightMode);
             Protoplast.utils.bindProperty(this, 'themeModel.tooltip', this.view, 'tooltip');
+            Protoplast.utils.bindProperty(this, 'themeModel.mainInfoComponent', this.view, 'mainInfoComponent');
 
             this.themeModel.width = $('html').width();
             this.themeModel.height =  $(document).height();

diff --git a/js/theme/aw-bubble/view/main.js b/js/theme/aw-bubble/view/main.js
@@ -13,12 +13,15 @@ define(function(require) {
         $meta: {
             presenter: MainPresenter
         },
-
+
+        mainInfoComponent: null,
+
         tooltip: null,
 
         html: '<main class="main">' +
             '<div data-comp="logo"></div>' +
             '<div data-prop="backgroundClick" class="background-click"></div>' +
+            '<div data-comp="infoPlaceholder"></div>' +
             '<div class="menu"><div data-comp="mainMenu"></div></div>' +
             '<div data-comp="footer"></div>' +
             '<div data-comp="content"></div>' +
@@ -28,6 +31,10 @@ define(function(require) {
             component: Logo
         },
 
+        infoPlaceholder: {
+            component: Protoplast.Component.extend({tag:'div'})
+        },
+
         mainMenu: {
             component: BubbleMenu
         },
@@ -49,6 +56,7 @@ define(function(require) {
             Protoplast.utils.bind(this, 'tooltip.text', this._updateTooltip);
             Protoplast.utils.bind(this, 'tooltip.x', this._updateTooltipPosition);
             Protoplast.utils.bind(this, 'tooltip.y', this._updateTooltipPosition);
+            Protoplast.utils.bind(this, 'mainInfoComponent', this._updateMainInfoComponent);
 
             this.$backgroundClick.on('click', this.dispatch.bind(this, 'clicked'));
         },
@@ -73,6 +81,14 @@ define(function(require) {
             }
         },
 
+        _updateMainInfoComponent: function(infoComponent) {
+            if (infoComponent) {
+                this.infoPlaceholder.add(infoComponent);
+            } else {
+                this.infoPlaceholder.removeAll();
+            }
+        },
+
         destroy: function() {
             Protoplast.Component.destroy.call(this);
             this.$backgroundClick.off();

diff --git a/js/utils/common.js b/js/utils/common.js
@@ -1,7 +1,7 @@
 define(function() {
     return {
         data: {
-            footer: 'version: 1.14.0 (2020/09/04)'
+            footer: 'version: 1.15.0 (2020/09/11)'
         }
     };