How to target html elements when logged into DNN - html

Silly question and I hope I just overlooked this. In Sitefinity, once you are logged in, there is a wrapping div which one can use to target certain html tags ONLY when you are logged in.
I am not seeing anything like this in DNN and was wondering if someone knows of a solution to this please?
What I would like, is something like this:
[div class="dnn-logged-in"]
[div class="my-content-wrapper"]
[div class="elements-i-would-like-to-show-or-hide]
Hide or show this if I am logged in or not
[/div]
[/div]
[/div]
Many thanks!

I'd say this is a fairly uncommon task because this type of logic is generally handled on the server side and not the client side. This is because you generally don't want to increase the client payload any more than you need to - and if the user isn't logged in - they'll never need this content. In addition there are obviously security implications if working with sensitive data - as the information is easily viewable in the underlying markup.
All disclaimers aside, If you do want to do this, I think the best solution would be to just make site work just like you're used to in Sitefinity. In DNN you would create a container that contains the appropriate logic. A container wraps each module, and within the container you have the opportunity to write any code (server or client) to make your container dynamic.
For this brute force example I modified the "Invisible.ascx" container that ships with the DarkKnight skin in DNN 6:
<%# Control language="C#" AutoEventWireup="false" Inherits="DotNetNuke.UI.Containers.Container" %>
<%
var isLoggedIn = HttpContext.Current.User.Identity.IsAuthenticated;
if (isLoggedIn)
{
%>
<div class="dnn-logged-in">
<% } %>
<div class="Invisible"><div id="ContentPane" runat="server"></div></div>
<% if (isLoggedIn) { %>
</div>
<% } %>
This will yield the following HTML when not authenticated:
<div class="DnnModule DnnModule-DNN_HTML DnnModule-364">
<a name="364"></a>
<div class="Invisible">
<div id="dnn_ctr364_ContentPane">
[Dynamic Content Here]
</div>
</div>
</div>
and this when you are authenticated:
<div class="DnnModule DnnModule-DNN_HTML DnnModule-364">
<a name="364"></a>
<div class="dnn-logged-in">
<div class="Invisible">
<div id="dnn_ctr364_ContentPane">
[Dynamic Content Here]
</div>
</div>
</div>
</div>
If you want this logic everywhere, I'd just enhance each of the containers that you're currently using with this type of logic.

You can use SkinObject to do so in dnn. Login skin object will help you showing a Login/ Logout OR Regiter, User Skin object will help you show the currently logged in user. You can use any style and div you want.

In DotNetNuke this is controlled by permissions, which can be assigned to pages or to individual modules (specific content). By default, new pages will have VIEW permissions for "All Users", and new content created on the page will inherit that permission.
To change this, select the settings for the specific content, un-check the "Inherit View Permissions from Page. This will enable the check-boxes for all the various roles. Then simply ensure that All Users is un-selected, and instead select "Registered Users". This will make the content visibleto any user who is logged into the site.
This is a super powerful permission model which actually controls the rendering, rather than just obscuring visibility.

Related

How can I add a generic page header with site navigation to an asciidoc document?

I'm trying to build a basic documentation site using asciidoctor. One thing I am struggling with is how I can inject a standard site header (a banner with a logo and top-level navigation) into each documentation page.
I render my asciidoc directly to html from the command line. I have tried to find a way to somehow inject an extra div element and position it fixed at the top, but I can't figure out what mechanism to use for this. My early attempts involved using docinfo.html but that gets injected into the html in the <head> element, instead of the <body>.
I am aware that full-on publication systems like Jekyll allow me to configure "front matter" that can probably take care of this, but I was hoping there was a mechanism or trick using vanilla asciidoctor that can achieve this.
Ted Bergeron on the Mailing List mentioned a simple project:
Demo website created just using Asciidoctor.
Check the corresponding repo to see the files and how to create the site (just using one command).
In summary: simply create a header asciidoc file that includes your site nav (in the demo site this is done using table markup), without including a level-0 (document) title. Include this header file right at the top in every page of your site. Then render by just running asciidoctor *.txt on your project.
--embedded option + simple post processing
With this option, asciidoctor generates only the interior part of the <body> element.
For example:
main.adoc
= Super title
== Second level
asdf
== Also second level
qwer
then:
asciidoctor --embedded main.adoc
produces:
main.html
<div class="sect1">
<h2 id="_second_level">Second level</h2>
<div class="sectionbody">
<div class="paragraph">
<p>asdf</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_also_second_level">Also second level</h2>
<div class="sectionbody">
<div class="paragraph">
<p>qwer</p>
</div>
</div>
</div>
You can then just cat a header and closing footer, and you are done.
Tested with Asciidoctor 2.0.10.

Embedding a rails view within a view

Rails noob here. I'm attempting to create create single-page scrolling site similar to this ...but, you know, not nearly as attractive :-)
Anyway, I've got my javascript working however I've developed much of the content (contact form, about us page etc etc) in different views which are hanging out in various html.erb files. Rather than cut and paste the contents of each into a single home.html.erb, I was wondering if there was a clean way to just embed the content from each view into my homepage view. Something like this:
<h1>My awesome homepage!</h1>
<div>
<div id="about">
<%= put_page_here page=about_us %>
</div>
<div id="our_product">
<%= put_page_here page=about_us %>
</div>
<div id="contact">
<%= put_page_here page=contact %>
</div>
</div>
If you would recommend going about this entirely differently, please let me know.
Many thanks in advance!
This should work:
<%= render partial:"shared/contact_us", locals:{variable:value} %>
Note that it will look for a view in app/views/shared/_contact_us.html.erb - notice the _ before the view. Pass the variables the view needs in through locals. More information on passing variables around here.

Iframe with another iframe

I want to extract result of checking code. Website display in that code. I marked it in source code.
<div id="ember332" class="ember-view backArrowContainer">
<div id="purchaseMeta">
<h2 class="flowStatus"> UŻYJ KODU PREPAID </h2>
<div class="gamertag">
<div class="title">
<script id="metamorph-2-start" type="text/x-placeholder">
***CODE STATUS WHICH I WANT TO EXTRACT***
<script id="metamorph-2-end" type="text/x-placeholder">
</div>
<div class="price"> Kod prepaid </div>
</div>
It is avaible when i go to this site: https://account.xbox.com/pl-PL/PaymentAndBilling/RedeemCode?token=W4HV8-6D6X3-3JVDJ-8PPG9-Q6BVR
I want to extract only CODE STATUS displayed when website will go to this adres. I think it can be avaible when i can use in HTML but i don't know how. Please help me with extract this status.
You can't extract anything from the inside of an iframe. There cannot be any interaction from the parent to the iframe. There can, therefore, be interaction between the iframe and the parent, but since you are not the owner of the iframe's webpage, this is not your case.
It's a security issue. People could get scammed if this wasn't this way. For example, designing a full-page iframe with a bank webpage and retrieving everything user types... Or designing a 1x1px iframe with a facebook page to see if your user is logged on fb and check all his/her personal information.
You can use a server-side language, such us PHP and get the HTML of that webpage using file_get_contents()

Loading different HTML code into one single page on different link clicks

So, my boss has this crazy idea - the whole website working on one single page. So far - still ok, but here's the thing:
- the different pages have different divs with content (like usual), and when some div is clicked (or link in it) some of the divs expand/collapse, working in the way of revealing different content. That's fine, but...
he doesn't want to use JavaScript or anything for dynamic view of the website ('cuz I am leaving in 2 weeks and him and the other employee are not capable of JS, thus cannot improve/maintain if needed)
his idea is to have the HTML code, for all the pages variations of the website, stored in the database, and upon clicking some link - reloading the page with the certain HTML. So not different .html files for every page, but only one for all of them.
The problem is that it works for the first page that I load, initially, but then when I call another page, it gets twisted, since I call the function, that retrieves the HTML, but the other call of the previously loaded page is still there, so it calls again. Here's sample, so you understand:
<script runat="server" type="text/C#">
public string getPage(string name)
{
string page = "null";
switch (name)
{
case "media":
page = getMediaPage(); <!-- just function from the code-behind that retrieves the html code from the DB and passes it to the page -->
break;
case "home":
page = getHomePage(); <!-- just function from the code-behind that retrieves the html code from the DB and passes it to the page -->
break;
}
return page;
}
</script>
</head>
<body onload="addEvents();">
<form id="form1" runat="server">
<div id="parent">
<div id="presentation">
SomeCompany ApS Street3 | CITY | INFO#Comapny.com TLF: 999999
</div>
<%=getPage("home") %>
</div>
</form>
So that's how the initial page will be and then just in the parent div I will call the HTML for the other pages. One example of HTML, stored in the DB:
<div id="mainmenu">
<b>HOME</b>
<br />
PRODUCTS
<br />
SUPPORT
<br />
CONTACT
<br />
ABOUT
<br />
</div>
<div id="logo">
</div>
So I call this chunk of code slam it in the page. The twist happens as I have <a href="<%=getPage("media")%>"> clicked, so it loads the page normally, but there is <%=getPage("home") %> standing statically in the page, ALL THE TIME, as I need to start from somewhere, and it attempts to load the previous page again, and... server error.
I know it's kinda stupid idea, but I can't argue with him anymore.
So my question is - is there way of handling all this with some kind of OnClick(Event e) or some other way out, with calling different functions (as I already started).
Or I should just tell the boss that it's not gonna work this way...
As stated, this isn't a great idea, but you could get it to work by using some Web Controls.
Where you have <%=getPage("home") %> in your page, change this to:
<asp:literal id="ltlContent" runat="server" />
On Page_Load call:
ltlContent.Text = getPage("home");
Any links on your page which should load other content, change these to LinkButton controls, and their click events could have:
<asp:LinkButton id="linkMedia" runat="server" onclick="LoadContent" CommandArgument="media" />
public void LoadContent(object sender, EventArgs e){
ltlContent.Text = getPage(e.CommandArgument);
}
you could try the parameters on the get url.
add them on your link "?page=media"
and then you parse the url when you arrive $_GET["page"]

"partial views" best practices for 'container' divs?

What is the 'best' way to handle the html markup for partial views? (which are also refreshed using AJAX) The biggest issue I run into is where to place the 'container' div...
Consider having a masterpage and a partial view.
(class="" could be interchanged with id="" depending if the partial is guaranteed to be unique, however this isn't really important to the issue i think)
Masterpage:
<div id="place1" class="placeholder">
<!-- render partial -->
</div>
Partial:
<div id="partial1" class="partial">
<!-- content -->
</div>
I feel that something isn't being done right. However I cannot remove the div in the masterpage, because I need that to 'encapsulate' the response from AJAX partial updates. And also I cannot move the div in the partial to the masterpage, because that would require to move 'partial' info to the masterpage...
How do you handle this?
I would say that it terms of the semantic description of what is happening here, of providing good hooks for styling and scripting, and also in terms of general robustness against future uses and changes, that using both divs is the best way to go.