pushnoti-landingpage.js

/* Functions */

//Changes Buttons and displays browser info for not supported browsers
function showNotSupported(){
    var btnNotSupported = document.getElementById('not-supported');
    var msgNotSupported = document.getElementById('not-supported-message');
    btnNotSupported.style.display = 'inline-block';
    msgNotSupported.style.display = 'block'; 
}

//Hides Button and browser info
function hideNotSupported(){
    var btnNotSupported = document.getElementById('not-supported');
    var msgNotSupported = document.getElementById('not-supported-message');
    btnNotSupported.style.display = 'none';
    msgNotSupported.style.display = 'none'; 
}

// Changes Button to PN Call To Action
function showPrompt(){
    var btnActivate = document.getElementById('activate');
    var btnChooseSettings = document.getElementById('choose-settings');
    btnChooseSettings.style.display = 'inline-block';
    btnActivate.style.display = 'inline-block';
}

// Changes Button to PN Call To Action
function hidePrompt(){
    var btnActivate = document.getElementById('activate');
    btnActivate.style.display = 'none';
}

//Changes the button and displays push settings
function showSettings(){
    var btnActivated = document.getElementById('activated');
    var btnDeactivate = document.getElementById('deactivate');
    var btnSettings = document.getElementById('choose-settings');
    var divPreferences = document.getElementById('preferences');
    
    btnActivated.style.display = 'inline-block';
    btnDeactivate.style.display = 'block';
    btnSettings.style.backgroundColor = '#f88c00';
    divPreferences.style.display = 'block';
}

//Changes the button and displays push settings
function hideSettings(){
    var btnActivated = document.getElementById('activated');
    var btnDeactivate = document.getElementById('deactivate');
    var msgSettings = document.getElementById('info-settings');
    var divPreferences = document.getElementById('preferences');
    
    btnActivated.style.display = 'none';
    btnDeactivate.style.display = 'none';
    msgSettings.style.display = 'none';
    divPreferences.style.display = 'none';
}

//Opens OneSignal Browser Prompt and displays the settings panel after a timeout
function subscribe(){
    // OneSignal Browser prompt
    OneSignal.push(["registerForPushNotifications"]);
    
    //If user opts in to one signal fire this function (currently symbolic timeout)
    setTimeout(function(){
        showSettings()
        hidePrompt()
    }, 1000);
}

function unsubscribe(){
    //Unsubscribe from OneSignal
    OneSignal.push(["setSubscription", false]);
}

//Changes Subscription of user for 'Damenmode'
function changeSubscriptionWomen(){
    //Get Value from OneSignal
    if (true){
        // Set New Value
    }else{
        // Set New Value
    }
    updateSubscriptions();
}

//Changes Subscription of user for 'Herrenmode'
function changeSubscriptionMen(){
    //Get Value from OneSignal
    if (true){
        // Set New Value
    }else{
        // Set New Value
    }
    updateSubscriptions();
}

//Changes Subscription of user for 'Outlet Angebote'
function changeSubscriptionSale(){
    //Get Value from OneSignal
    if (true){
        // Set New Value
    }else{
        // Set New Value
    }
    updateSubscriptions();
}

//Gets the subscriptions for user and displays buttons accordingly
function updateSubscriptions(){
    //Get Onesignal Tags
    
    OneSignal.push(["getTags", function(tags) {
    console.log("OneSignal getTags:");
    console.log(tags);
    }]);
    
    var women = true;
    var men = false;
    var sale = true;
    
    if (women){
        var btnWomenSubscribe = document.getElementById('women-subscribe');
        var boxWomen = document.getElementById('push-fashion-women');
        var btnWomenSubscribed = document.getElementById('women-subscribed');
        btnWomenSubscribe.style.display = 'none';
        btnWomenSubscribed.style.display = 'inline';
        boxWomen.style.opacity = '1';
    }
    
    if (men){
        var btnMenSubscribe = document.getElementById('men-subscribe');
        var boxMen = document.getElementById('push-fashion-men');
        var btnMenSubscribed = document.getElementById('men-subscribed');
        btnMenSubscribe.style.display = 'none';
        btnMenSubscribed.style.display = 'inline';
        boxMen.style.opacity = '1';
    }
    
    if (sale){
        var btnSaleSubscribe = document.getElementById('sale-subscribe');
        var boxSale = document.getElementById('push-fashion-sale');
        var btnSaleSubscribed = document.getElementById('sale-subscribed');
        btnSaleSubscribe.style.display = 'none';
        btnSaleSubscribed.style.display = 'inline';
        boxSale.style.opacity = '1';
    }
}

/* Main Procedures */
window.onload = function() {
    //Deactivate no Javascript warning
    var btnEnableJS = document.getElementById('enable-js');
    btnEnableJS.style.display = 'none';
    
    //check if OneSignal is supported
    if (OneSignal.isPushNotificationsSupported()) {
        //Check if PNs are enabled for the client
        OneSignal.isPushNotificationsEnabled(function (isEnabled) {
            if (isEnabled) {
                showSettings();
                updateSubscriptions();
            } else {
                showPrompt();
            }
        });              
    }else{
        showNotSupported();
    }
    
    // Open OneSignal Browser prompt 
    document.getElementById("activate").addEventListener("click", subscribe);
    // subscribe/ unsubscribe for 'Damenmode'
    document.getElementById("push-fashion-women").addEventListener("click", changeSubscriptionWomen);
    // subscribe/ unsubscribe for 'Herrenmode'
    document.getElementById("push-fashion-men").addEventListener("click", changeSubscriptionMen);
    // subscribe/ unsubscribe for 'Outlet Angebote'
    document.getElementById("push-fashion-sale").addEventListener("click", changeSubscriptionSale);
    // unsubscribe from OneSignal
    document.getElementById("deactivate").addEventListener("click", unsubscribe);
}