Modal popover for builder - bring into this repo

[MrBryan]

Jeanette sent me the builder popover as an attachment so it has all its own libraries and js/css - Can you please do it in our github repo with the new article so that the styles etc will be integrated + not two copies of bootstrap styles etc? Probably makes more sense since you were just working on it rather than my reverse engineering

Currently 02-organisms/sections/subscription-modal.html is where our existing one is and the code that operates it is in article_subscription_popup.js

you can add a condition that is always true to test the modal popup in that js --

  if ( elapsed > 604800000) {

to become

  if ( elapsed > 604800000 | 1 < 2 ) {

Then it will show on page load whenever you are in an incognito window

[alexgreen]

if ( elapsed > 604800000 | 1 < 2 ) {

This doesn't work. The popup doesn't show. I'll have to table this until I can see the popup.

Phillip do you have any idea how we can make the popup appear?

[MrBryan]

Were you in an incognito window ? that part is crucial because you'll have cookies that won't let it get that far

[MrBryan]

just tested again myself, works every time for me

[alexgreen]

Yes I tried it several times incognito with different conditionals. Can you set up a branch that works so i can pull it?

[MrBryan]

Very odd -- should have worked. Before we go that route how about just paste

window.setTimeout(showPopup, 0);

around line 121 so just before

function hideModal() {
    jQuery('#modalSub').modal('hide')
}

That should be fool proof and work whether or not incognito

[MrBryan]

Don't commit that change, of course

[alexgreen]

Still doesn't work. Which page in the repo are you viewing when you see the modal appear? There is no instance of "modalSub" on the repo index page, so it seems like there's nothing for the js to show.

[alexgreen]

i.e. I don't think the modal include is actually being called when repo pages are generated. unless there's a specific repo page you've set up where the include is used.

[alexgreen]

Oh it doesn't get called in article-standard, but it does seem to get called in article and most other layouts. So that means it should appear on the library page which is one of the pages I've tested and the modal doesn't show up there.

...wouldn't hurt to include the modal within footer.html rather than separately in every different layout.

[alexgreen]

ha! looks like article_subscription_popup.js isn't actually being deployed by jekyll in the develop branch. Can you push all your commits that are relevant to the modal? And any other commits you haven't pushed.

[MrBryan]

ah.. you're right. Sorry ,I forgot I did that on article-standard layout in my local environment

[MrBryan]

sure we can add to the footer one instead

[alexgreen]

ok, please make sure everything's in place. I have to do some other stuff for jeanette and won't get back to this until later.

[MrBryan]

ok just added it to footer.html affd731

[MrBryan]

removed from the other layouts too b9f427d

[MrBryan]

+added to meta

[alexgreen]

cool. and that js file is getting deployed now?

[MrBryan]

it's in the head.html

[MrBryan]

so yes should be in that commit too

[alexgreen]

works now, thanks

[alexgreen]

I merged the builder-modal branch into develop and it's in the repo now.

It's working on OSX chrome at all viewport sizes and iPad. But for some reason the modal doesn't appear on my android chrome. Not sure if that's specific to me so please test with whatever devices you have on hand.

[MrBryan]

yes disabled on android and iphone, too annoying

[alexgreen]

Are phone browsers designed to prevent modals? Wouldn't that mean that any js-based showing and hiding of content is impossible? That seems crazy. It also seems odd that IOS would allow modals on tablets but not on phones.

[MrBryan]

No it's by design on our end

On Nov 23, 2016, at 9:40 PM, alexgreen notifications@github.com wrote:

Are phone browsers designed to prevent modals? Wouldn't that mean that any js-based showing and hiding of content is impossible? That seems crazy. It also seems odd that IOS would allow modals on tablets but not on phones.

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub, or mute the thread.

[MrBryan]

We decided it was too hard to close the little model screen and who is going to want to sit and fill out a form anyways on their phone

Sent from my iPhone

On Nov 23, 2016, at 9:40 PM, alexgreen notifications@github.com wrote:

Are phone browsers designed to prevent modals? Wouldn't that mean that any js-based showing and hiding of content is impossible? That seems crazy. It also seems odd that IOS would allow modals on tablets but not on phones.

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub, or mute the thread.

[MrBryan]

deployed

[alexgreen]

filling out a form on mobile is a high bar. But there's ways around it: google pay, apple pay, paypal 1-click payments (assuming this exists). (This also relates to the reader micro-payments discussion I seeded a few weeks ago, so hopefully we'll have an update on that soon too.)

Or the mobile popup might deliver completely different functionality. e.g. single click to post "I support The Tyee" on FB, twitter, etc.

[MrBryan]

Good points - we do get a not insignificant number of donations on mobile already so anything that make it easier is a good idea. We use a service called recurly for all of our payments at the moment so it would involve a fairly big add on but possibly worth it or wait until apple/google pay are ready on recurly https://blog.recurly.com/recurly-to-support-apple-pay-on-the-web