Skip to content
This repository has been archived by the owner. It is now read-only.
Permalink
Browse files

Modified TrayToolbar for Cliqz branding

- Removed delete button
- Moved `New Tab` button in the middle
- Added `Done` button to the right with Long press gesture to close all tabs
- Changed the look and feel of the private mode button
- Changed coloring for toolbar and tab tray toolbar
  • Loading branch information
mahmoud-adam85 authored and Tim Palade committed May 9, 2018
1 parent 5242ef1 commit 2e67e3bd182b482252d94c18ada200249fd63ead
@@ -43,6 +43,7 @@
0BF42D4F1A7CD09600889E28 /* TestFavicons.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0BF42D4E1A7CD09600889E28 /* TestFavicons.swift */; };
0BF8F8DA1AEFF1C900E90BC2 /* noTitle.html in Resources */ = {isa = PBXBuildFile; fileRef = 0BF8F8D91AEFF1C900E90BC2 /* noTitle.html */; };
19DE1F671EC13B6400428B8C /* LeanplumIntegration.swift in Sources */ = {isa = PBXBuildFile; fileRef = 19DE1F661EC13B6400428B8C /* LeanplumIntegration.swift */; };
1E3C5388209AFEDA00286CA4 /* TabTrayDoneButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1E3C5387209AFEDA00286CA4 /* TabTrayDoneButton.swift */; };
1E3CBC152057D83700898B05 /* CliqzAppSettingsTableViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1E3CBC142057D83700898B05 /* CliqzAppSettingsTableViewController.swift */; };
1E3CBC1D205806F000898B05 /* DateExtension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1E3CBC1C205806F000898B05 /* DateExtension.swift */; };
1E3FBF59207763FE00FAE3FD /* BrowserViewController+Connect.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1E3FBF58207763FE00FAE3FD /* BrowserViewController+Connect.swift */; };
@@ -72,6 +73,8 @@
1EDF0B24207B86DA00856493 /* QuerySuggestions.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EDF0B23207B86DA00856493 /* QuerySuggestions.swift */; };
1EDF91742087446700200100 /* SettingsActivity.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EDF91732087446700200100 /* SettingsActivity.swift */; };
1EDF917820874DAA00200100 /* ShareExtensionActivities.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EDF917720874DAA00200100 /* ShareExtensionActivities.swift */; };
1EDF91C5208A33C500200100 /* TabTrayControllerExtension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EDF91C4208A33C500200100 /* TabTrayControllerExtension.swift */; };
1EDF91C9208DDC5400200100 /* CliqzForgetModeButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EDF91C8208DDC5400200100 /* CliqzForgetModeButton.swift */; };
1EEA368120613C17003B6AD5 /* SendCrashReportsTableViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EEA368020613C17003B6AD5 /* SendCrashReportsTableViewController.swift */; };
1EEA369520615725003B6AD5 /* DownloadManager.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EEA369420615725003B6AD5 /* DownloadManager.swift */; };
1EEA36D52063E105003B6AD5 /* FileManagerExtension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1EEA36D42063E105003B6AD5 /* FileManagerExtension.swift */; };
@@ -1511,6 +1514,7 @@
0BF8F8D91AEFF1C900E90BC2 /* noTitle.html */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.html; path = noTitle.html; sourceTree = "<group>"; };
19DE1F661EC13B6400428B8C /* LeanplumIntegration.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = LeanplumIntegration.swift; sourceTree = "<group>"; };
1E066FAB204D5B1C0017C800 /* Client.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = Client.entitlements; sourceTree = "<group>"; };
1E3C5387209AFEDA00286CA4 /* TabTrayDoneButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabTrayDoneButton.swift; sourceTree = "<group>"; };
1E3CBC142057D83700898B05 /* CliqzAppSettingsTableViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CliqzAppSettingsTableViewController.swift; sourceTree = "<group>"; };
1E3CBC162058057700898B05 /* CliqzAppSettingsOptions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CliqzAppSettingsOptions.swift; sourceTree = "<group>"; };
1E3CBC1C205806F000898B05 /* DateExtension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DateExtension.swift; sourceTree = "<group>"; };
@@ -1540,6 +1544,8 @@
1EDF0B23207B86DA00856493 /* QuerySuggestions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = QuerySuggestions.swift; sourceTree = "<group>"; };
1EDF91732087446700200100 /* SettingsActivity.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SettingsActivity.swift; sourceTree = "<group>"; };
1EDF917720874DAA00200100 /* ShareExtensionActivities.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShareExtensionActivities.swift; sourceTree = "<group>"; };
1EDF91C4208A33C500200100 /* TabTrayControllerExtension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabTrayControllerExtension.swift; sourceTree = "<group>"; };
1EDF91C8208DDC5400200100 /* CliqzForgetModeButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CliqzForgetModeButton.swift; sourceTree = "<group>"; };
1EEA368020613C17003B6AD5 /* SendCrashReportsTableViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SendCrashReportsTableViewController.swift; sourceTree = "<group>"; };
1EEA369420615725003B6AD5 /* DownloadManager.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DownloadManager.swift; sourceTree = "<group>"; };
1EEA36D42063E105003B6AD5 /* FileManagerExtension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FileManagerExtension.swift; sourceTree = "<group>"; };
@@ -2662,6 +2668,16 @@
path = "Share Menu";
sourceTree = "<group>";
};
1EDF91B5208A339800200100 /* Tab Tray */ = {
isa = PBXGroup;
children = (
1EDF91C4208A33C500200100 /* TabTrayControllerExtension.swift */,
1EDF91C8208DDC5400200100 /* CliqzForgetModeButton.swift */,
1E3C5387209AFEDA00286CA4 /* TabTrayDoneButton.swift */,
);
path = "Tab Tray";
sourceTree = "<group>";
};
282731601ABC9BE600AA1954 /* Supporting Files */ = {
isa = PBXGroup;
children = (
@@ -3303,6 +3319,7 @@
4F8F3C0D202CB39F001C1A0F /* Cliqz */ = {
isa = PBXGroup;
children = (
1EDF91B5208A339800200100 /* Tab Tray */,
1EDF91722087445600200100 /* Share Menu */,
1E7B769F206B9C4900FD0BA5 /* Connect */,
1EDF0B20207B868000856493 /* QuerySuggestions */,
@@ -6373,6 +6390,7 @@
7BA8D1C71BA037F500C8AE9E /* OpenInHelper.swift in Sources */,
E4B423BE1AB9FE6A007E66C8 /* ReaderModeCache.swift in Sources */,
4F30F5172051670C0049E4F6 /* Telemetry.swift in Sources */,
1EDF91C9208DDC5400200100 /* CliqzForgetModeButton.swift in Sources */,
AF99C8A2206935F0009404FF /* GhosteryButton.swift in Sources */,
4F30F50F2051670C0049E4F6 /* JSBridgeBridge.m in Sources */,
74E36D781B71323500D69DA1 /* SettingsContentViewController.swift in Sources */,
@@ -6415,6 +6433,7 @@
C4F3B29A1CFCF93A00966259 /* ButtonToast.swift in Sources */,
AF7FDDBC205949AA00AA2280 /* ExpandableView.swift in Sources */,
D31A0FC71A65D6D000DC8C7E /* SearchSuggestClient.swift in Sources */,
1EDF91C5208A33C500200100 /* TabTrayControllerExtension.swift in Sources */,
A83E5AB71C1D993D0026D912 /* UIPasteboardExtensions.swift in Sources */,
D0E55C4F1FB4FD23006DC274 /* FormPostHelper.swift in Sources */,
E650754E1E37F6AE006961AC /* GeometryExtensions.swift in Sources */,
@@ -6510,6 +6529,7 @@
4F3FA4E32044194400A9E7F6 /* ColorExtension.swift in Sources */,
D3972BF31C22412B00035B87 /* ShareExtensionHelper.swift in Sources */,
4F30F5182051670C0049E4F6 /* TelemetryBridge.m in Sources */,
1E3C5388209AFEDA00286CA4 /* TabTrayDoneButton.swift in Sources */,
4F30F5132051670C0049E4F6 /* ShareCardModule.swift in Sources */,
4F30F5162051670C0049E4F6 /* SubscriptionModuleBridge.m in Sources */,
4F30F51B2051670C0049E4F6 /* Engine.swift in Sources */,
@@ -241,6 +241,9 @@ private func headerTransform(_ frame: CGRect, toFrame finalFrame: CGRect, contai

//MARK: Private Helper Methods
private func calculateCollapsedCellFrameUsingCollectionView(_ collectionView: UICollectionView, atIndex index: Int) -> CGRect {
// Cliqz: added check to prevent charing the app when clicking does after swtiching forget mode state
guard collectionView.numberOfItems(inSection: 0) > index else { return .zero}

if let attr = collectionView.collectionViewLayout.layoutAttributesForItem(at: IndexPath(item: index, section: 0)) {
return collectionView.convert(attr.frame, to: collectionView.superview)
} else {
@@ -187,9 +187,15 @@ class ToolbarButton: UIButton {

extension ToolbarButton: Themeable {
func applyTheme(_ theme: Theme) {
/* Cliqz: Changed the tint colors for the toolbar button
selectedTintColor = UIColor.ToolbarButton.SelectedTint.colorFor(theme)
disabledTintColor = UIColor.ToolbarButton.DisabledTint.colorFor(theme)
unselectedTintColor = UIColor.Browser.Tint.colorFor(theme)
*/
selectedTintColor = UIColor.CliqzToolbarButton.SelectedTint.colorFor(theme)
disabledTintColor = UIColor.CliqzToolbarButton.DisabledTint.colorFor(theme)
unselectedTintColor = UIColor.CliqzToolbarButton.UnselectedTint.colorFor(theme)

tintColor = isEnabled ? unselectedTintColor : disabledTintColor
imageView?.tintColor = tintColor
}
@@ -288,7 +294,10 @@ extension TabToolbar: TabToolbarProtocol {

extension TabToolbar: Themeable {
func applyTheme(_ theme: Theme) {
/* Cliqz: Changed the background color of the tab toolbar
backgroundColor = UIColor.Browser.Background.colorFor(theme)
*/
backgroundColor = UIColor.CliqzToolbar.Background.colorFor(theme)
helper?.setTheme(theme: theme, forButtons: actionButtons)
}
}
@@ -242,13 +242,24 @@ class TabTrayController: UIViewController {
var collectionView: UICollectionView!
var draggedCell: TabCell?
var dragOffset: CGPoint = .zero
/* Cliqz: use CliqzTrayToolbar
lazy var toolbar: TrayToolbar = {
let toolbar = TrayToolbar()
toolbar.addTabButton.addTarget(self, action: #selector(didClickAddTab), for: .touchUpInside)
toolbar.maskButton.addTarget(self, action: #selector(didTogglePrivateMode), for: .touchUpInside)
toolbar.deleteButton.addTarget(self, action: #selector(didTapDelete), for: .touchUpInside)
return toolbar
}()
*/
lazy var toolbar: CliqzTrayToolbar = {
let toolbar = CliqzTrayToolbar()
toolbar.addTabButton.addTarget(self, action: #selector(didClickAddTab), for: .touchUpInside)
toolbar.forgetModeButton.addTarget(self, action: #selector(didTogglePrivateMode), for: .touchUpInside)
toolbar.doneButton.addTarget(self, action: #selector(didTapDone), for: .touchUpInside)
toolbar.doneButton.addGestureRecognizer(UILongPressGestureRecognizer(target: self, action: #selector(SELlongPressDoneButton)))
return toolbar
}()


fileprivate(set) internal var privateMode: Bool = false {
didSet {
@@ -448,6 +459,10 @@ class TabTrayController: UIViewController {
let exitingPrivateMode = !privateMode && tabManager.shouldClearPrivateTabs()

toolbar.maskButton.setSelected(privateMode, animated: true)

// Cliqz: togol forgetmode button
toolbar.forgetModeButton.setSelected(privateMode, animated: true)

collectionView.layoutSubviews()

let toView: UIView
@@ -1062,3 +1077,57 @@ class TrayToolbar: UIView {
maskButton.applyTheme(theme)
}
}

// Cliqz: customize TabTrayToolbar
class CliqzTrayToolbar : TrayToolbar {
lazy var doneButton = TabTrayDoneButton()

lazy var forgetModeButton = CliqzForgetModeButton()

override lazy var addTabButton: UIButton = {
let button = UIButton()
button.setImage(UIImage.templateImageNamed("cliqz-nav-add"), for: .normal)
button.accessibilityLabel = NSLocalizedString("Add Tab", comment: "Accessibility label for the Add Tab button in the Tab Tray.")
button.accessibilityIdentifier = "TabTrayController.addTabButton"
return button
}()

override init(frame: CGRect) {
super.init(frame: frame)
deleteButton.removeFromSuperview()
maskButton.removeFromSuperview()

addSubview(doneButton)
addSubview(forgetModeButton)

doneButton.snp.makeConstraints { make in
make.top.equalTo(self)
make.right.equalTo(self).offset(-sideOffset)
make.size.equalTo(toolbarButtonSize)
}

addTabButton.snp.remakeConstraints { make in
make.centerX.equalTo(self)
make.top.equalTo(self)
make.size.equalTo(toolbarButtonSize)
}

forgetModeButton.snp.remakeConstraints { make in
make.centerY.equalTo(self)
make.left.equalTo(self).offset(sideOffset)
make.size.equalTo(CGSize(width: 64, height: 34))
}
}

required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}

override fileprivate func applyTheme(_ theme: Theme) {
super.applyTheme(theme)
doneButton.applyTheme(theme)
forgetModeButton.applyTheme(theme)
backgroundColor = UIColor.CliqzToolbar.Background.colorFor(theme)
addTabButton.tintColor = UIColor.CliqzToolbarButton.UnselectedTint.colorFor(theme)
}
}
@@ -27,4 +27,19 @@ extension UIColor {
static let cliqzGreenDarkFunctional = UIColor(colorString: "67A73A")
static let cliqzPinkFunctional = UIColor(colorString: "FF7E74")
static let cliqzGrayFunctional = UIColor(colorString: "97A4AE")


struct CliqzTabTray {
static let ButtonText = BrowserColor(normal: cliqzWhitePrimary, pbm: cliqzWhitePrimary)
}

struct CliqzToolbarButton {
static let SelectedTint = BrowserColor(normal: UIColor.gray, pbm: UIColor.gray)
static let DisabledTint = BrowserColor(normal: UIColor.gray, pbm: UIColor.gray)
static let UnselectedTint = BrowserColor(normal: UIColor.white, pbm: UIColor.white)
}

struct CliqzToolbar {
static let Background = BrowserColor(normal: UIColor.black, pbm: UIColor.black)
}
}
@@ -0,0 +1,23 @@
{
"images" : [
{
"idiom" : "universal",
"filename" : "plus.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"filename" : "plus@2x.png",
"scale" : "2x"
},
{
"idiom" : "universal",
"filename" : "plus@3x.png",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,37 @@
//
// CliqzForgetModeButton.swift
// Client
//
// Created by Mahmoud Adam on 4/23/18.
// Copyright © 2018 Cliqz. All rights reserved.
//
import UIKit
import QuartzCore

class CliqzForgetModeButton: UIButton, Themeable {
override init(frame: CGRect) {
super.init(frame: frame)
setTitle(NSLocalizedString("Forget", tableName: "Cliqz", comment: "Forget toogle button in tab overview"), for: [])
self.accessibilityIdentifier = "TabTrayController.forgetModeButton"
self.layer.cornerRadius = 5.0
self.layer.masksToBounds = true
}

required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}

func applyTheme(_ theme: Theme) {
setTitleColor(UIColor.CliqzTabTray.ButtonText.colorFor(theme), for: [])
}

func setSelected(_ selected: Bool, animated: Bool = true) {
self.isSelected = selected
let duration = animated ? 0.4 : 0.0
UIView.transition(with: self, duration:duration, options: .curveEaseInOut, animations: {
self.backgroundColor = selected ? UIColor.cliqzBluePrimary : UIColor.clear
})
}

}
@@ -0,0 +1,22 @@
//
// TabTrayControllerExtension.swift
// Client
//
// Created by Mahmoud Adam on 4/20/18.
// Copyright © 2018 Cliqz. All rights reserved.
//
import UIKit

extension TabTrayController {

func didTapDone() {
_ = self.navigationController?.popViewController(animated: true)
}

func SELlongPressDoneButton(_ recognizer: UILongPressGestureRecognizer) {
if recognizer.state == .began {
self.didTapDelete(self.toolbar.doneButton)
}
}
}
@@ -0,0 +1,27 @@
//
// TabTrayDoneButton.swift
// Client
//
// Created by Mahmoud Adam on 5/3/18.
// Copyright © 2018 Cliqz. All rights reserved.
//
import UIKit

class TabTrayDoneButton: UIButton, Themeable {

override init(frame: CGRect) {
super.init(frame: frame)
let title = NSLocalizedString("Done", tableName: "Cliqz", comment: "Done button in the tabTray Toolbar")
setTitle(title, for: .normal)
accessibilityIdentifier = "TabTrayController.doneButton"
}

required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}

func applyTheme(_ theme: Theme) {
setTitleColor(UIColor.CliqzTabTray.ButtonText.colorFor(theme), for: [])
}
}

0 comments on commit 2e67e3b

Please sign in to comment.