jeudi 15 septembre 2016

Facebook share with checkbox

I'm been busy making a website for my first customer. I have to build a website with payment option. Before paying the user need to be given the option to share on facebook for a discount. This needs to happen with a checkbox.

I'm doing this in a c# web mcv enviroment. The views are all in cshtml format.

Now i've looked before and I ended up with this:

@model Movit.Models.InfoStorage
@{
    ViewBag.Title = "UserInformationView";
}

<style>
    html .fb_share_link {
        padding: 2px 0 0 20px;
        height: 16px;
        background: url(http://ift.tt/1hZUO6Q) no-repeat top left;
    }
</style>
<script src="jquery-1.11.1.min.js"></script>
<script type='text/javascript'>
        var perms = ['public_profile', 'email'];
        var declined_perms = [];
        $(window).load(function () {
            window.fbAsyncInit = function () {
                FB.init({
                    appId: 'XXXXXXXX',
                    status: true,
                    cookie: true,
                    xfbml: true
                });
                checkLoginState();
            };
            (function (d) {
                var js, id = 'facebook-jssdk',
                        ref = d.getElementsByTagName('script')[0];
                if (d.getElementById(id)) {
                    return;
                }
                js = d.createElement('script');
                js.id = id;
                js.async = true;
                js.src = "//connect.facebook.net/en_US/all.js";
                ref.parentNode.insertBefore(js, ref);
            }(document));


            $('#checkbox').change(function () {
                if ($(this).is(':checked')) {
                    if (parseFloat($(this).val())) {
                        customLogin();
                    } else {
                        rerequest();
                    }

                }
            });

            function statusChangeCallback(response) {
                console.log('statusChangeCallback');
                console.log(response);

                if (response.status === 'connected') {
                    // Logged into your app and Facebook.
                    testAPI();
                } else if (response.status === 'not_authorized') {
                    // The person is logged into Facebook, but not your app.

                } else {
                    // The person is not logged into Facebook, so we're not sure if
                    // they are logged into this app or not.

                }
            }

            function checkLoginState() {
                FB.getLoginStatus(function (response) {
                    statusChangeCallback(response);
                });
            }

            function rerequest() {
                FB.login(
                        function (response) {
                            testAPI();
                        },
                        {
                            scope: declined_perms.join(),
                            auth_type: 'rerequest'
                        }
                );
            }

            function customLogin() {
                FB.login(
                        function (response) {
                            testAPI();
                        },
                        {
                            scope: perms.join()
                        }
                );
            }

            function testAPI() {
                declined_perms.length = 0;

                FB.api('/me/permissions', function (response) {
                    var responsePerms = [];
                    for (var i = 0; i < response.data.length; i++) {
                        responsePerms.push(response.data[i].permission)
                        if (response.data[i].status == 'declined') {
                            declined_perms.push(response.data[i].permission);
                        }
                    }
                    for (var _i = 0, _j = perms.length; _i < _j; _i++) {
                        if (responsePerms.indexOf(perms[_i]) < 0) {
                            declined_perms.push(perms[_i]);
                        }
                    }

                    if (declined_perms.length) {
                        alert('User canceled login or did not fully authorize the app.');
                        console.log('Please Provide access to ' + declined_perms.join());
                        document.getElementById('checkbox').checked = false;
                        document.getElementById('checkbox').value = 0;
                    } else {
                        document.getElementById('checkbox').checked = true;
                        console.log('Welcome!  Fetching your information.... ');
                        FB.api('/me', function (response) {
                            console.log('Successful login for: ' + response.name);
                        });
                    }
                });


            }


            function fb_publish() {
                var msg = $('#message').val();
                FB.ui({
                            method: 'stream.publish',
                            message: msg,
                            attachment: {
                                name: 'Name here',
                                caption: 'Caption here.',
                                description: (
                                        'description here'
                                        ),
                                href: 'url here'
                            },
                            action_links: [
                                { text: 'Code', href: 'action url here' }
                            ],
                            user_prompt_message: 'Personal message here'
                        },
                        function (response) {
                            if (response && response.post_id) {
                                alert('Post was published.');
                            } else {
                                alert('Post was not published.');
                            }
                        }
                );

            }

        });
</script>



<h2>UserInformationView</h2>
@using (Html.BeginForm("PayOptionsView", "Movit",new { InfoStorage = Model},  FormMethod.Post))
{
    <div class="body-content">
        @Html.HiddenFor(m => m.Cost)
        @Html.HiddenFor(m => m.DiscountCost)
        @Html.HiddenFor(m => m.Shared)
        @Html.HiddenFor(m => m.StartTime)
        @Html.HiddenFor(m => m.EndTime)
        @Html.HiddenFor(m => m.FacillityId)
        @Html.HiddenFor(m => m.ExisiteningÁccount)
        @Html.HiddenFor(m => m.User.Userid)

        @if (Session["email"] == null)
        {
            @Html.Label("Email")
            @Html.TextBoxFor(m => m.User.Email, new { @class = "form-control" })
        }
        <p> </p>
        <p> Current price: @Model.Cost</p>
        <p> Discount price: @Model.DiscountCost</p>

        <input type="checkbox" name="facebook" value="1" id="checkbox" />
        @Html.Label("Share on facebook for a discount")
        <hr />
        <input type="submit" value="Naar Betalen" />
    </div>
}

The problem is, that nothing happens when the checkbox is checked.




Aucun commentaire:

Enregistrer un commentaire