2

As Javascript newbie I'm not able to store locally a variable and reuse from Google cache. I have a counter that starts onClick from zero then increments until a specific number then goes to a new page.

In the new page I need to continue the counter from the previous number.

I can't use cookies since this is for a Chrome extension, so I used storage.local and I set my manifest as follow:

...
"permissions": ["storage", "https://example.com/*", "unlimitedStorage"],
  "content_scripts": [
    {
      "matches":  ["https://example.com/*"],
      "js":       ["js/jquery-2.1.4.min.js", "js/example.js"],
      "css":      ["css/example.css"]
    }
  ],
...

So basically when I click my button it starts the follow function and it increments this.count

function Button(t, e, i) {
    var n = this;
    n.$el = t, 
    n.count = (Record.get(function() {tmf.followBtn.counter()}) > 1 ? Record.get(function() {tmf.followBtn.counter()}) : 0), 
    n.$title = t.find(".tmf-btn__title"), 
    n.$subtitle = t.find(".tmf-btn__subtitle"), 
    n.action = new BulkAction(e, i), n.$el.on("click", function() {
        n.$el.addClass("tmf-btn--active"), 
        n.$title.text(n.count), 
        n.action.paused ? (n.action.proceed(), n.$subtitle.text("Click to pause")) : (n.action.pause(), n.$subtitle.text("Click to continue"))
    })
}

function Profile(t) {
    this.$el = $(".ProfileCard:eq(" + t + ")"), 
    this.isLoaded() && (this.$btn = this.$el.find(".user-actions-follow-button"), 
    this.id = this.$el.data("user-id") + "-")
}

function BulkAction(t, e) {
    this.callback = t, 
    this.interval = e, 
    this.paused = !0
}

function gotoPage() {
    window.location.replace("https://example.com/newpage/");
}

$.fn.isPresent = function() {
    return this.length > 0
};

var USER_ID = $("#user-dropdown").find("[data-user-id]").data("user-id"),
    Record = {
        storage: chrome.storage.local,
        key: USER_ID.toString(),
        get: function(t) {
            var e = this;
            this.storage.get(this.key, function(i) {
                e.result = i, t.call()
            })
        },
        set: function() {
            this.storage.set(this.result)
        },
        add: function(t) {
            this.result[this.key] ? this.result[this.key] += t : this.result[this.key] = t, this.set()
        },
        includes: function(t) {
            return this.result[this.key] ? this.result[this.key].includes(t) : !1
        }
    },
    tmf = {
        init: function() {
            var t = this;
            t.$el = $("<div>").addClass("tmf animated").appendTo("body")
        },
        toggle: function() {
            var t = this;
            this.$el.removeClass("flipInY flipOutY tmf--active"), $(".ProfileCard").length > 10 ? t.$el.load(chrome.extension.getURL("html/actions.html"), {}, function() {
                $(".tmf-btn").on("click", function() {
                    t.$el.addClass("tmf--active")
                }), t.followBtn = new Button($(".tmf-btn--follow"), function() {
                    this.follow()
                }, 100), t.unfollowBtn = new Button($(".tmf-btn--unfollow"), function() {
                    this.unfollow()
                }, 100), t.$el.addClass("flipInY");
                var e = new MutationObserver(function(e) {
                    e.forEach(function(e) {
                        var i = $("#message-drawer").html();
                        i.includes("66885") && t.followBtn.setIdle()
                    })
                });
                e.observe(document.getElementById("message-drawer"), {
                    subtree: !0,
                    characterData: !0,
                    childList: !0
                }), $("#tmf_without_exception").on("change", function() {
                    t.withoutException = this.checked, 
                    this.checked ? (t.followBtn.$subtitle.text("without exception"),t.unfollowBtn.$subtitle.text("without exception")) : (t.followBtn.$subtitle.text("who have never been unfollowed"), t.unfollowBtn.$subtitle.text("who do not follow you"))
                })
            }) : this.$el.addClass("flipOutY")
        },
        withoutException: !1
    };

