Opened 4 years ago

Closed 4 years ago

#3408 closed change (fixed)

Ghost Mode for Adblock Browser for iOS

Reported by: sven Assignee:
Priority: P2 Milestone: Adblock-Browser-for-iOS-1.3.0
Module: Adblock-Browser-for-iOS Keywords: salsita
Cc: mario, scheer Blocked By:
Blocking: Platform: Adblock Browser for iOS
Ready: yes Confidential: no
Tester: Unknown Verified working: no
Review URL(s):

Description (last modified by mario)

Background

The ghost mode is an equivalent to something that other browsers call incognito mode or private mode. We decided to implement such a method, too.
After closing a Ghost Mode tab, the browser history, search history, download history, web form history, cookies and temporary internet files within this tab will no longer be stored on the device.

What to change

1. Implement the logic to have a separate tab group (called ghost mode tabs), which deletes the mentioned data of a ghost mode tab, after closing it.

2. Implement the ghost mode user interface.

There are three states which are important for the ghost mode:

2.1. The general tab-view
2.2. The initial ghost mode tab-view
2.3. The ghost mode tab-view

To 2.1. The general tab-view - Style guide for general tab-view

The general tabs should behave such as they did in previous releases. Means that there is always, at least, one tab open. On the bottom of the tab-view, there will be another button next to the plus icon, which shows a ghost icon and a number in it. The number in that icon indicates how many ghost mode tabs are already open. Initially the number is 0.

Ghost icon for general tab-view

There are three different situations, which can exist.

2.1.1. The number of the ghost icon is 0, because you didn’t click that icon before.
2.1.2. The number of the ghost icon is 0, because there is no ghost mode tab open.
2.1.3. The number of the ghost icon is >0, because there are ghost mode tabs open already.

In case 2.1.1. and 2.1.2. we link to the initial ghost mode tab-view (2.2.). In case 2.1.3. we link to the ghost mode tab-view (2.3).

To 2.2. The initial ghost mode tab-view - Style guide for initial ghost mode

After clicking the ghost icon (situation: 2.1.1. and 2.1.2.) the button with the ghost icon will be replaced by a button with the general tab icon (+ number of opened general tabs opened). If you click the general tab icon, you will see the general tab-view again.

There are four things, which are different compared to general tab-view:

2.2.1. The white plus button will be replaced by a purple plus button
2.2.2. The ghost icon will be replaced by a white general tab icon, which indicates how many general tabs are open. You will return to the general tab-view after clicking that icon.
2.2.3. In the bottom navigation bar: The general tab icon will be replaced by a greyed out ghost icon with the number 0 in it.

Greyed out ghost icon for bottom bar

2.2.4. The initial ghost mode tab-view will not be closable and the ghost mode tab-view will be expanded, so that the full height will be used.

Transition between general tab-view to initial ghost mode tab-view:

  • The tabs, which are in the general tab-view will move to the left and disappear
  • While this is happening the tab-view background will expand in height and the swipe down indicator (the dark line on top of the tab-view) will disappear after the tab-view height reached the very top of the screen.
  • The content of the initial ghost mode tab-view will fade in from the right side of the screen

Transition step by step animated gif

The same transition should be used but backwards, after you clicked the general tab icon.
None of the bottom navigation bar items should be clickable, except the quick menu (Adblock Browser) icon.

The wording for the initial ghost mode tab-view (below the big ghost icon):

1.) Ghost Mode
2.) After closing a Ghost Mode tab, the browser history, search history, download history, web form history, cookies and temporary internet files within this tab will no longer be stored on your device.

After you clicked the purple plus button a new ghost mode tab will be opened. Which leads us to 2.3. the ghost mode tab-view with more than 0 tabs opened.

To 2.3. The ghost mode tab-view - Style guide ghost mode tab-view with at least one tab opened

There are two ways to see the ghost mode tab-view

2.3.1. You visited the initial ghost mode tab-view and clicked the purple plus icon
2.3.2. There are more than 0 ghost mode tabs opened already


To 2.3.1. You visited the initial ghost mode tab-view and clicked the purple plus icon

After you clicked the purple plus sign, the ghost mode tab-view background will fade out and will have a similar animation such as you know it from the general tab-view.

Transition step by step animated gif

The ghost icon in the bottom navigation bar will change its color from grey to purple and the number will change from 0 to 1.

Purple ghost icon for bottom bar

After that you will see the dashboard, as you know it from the general tabs.

To 2.3.2. There are more than 0 ghost mode tabs opened already

If you open the ghost mode tab-view, while one (or more) ghost mode tab is open, you will see a similar tab view, such as you know it from the general tab-view, but with minor changes (see style guide ghost mode tab-view with at least one tab opened).

The transition between the ghost mode tab-view (> 0 ghost mode tabs are open) and the general tab-view: The tab-view background stays the same, but only the content (opened tabs) will move from left to right, if you switch from ghost mode tab view to general tab-view, and from right to left, if you switch from general tab-view to ghost mode tab-view.

