From dce272462ada65496de52786f9e10fdee9ca2c05 Mon Sep 17 00:00:00 2001 From: Paulo Reis Date: Tue, 22 Nov 2016 10:39:56 +0000 Subject: [PATCH 1/3] Remove test-related mark-up. --- .../web/app/views/project/editor/header.jade | 463 ++++-------------- 1 file changed, 100 insertions(+), 363 deletions(-) diff --git a/services/web/app/views/project/editor/header.jade b/services/web/app/views/project/editor/header.jade index 02cec9d2ca..d5de9c99b5 100644 --- a/services/web/app/views/project/editor/header.jade +++ b/services/web/app/views/project/editor/header.jade @@ -1,380 +1,117 @@ -div(ng-if="!shouldABTestHeaderLabels") - header.toolbar.toolbar-header( - ng-cloak, - ng-hide="state.loading" - ) +header.toolbar.toolbar-header.toolbar-with-labels( + ng-cloak, + ng-hide="state.loading" +) + .toolbar-left a.btn.btn-full-height( href, - ng-click="ui.leftMenuShown = true" - tooltip='#{translate("menu")}', - tooltip-placement="bottom", - tooltip-append-to-body="true", + ng-click="ui.leftMenuShown = true;", ) i.fa.fa-fw.fa-bars + p.toolbar-label #{translate("menu")} a( href="/project" - tooltip="#{translate('back_to_projects')}", - tooltip-placement="bottom", - tooltip-append-to-body="true" ) i.fa.fa-fw.fa-level-up - - span(ng-controller="PdfViewToggleController") - a( - href, - ng-show="ui.pdfLayout == 'flat' && fileTreeClosed", - tooltip="PDF", - tooltip-placement="bottom", - tooltip-append-to-body="true", - ng-click="togglePdfView()", - ng-class="{ 'active': ui.view == 'pdf' }" - ) - i.fa.fa-file-pdf-o - .toolbar-center.project-name(ng-controller="ProjectNameController") - span.name( - ng-dblclick="!permissions.admin || startRenaming()", - ng-show="!state.renaming" - ) {{ project.name }} - - input.form-control( - type="text" - ng-model="inputs.name", - ng-show="state.renaming", - on-enter="finishRenaming()", - ng-blur="finishRenaming()", - select-name-when="state.renaming" - ) - - a.rename( - ng-if="permissions.admin", - href='#', - tooltip-placement="bottom", - tooltip="#{translate('rename')}", - tooltip-append-to-body="true", - ng-click="startRenaming()", - ng-show="!state.renaming" - ) - i.fa.fa-pencil - - .toolbar-right - span.online-users( - ng-show="onlineUsersArray.length > 0" - ng-controller="OnlineUsersController" - ) - span(ng-if="onlineUsersArray.length < 4") - span.online-user( - ng-repeat="user in onlineUsersArray", - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }", - popover="{{ user.name }}" - popover-placement="bottom" - popover-append-to-body="true" - popover-trigger="mouseenter" - ng-click="gotoUser(user)" - ) {{ user.name.slice(0,1) }} - - span.dropdown(dropdown, ng-if="onlineUsersArray.length >= 4") - span.online-user.online-user-multi( - dropdown-toggle, - tooltip="#{translate('connected_users')}", - tooltip-placement="left" - ) - strong {{ onlineUsersArray.length }} - i.fa.fa-fw.fa-user - ul.dropdown-menu.pull-right - li.dropdown-header #{translate('connected_users')} - li(ng-repeat="user in onlineUsersArray") - a(href, ng-click="gotoUser(user)") - span.online-user( - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }" - ) {{ user.name.slice(0,1) }} - | {{ user.name }} - - - a.btn.btn-full-height( - href, - ng-if="permissions.admin", - tooltip="#{translate('share')}", - tooltip-placement="bottom", - ng-click="openShareProjectModal()", - ng-controller="ShareController", - ) - i.fa.fa-fw.fa-group - a.btn.btn-full-height( - href, - ng-click="toggleHistory()", - ng-class="{ active: (ui.view == 'history') }" - tooltip="#{translate('recent_changes')}", - tooltip-placement="bottom", - ) - i.fa.fa-fw.fa-history - a.btn.btn-full-height( - href, - tooltip="#{translate('chat')}", - tooltip-placement="bottom", - ng-class="{ active: ui.chatOpen }", - ng-click="toggleChat()", - ng-controller="ChatButtonController", - ng-show="!anonymous", - ) - i.fa.fa-fw.fa-comment( - ng-class="{ 'bounce': unreadMessages > 0 }" - ) - span.label.label-info( - ng-show="unreadMessages > 0" - ) {{ unreadMessages }} - -div(ng-if="shouldABTestHeaderLabels") - div(sixpack-switch="editor-header") - header.toolbar.toolbar-header( - ng-cloak, - ng-hide="state.loading" - sixpack-default + span(ng-controller="PdfViewToggleController") + a( + href, + ng-show="ui.pdfLayout == 'flat' && fileTreeClosed", + tooltip="PDF", + tooltip-placement="bottom", + tooltip-append-to-body="true", + ng-click="togglePdfView()", + ng-class="{ 'active': ui.view == 'pdf' }" ) - a.btn.btn-full-height( - href, - ng-click="ui.leftMenuShown = true; trackABTestConversion('menu');" - tooltip='#{translate("menu")}', - tooltip-placement="bottom", - tooltip-append-to-body="true", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-bars - a( - href="/project" - tooltip="#{translate('back_to_projects')}", - tooltip-placement="bottom", - tooltip-append-to-body="true" - ) - i.fa.fa-fw.fa-level-up - - span(ng-controller="PdfViewToggleController") - a( - href, - ng-show="ui.pdfLayout == 'flat' && fileTreeClosed", - tooltip="PDF", - tooltip-placement="bottom", - tooltip-append-to-body="true", - ng-click="togglePdfView()", - ng-class="{ 'active': ui.view == 'pdf' }" - ) - i.fa.fa-file-pdf-o + i.fa.fa-file-pdf-o - .toolbar-center.project-name(ng-controller="ProjectNameController") - span.name( - ng-dblclick="!permissions.admin || startRenaming()", - ng-show="!state.renaming" - ) {{ project.name }} + .toolbar-center.project-name(ng-controller="ProjectNameController") + span.name( + ng-dblclick="!permissions.admin || startRenaming()", + ng-show="!state.renaming" + ) {{ project.name }} - input.form-control( - type="text" - ng-model="inputs.name", - ng-show="state.renaming", - on-enter="finishRenaming()", - ng-blur="finishRenaming()", - select-name-when="state.renaming" - ) - - a.rename( - ng-if="permissions.admin", - href='#', - tooltip-placement="bottom", - tooltip="#{translate('rename')}", - tooltip-append-to-body="true", - ng-click="startRenaming()", - ng-show="!state.renaming" - ) - i.fa.fa-pencil - - .toolbar-right - span.online-users( - ng-show="onlineUsersArray.length > 0" - ng-controller="OnlineUsersController" - ) - span(ng-if="onlineUsersArray.length < 4") - span.online-user( - ng-repeat="user in onlineUsersArray", - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }", - popover="{{ user.name }}" - popover-placement="bottom" - popover-append-to-body="true" - popover-trigger="mouseenter" - ng-click="gotoUser(user)" - ) {{ user.name.slice(0,1) }} - - span.dropdown(dropdown, ng-if="onlineUsersArray.length >= 4") - span.online-user.online-user-multi( - dropdown-toggle, - tooltip="#{translate('connected_users')}", - tooltip-placement="left" - ) - strong {{ onlineUsersArray.length }} - i.fa.fa-fw.fa-user - ul.dropdown-menu.pull-right - li.dropdown-header #{translate('connected_users')} - li(ng-repeat="user in onlineUsersArray") - a(href, ng-click="gotoUser(user)") - span.online-user( - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }" - ) {{ user.name.slice(0,1) }} - | {{ user.name }} - - - a.btn.btn-full-height( - href, - ng-if="permissions.admin", - tooltip="#{translate('share')}", - tooltip-placement="bottom", - ng-click="openShareProjectModal(); trackABTestConversion('share');", - ng-controller="ShareController", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-group - a.btn.btn-full-height( - href, - ng-click="toggleHistory(); trackABTestConversion('history');", - ng-class="{ active: (ui.view == 'history') }" - tooltip="#{translate('recent_changes')}", - tooltip-placement="bottom", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-history - a.btn.btn-full-height( - href, - tooltip="#{translate('chat')}", - tooltip-placement="bottom", - ng-class="{ active: ui.chatOpen }", - ng-click="toggleChat(); trackABTestConversion('chat');", - ng-controller="ChatButtonController", - ng-show="!anonymous", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-comment( - ng-class="{ 'bounce': unreadMessages > 0 }" - ) - span.label.label-info( - ng-show="unreadMessages > 0" - ) {{ unreadMessages }} - - header.toolbar.toolbar-header.toolbar-with-labels( - ng-cloak, - ng-hide="state.loading" - sixpack-when="labels" + input.form-control( + type="text" + ng-model="inputs.name", + ng-show="state.renaming", + on-enter="finishRenaming()", + ng-blur="finishRenaming()", + select-name-when="state.renaming" ) - .toolbar-left - a.btn.btn-full-height( - href, - ng-click="ui.leftMenuShown = true; trackABTestConversion('menu');", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-bars - p.toolbar-label #{translate("menu")} - a( - href="/project" - ) - i.fa.fa-fw.fa-level-up - span(ng-controller="PdfViewToggleController") - a( - href, - ng-show="ui.pdfLayout == 'flat' && fileTreeClosed", - tooltip="PDF", - tooltip-placement="bottom", - tooltip-append-to-body="true", - ng-click="togglePdfView()", - ng-class="{ 'active': ui.view == 'pdf' }" - ) - i.fa.fa-file-pdf-o - - .toolbar-center.project-name(ng-controller="ProjectNameController") - span.name( - ng-dblclick="!permissions.admin || startRenaming()", - ng-show="!state.renaming" - ) {{ project.name }} - - input.form-control( - type="text" - ng-model="inputs.name", - ng-show="state.renaming", - on-enter="finishRenaming()", - ng-blur="finishRenaming()", - select-name-when="state.renaming" - ) - - a.rename( - ng-if="permissions.admin", - href='#', - tooltip-placement="bottom", - tooltip="#{translate('rename')}", - tooltip-append-to-body="true", - ng-click="startRenaming()", - ng-show="!state.renaming" - ) - i.fa.fa-pencil - - .toolbar-right - span.online-users( - ng-show="onlineUsersArray.length > 0" - ng-controller="OnlineUsersController" - ) - span(ng-if="onlineUsersArray.length < 4") - span.online-user( - ng-repeat="user in onlineUsersArray", - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }", - popover="{{ user.name }}" - popover-placement="bottom" - popover-append-to-body="true" - popover-trigger="mouseenter" - ng-click="gotoUser(user)" - ) {{ user.name.slice(0,1) }} - - span.dropdown(dropdown, ng-if="onlineUsersArray.length >= 4") - span.online-user.online-user-multi( - dropdown-toggle, - tooltip="#{translate('connected_users')}", - tooltip-placement="left" - ) - strong {{ onlineUsersArray.length }} - i.fa.fa-fw.fa-user - ul.dropdown-menu.pull-right - li.dropdown-header #{translate('connected_users')} - li(ng-repeat="user in onlineUsersArray") - a(href, ng-click="gotoUser(user)") - span.online-user( - ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }" - ) {{ user.name.slice(0,1) }} - | {{ user.name }} + a.rename( + ng-if="permissions.admin", + href='#', + tooltip-placement="bottom", + tooltip="#{translate('rename')}", + tooltip-append-to-body="true", + ng-click="startRenaming()", + ng-show="!state.renaming" + ) + i.fa.fa-pencil + .toolbar-right + span.online-users( + ng-show="onlineUsersArray.length > 0" + ng-controller="OnlineUsersController" + ) + span(ng-if="onlineUsersArray.length < 4") + span.online-user( + ng-repeat="user in onlineUsersArray", + ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }", + popover="{{ user.name }}" + popover-placement="bottom" + popover-append-to-body="true" + popover-trigger="mouseenter" + ng-click="gotoUser(user)" + ) {{ user.name.slice(0,1) }} - a.btn.btn-full-height( - href, - ng-if="permissions.admin", - ng-click="openShareProjectModal(); trackABTestConversion('share');", - ng-controller="ShareController", - sixpack-convert="editor-header" + span.dropdown(dropdown, ng-if="onlineUsersArray.length >= 4") + span.online-user.online-user-multi( + dropdown-toggle, + tooltip="#{translate('connected_users')}", + tooltip-placement="left" ) - i.fa.fa-fw.fa-group - p.toolbar-label #{translate("share")} - a.btn.btn-full-height( - href, - ng-click="toggleHistory(); trackABTestConversion('history');", - ng-class="{ active: (ui.view == 'history') }", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-history - p.toolbar-label #{translate("history")} - a.btn.btn-full-height( - href, - ng-class="{ active: ui.chatOpen }", - ng-click="toggleChat(); trackABTestConversion('chat');", - ng-controller="ChatButtonController", - ng-show="!anonymous", - sixpack-convert="editor-header" - ) - i.fa.fa-fw.fa-comment( - ng-class="{ 'bounce': unreadMessages > 0 }" - ) - span.label.label-info( - ng-show="unreadMessages > 0" - ) {{ unreadMessages }} - p.toolbar-label #{translate("chat")} \ No newline at end of file + strong {{ onlineUsersArray.length }} + i.fa.fa-fw.fa-user + ul.dropdown-menu.pull-right + li.dropdown-header #{translate('connected_users')} + li(ng-repeat="user in onlineUsersArray") + a(href, ng-click="gotoUser(user)") + span.online-user( + ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }" + ) {{ user.name.slice(0,1) }} + | {{ user.name }} + + + a.btn.btn-full-height( + href, + ng-if="permissions.admin", + ng-click="openShareProjectModal();", + ng-controller="ShareController", + ) + i.fa.fa-fw.fa-group + p.toolbar-label #{translate("share")} + a.btn.btn-full-height( + href, + ng-click="toggleHistory();", + ng-class="{ active: (ui.view == 'history') }", + ) + i.fa.fa-fw.fa-history + p.toolbar-label #{translate("history")} + a.btn.btn-full-height( + href, + ng-class="{ active: ui.chatOpen }", + ng-click="toggleChat();", + ng-controller="ChatButtonController", + ng-show="!anonymous", + ) + i.fa.fa-fw.fa-comment( + ng-class="{ 'bounce': unreadMessages > 0 }" + ) + span.label.label-info( + ng-show="unreadMessages > 0" + ) {{ unreadMessages }} + p.toolbar-label #{translate("chat")} \ No newline at end of file From fab7ec3e9878e8bf661792be3483d22f62ccee55 Mon Sep 17 00:00:00 2001 From: Paulo Reis Date: Tue, 22 Nov 2016 10:50:29 +0000 Subject: [PATCH 2/3] Remove test-related tracking and analytics code. --- services/web/public/coffee/ide.coffee | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/services/web/public/coffee/ide.coffee b/services/web/public/coffee/ide.coffee index 9a87d0a06b..6fb69ec712 100644 --- a/services/web/public/coffee/ide.coffee +++ b/services/web/public/coffee/ide.coffee @@ -72,7 +72,6 @@ define [ } $scope.user = window.user - $scope.shouldABTestPlans = false if $scope.user.signUpDate >= '2016-10-27' $scope.shouldABTestPlans = true @@ -86,23 +85,6 @@ define [ $scope.ui.reviewPanelOpen = !$scope.ui.reviewPanelOpen $scope.$digest() - # Only run the header AB test for newly registered users. - _abTestStartDate = new Date(Date.UTC(2016, 8, 28)) - _userSignUpDate = new Date(window.user.signUpDate) - - $scope.shouldABTestHeaderLabels = _userSignUpDate > _abTestStartDate - $scope.headerLabelsABVariant = "" - - if ($scope.shouldABTestHeaderLabels) - sixpack.participate "editor-header", [ "default", "labels"], (chosenVariation) -> - $scope.headerLabelsABVariant = chosenVariation - - $scope.trackABTestConversion = (headerItem) -> - event_tracking.sendMB "header-ab-conversion", { - headerItem: headerItem, - variant: $scope.headerLabelsABVariant - } - # Tracking code. $scope.$watch "ui.view", (newView, oldView) -> if newView? and newView != "editor" and newView != "pdf" From 0bc52412eaf9886b0243ba799e2ceae0f2dbd75e Mon Sep 17 00:00:00 2001 From: Paulo Reis Date: Tue, 22 Nov 2016 10:59:20 +0000 Subject: [PATCH 3/3] Hide header labels in XS resolutions (i.e. up to 768px). --- services/web/public/stylesheets/app/editor/toolbar.less | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/services/web/public/stylesheets/app/editor/toolbar.less b/services/web/public/stylesheets/app/editor/toolbar.less index 30e826f6b1..a30b2897c4 100644 --- a/services/web/public/stylesheets/app/editor/toolbar.less +++ b/services/web/public/stylesheets/app/editor/toolbar.less @@ -138,12 +138,16 @@ } .toolbar-label { - display: inline-block; + display: none; margin: 0 4px; font-size: 12px; font-weight: 600; margin-bottom: 2px; vertical-align: middle; + + @media (min-width: @screen-sm-min) { + display: inline-block; + } } .editor-dark {