Browse Source

Working on mobile

Broken desktop
master
Igor Zhukov 7 years ago
parent
commit
fa47720d22
  1. 5
      app/js/controllers.js
  2. 81
      app/js/directives.js
  3. 3
      app/js/locales/en-us.json
  4. 125
      app/less/mobile.less
  5. 50
      app/partials/desktop/im.html
  6. 50
      app/partials/desktop/send_form.html
  7. 57
      app/partials/mobile/im.html
  8. 55
      app/partials/mobile/send_form.html
  9. 3
      app/vendor/recorderjs/recorder.js

5
app/js/controllers.js

@ -2321,6 +2321,8 @@ angular.module('myApp.controllers', ['myApp.i18n'])
send: submitMessage, send: submitMessage,
replyClear: replyClear, replyClear: replyClear,
fwdsClear: fwdsClear, fwdsClear: fwdsClear,
toggleSlash: toggleSlash,
replyKeyboardToggle: replyKeyboardToggle,
type: 'new' type: 'new'
} }
$scope.mentions = {} $scope.mentions = {}
@ -2347,9 +2349,6 @@ angular.module('myApp.controllers', ['myApp.i18n'])
$scope.$on('last_message_edit', setEditLastMessage) $scope.$on('last_message_edit', setEditLastMessage)
$scope.replyKeyboardToggle = replyKeyboardToggle
$scope.toggleSlash = toggleSlash
$rootScope.$watch('idle.isIDLE', function (newVal) { $rootScope.$watch('idle.isIDLE', function (newVal) {
if ($rootScope.idle.initial) { if ($rootScope.idle.initial) {
return return

81
app/js/directives.js

@ -1548,8 +1548,11 @@ angular.module('myApp.directives', ['myApp.filters'])
}) })
.directive('mySendForm', function (_, $q, $timeout, $interval, $window, $compile, $modalStack, $http, $interpolate, Storage, AppStickersManager, AppDocsManager, ErrorService, AppInlineBotsManager, FileManager, shouldFocusOnInteraction) { .directive('mySendForm', function (_, $q, $timeout, $interval, $window, $compile, $modalStack, $http, $interpolate, Storage, AppStickersManager, AppDocsManager, ErrorService, AppInlineBotsManager, FileManager, shouldFocusOnInteraction) {
return { return {
link: link, link: link,
templateUrl: templateUrl('send_form'),
replace: true,
scope: { scope: {
draftMessage: '=', draftMessage: '=',
mentions: '=', mentions: '=',
@ -1574,7 +1577,6 @@ angular.module('myApp.directives', ['myApp.filters'])
var cachedStickerImages = {} var cachedStickerImages = {}
var voiceRecorder = null var voiceRecorder = null
var voiceRecordSuccess = false
var voiceRecordSupported = Recorder.isRecordingSupported() var voiceRecordSupported = Recorder.isRecordingSupported()
var voiceRecordDurationInterval = null var voiceRecordDurationInterval = null
var voiceRecorderPromise = null var voiceRecorderPromise = null
@ -1698,7 +1700,7 @@ angular.module('myApp.directives', ['myApp.filters'])
$(voiceRecordBtn).on('contextmenu', cancelEvent) $(voiceRecordBtn).on('contextmenu', cancelEvent)
$(voiceRecordBtn).on('touchstart', function(e) { $(voiceRecordBtn).on('touchstart', function(event) {
if ($scope.voiceRecorder.processing) { if ($scope.voiceRecorder.processing) {
return return
} }
@ -1716,8 +1718,6 @@ angular.module('myApp.directives', ['myApp.filters'])
voiceRecorder.addEventListener('start', function(e) { voiceRecorder.addEventListener('start', function(e) {
var startTime = tsNow(true) var startTime = tsNow(true)
voiceRecordSuccess = false
voiceRecordDurationInterval = $interval(function() { voiceRecordDurationInterval = $interval(function() {
$scope.voiceRecorder.duration = tsNow(true) - startTime $scope.voiceRecorder.duration = tsNow(true) - startTime
}, 1000) }, 1000)
@ -1735,40 +1735,67 @@ angular.module('myApp.directives', ['myApp.filters'])
voiceRecorder.initStream() voiceRecorder.initStream()
$($window).one('touchend', function() { var curHover = false
var deferred = $q.defer() var curBoundaries = {}
voiceRecorder.addEventListener('dataAvailable', function(e) {
var blob = blobConstruct([e.detail], 'audio/ogg')
deferred.resolve(blob)
})
voiceRecorderPromise = deferred.promise
voiceRecorder.stop()
$interval.cancel(voiceRecordDurationInterval) var updateVoiceHoverBoundaries = function () {
var offset = element.offset()
curBoundaries = {
top: offset.top,
left: offset.left,
width: element.outerWidth(),
height: element.outerHeight(),
}
}
$scope.$apply(function() { var updateVoiceHoveredClass = function (event, returnHover) {
$scope.voiceRecorder.recording = false var originalEvent = event.originalEvent || event
}) var touch = originalEvent.changedTouches && originalEvent.changedTouches[0]
}) var isHover = touch &&
}) touch.pageX >= curBoundaries.left &&
touch.pageX <= curBoundaries.left + curBoundaries.width &&
touch.pageY >= curBoundaries.top &&
touch.pageY <= curBoundaries.top + curBoundaries.height
$(voiceRecordBtn).on('touchend', function(e) { if (curHover != isHover) {
voiceRecordSuccess = true element.toggleClass('im_send_form_hover', isHover)
$timeout(function () { curHover = isHover
if (voiceRecorderPromise) { }
$scope.voiceRecorder.processing = true return returnHover && isHover
}
voiceRecorderPromise.then(function(blob) { updateVoiceHoverBoundaries()
updateVoiceHoveredClass(event)
$($window).on('touchmove', updateVoiceHoveredClass)
$($window).one('touchend', function(event) {
$($window).off('touchmove', updateVoiceHoveredClass)
var isHover = updateVoiceHoveredClass(event, true)
if ($scope.voiceRecorder.duration > 0 && isHover) {
$scope.voiceRecorder.processing = true
voiceRecorder.addEventListener('dataAvailable', function(e) {
var blob = blobConstruct([e.detail], 'audio/ogg')
console.warn(dT(), 'got audio', blob) console.warn(dT(), 'got audio', blob)
$scope.draftMessage.files = [blob] $scope.draftMessage.files = [blob]
$scope.draftMessage.isMedia = true $scope.draftMessage.isMedia = true
$scope.voiceRecorder.processing = false $scope.voiceRecorder.processing = false
voiceRecorderPromise = null
}) })
} }
}, 100) voiceRecorder.stop()
console.warn(dT(), 'stop audio')
$interval.cancel(voiceRecordDurationInterval)
$scope.$apply(function() {
$scope.voiceRecorder.recording = false
$scope.voiceRecorder.duration = 0
})
})
}) })
var sendOnEnter = true var sendOnEnter = true

3
app/js/locales/en-us.json

@ -530,7 +530,8 @@
"im_submit_message": "Send", "im_submit_message": "Send",
"im_submit_edit_message": "Save", "im_submit_edit_message": "Save",
"im_edit_message_title": "Edit message", "im_edit_message_title": "Edit message",
"im_voice_recorder_label": "Swipe left to abort", "im_voice_recording_label": "Release outside this field to cancel",
"im_voice_processing_label": "Processing{dots}",
"login_sign_in": "Sign in", "login_sign_in": "Sign in",
"login_enter_number_description": "Please choose your country and enter your full phone number.", "login_enter_number_description": "Please choose your country and enter your full phone number.",
"login_incorrect_number": "Incorrect phone number", "login_incorrect_number": "Incorrect phone number",

125
app/less/mobile.less

@ -577,6 +577,13 @@ html {
.audio_player_volume_slider .tg_slider_wrap { .audio_player_volume_slider .tg_slider_wrap {
display: none; display: none;
} }
.audio_player_seek_slider {
width: 100%;
}
.audio_player_seek_slider .tg_slider_track {
background: rgba(200, 200, 200, 0.6);
}
.im_message_body_media { .im_message_body_media {
.im_message_document, .im_message_document,
@ -1426,7 +1433,7 @@ a.im_message_fwd_author {
.icon-paperclip, .icon-mic { .icon-paperclip, .icon-mic {
display: inline-block; display: inline-block;
width: 19px; width: 18px;
height: 23px; height: 23px;
vertical-align: text-top; vertical-align: text-top;
opacity: 0.8; opacity: 0.8;
@ -1438,19 +1445,22 @@ a.im_message_fwd_author {
.icon-mic { .icon-mic {
background-position: -12px -285px; background-position: -12px -285px;
} }
.im_voice_recording .icon-mic {
background-position: -12px -705px;
}
.im_attach { .im_attach {
cursor: pointer; cursor: pointer;
display: none; display: block;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
right: 34px; left: 0;
top: 0; top: 0;
margin: 0; margin: 0;
width: 50px; width: 50px;
height: 32px; height: 32px;
padding: 3px 13px 4px 16px; padding: 3px 13px 4px 16px;
right: 0; right: auto;
&:active { &:active {
.icon-paperclip { .icon-paperclip {
@ -1461,47 +1471,51 @@ a.im_message_fwd_author {
} }
.im_record { .im_record {
display: none;
right: 0; right: 0;
top: -9px;
width: 50px;
height: 50px;
position: absolute;
user-select: none; user-select: none;
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none; -webkit-user-select: none;
-ms-user-select: none; -ms-user-select: none;
padding: 13px 16px 13px 16px;
.im_record_supported .im_send_form_empty & { border-radius: 50px;
overflow: hidden;
background: #fff;
transition: background-color linear 0.2s;
.im_send_form_empty .im_record_supported & {
display: block; display: block;
} }
} }
.im_send_form_hover .im_voice_recording .im_record {
background: #bfd9ed;
}
.im_send_form_empty { .im_send_form_empty .im_submit {
.im_submit { opacity: 0.4;
display: none; }
} .im_send_form_empty .im_record_supported .im_submit {
display: none;
.im_attach {
display: block;
}
} }
.im_voice_recording, .im_processing_recording {
background-color: rgb(23, 23, 23);
color: white;
.im_voice_recorder_wrap { .im_voice_recording,
display: block; .im_processing_recording {
} color: #AAA;
.im_send_field_wrap { .im_voice_recorder_wrap {
display: none; display: block;
} }
.im_send_field_wrap,
.im_submit,
.im_attach { .im_attach {
display: none; display: none;
} }
.composer_emoji_insert_btn {
display: none;
}
} }
.im_processing_recording { .im_processing_recording {
@ -1527,17 +1541,12 @@ a.im_message_fwd_author {
} }
.composer_emoji_insert_btn { .composer_emoji_insert_btn {
position: absolute; top: 3px;
left: 0; right: 5px;
top: 0;
margin: 0;
padding: 3px 13px 4px 13px;
width: 48px;
height: 32px;
&.on, &.composer_emoji_insert_btn_on,
&:active, &:active,
.is_1x &.on, .is_1x &.composer_emoji_insert_btn_on,
.is_1x &:active { .is_1x &:active {
.icon-emoji { .icon-emoji {
background-position: -10px -803px; background-position: -10px -803px;
@ -1555,34 +1564,46 @@ a.im_message_fwd_author {
} }
.im_voice_recorder_wrap { .im_voice_recorder_wrap {
margin-left: 0px; height: 32px;
padding-left: 10px;
height: 38px;
display: none; display: none;
line-height: 38px; line-height: 32px;
color: white; right: 50px;
left: 0;
z-index: 100;
padding: 0 0 0 20px;
} }
.im_recorder_indicator, .im_recorder_time { .im_recorder_indicator, .im_recorder_time {
float: left; float: left;
vertical-align: middle; vertical-align: middle;
color: #333;
} }
.im_recorder_indicator i { .im_recorder_indicator i {
background-color: #F00; background-color: #ff1010;
height: 10px; height: 10px;
width: 10px; width: 10px;
border-radius: 50%; border-radius: 50%;
margin-right: 5px; margin-right: 5px;
vertical-align: middle; vertical-align: baseline;
display: inline-block; display: inline-block;
animation: blinker 0.5s cubic-bezier(.5, 0, 1, 1) infinite alternate;
}
@keyframes blinker {
from { opacity: 1; }
to { opacity: 0; }
} }
.im_recorder_label { .im_recorder_label {
overflow: auto; overflow: auto;
font-size: 17px; font-size: 12px;
text-align: center; text-align: center;
margin-right: 50px; vertical-align: middle;
padding-right: 48px;
color: #3a6d99;
transition: color linear 0.2s;
i, span { i, span {
vertical-align: middle; vertical-align: middle;
@ -1591,6 +1612,10 @@ a.im_message_fwd_author {
i { i {
margin-right: 5px; margin-right: 5px;
} }
.im_send_form_hover & {
color: #CCC;
}
} }
.composer_rich_textarea { .composer_rich_textarea {
@ -1620,8 +1645,8 @@ a.im_message_fwd_author {
} }
.composer_emoji_tooltip { .composer_emoji_tooltip {
margin-left: 6px; margin-left: -246px;
margin-top: -176px; margin-top: -181px;
z-index: 10000; z-index: 10000;
} }
.composer_emoji_tooltip_tab { .composer_emoji_tooltip_tab {
@ -1940,6 +1965,8 @@ a.media_modal_date:hover {
} }
.composer_rich_textarea, .composer_rich_textarea,
.composer_textarea { .composer_textarea {
padding-right: 28px;
.im_send_field_wrap_2ndbtn & { .im_send_field_wrap_2ndbtn & {
padding-right: 35px; padding-right: 35px;
} }
@ -1962,11 +1989,11 @@ a.media_modal_date:hover {
position: relative; position: relative;
} }
.composer_command_btn { .composer_command_btn {
right: 10px; right: 35px;
top: 6px; top: 6px;
} }
.composer_keyboard_btn { .composer_keyboard_btn {
right: 10px; right: 35px;
top: 6px; top: 6px;
} }
.im_send_keyboard_wrap { .im_send_keyboard_wrap {

50
app/partials/desktop/im.html

@ -211,56 +211,8 @@
</a> </a>
<a class="pull-left im_panel_own_photo" my-peer-photolink="draftMessage.isBroadcast ? historyPeer.id : ownID" img-class="im_panel_own_photo" watch="true" ng-click="openSettings()" no-open="true"></a> <a class="pull-left im_panel_own_photo" my-peer-photolink="draftMessage.isBroadcast ? historyPeer.id : ownID" img-class="im_panel_own_photo" watch="true" ng-click="openSettings()" no-open="true"></a>
<form my-send-form draft-message="draftMessage" mentions="mentions" commands="commands" class="im_send_form" ng-class="{im_send_form_empty: !draftMessage.text.length, composer_progress_enabled: draftMessage.inlineProgress}"> <div my-send-form draft-message="draftMessage" mentions="mentions" commands="commands"></div>
<div class="im_send_form_inline_results" my-inline-results="inlineResults"></div>
<div class="im_send_reply_wrap" ng-if="draftMessage.replyToMsgID > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.replyClear(true)"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<a class="im_message_reply_wrap" my-reply-message="draftMessage.replyToMsgID" watch="true" edit="{{draftMessage.type == 'edit'}}"></a>
</div>
<div class="im_send_reply_wrap im_send_fwds_wrap" ng-if="draftMessage.fwdMessages.length > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.fwdsClear()"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<div class="im_message_reply_wrap" my-forwarded-messages="draftMessage.fwdMessages"></div>
</div>
<div class="im_send_field_wrap hasselect" ng-class="historyState.replyKeyboard._ == 'replyKeyboardMarkup' ? 'im_send_field_wrap_2ndbtn' : ''">
<a class="composer_emoji_insert_btn"><i class="icon icon-emoji"></i></a>
<div class="composer_progress_icon_wrap">
<div class="composer_progress_icon" my-arc-progress width="22" stroke="2.5"></div>
</div>
<a class="composer_command_btn" ng-show="!historyState.replyKeyboard && commands.list.length > 0 && (!draftMessage.text.length || draftMessage.text == '/')" ng-mousedown="toggleSlash($event)" ng-class="draftMessage.text[0] == '/' ? 'active' : ''"><i class="icon icon-slash"></i></a>
<a class="composer_keyboard_btn" ng-show="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-mousedown="replyKeyboardToggle($event)" ng-class="!historyState.replyKeyboard.pFlags.hidden ? 'active' : ''"><i class="icon icon-keyboard"></i></a>
<div class="im_send_dropbox_wrap" my-i18n="im_photos_drop_text"></div>
<textarea ng-model="draftMessage.text" class="form-control im_message_field no_outline" dir="auto" ng-trim="false"></textarea>
</div>
<div class="im_send_buttons_wrap clearfix">
<button type="submit" class="btn btn-md im_submit" ng-class="draftMessage.type == 'edit' ? 'im_submit_edit' : 'im_submit_send'">
<span class="im_submit_send_label nocopy" my-i18n="im_submit_message"></span>
<span class="im_submit_edit_label nocopy" my-i18n="im_submit_edit_message"></span>
</button>
<div class="im_attach pull-left">
<input type="file" class="im_attach_input" size="28" multiple="multiple" title="{{'im_attach_file_title' | i18n}}" />
<i class="icon icon-paperclip"></i>
</div>
<div class="im_media_attach pull-left">
<input type="file" class="im_media_attach_input" size="28" multiple="multiple" accept="image/*, video/*, audio/*" title="{{'im_media_attach_title' | i18n}}"/>
<i class="icon icon-camera"></i>
</div>
<div class="composer_emoji_panel"></div>
</div>
<div class="im_send_keyboard_wrap" ng-if="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-show="!historyState.replyKeyboard.pFlags.hidden">
<div my-reply-markup="historyState.replyKeyboard"></div>
</div>
</form>
</div> </div>
</div> </div>

50
app/partials/desktop/send_form.html

@ -0,0 +1,50 @@
<form class="im_send_form" ng-class="{im_send_form_empty: !draftMessage.text.length, composer_progress_enabled: draftMessage.inlineProgress}">
<div class="im_send_form_inline_results" my-inline-results="inlineResults"></div>
<div class="im_send_reply_wrap" ng-if="draftMessage.replyToMsgID > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.replyClear(true)"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<a class="im_message_reply_wrap" my-reply-message="draftMessage.replyToMsgID" watch="true" edit="{{draftMessage.type == 'edit'}}"></a>
</div>
<div class="im_send_reply_wrap im_send_fwds_wrap" ng-if="draftMessage.fwdMessages.length > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.fwdsClear()"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<div class="im_message_reply_wrap" my-forwarded-messages="draftMessage.fwdMessages"></div>
</div>
<div class="im_send_field_wrap hasselect" ng-class="historyState.replyKeyboard._ == 'replyKeyboardMarkup' ? 'im_send_field_wrap_2ndbtn' : ''">
<a class="composer_emoji_insert_btn"><i class="icon icon-emoji"></i></a>
<div class="composer_progress_icon_wrap">
<div class="composer_progress_icon" my-arc-progress width="22" stroke="2.5"></div>
</div>
<a class="composer_command_btn" ng-show="!historyState.replyKeyboard && commands.list.length > 0 && (!draftMessage.text.length || draftMessage.text == '/')" ng-mousedown="draftMessage.toggleSlash($event)" ng-class="draftMessage.text[0] == '/' ? 'active' : ''"><i class="icon icon-slash"></i></a>
<a class="composer_keyboard_btn" ng-show="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-mousedown="draftMessage.replyKeyboardToggle($event)" ng-class="!historyState.replyKeyboard.pFlags.hidden ? 'active' : ''"><i class="icon icon-keyboard"></i></a>
<div class="im_send_dropbox_wrap" my-i18n="im_photos_drop_text"></div>
<textarea ng-model="draftMessage.text" class="form-control im_message_field no_outline" dir="auto" ng-trim="false"></textarea>
</div>
<div class="im_send_buttons_wrap clearfix">
<button type="submit" class="btn btn-md im_submit" ng-class="draftMessage.type == 'edit' ? 'im_submit_edit' : 'im_submit_send'">
<span class="im_submit_send_label nocopy" my-i18n="im_submit_message"></span>
<span class="im_submit_edit_label nocopy" my-i18n="im_submit_edit_message"></span>
</button>
<div class="im_attach pull-left">
<input type="file" class="im_attach_input" size="28" multiple="multiple" title="{{'im_attach_file_title' | i18n}}" />
<i class="icon icon-paperclip"></i>
</div>
<div class="im_media_attach pull-left">
<input type="file" class="im_media_attach_input" size="28" multiple="multiple" accept="image/*, video/*, audio/*" title="{{'im_media_attach_title' | i18n}}"/>
<i class="icon icon-camera"></i>
</div>
<div class="composer_emoji_panel"></div>
</div>
<div class="im_send_keyboard_wrap" ng-if="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-show="!historyState.replyKeyboard.pFlags.hidden">
<div my-reply-markup="historyState.replyKeyboard"></div>
</div>
</form>

57
app/partials/mobile/im.html

@ -131,65 +131,12 @@
</div> </div>
</div> </div>
<div class="im_send_panel_wrap" ng-show="!historyState.actions()" ng-class="{im_voice_recording: voiceRecorder.recording, im_processing_recording: voiceRecorder.processing}"> <div class="im_send_panel_wrap" ng-show="!historyState.actions()">
<div class="im_send_form_wrap1"> <div class="im_send_form_wrap1">
<div class="im_send_form_wrap clearfix" ng-controller="AppImSendController"> <div class="im_send_form_wrap clearfix" ng-controller="AppImSendController">
<form my-send-form draft-message="draftMessage" mentions="mentions" commands="commands" class="im_send_form" ng-class="{im_send_form_empty: !draftMessage.text.length && draftMessage.type != 'edit', composer_progress_enabled: draftMessage.inlineProgress}"> <div my-send-form draft-message="draftMessage" mentions="mentions" commands="commands"></div>
<div class="im_send_reply_wrap" ng-if="draftMessage.replyToMsgID > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.replyClear(true)"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<a class="im_message_reply_wrap" my-reply-message="draftMessage.replyToMsgID" watch="true" edit="{{draftMessage.type == 'edit'}}"></a>
</div>
<div class="im_send_reply_wrap im_send_fwds_wrap" ng-if="draftMessage.fwdMessages.length > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.fwdsClear()"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<div class="im_message_reply_wrap" my-forwarded-messages="draftMessage.fwdMessages"></div>
</div>
<div class="im_send_field_panel">
<div class="im_send_field_wrap" ng-class="historyState.replyKeyboard._ == 'replyKeyboardMarkup' ? 'im_send_field_wrap_2ndbtn' : ''">
<a class="composer_command_btn" ng-show="!historyState.replyKeyboard && commands.list.length > 0 && (!draftMessage.text.length || draftMessage.text[0] == '/')" ng-mousedown="toggleSlash($event)" ng-class="draftMessage.text[0] == '/' ? 'active' : ''"><i class="icon icon-slash"></i></a>
<a class="composer_keyboard_btn" ng-show="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-mousedown="replyKeyboardToggle($event)" ng-class="!historyState.replyKeyboard.pFlags.hidden ? 'active' : ''"><i class="icon icon-keyboard"></i></a>
<div class="composer_progress_icon_wrap">
<div class="composer_progress_icon" my-arc-progress width="22" stroke="2.5"></div>
</div>
<div class="im_send_dropbox_wrap" my-i18n="im_photos_drop_text"></div>
<textarea ng-model="draftMessage.text" class="form-control im_message_field no_outline" dir="auto" ng-trim="false"></textarea>
</div>
<div class="im_voice_recorder_wrap">
<div class="im_recorder_indicator"><i></i></div>
<div class="im_recorder_time" ng-bind="voiceRecorder.duration | duration"></div>
<div class="im_recorder_label">
<i class="icon icon-back"></i>
<span my-i18n="im_voice_recorder_label"></span>
</div>
</div>
<div class="im_attach pull-right">
<input type="file" class="im_attach_input" size="28" multiple="true" title="{{'im_media_attach_title' | i18n}}" />
<i class="icon icon-paperclip"></i>
</div>
<div class="im_record pull-right">
<i class="icon icon-mic"></i>
</div>
<a class="composer_emoji_insert_btn pull-right"><i class="icon icon-emoji"></i></a>
<button type="submit" class="btn btn-success im_submit"></button>
</div>
<div class="im_send_keyboard_wrap" ng-if="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-show="!historyState.replyKeyboard.pFlags.hidden">
<div my-reply-markup="historyState.replyKeyboard"></div>
</div>
</form>
</div> </div>
</div> </div>

55
app/partials/mobile/send_form.html

@ -0,0 +1,55 @@
<form class="im_send_form" ng-class="{im_send_form_empty: !draftMessage.text.length && draftMessage.type != 'edit', composer_progress_enabled: draftMessage.inlineProgress, im_voice_recording: voiceRecorder.recording, im_processing_recording: voiceRecorder.processing}">
<div class="im_send_reply_wrap" ng-if="draftMessage.replyToMsgID > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.replyClear(true)"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<a class="im_message_reply_wrap" my-reply-message="draftMessage.replyToMsgID" watch="true" edit="{{draftMessage.type == 'edit'}}"></a>
</div>
<div class="im_send_reply_wrap im_send_fwds_wrap" ng-if="draftMessage.fwdMessages.length > 0">
<a class="im_send_reply_cancel" ng-mousedown="draftMessage.fwdsClear()"><i class="icon icon-reply-bar"></i><i class="icon icon-reply-bar"></i></a>
<div class="im_message_reply_wrap" my-forwarded-messages="draftMessage.fwdMessages"></div>
</div>
<div class="im_send_field_panel">
<div class="im_voice_recorder_wrap">
<div class="im_recorder_indicator"><i></i></div>
<div class="im_recorder_time" ng-bind="voiceRecorder.duration | duration"></div>
<div class="im_recorder_label" ng-switch="voiceRecorder.processing" my-i18n>
<span ng-switch-when="true" my-i18n-format="im_voice_processing_label"></span>
<span ng-switch-default my-i18n-format="im_voice_recording_label"></span>
<my-i18n-param name="dots"></my-i18n-param>
</div>
</div>
<div class="im_send_field_wrap" ng-class="historyState.replyKeyboard._ == 'replyKeyboardMarkup' ? 'im_send_field_wrap_2ndbtn' : ''">
<a class="composer_emoji_insert_btn pull-right"><i class="icon icon-emoji"></i></a>
<a class="composer_command_btn" ng-show="!historyState.replyKeyboard && commands.list.length > 0 && (!draftMessage.text.length || draftMessage.text[0] == '/')" ng-mousedown="draftMessage.toggleSlash($event)" ng-class="draftMessage.text[0] == '/' ? 'active' : ''"><i class="icon icon-slash"></i></a>
<a class="composer_keyboard_btn" ng-show="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-mousedown="draftMessage.replyKeyboardToggle($event)" ng-class="!historyState.replyKeyboard.pFlags.hidden ? 'active' : ''"><i class="icon icon-keyboard"></i></a>
<div class="composer_progress_icon_wrap">
<div class="composer_progress_icon" my-arc-progress width="22" stroke="2.5"></div>
</div>
<div class="im_send_dropbox_wrap" my-i18n="im_photos_drop_text"></div>
<textarea ng-model="draftMessage.text" class="form-control im_message_field no_outline" dir="auto" ng-trim="false"></textarea>
</div>
<div class="im_attach pull-left">
<input type="file" class="im_attach_input" size="28" multiple="true" title="{{'im_media_attach_title' | i18n}}" />
<i class="icon icon-paperclip"></i>
</div>
<div class="im_record pull-right">
<i class="icon icon-mic"></i>
</div>
<button type="submit" class="btn btn-success im_submit"></button>
</div>
<div class="im_send_keyboard_wrap" ng-if="historyState.replyKeyboard._ == 'replyKeyboardMarkup'" ng-show="!historyState.replyKeyboard.pFlags.hidden">
<div my-reply-markup="historyState.replyKeyboard"></div>
</div>
</form>

3
app/vendor/recorderjs/recorder.js vendored

@ -185,6 +185,9 @@ var root = (typeof self === 'object' && self.self === self && self) || (typeof g
this.clearStream(); this.clearStream();
} }
this.audioContext.close();
this.audioContext = null;
this.encoder.postMessage({ command: "done" }); this.encoder.postMessage({ command: "done" });
} }
}; };

Loading…
Cancel
Save