You will see the initial ghost mode tab-view, if you close all ghost mode tabs. The initial tab-view will be displayed with the transition described in 2.2.4., but backwards.

Appendix

Styleguides

Icons

Remark for testers

Please note, that this change was intentionally deactivated (#3689) for the upcoming release and thus cannot be tested within the current development build.

Attachments (25)

adblock browser iOS 70 gm inactive.png (335.6 KB) - added by sven 4 years ago.
adblock browser iOS 70 gm init tab.png (190.3 KB) - added by sven 4 years ago.
adblock browser iOS 70 gm open tabs.png (338.4 KB) - added by sven 4 years ago.
adblock browser iOS 70 gm settings page.png (210.0 KB) - added by sven 4 years ago.
add gm tab.png (20.0 KB) - added by sven 4 years ago.
add tab.png (20.0 KB) - added by sven 4 years ago.
ghostmodebig.png (22.9 KB) - added by sven 4 years ago.
gm tab indicator active.png (20.8 KB) - added by sven 4 years ago.
gm tab indicator inactive.png (20.7 KB) - added by sven 4 years ago.
tab indicator inactive.png (20.2 KB) - added by sven 4 years ago.
adblock browser iOS 70 settings overview.png (181.0 KB) - added by sven 4 years ago.
adblock browser iOS 71 initial ghost mode style guide.png (202.5 KB) - added by sven 4 years ago.
adblock browser iOS 71 initial ghost mode 14.png (194.2 KB) - added by sven 4 years ago.
adblock browser iOS 74 - ghost mode.png (189.0 KB) - added by sven 4 years ago.
adblock-browser-iOS-70-gm-transition intial.gif (134.3 KB) - added by sven 4 years ago.
adblock-browser-iOS-70-gm-transition open tab.gif (59.9 KB) - added by sven 4 years ago.
adblock-browser-iOS-70-gm-transition initial.gif (134.3 KB) - added by sven 4 years ago.
ghost mode - tab indicator active.png (21.1 KB) - added by sven 4 years ago.
adblock browser iOS 74 - gerneral tab-view.png (333.9 KB) - added by sven 4 years ago.
adblock browser iOS 74 - ghost mode.2.png (340.2 KB) - added by sven 4 years ago.
adblock browser iOS 74 - initial.png (189.2 KB) - added by sven 4 years ago.
adblock browser iOS 74 - initial style guide.png (197.6 KB) - added by sven 4 years ago.
ghost mode - tab indicator inactive bottom bar.png (21.1 KB) - added by sven 4 years ago.
adblock browser iOS 74 - gerneral tab-view style guide.png (217.1 KB) - added by sven 4 years ago.
adblock browser iOS 74 - ghost mode style guide.png (216.9 KB) - added by sven 4 years ago.

Download all attachments as: .zip

Change History (62)

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

Changed 4 years ago by sven

comment:1 Changed 4 years ago by sven

  • Description modified (diff)

comment:2 Changed 4 years ago by sven

  • Description modified (diff)

comment:3 Changed 4 years ago by sven

  • Description modified (diff)

comment:4 Changed 4 years ago by sven

  • Description modified (diff)

comment:5 Changed 4 years ago by sven

  • Description modified (diff)

comment:6 Changed 4 years ago by sven

  • Description modified (diff)

comment:7 Changed 4 years ago by sven

  • Cc mario salsita added

comment:8 Changed 4 years ago by sven

  • Description modified (diff)

comment:9 Changed 4 years ago by sven

  • Priority changed from Unknown to P2

comment:10 Changed 4 years ago by lisabielik

For adblock browser iOS 70 settings overview.png, should the option be 'Clear History' (as opposed to Clear Browsing Data) to match Adblock Browser for iOS?

For adblock browser iOS 70 gm settings page.png, please change 'Disable Histroy' to 'Disable History.'

comment:11 Changed 4 years ago by pavelz

  • Keywords blocked added

comment:12 Changed 4 years ago by pavelz

Needs to know whether ABP extension supports handling Acceptable Ads separately (and possibly differently) in Incognito mode and public mode.

comment:13 Changed 4 years ago by fhd

No, it doesn't. In the long term we could add this capability, but we most definitely won't get around to that in the near future. The only alternative would be to keep two instances of ABP running, but that would increase memory usage significantly.

comment:14 Changed 4 years ago by sven

  • Description modified (diff)

We decided to split this issue into two independent ones, since we figured out that a different behavior of Adblock Plus between normal and ghost mode tabs is not a minor implementation effort.

comment:15 Changed 4 years ago by sven

  • Description modified (diff)

comment:16 Changed 4 years ago by sven

  • Description modified (diff)

comment:17 Changed 4 years ago by jand

  • Keywords blocked removed
  • Resolution set to fixed
  • Status changed from new to closed

comment:18 Changed 4 years ago by sven

  • Resolution fixed deleted
  • Status changed from closed to reopened

The number in the ghost icon should be "0" by default and increase, if there are some more tabs opened. The color of the number (while you are in the default tab-view) is: #ba00ff. The size of the number in the ghost icon is 22px (that could change to 20px if live tests show, that the 22px are too much).
The idea is that it should always be "0", if there are only dashboard tabs opened. The same applies for the normal (not ghost mode) tabs. Consider that we are only speaking about the number in the icons which are next to the plus sign (not the one in the bottom bar).


1.) This behavior is not implemented correctly. It should never happen, that the tab-view is empty. Please note the sentence "Consider that we are only speaking about the number in the icons which are next to the plus sign (not the one in the bottom bar)"