$.extend(Button.prototype, {
    incrementCount: function() {
        this.count++, 
        this.$title.text(this.count)
    },
    counter: function() {
        return this.count
    },
    setIdle: function() {
        var t = this;
        if (!t.action.paused) {
            t.action.pause();
        }
    }
    }), 
    $.extend(Profile.prototype, {
        isLoaded: function() {
            return this.$el.isPresent()
        }, 
        isFollowing: function() {
            return this.$el.find(".FollowStatus").isPresent()
        },
        isProtected: function() {
            return this.$el.find(".Icon--protected").isPresent()
        },
        isNotFollowing: function() {
            return !this.isFollowing()
        },
        isFollowable: function() {
            return this.$btn.children(".follow-text").is(":visible")
        },
        isFollowed: function() {
            return this.$btn.children(".following-text").is(":visible")
        },
        follow: function() {       
            if (tmf.followBtn.counter() > 1) {
                tmf.followBtn.action.pause();
                Record.set(function() {tmf.followBtn.counter()});
                gotoPage(); 
            };        
            this.isFollowable() && !this.isProtected() && tmf.followBtn.counter() < 6 && (tmf.withoutException || !Record.includes(this.id) ? (this.click(), tmf.followBtn.incrementCount()) : this.log("warn", "Already unfollowed once"))
        },
        unfollow: function() {
            this.isFollowed() && (tmf.withoutException || this.isNotFollowing()) && (this.click(), tmf.unfollowBtn.incrementCount(), Record.add(this.id))
        },
        click: function() {
            this.log("success", 'Clicked on "' + this.$btn.children(":visible").text().trim() + '"'), this.$btn.click(), this.clicked = !0
        },
        log: function(t, e) {
            $("<div>").addClass("tmf-log").addClass("tmf-log--" + t).text(e).insertBefore(this.$el.find(".ProfileCard-bio"))
        }
    }), 
    $.extend(BulkAction.prototype, {
        nth: 0,
        loadAttempts: 0,
        _loadProfiles: function() {
            this.loadAttempts < 10 && (this.last.$btn.focus(), this.loadAttempts++, this._sleep(700))
        },
        _sleep: function(t) {
            var e = this;
            setTimeout(function() {
                e.run()
            }, t)
        },
        run: function() {
            if (!this.paused) {
                var t = new Profile(this.nth);
                t.isLoaded() ? (this.loadAttempts = 0, this.callback.call(t), this.last = t, this.nth++, t.clicked ? this._sleep(this.interval) : this.run()) : this._loadProfiles()
            }
        },
        pause: function() {
            this.paused = !0
        },
        proceed: function() {
            this.paused = !1, this.run()
        }
    }), 
    Record.get(function() {
    tmf.init(), tmf.toggle()
});

var observer = new MutationObserver(function(t) {
    t.forEach(function(t) {
        tmf.toggle()
    })
});

$(".tmf-btn--close").click(function(){
    $(".flipInY").hide();
});

observer.observe(document.querySelector("head > title"), {
    subtree: !0,
    characterData: !0,
    childList: !0
});

I need to store locally my counter, so as you can see I tried to set it as:

Record.set(function() {tmf.followBtn.counter()}); inside my follow function.

Then I tried to get it from my Button function as:

n.count = (Record.get(function() {tmf.followBtn.counter()}) > 1 ? Record.get(function() {tmf.followBtn.counter()}) : 0),

Why all the time I reload the page, the counter starts from zero?

NineCattoRules
  • 2,253
  • 6
  • 39
  • 84
  • I immediately apologize if the question is too simple but are 3 days now that I try without find a solution – NineCattoRules Jun 02 '16 at 18:22
  • 4
    It's really confusing code, a lot of `this`, a total lack of semicolons, and adding function calls after variables with a comma "hack" etc? – adeneo Jun 02 '16 at 18:25
  • @adeneo Sure you're right, I'm a Javascript lover but newbie...this code however works fine but not the `Record.counterstart` as it should. `this.count` is the counter on page and `Record.counterstart` should store that number. I need to find someone able to instruct me to edit `n.count = ` on button creation (since it starts always from 0 ) – NineCattoRules Jun 02 '16 at 18:42
  • 1
    nobody will help you if you dont at least indent your code. it's unreadable but most likely you have an async issue http://stackoverflow.com/q/23667086/2213940 – Zig Mandel Jun 03 '16 at 13:52
  • 1
    @ZigMandel I tried to be more exhaustive as possible – NineCattoRules Jun 03 '16 at 17:10
  • work on making a minimal example that shows the issue. again, most likely you are not aware of how to call an asynchronous function. – Zig Mandel Jun 03 '16 at 20:16
  • also, make sure your coworkers dont all jump to upvote, its suspicious you have 4 upvotes. – Zig Mandel Jun 03 '16 at 20:17
  • 1
    Haha, very nice code: this.paused = !0 can be rewritten as this.paused = true; – Niels Steenbeek Jun 03 '16 at 20:38

0 Answers0