Commit 5d91dfd6 authored by Eric Eastwood's avatar Eric Eastwood

Separate Android and iOS builds (restore chat input for Android)

Previous Android MR, gitlab-org/gitter/webapp!1218
that is part of open-sourcing Android, gitlab-org/gitter/gitter-android-app#8

The web input was removed in favor of a native input but this is only the case of iOS (gitlab-org/gitter/webapp@06f71694). So I restored the web input for an Android specific build.

We used to store the `www/` assets directly in the Android repo and had an old build so we didn't encounter the problem of the missing chat input. But in preparation for open-sourcing Android, I removed them, gitlab-org/gitter/gitter-android-app!13
parent 40664bac
......@@ -5,6 +5,7 @@
Developer facing:
- Move Android embedded chat build to cross-platform Gulp scripts, https://gitlab.com/gitlab-org/gitter/webapp/merge_requests/1218
- Separate Android and iOS builds (restore chat input for Android), https://gitlab.com/gitlab-org/gitter/webapp/merge_requests/1222
# 19.14.0 - 2018-8-1
......
......@@ -3,7 +3,6 @@
const Promise = require('bluebird');
const path = require('path');
const gulp = require('gulp');
const glob = Promise.promisify(require('glob'));
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer-core');
......@@ -16,8 +15,31 @@ const uglify = require('gulp-uglify');
const childProcessPromise = require('./child-process-promise');
const extractUrls = require('./extract-urls');
const cssDestDir = 'output/embedded/www/styles';
const cssWatchGlob = 'public/**/*.less';
var opts = require('yargs')
.option('android', {
type: 'boolean',
default: false,
description: 'Output'
})
.option('ios', {
type: 'boolean',
default: false,
description: 'Output'
})
.help('help')
.alias('help', 'h')
.argv;
let buildPath;
if(opts.android) {
buildPath = 'output/android/www/';
}
else if(opts.ios) {
buildPath = 'output/ios/www/';
}
else {
throw new Error('Please define the --android of --ios args when running the embedded build')
}
/**
* Hook into the compile stage
......@@ -39,21 +61,32 @@ gulp.task('clientapp:compile:copy-files', function() {
base: './public',
stat: true
})
.pipe(gulp.dest('output/embedded/www'));
.pipe(gulp.dest(buildPath));
});
gulp.task('embedded:compile:markup', function() {
return childProcessPromise.spawn('node', [
const args = [
path.join(__dirname, './render-embedded-chat.js'),
'--output', 'output/embedded/www/mobile/embedded-chat.html',
], process.env);
'--output', path.join(buildPath, 'mobile/embedded-chat.html'),
];
if(opts.android) {
args.push('--android');
}
if(opts.ios) {
args.push('--ios');
}
return childProcessPromise.spawn('node', args, Object.assign({}, process.env, {
// Default to prod config
NODE_ENV: process.env.NODE_ENV || 'prod'
}));
});
const cssIosStyleBuilder = styleBuilder([
'public/less/mobile-native-chat.less'
], {
dest: cssDestDir,
watchGlob: cssWatchGlob,
dest: path.join(buildPath, 'styles'),
watchGlob: 'public/**/*.less',
sourceMapOptions: getSourceMapOptions(),
lessOptions: {
paths: ['public/less'],
......@@ -82,7 +115,7 @@ gulp.task('embedded:compile:css', function() {
gulp.task('embedded:compile:webpack', ['clientapp:compile:copy-files'], function() {
return gulp.src('./public/js/webpack-mobile-native.config')
.pipe(webpack(require('../public/js/webpack-mobile-native.config')))
.pipe(gulp.dest('output/embedded/www/js'));
.pipe(gulp.dest(path.join(buildPath, 'js')));
});
gulp.task('embedded:post-compile', [
......@@ -91,14 +124,14 @@ gulp.task('embedded:post-compile', [
]);
gulp.task('embedded:post-compile:uglify', function() {
return gulp.src('output/embedded/www/js/*.js')
return gulp.src(path.join(buildPath, 'js/*.js'))
.pipe(uglify())
.pipe(gulp.dest('output/embedded/www/js'));
.pipe(gulp.dest(path.join(buildPath, 'js')));
});
gulp.task('embedded:post-compile:copy-linked-assets', function() {
return Promise.all([
extractUrls('output/embedded/www/styles/mobile-native-chat.css', 'output/embedded/www/'),
extractUrls(path.join(buildPath, 'styles/mobile-native-chat.css'), buildPath),
])
.then((resourceLists) => {
const resourceList = resourceLists.reduce((list, resultantList) => {
......@@ -109,6 +142,6 @@ gulp.task('embedded:post-compile:copy-linked-assets', function() {
base: './public',
stat: true
})
.pipe(gulp.dest('output/embedded/www'));
.pipe(gulp.dest(buildPath));
})
});
......@@ -16,6 +16,11 @@ var opts = require('yargs')
required: true,
description: 'Output'
})
.option('android', {
type: 'boolean',
default: false,
description: 'Output'
})
.help('help')
.alias('help', 'h')
.argv;
......@@ -39,7 +44,9 @@ app.engine('hbs', expressHbs.express3({
app.set('view engine', 'hbs');
app.set('views', resolveStatic('/templates'));
app.render('mobile/native-embedded-chat-app', {}, function(err, html) {
app.render('mobile/native-embedded-chat-app', {
isAndroidBuild: opts.android
}, function(err, html) {
if(err) {
die(err);
}
......
......@@ -326,7 +326,8 @@
"precommit-checks": "eslint --cache --quiet --format unix --ext .js --ext .jsx . && gulp linter:validate:config test:test --test-fast --test-critical-only",
"task-validate": "gulp validate",
"task-watch": "gulp watch",
"build-android-assets": "gulp --gulpfile gulpfile-embedded.js",
"build-android-assets": "gulp --gulpfile gulpfile-embedded.js --android",
"build-ios-assets": "gulp --gulpfile gulpfile-embedded.js --ios",
"browser-build-tests": "webpack --config ./test/in-browser/webpack.config.js",
"browser-run-test": "cd ./test/in-browser/fixtures && devtool -cq runner.js",
"browser-test": "npm run browser-build-tests && npm run browser-run-test",
......
......@@ -4,6 +4,7 @@ var context = require('./utils/context');
var liveContext = require('./components/live-context');
var chatModels = require('./collections/chat');
var ChatCollectionView = require('./views/chat/chatCollectionView');
var ChatInputView = require('./views/chat/chatInputView');
var unreadItemsClient = require('./components/unread-items-client');
var emojiDecorator = require('./views/chat/decorators/emojiDecorator');
var mobileDecorator = require('./views/chat/decorators/mobileDecorator');
......@@ -35,6 +36,38 @@ onready(function() {
unreadItemsClient.monitorViewForUnreadItems($('#content-frame'), chatCollectionView);
// This is only used for Android (iOS has native inputs)
var $chatInputWrapper = $('#chat-input-wrapper');
if($chatInputWrapper) {
var room = context.troupe();
if (!room.get('roomMember')) {
// Im Andy Trevorah and I wrote this instead of using region switching because:
// a) we need to hide the border between chat collection view and chat input
// b) using web textinput on native apps is on its way out anyway
// c) im lazy
$chatInputWrapper.hide();
}
new ChatInputView({
el: $('#chat-input'),
model: room,
collection: chatCollection,
}).render();
room.on('change:roomMember', function(room, isMember) {
// Im Andy Trevorah and I wrote this instead of using region switching because:
// a) we need to hide the border between chat collection view and chat input
// b) using web textinput on native apps is on its way out anyway
// c) im so lazy that I copy and paste all my excuses
if (isMember) {
$chatInputWrapper.show();
} else {
$chatInputWrapper.hide();
}
});
}
// used by the ios native app v3.5.0+
window._sendMessage = function(text) {
var newMessage = {
......
......@@ -21,6 +21,9 @@
<div id="mainPage" class="chat-app">
{{> chat_content}}
{{#if isAndroidBuild}}
{{> chat_input}}
{{/if}}
</div>
{{{ bootScript "mobile-native-embedded-chat" root="../" }}}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment