DNN Modal PopUp - How Do I Display On Page Load and With Cookie Confirmation Dialog?
Last Post 02/05/2015 5:47 PM by ReGFX. 4 Replies.
Author Messages
ReGFX
Nuke Pro
Nuke Pro
Posts:88


--
02/03/2015 5:18 PM
    Based on the VERY HELPFUL Tutorial "How to Display any Page or Module Within a dnnModal Pop-up" at the following link:
    http://www.dnncreative.com/video/ho...dal-pop-up


    Which I understand.
    I just need a little help modifying some Old School PopUp code that uses dnnModal Pop-up.


    Basically, I would like to know HOW i can modify the attached samples to work as a MODAL Pop-up, Using DNN's Native Modal PopUp in DNN 6.X -7.X ?


    Again really just wanting to modify traditional Cookie Based Pop-up with "Don't Show This Again" when user first visits home page. However instead of a PopUp confirmation, it is a Modal Confirmation where the Cookie does not show again for X amount of days.


    I will try to see if I can attach the samples to this post for clarity.
    ReGFX
    Nuke Pro
    Nuke Pro
    Posts:88


    --
    02/03/2015 5:29 PM
    Looks like I'm not able to upload the files.. but here is the code I am trying to modify.

    Create a File Named OldSchoolCookieDialogPopUp.html
    Code below



    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>OldSchoolPopUp Convert to DNN Modal PopUp</title>
    <SCRIPT LANGUAGE="JavaScript">
    
    <!-- HOW WOULD I MODIFY THE CONDITION STATEMENT BELOW TO INITIATE THE DNN MODAL CALL ON PAGE LOAD
    
    if (document.cookie.indexOf("MYCUSTOMCookie") < 0) {window.open(&#39;MyHTMLFILE.html&#39;,&#39;Ad&#39;,&#39;toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=1,width=320,height=250&#39;);}
    
    // -->
    
    
    <!-- Begin
    var expDays = 1; // number of days the cookie should last
    
    function GetCookie (name) {  
    var arg = name + "=";  
    var alen = arg.length;  
    var clen = document.cookie.length;  
    var i = 0;  
    while (i < clen) {    
    var j = i + alen;    
    if (document.cookie.substring(i, j) == arg)      
    return getCookieVal (j);    
    i = document.cookie.indexOf(" ", i) + 1;    
    if (i == 0) break;   
    }  
    return null;
    }
    function SetCookie (name, value) {  
    var argv = SetCookie.arguments;  
    var argc = SetCookie.arguments.length;  
    var expires = (argc > 2) ? argv[2] : null;  
    var path = (argc > 3) ? argv[3] : null;  
    var domain = (argc > 4) ? argv[4] : null;  
    var secure = (argc > 5) ? argv[5] : false;  
    document.cookie = name + "=" + escape (value) + 
    ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + 
    ((path == null) ? "" : ("; path=" + path)) +  
    ((domain == null) ? "" : ("; domain=" + domain)) +    
    ((secure == true) ? "; secure" : "");
    }
    function DeleteCookie (name) {  
    var exp = new Date();  
    exp.setTime (exp.getTime() - 1);  
    var cval = GetCookie (name);  
    document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
    }
    var exp = new Date(); 
    exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
    function amt(){
    var MYCUSTOMCookie = GetCookie(&#39;MYCUSTOMCookie&#39;)
    if(MYCUSTOMCookie == null) {
    SetCookie(&#39;MYCUSTOMCookie&#39;,&#39;1&#39;)
    return 1
    }
    else {
    var newMYCUSTOMCookie = parseInt(MYCUSTOMCookie) + 1;
    DeleteCookie(&#39;MYCUSTOMCookie&#39;)
    SetCookie(&#39;MYCUSTOMCookie&#39;,newMYCUSTOMCookie,exp)
    return MYCUSTOMCookie
       }
    }
    function getCookieVal(offset) {
    var endstr = document.cookie.indexOf (";", offset);
    if (endstr == -1)
    endstr = document.cookie.length;
    return unescape(document.cookie.substring(offset, endstr));
    }
    
    function checkMYCUSTOMCookie() {
    //alert(&#39;test&#39;);
    //return;
    var MYCUSTOMCookie = GetCookie(&#39;MYCUSTOMCookie&#39;);
    if (MYCUSTOMCookie == null) {
    MYCUSTOMCookie=1;
    SetCookie(&#39;MYCUSTOMCookie&#39;, MYCUSTOMCookie, exp);
    
    //window.open(page, "", windowprops);
    
    //}
    //else {
    MYCUSTOMCookie++;
    SetCookie(&#39;MYCUSTOMCookie&#39;, MYCUSTOMCookie, exp);
       }
    }
    //  End -->
    
    //----------------------
    
    </SCRIPT>
    </head>
    
    <body>
    EXAMPLE of traditional onload POPUP that would like to see as a DNN MODAL using DNN&#39;s Native Modal PopUp in DNN 6.X -7.X
    </body>
    </html>
     


    Next File Titled HyHTMLFILE.html

     
    <html>
    <head>
    <title>MyHTMLFILE.html</title>
    
    <script>
    
    //FUNCTIONS----------------------------------------------
    
    function PopupClose(){
      //Cookie
      //if(document.frmAlpha.dontshow.checked){checkMYCUSTOMCookie()};
      //Window
      window.close();
    };
    
    //----------------------
    
    </script>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
    
    <body>
    <table width="300" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td><p><font size="2" face="arial" color="#000000"> Popup Disclaimer </font></td>
      </tr>
        <tr>
        <td>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
    <form name="frmAlpha">
      <input type="checkbox" name="dontshow" value="yes" onClick="if(this.checked &amp;&amp; !window.opener.closed){window.opener.checkMYCUSTOMCookie()}">
      &#160;- Don&#39;t Show This Again.
      <input type="button" name="OK" value=" OK " onClick={PopupClose();}>
    </form>
    </td>
      </tr>
    </table>
    </body>
    </html>
    
    ReGFX
    Nuke Pro
    Nuke Pro
    Posts:88


    --
    02/03/2015 5:36 PM
    Just one more quick Note... Looks like the Code I posted did not convert '
    Everywhere you see
    &#39;
    ' should be an Apostrophe... Hope I am making clear what I am trying to do here... Again just trying to make the above code work as a DNN Modal Dialog with "Don't Show This Again Option" for the user for X amount of days.
    Joseph Craig
    DNN MVP
    Posts:11667


    --
    02/04/2015 9:31 AM
    Without having dug into this ... you might want to look at a default install of DNN with the Awesome Cycles site. As installed, DNN presents a popup and with a Don't Show Again checkbox. You might want to dig through it so see how they are doing that.

    Having said that, I'll try to take a look at your code and see if I can offer some suggestions. It will probably take me several days to get to it, though.

    Joe Craig, Patapsco Research Group
    Complete DNN Support
    ReGFX
    Nuke Pro
    Nuke Pro
    Posts:88


    --
    02/05/2015 5:47 PM
    Ok... that is a super suggestion....
    On the other hand, I could send you the html file examples for clarity?



    ---