PDA

View Full Version : hide start button on desktop Ext.NET 5


muhammadantoniussony
Jun 11, 2020, 11:40 PM
Greeting,

I've create desktop.aspx like below :


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="desktop.aspx.cs" Inherits="WebApplication1.desktop" %>


<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var curTheme = Ext.Net.ResourceManager.GetInstance(HttpContext.Cu rrent);

switch (curTheme.Theme)
{
case Ext.Net.Theme.Triton:
this.toolbarMnu.Height = 50;
break;
case Ext.Net.Theme.Classic:
this.toolbarMnu.Height = 35;
break;
case Ext.Net.Theme.CrispTouch:
case Ext.Net.Theme.NeptuneTouch:
Desktop1.TaskBar.QuickStartWidth = 84;
Desktop1.TaskBar.TrayWidth = 127;
break;
case Ext.Net.Theme.Crisp:
case Ext.Net.Theme.Neptune:
Desktop1.TaskBar.QuickStartWidth = 64;
Desktop1.TaskBar.TrayWidth = 114;
break;
}
}
}

protected void Logout_Click(object sender, DirectEventArgs e)
{

this.Response.Redirect("startup.aspx");
}

[DirectMethod(ShowMask = true)]
public void createwinappme(string idmn, string wtitle, string waction, int wheight, int wwidth)
{
Desktop.GetInstance().CreateWindow(new Window
{
ID = idmn,
Height = wheight,
Width = wwidth,
Maximizable = false,
Resizable = false,
Title = wtitle,
Icon = Icon.TableGear,
CloseAction = CloseAction.Destroy,
Modal = true,
Layout = "FitLayout",
Loader = new ComponentLoader
{
Url= waction,
Mode = LoadMode.Frame,
LoadMask =
{
ShowMask = true
}
}

});
}

</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Aplikasi Aset (BMD) ... </title>

<script type="text/javascript" src="~/Content/CommonUtil.js"></script>
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<link href="~/resources/desktop.css" rel="stylesheet" />
<style type="text/css">
/* wraps over the x-fa CSS class to match the reference from the Triton/Graphite themes */
.x-fa {
display: inline-block;
font: 18px;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: inherit;
}
</style>

<script>
var tile = function () {
Ext.net.Desktop.desktop.tileWindows();
};

var cascade = function () {
Ext.net.Desktop.desktop.cascadeWindows();
};

</script>
</head>
<body>
<ext:ResourceManager runat="server" Theme="Classic" ></ext:ResourceManager>

<ext:Desktop ID="Desktop1" runat="server" >

<DesktopConfig Wallpaper="~/resources/wallpapers/desk.jpg" ShortcutDragSelector="true" >
<Content>

</Content>
</DesktopConfig>

<StartMenu Title="Ext.Net Desktop" Icon="Application" Height="200" Hidden="true" >
<ToolConfig>
<ext:Toolbar ID="StartMenuToolbar" runat="server" Width="100">
<Items>
<ext:Button runat="server" Text="Settings" Icon="Cog" />
<ext:Button runat="server" Text="Logout" Icon="Key">
<DirectEvents>
<Click OnEvent="Logout_Click">
<EventMask ShowMask="true" Msg="Good Bye..." MinDelay="1000" />
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</ToolConfig>
</StartMenu>

<TaskBar QuickStartWidth="0" TrayWidth="50" Dock="Top" >
<QuickStart>
<ext:Toolbar ID="MnToolbar" runat="server">

</ext:Toolbar>
</QuickStart>
<Tray>

</Tray>

</TaskBar>
</ext:Desktop>
</body>
</html>


I want to hide start button using -- > Handler="Ext.get('ux-taskbar-start').addClass('x-hide-display');"

and I put <Listeners> </Listener> :


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="desktop.aspx.cs" Inherits="WebApplication1.desktop" %>


<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var curTheme = Ext.Net.ResourceManager.GetInstance(HttpContext.Cu rrent);

switch (curTheme.Theme)
{
case Ext.Net.Theme.Triton:
this.toolbarMnu.Height = 50;
break;
case Ext.Net.Theme.Classic:
this.toolbarMnu.Height = 35;
break;
case Ext.Net.Theme.CrispTouch:
case Ext.Net.Theme.NeptuneTouch:
Desktop1.TaskBar.QuickStartWidth = 84;
Desktop1.TaskBar.TrayWidth = 127;
break;
case Ext.Net.Theme.Crisp:
case Ext.Net.Theme.Neptune:
Desktop1.TaskBar.QuickStartWidth = 64;
Desktop1.TaskBar.TrayWidth = 114;
break;
}
}
}

