Windows Azure Pack Management Portal Client-Side-tillägget JavaScript
Gäller för: Windows Azure Pack
Hello World Exempel Visual Studio Project sökvägar: Microsoft.WAP.Samples.HelloWorld.TenantExtension\Content\*.js och Microsoft.WAP.Samples.HelloWorld.AdminExtension\Content\*.js
JavaScript som krävs av ett Windows Azure Pack-hanteringsportaltillägget ska placeras i mallar och definieras i manifestet. Då läses JavaScript in i webbläsaren när Windows Azure Pack-portalen läses in. Precis som med formatmallar finns det ingen isolering för skript – alla skript läses in tillsammans. Vi rekommenderar därför starkt att JavaScript-isoleringstekniker som namnområden används.
Layout
Du kan ha så få eller så många JavaScript-filer som tillägget kräver. Vi föreslår dock att du följer en fillayout och en separation som liknar Hello World exempel:
Microsoft.WAP.Samples.HelloWorld.TenantExtension (or Microsoft.WAP.Samples.HelloWorld.AdminExtension)
\Styles
\Templates
extensions.data.js
[ExtensionName]Extension.js (e.g. DomainTenantExtension.js)
\Scripts
(Individual scripts per tab or dialog)
Huvudpunkterna i den här layouten är:
Det finns två JavaScript-filer utanför katalogen \Scripts – de innehåller initieringskoden för webbläsardelen av klientsidan av tillägget.
Alla andra JavaScript-filer finns i katalogen \Scripts. Varje större användargränssnittsvy för tillägget, till exempel flikar eller dialogrutor, har en egen fil. Koden i finns i ett namnområde för tillägget.
Initiering av Java-skript
Initieringen av JavaScript-filer är:
Microsoft.WAP.Samples.HelloWorld.TenantExtension\extensions.data.js
Microsoft.WAP.Samples.HelloWorld.TenantExtension\HelloWorldTenant Extension.js
Microsoft.WAP.Samples.HelloWorld.AdminExtension\extensions.data.js
Microsoft.WAP.Samples.HelloWorld.AdminExtension\HelloWorldAdminExtension.js
Initieringen av JavaScript-delen av klienttillägget är i två delar. Den första deklarerar tillägget till ramverket, den andra delen fyller i beteende och viktiga komponenter i användargränssnittet, till exempel flikar och kommandofältsknappar. Anledningen till den här uppdelningen är att det gör att ett tillägg kan kontrollera om det behöver visas. En användare kanske till exempel inte prenumererar på en plan som innehåller dina resurser. Då behövs inte visning. Detta visas av funktionen HelloWorldTenantExtensionActivationInit i Microsoft.WAP.Samples.HelloWorld.TenantExtension\Content\HelloWorldTenantExtension.js:
HelloWorldTenantExtensionActivationInit = function () {
var subs = Exp.Rdfe.getSubscriptionList(),
subscriptionRegisteredToService = global.Exp.Rdfe.getSubscriptionsRegisteredToService("helloworld"),
helloWorldExtension = $.extend(this, global.HelloWorldTenantExtension);
// Don't activate the extension if user doesn't have a plan that includes the service.
if (subscriptionRegisteredToService.length === 0) {
return false; // Don't want to activate? Just bail
}
//var quickCreateViewModel = new global.HelloWorldTenantExtension.ViewModels.QuickCreateViewModel();
$.extend(helloWorldExtension, {
viewModelUris: [helloWorldExtension.Controller.userInfoUrl],
displayName: "Hello World",
navigationalViewModelUri: {
uri: helloWorldExtension.Controller.listFileSharesUrl,
ajaxData: function () {
return global.Exp.Rdfe.getSubscriptionIdsRegisteredToService(serviceName);
}
},
displayStatus: global.waz.interaction.statusIconHelper(global.HelloWorldTenantExtension.FileSharesTab.statusIcons, "Status"),
menuItems: [
{
name: "FileShares",
displayName: "Hello World",
url: "#Workspaces/HelloWorldTenantExtension",
preview: "createPreview",
subMenu: [
{
name: "Create",
displayName: "Create File Share",
description: "Quickly Create File Share on a File Server",
template: "CreateFileShare",
label: "Create",
subMenu: [
{
name: "QuickCreate",
displayName: "FileFile",
template: "CreateFileShare"
}
]//,
//data: quickCreateViewModel,
//open: global.HelloWorldTenantExtension.ViewModels.onOpened,
//ok: global.HelloWorldTenantExtension.ViewModels.onOk
//execute: global.HelloWorldTenantExtension.CreateWizard.showCreateWizard
}
]
}
],
getResources: function () {
return resources;
}
});
// TODO: (fx-isolation) Refactor navigation
helloWorldExtension.onNavigateAway = onNavigateAway;
helloWorldExtension.navigation = navigation;
Shell.UI.Pivots.registerExtension(helloWorldExtension, function () {
Exp.Navigation.initializePivots(this, this.navigation);
});
// Finally activate and give "the" helloWorldExtension the activated extension since a good bit of code depends on it
$.extend(global.HelloWorldTenantExtension, Shell.Extensions.activate(helloWorldExtension));
};
Precis som alla andra JavaScript som krävs för tillägget bör det deklareras i manifestet för ditt tillägg. Den första delen av tilläggsdeklarationen, om du använder den föreslagna fillayouten från tidigare, sker i extensions.data.js-filen. Det Hello World exemplet har detta i Microsoft.WAP.Samples.HelloWorld.TenantExtension\Content\extensions.data.js :
(function (global, undefined) {
"use strict";
var extensions = [{
name: "HelloWorldTenantExtension",
displayName: "Hello World",
iconUri: "/Content/HelloWorldTenant/HelloWorldTenant.png",
iconShowCount: false,
iconTextOffset: 11,
iconInvertTextColor: true,
displayOrderHint: 2 // Display it right after WebSites extension (order 1)
}];
global.Shell.Internal.ExtensionProviders.addLocal(extensions);
})(this);
Egenskap |
Beskrivning |
|---|---|
displayName |
Text som visas i det vänstra navigeringsfältet för tillägget. |
iconUri |
Webbplats-absolut sökväg till bilden som används som ikon för tillägget. |
iconShowCount |
Växlar till att visa antalet objekt i ett tillägg på tilläggets ikon. |
iconTextOffset, iconInvertTextColor |
Detaljerad kontroll över visningen av tilläggets post i det vänstra navigeringsfältet. |
displayOrderHint |
Placera i listan över tillägg i det vänstra navigeringsfältet. Ett lägre tal motsvarar närmare överst i det vänstra navigeringsfönstret. |
Den andra delen av tilläggsdeklarationen, om du använder den föreslagna fillayouten i Implementera en Windows Azure Pack Management Portal Client-Side Extension, sker i filen [ExtensionName]Extension.js (där [ExtensionName] är namnet på tillägget). Innehållet i den här filen är vanligtvis tilläggsomfattande i omfånget. Exempel på vad som vanligtvis utförs i den här filen är:
Konfigurera JavaScript-namnområdet för tilläggets kod.
Deklarera eventuella flikar som tillägget kommer att ha.
Om du deklarerar alla Lägg till nya menyalternativ kommer tillägget att bidra.
Definiera eventuella tilläggs-globala beteenden. Till exempel vad du ska göra när tillägget öppnas för första gången.
Tabb- eller dialogruta för JavaScript-filer
Om du använder den föreslagna skriptdelningen och fillayouten har varje flik eller dialogruta en egen JavaScript-fil i katalogen \Scripts. Varje skriptfil måste deklareras i manifestet för ditt tillägg om den ska läsas in. Vi rekommenderar att JavaScript-koden finns i ett namnområde för att inte störa kod från andra tillägg. Om samma namnområde används mellan alla dina filer, bör du kunna referera till funktioner från andra filer, vilket innebär att du kan ha initieringen JavaScript referera till en funktion i guiden JavaScript som skapar en guide, i stället för att låta guiden skapa funktionen vara en del av initieringen JavaScript.
Mer information om hur du utför åtgärder i användargränssnittet finns i Utföra vanliga uppgifter i ett Windows Azure Pack Management Portal-tillägg.
Se även
Windows Tillägg för användargränssnitt i Azure Pack Management Portal