2.) The Ghost Mode icons were mixed-up. The brighter one should be in the tab-view and the darker one in the bottom bar.

3.) The text in the initial tab is in "Italic" and "Semibold Italic" (there is a little mistake in the style guide, which only says Semibold instead of "Semibold Italic")

comment:19 Changed 4 years ago by sven

  • Description modified (diff)

comment:20 Changed 4 years ago by sven

4.) The color of the numbers in the standard tab (in tab-view, while the ghost mode is active) needs to be changed. It was not defined in this ticket yet, but i added it now. The current color is way too dark.

comment:21 Changed 4 years ago by jand

  • Resolution set to fixed
  • Status changed from reopened to closed

Changed 4 years ago by sven

comment:22 Changed 4 years ago by sven

  • Description modified (diff)
  • Resolution fixed deleted
  • Status changed from closed to reopened

Was closed accidentally.

comment:23 Changed 4 years ago by sven

  • Description modified (diff)

comment:24 Changed 4 years ago by sven

  • Cc mario salsita removed
  • Description modified (diff)

Changed 4 years ago by sven

Changed 4 years ago by sven

comment:25 Changed 4 years ago by sven

  • Description modified (diff)

comment:26 Changed 4 years ago by sven

  • Description modified (diff)

comment:27 Changed 4 years ago by sven

  • Cc salsita mario added
  • Description modified (diff)

comment:28 Changed 4 years ago by mario

  • Ready set

comment:29 Changed 4 years ago by pavelz

  • Resolution set to fixed
  • Status changed from reopened to closed

comment:30 Changed 4 years ago by mario

  • Milestone set to Adblock-Browser-for-iOS-next

comment:31 Changed 4 years ago by sven

  • Resolution fixed deleted
  • Status changed from closed to reopened

I had a first look into the implemented changes and the following is what I observed:

  1. The transition between normal tab-view and ghost mode tab-view is not implemented such as described in this ticket.
  1. The initial ghost mode tab-view is not implemented such as described in this ticket. The initial ghost mode tab-view looks the same like the normal tab-view. It shouldn't be closable.



[Edit MK:] As discussed, I removed two issues from this list which I'll convert into new issues as they're not in the scope of this issue.

Last edited 4 years ago by mario (previous) (diff)

comment:32 Changed 4 years ago by pavelz

  • Resolution set to fixed
  • Status changed from reopened to closed

comment:33 Changed 4 years ago by scheer

  • Cc scheer added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Referring to 2.2.3 in the 2.2 section of the 'What To Change' above, it states -

'2.2.3. In the bottom navigation bar: The general tab icon will be replaced by a greyed out ghost icon with the number 0 in it. It is not clickable as long as the number 0 is present.'

In this situation, the user, in fact, is able to select the greyed out ghost symbol, and by doing so, a new tab is opened.

Referring to 2.2.4 where it states -

'2.2.4. The initial ghost mode tab-view will not be closable (neither by clicking the ghost icon in the bottom navigation bar nor by swiping the tab-view down) and the ghost mode tab-view will be expanded, so that the full height will be used.'

By selecting the same Greyed out Ghost Icon in the bottom right will close the initial Tab View.

ABB 1.3.0-qa (814)
iPhone 5C 16 GB - iOS 9.2.1

comment:34 Changed 4 years ago by mario

  • Cc salsita removed
  • Keywords salsita added

comment:35 Changed 4 years ago by mario

  • Blocking 3689 added
  • Milestone Adblock-Browser-for-iOS-next deleted
  • Ready unset

Removed from the scope of release 1.3.0.
Removed ready flag as we need to revise the scope of this issue.

comment:36 Changed 4 years ago by mario

  • Blocking 3689 removed

comment:37 Changed 4 years ago by mario

  • Description modified (diff)
  • Milestone set to Adblock-Browser-for-iOS-next
  • Ready set
  • Resolution set to fixed
  • Status changed from reopened to closed

We have decided to close this issue as is and make it part of the release of 1.3.0. However please note, that we've introduced another change (#3689) which completely deactivates and hides Ghost Mode for the upcoming release. The reason for this is, that we need to introduce additional changes to the UI of the Ghost Mode, however we couldn't wait for these to be applied for this release.

We will soon introduce additional issues in order to:

  • Change the UI of the Ghost Mode
  • Activate the Ghost Mode again (in order to undo #3689)

As a result I've modified the description to match the current state of the Ghost Mode.

Note: See TracTickets for help on using tickets.