protected void Logout_Click(object sender, DirectEventArgs e)
{

this.Response.Redirect("startup.aspx");
}

[DirectMethod(ShowMask = true)]
public void createwinappme(string idmn, string wtitle, string waction, int wheight, int wwidth)
{
Desktop.GetInstance().CreateWindow(new Window
{
ID = idmn,
Height = wheight,
Width = wwidth,
Maximizable = false,
Resizable = false,
Title = wtitle,
Icon = Icon.TableGear,
CloseAction = CloseAction.Destroy,
Modal = true,
Layout = "FitLayout",
Loader = new ComponentLoader
{
Url= waction,
Mode = LoadMode.Frame,
LoadMask =
{
ShowMask = true
}
}

});
}

</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Aplikasi Aset (BMD) ... </title>

<script type="text/javascript" src="~/Content/CommonUtil.js"></script>
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<link href="~/resources/desktop.css" rel="stylesheet" />
<style type="text/css">
/* wraps over the x-fa CSS class to match the reference from the Triton/Graphite themes */
.x-fa {
display: inline-block;
font: 18px;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: inherit;
}
</style>

<script>
var tile = function () {
Ext.net.Desktop.desktop.tileWindows();
};

var cascade = function () {
Ext.net.Desktop.desktop.cascadeWindows();
};

</script>
</head>
<body>
<ext:ResourceManager runat="server" Theme="Classic" ></ext:ResourceManager>

<ext:Desktop ID="Desktop1" runat="server" >

<DesktopConfig Wallpaper="~/resources/wallpapers/desk.jpg" ShortcutDragSelector="true" >
<Content>

</Content>
</DesktopConfig>

<StartMenu Title="Ext.Net Desktop" Icon="Application" Height="200" Hidden="true" >
<ToolConfig>
<ext:Toolbar ID="StartMenuToolbar" runat="server" Width="100">
<Items>
<ext:Button runat="server" Text="Settings" Icon="Cog" />
<ext:Button runat="server" Text="Logout" Icon="Key">
<DirectEvents>
<Click OnEvent="Logout_Click">
<EventMask ShowMask="true" Msg="Good Bye..." MinDelay="1000" />
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</ToolConfig>
</StartMenu>

<TaskBar QuickStartWidth="0" TrayWidth="50" Dock="Top" >
<QuickStart>
<ext:Toolbar ID="MnToolbar" runat="server">

</ext:Toolbar>
</QuickStart>
<Tray>

</Tray>

</TaskBar>
<Listeners>
<Ready Handler="Ext.get('ux-taskbar-start').addClass('x-hide-display');" />
</Listeners>
</ext:Desktop>
</body>
</html>




but why become blank like picture below
25362

Are there any solution ... ?? Thank you ...
fabricio.murta
Jun 12, 2020, 7:10 PM
Hello @muhammadantoniussony!

Disabling or enabling the listener you added:



<Listeners>
<Ready Handler="Ext.get('ux-taskbar-start').addClass('x-hide-display');" />
</Listeners>


I get the same result: the desktop showing the start menu:

25363

But indeed, there's a script error because there's no component named (or with ID as) ux-taskbar-start. Where have you inferred that command from? An example in Examples Explorer or another forum thread?

One way to get the button from the taskbar to hide it from desktop would be to use instead the Ext.select() method (https://docs.sencha.com/extjs/7.2.0/classic/Ext.html#method-select). The button takes the ux-start-button CSS class and you should be able to get its representation in the DOM (element in generated HTML page) via Ext.select('.ux-start-button').

Hoping it will be the only component using this CSS class in the page, you can then hide it with:



<Listeners>
<Ready Handler="Ext.select('.ux-start-button').elements[0].style.display = 'none';" />
</Listeners>


Fortunately this Ready event fires early and the space taken by the start button is also deallocated if you hide it.

Another (simpler) solution to hide the start menu would be to just add this CSS class extending its ux-start-button CSS class:


.ux-start-button {
display: none
}


Hope this helps!
muhammadantoniussony
Jun 13, 2020, 1:43 PM
Thank you Fabricio,

I get that code from https://forums.ext.net/showthread.php?62924-hide-start-button-on-desktop-Ext-NET-5&p=285710#post285710

After you answer my thread, I use this :


<style type="text/css">
.ux-start-button {
display: none
}
</style>


and It work
25364

Once again, thank you

And you can close this thread ...