OneUI version 2.1

Fra Notes 8.5.3 er der kommet OneUI 2.1

For at bruge det, så skal du i dit theme skrive:

<theme extends="oneuiv2.1" ...

Eller hvis du ønkser en af de forskellige farvekombinationer: Blue, Gold, Green, Onyx, Orange, Pink, Purple, Red eller Silver: oneuiv2.1_<colorname>

OneUI 2.1 introducere et helt nyt look and feel (klik for at se i fuld størrelse):

Til sammenligning, så ser OneUI 2 sådan ud:

Links

Dynamisk ændring af Themes

Hvis du har flere themes, så kan man nemt lave en dropdown på din XPage hvorfra brugeren selv kan vælge et andet theme. Koden er vist nedenfor. Det er også muligt, i themet, at beregne hvilke stylesheets der skal benyttes – det har bl.a. Paul Withers lavet et eksempel på.

Theme vælger – koden er lige til at kopiere. Du skal blot ændre valgmuligheder, så de svarer til de themes du har:

<xp:panel styleClass="lotusInfoBox">
	<h3>Theme selector</h3>
	<xp:comboBox id="comboBox1" value="#{requestScope.possibleAppThemes}">
		<xp:selectItem itemLabel="" />
		<xp:selectItem itemLabel="Theme1" />
		<xp:selectItem itemLabel="Theme2" />
		<xp:selectItem itemLabel="Theme3" />
		<xp:eventHandler event="onchange" submit="true"
			refreshMode="complete">
			<xp:this.action><![CDATA[#{javascript:var f = "/"+@RightBack(context.getUrl().getAddress(),"/");
context.setSessionProperty('xsp.theme', getComponent('themeSelector').getValue());
context.redirectToPage(f)}]]></xp:this.action>
		</xp:eventHandler>

	</xp:comboBox>
</xp:panel>

Login og Logout

På OpenNTF findes der en lækker Login/Login Custom Control som du kan genbruge på dine egne sider. Denne åbner en dialogboks og understøtter funktioner som ‘Husk password’ og ‘Glemt password’

Hvis du ønsker en mere simple ‘gør det selv’ løsning, så kan du blot indsætte følgende kode i dit OneUI ‘lotusBanner’ panel:

<xp:tabbedPanel id="lotusUtility" styleClass="lotusInlinelist lotusUtility"
		disableTheme="true">
		<xp:tabPanel id="tabserverName" startTabStyleClass="lotusFirst">
			<xp:this.label><![CDATA[${javascript:"On " + @Name("[CN]",database.getServer());}]]></xp:this.label>
			<xp:this.loaded><![CDATA[${javascript:@ClientType()=="Notes"}]]></xp:this.loaded>
		</xp:tabPanel>
		<xp:tabPanel id="userName" startTabStyleClass="lotusFirst"
			styleClass="lotusUser">
			<xp:this.label><![CDATA[#{javascript:@Name("[CN]",session.getEffectiveUserName());}]]></xp:this.label>
			<xp:this.loaded><![CDATA[${javascript:@ClientType()=="Web"}]]></xp:this.loaded>
		</xp:tabPanel>
		<xp:tabPanel label="Log in" id="login">
			<xp:this.rendered><![CDATA[${javascript:@ClientType()=="Web" && session.getEffectiveUserName()=="Anonymous"}]]></xp:this.rendered>
			<xp:this.href><![CDATA[?Open&login]]></xp:this.href>
		</xp:tabPanel>
		<xp:tabPanel label="Log out" id="logout">
			<xp:this.rendered><![CDATA[${javascript:@ClientType()=="Web" && session.getEffectiveUserName()!="Anonymous"}]]></xp:this.rendered>
			<xp:this.href><![CDATA[${javascript:"/names.nsf?logout&RedirectTo="+context.getUrl().toString()}]]></xp:this.href>
		</xp:tabPanel>
	</xp:tabbedPanel>