diff --git a/src/Our.Umbraco.UiExamples/Build/Our.Umbraco.UiExamples.targets b/src/Our.Umbraco.UiExamples/Build/Our.Umbraco.UiExamples.targets new file mode 100644 index 0000000..ee7dd43 --- /dev/null +++ b/src/Our.Umbraco.UiExamples/Build/Our.Umbraco.UiExamples.targets @@ -0,0 +1,27 @@ + + + + $(MSBuildThisFileDirectory)..\content\App_Plugins\uiexamples\**\*.* + + + + + + + + + + + + + + + + + + + + diff --git a/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdmins.cs b/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdmins.cs deleted file mode 100644 index 3f578d7..0000000 --- a/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdmins.cs +++ /dev/null @@ -1,44 +0,0 @@ -using Umbraco.Core; -using Umbraco.Core.Logging; -using Umbraco.Core.Migrations; -using Umbraco.Core.Scoping; -using Umbraco.Core.Services; -using Umbraco.Web; - -namespace Our.Umbraco.UiExamples.Migrations -{ - public class AddSectionForAdmins : IMigration - { - private readonly IProfilingLogger _logger; - private readonly IUmbracoContextFactory _context; - private readonly IScopeProvider _scopeProvider; - private readonly IUserService _userService; - - public AddSectionForAdmins(IProfilingLogger logger, IUmbracoContextFactory contextFactory, IScopeProvider scopeProvider, IUserService userService) - { - _logger = logger; - _context = contextFactory; - _scopeProvider = scopeProvider; - _userService = userService; - } - - public void Migrate() - { - using (UmbracoContextReference umbracoContextReference = _context.EnsureUmbracoContext()) - { - - using (var scope = _scopeProvider.CreateScope()) - { - var adminGroup = _userService.GetUserGroupByAlias(Constants.Security.AdminGroupAlias); - adminGroup.AddAllowedSection("uiExamples"); - - _userService.Save(adminGroup); - - scope.Complete(); - } - } - - _logger.Info("Post migration completed"); - } - } -} \ No newline at end of file diff --git a/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdminsMigration.cs b/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdminsMigration.cs index 45e22f1..f448bb8 100644 --- a/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdminsMigration.cs +++ b/src/Our.Umbraco.UiExamples/Migrations/AddSectionForAdminsMigration.cs @@ -1,17 +1,57 @@ -using Umbraco.Core.Logging; + +#if NETCOREAPP +using Umbraco.Cms.Core.Scoping; +using Umbraco.Cms.Core.Services; +using Umbraco.Cms.Core; +using Umbraco.Cms.Infrastructure.Migrations; +using Umbraco.Cms.Core.Logging; +using Umbraco.Cms.Core.Web; +#else +using Umbraco.Core; using Umbraco.Core.Migrations; +using Umbraco.Core.Scoping; +using Umbraco.Core.Services; +using Umbraco.Web; +#endif + namespace Our.Umbraco.UiExamples.Migrations { public class AddSectionToAdminsMigration : MigrationBase { - public AddSectionToAdminsMigration( IMigrationContext context) : base(context) { } + private readonly IUmbracoContextFactory _context; + private readonly IScopeProvider _scopeProvider; + private readonly IUserService _userService; + + public AddSectionToAdminsMigration(IMigrationContext context, + IUmbracoContextFactory umbracoContextFactory, + IScopeProvider scopeProvider, + IUserService userService) : base(context) + { + _userService = userService; + _context = umbracoContextFactory; + _scopeProvider = scopeProvider; + } +#if NETCOREAPP + protected override void Migrate() +#else public override void Migrate() +#endif { - Context.Logger.Info("Starting migration to add UI Examples section to the admin usergroup"); - Context.AddPostMigration(); - Context.Logger.Info("Migration completed"); + using (UmbracoContextReference umbracoContextReference = _context.EnsureUmbracoContext()) + { + using (var scope = _scopeProvider.CreateScope()) + { + var adminGroup = _userService.GetUserGroupByAlias(Constants.Security.AdminGroupAlias); + adminGroup.AddAllowedSection("uiExamples"); + + _userService.Save(adminGroup); + + scope.Complete(); + } + } + } } } \ No newline at end of file diff --git a/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComponent.cs b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComponent.cs new file mode 100644 index 0000000..dc3ccfd --- /dev/null +++ b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComponent.cs @@ -0,0 +1,40 @@ +// +// FRAMEWORK ONLY CODE +// +#if NETFRAMEWORK +using Umbraco.Core.Composing; +using Umbraco.Core.Logging; +using Umbraco.Core.Migrations; +using Umbraco.Core.Migrations.Upgrade; +using Umbraco.Core.Scoping; +using Umbraco.Core.Services; + +namespace Our.Umbraco.UiExamples.Migrations +{ + public class UiExamplesMigrationComponent : IComponent + { + private readonly IScopeProvider _scopeProvider; + private readonly IMigrationBuilder _migrationBuilder; + private readonly IKeyValueService _keyValueService; + private readonly IProfilingLogger _profilingLogger; + + public UiExamplesMigrationComponent(IScopeProvider scopeProvider, IMigrationBuilder migrationBuilder, IKeyValueService keyValueService, IProfilingLogger profilingLogger) + { + _scopeProvider = scopeProvider; + _migrationBuilder = migrationBuilder; + _keyValueService = keyValueService; + _profilingLogger = profilingLogger; + } + + + public void Initialize() + { + var upgrader = new Upgrader(new UiExamplesMigrationPlan()); + upgrader.Execute(_scopeProvider, _migrationBuilder, _keyValueService, _profilingLogger); + } + + public void Terminate() + { } + } +} +#endif \ No newline at end of file diff --git a/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComposer.cs b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComposer.cs index ba32dec..743bab9 100644 --- a/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComposer.cs +++ b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationComposer.cs @@ -1,40 +1,35 @@ -using Umbraco.Core; +#if NETCOREAPP +using Umbraco.Cms.Core.Composing; +using Umbraco.Cms.Core.DependencyInjection; +using Umbraco.Cms.Core.Events; +using Umbraco.Cms.Core.Notifications; +#else +using Umbraco.Core; using Umbraco.Core.Composing; -using Umbraco.Core.Logging; -using Umbraco.Core.Migrations; -using Umbraco.Core.Migrations.Upgrade; -using Umbraco.Core.Scoping; -using Umbraco.Core.Services; +#endif + namespace Our.Umbraco.UiExamples.Migrations { - [RuntimeLevel(MinLevel = RuntimeLevel.Run)] - public class UiExamplesMigrationComposer : ComponentComposer, IUserComposer - { } - public class UiExamplesMigrationComponent : IComponent - { - private readonly IScopeProvider _scopeProvider; - private readonly IMigrationBuilder _migrationBuilder; - private readonly IKeyValueService _keyValueService; - private readonly IProfilingLogger _profilingLogger; +#if NETCOREAPP - public UiExamplesMigrationComponent(IScopeProvider scopeProvider, IMigrationBuilder migrationBuilder, IKeyValueService keyValueService, IProfilingLogger profilingLogger) + public class UiExamplesMigrationComposer : IComposer + { + public void Compose(IUmbracoBuilder builder) { - _scopeProvider = scopeProvider; - _migrationBuilder = migrationBuilder; - _keyValueService = keyValueService; - _profilingLogger = profilingLogger; + builder.AddNotificationHandler(); } + } + + +#else + [RuntimeLevel(MinLevel = RuntimeLevel.Run)] + public class UiExamplesMigrationComposer : ComponentComposer, IUserComposer + { } +#endif + - public void Initialize() - { - var upgrader = new Upgrader(new UiExamplesMigrationPlan()); - upgrader.Execute(_scopeProvider, _migrationBuilder, _keyValueService, _profilingLogger); - } - public void Terminate() - { } - } } \ No newline at end of file diff --git a/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationPlan.cs b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationPlan.cs index 1e0374a..728e551 100644 --- a/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationPlan.cs +++ b/src/Our.Umbraco.UiExamples/Migrations/UiExamplesMigrationPlan.cs @@ -1,4 +1,9 @@ -using Umbraco.Core.Migrations; + +#if NETCOREAPP +using Umbraco.Cms.Infrastructure.Migrations; +#else +using Umbraco.Core.Migrations; +#endif namespace Our.Umbraco.UiExamples.Migrations { diff --git a/src/Our.Umbraco.UiExamples/Migrations/UmbracoAppStartingHandler.cs b/src/Our.Umbraco.UiExamples/Migrations/UmbracoAppStartingHandler.cs new file mode 100644 index 0000000..7d577b3 --- /dev/null +++ b/src/Our.Umbraco.UiExamples/Migrations/UmbracoAppStartingHandler.cs @@ -0,0 +1,43 @@ +#if NETCOREAPP + +using Umbraco.Cms.Core.Events; +using Umbraco.Cms.Core.Migrations; +using Umbraco.Cms.Core.Notifications; +using Umbraco.Cms.Core.Scoping; +using Umbraco.Cms.Core.Services; +using Umbraco.Cms.Infrastructure.Migrations.Upgrade; + +namespace Our.Umbraco.UiExamples.Migrations +{ + public class UmbracoAppStartingHandler + : INotificationHandler + { + private readonly IRuntimeState _runtimeState; + private readonly IMigrationPlanExecutor _migrationPlanExecutor; + private readonly IScopeProvider _scopeProvider; + private readonly IKeyValueService _keyValueService; + + public UmbracoAppStartingHandler(IRuntimeState runtimeState, + IMigrationPlanExecutor migrationPlanExecutor, + IScopeProvider scopeProvider, + IKeyValueService keyValueService + ) + { + _runtimeState = runtimeState; + + _migrationPlanExecutor = migrationPlanExecutor; + _scopeProvider = scopeProvider; + _keyValueService = keyValueService; + } + public void Handle(UmbracoApplicationStartingNotification notification) + { + if (_runtimeState.Level == global::Umbraco.Cms.Core.RuntimeLevel.Run) + { + var upgrader = new Upgrader(new UiExamplesMigrationPlan()); + upgrader.Execute(_migrationPlanExecutor, _scopeProvider, _keyValueService); + + } + } + } +} +#endif \ No newline at end of file diff --git a/src/Our.Umbraco.UiExamples/Our.Umbraco.UiExamples.csproj b/src/Our.Umbraco.UiExamples/Our.Umbraco.UiExamples.csproj index f5a7682..5461fb6 100644 --- a/src/Our.Umbraco.UiExamples/Our.Umbraco.UiExamples.csproj +++ b/src/Our.Umbraco.UiExamples/Our.Umbraco.UiExamples.csproj @@ -1,11 +1,66 @@ - + - net472 + net472;net50 - - - + + + Our.Umbraco.UIExamples + 2.0-beta001 + + + MIT + https://our.umbraco.com/packages/developer-tools/ui-examples/ + Umbraco + + https://github.com/umbraco/UI-Examples + + A collection of backoffice elements designed to help Umbraco developers extend the backoffice. + + 1.0 - Initial version + 2.0 - Multi-targeted v8/v9 version + + + true + true + snupkg + + content + + ../../output + + + + + + + true + Always + + + + + True + buildTransitive + + + + + + + + + + + + + + + + + + + diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.controller.js new file mode 100644 index 0000000..13f5c63 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.controller.js @@ -0,0 +1,78 @@ + +(function () { + 'use strict'; + + function buttons($scope, + localizationService, + overlayService, + exampleResource) { + + var vm = this; + vm.doStuff = doStuff; + vm.linkAway = exampleResource.linkAway; + + /// umb-button-group /// + + vm.buttonGroup = { + defaultButton: { + labelKey: "buttons_groupedButton_default", + hotKey: "ctrl+d", + hotKeyWhenHidden: true, + buttonStyle: 'success', + handler: function () { + // do magic here + alert("you clicked the default button"); + } + }, + subButtons: [ + { + labelKey: "buttons_groupedButton_subButtonA", + hotKey: "ctrl+a", + hotKeyWhenHidden: true, + handler: function () { + // do magic here + alert("you clicked a sub button A"); + } + }, + { + labelKey: "buttons_groupedButton_subButtonB", + hotKey: "ctrl+b", + hotKeyWhenHidden: true, + buttonStyle: 'success', + handler: function () { + // do magic here + alert("you clicked a sub button B"); + } + } + ] + }; + + /// + + function doStuff () { + openOverlay(); + }; + + function openOverlay() { + + localizationService.localizeMany(["buttonsOverlayTitle", "buttonsOverlayMessage"]) + .then(function (values) { + + var overlay = { + title: values[0], + content: values[1], + disableBackdropClick: true, + disableEscKey: true, + submit: function () { + overlayService.close(); + } + }; + + overlayService.confirmDelete(overlay); + }); + } + }; + + angular.module('umbraco') + .controller('buttonsSectionController', buttons); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.html new file mode 100644 index 0000000..7c41465 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/buttons.html @@ -0,0 +1,121 @@ +
+ + + + + + + + <umb-button + action="vm.doStuff()" + label="Hello world" + type="button" + button-style="block | action | primary | info | success | warning | danger | inverse | link"> +</umb-button> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + <umb-button-group + button-style="block | action | primary | info | success | warning | danger | inverse | link" + default-button="vm.buttonGroup.defaultButton" + sub-buttons="vm.buttonGroup.subButtons" + direction="up | down"> +</umb-button-group> + + + + + + + + + + + + + + + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/lang/en.xml new file mode 100644 index 0000000..edb3131 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/lang/en.xml @@ -0,0 +1,18 @@ + + + + umb-button + Render a styled button + + + + umb-grouped-button + Render a grouped button + This is an example of a button group, you can see a few examples rendered down below. + Grouped style 'info' + Sub Button A + Sub Button B + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/package.manifest new file mode 100644 index 0000000..cb2c959 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/buttons/package.manifest @@ -0,0 +1,3 @@ +{ + "javascript": [ "~/app_plugins/uiexamples/buttons/buttons.controller.js" ] +} diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.controller.js new file mode 100644 index 0000000..a2711d8 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.controller.js @@ -0,0 +1,77 @@ +(function () { + 'use strict'; + + + function dialogsController($scope, overlayService) { + + var vm = this; + + vm.openConfirmOverlay = openConfirmOverlay; + vm.openCustomOverlay = openCustomOverlay; + + function openConfirmOverlay(content, confirmType) { + + var options = { + title: 'Simple', + content: content, + disableBackdropClick: true, + disableEscKey: true, + confirmType: confirmType, // type of confirmation. + submit: function () { + overlayService.close(); + } + }; + + overlayService.confirm(options); + + } + + function openCustomOverlay() { + + + var options = { + view: Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/dialogs/overlays/customOverlay.html', + title: 'Custom overlay', + description: 'A custom view in an overlay', + disableBackdropClick: true, + disableEscKey: true, + submitButtonLabel: 'Do Things', + closeButtonLable: 'Close', + submit: function (model) { + + // multi-step overlay, will still call the submit + // as its the only button, + // but you can use values in the model, to check + // if you are ready to close. + // simple example, we have a process function + // (in the overlay's controller) that does stuff + // and sets complete when done. + + // when complete is true, we close the overlay. + // until then we keep calling process. + + if (model.complete) { + overlayService.close(); + } + else { + model.process(); + } + + }, + close: function () { + overlayService.close(); + } + + } + + overlayService.open(options); + + } + + + } + + angular.module('umbraco') + .controller('exampleDialogController', dialogsController); + +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.html new file mode 100644 index 0000000..07ba046 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/dialogs.html @@ -0,0 +1,47 @@ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/lang/en.xml new file mode 100644 index 0000000..c9f938b --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/lang/en.xml @@ -0,0 +1,23 @@ + + + + Overlay Dialogs + Overlays give you a 'modal' dialog across the whole screen + + + The overlay service has a confirm option built, in with this you can quickly create a confirm + dialog, to present your users with a simple option. +

]]> + + + Custom overlay + Custom overlays give you more control + + + For more custom options you need to provide a view and a custom controller to manage what + happens inside the overlay.

+

With this method you can control the submit and close process so you can (with a little fangling) + have muilt-step processes inside the overlay window.

]]> + + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.controller.js new file mode 100644 index 0000000..3e681bd --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.controller.js @@ -0,0 +1,43 @@ +(function () { + 'use strict'; + + function customOverlayController($scope) { + + var vm = this; + $scope.model.complete = false; + + vm.step = 1; + + vm.icon = 'icon-box'; + + vm.content = 'A custom overlay.' + + // add method to model, so we can call it from parent + $scope.model.process = process; + + function process() { + + vm.step++; + $scope.model.description = 'Step ' + vm.step; + + switch (vm.step) { + case 2: + vm.icon = 'icon-sprout'; + vm.content = 'Do another thing'; + $scope.model.submitButtonLabel = 'One last thing'; + break; + case 3: + vm.icon = 'icon-check color-green'; + vm.content = 'We are done now'; + $scope.model.submitButtonLabel = 'Finish'; + $scope.model.complete = true; + break; + } + + + } + } + + angular.module('umbraco') + .controller('exampleCustomOverlayController', customOverlayController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.html new file mode 100644 index 0000000..07501ea --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/overlays/customoverlay.html @@ -0,0 +1,6 @@ +
+
+ +

{{vm.content}}

+
+
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/package.manifest new file mode 100644 index 0000000..8e29d62 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/dialogs/package.manifest @@ -0,0 +1,6 @@ +{ + "javascript": [ + "~/app_plugins/uiexamples/dialogs/dialogs.controller.js", + "~/app_plugins/uiexamples/dialogs/overlays/customoverlay.controller.js" + ] +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/lang/en.xml new file mode 100644 index 0000000..b098e3f --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/lang/en.xml @@ -0,0 +1,40 @@ + + + + The umb-editor-footer element + + The umb-editor-footer element (outlined in red) is used as a container to display a footer on the current editor screen in Umbraco. It contains a left (outlined in blue) and right element (outlined in green). For example, these are used in Umbraco to display a breadcrumb and the save/publish buttons while editing content. + ]]> + + The umb-editor-header element + + The umbEditorHeader directive is used to display the header if things like DocumentTypes, MemberTypes and so on are edited. It has input boxes for icon, name, description and alias. +

Directive attributes:

+
    +
  • name
    • +
  • nameLocked
    • +
  • nameRequired
    • +
  • menu
    • +
  • hideActionsMenu
    • +
  • icon
    • +
  • hideIcon
    • +
  • alias
    • +
  • aliasLocked
    • +
  • hideAlias
    • +
  • description
    • +
  • hideDescription
    • +
  • descriptionLocked
    • +
  • navigation
    • +
  • onSelectNavigationItem
    • +
  • key
    • +
  • onBack
    • +
  • showBackButton
    • +
  • editorfor
    • +
  • setpagetitle
    • +
+ ]]> + + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/package.manifest new file mode 100644 index 0000000..1ecc138 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/package.manifest @@ -0,0 +1,6 @@ +{ + "css": [ "~/app_plugins/uiexamples/editorPanels/panels.css" ], + "javascript": [ + "~/app_plugins/uiexamples/editorPanels/panels.controller.js" + ] +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.controller.js new file mode 100644 index 0000000..14d5b89 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.controller.js @@ -0,0 +1,14 @@ +(function () { + 'use strict'; + + function panelsController($scope, exampleResource) { + + var vm = this; + + vm.loading = true; + + vm.linkAway = exampleResource.linkAway; + }; + + angular.module('umbraco').controller('panelsController', panelsController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.css b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.css new file mode 100644 index 0000000..e11c7ed --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.css @@ -0,0 +1,18 @@ +.editor-panels-container{} + +.editor-panels-container .red-outline-dotted{ + border: 1px dotted red; +} + +.editor-panels-container .blue-outline-dotted { + border: 1px dotted blue; +} + +.editor-panels-container .green-outline-dotted { + border: 1px dotted green; +} + +.editor-panels-container .umb-editor-footer, +.editor-panels-container .umb-editor-header { + position: relative; +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.html new file mode 100644 index 0000000..f869395 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/editorPanels/panels.html @@ -0,0 +1,65 @@ +
+ + + + + + + + + Left + + + Right + + + + +<umb-editor-footer> + <umb-editor-footer-content-left> + Left + </umb-editor-footer-content-left> + <umb-editor-footer-content-right> + Right + </umb-editor-footer-content-right> +</umb-editor-footer> + + + + + + + + + + + + + + + +<umb-editor-header name="'TestName'" name-locked="true" + icon="'icon-screenshare'" alias="'testName'" alias-locked="true" + description="'Description'" + description-locked="true" + hide-alias="true" + show-back-button="true"> +</umb-editor-header> + + + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.controller.js new file mode 100644 index 0000000..9bb9dd3 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.controller.js @@ -0,0 +1,34 @@ +(function () { + 'use strict'; + + function overlayController() { + + var vm = this; + + vm.colors = [ + { name: "Black", value: "color-black", default: true }, + { name: "Blue Grey", value: "color-blue-grey" }, + { name: "Grey", value: "color-grey" }, + { name: "Brown", value: "color-brown" }, + { name: "Blue", value: "color-blue" }, + { name: "Light Blue", value: "color-light-blue" }, + { name: "Indigo", value: "color-indigo" }, + { name: "Purple", value: "color-purple" }, + { name: "Deep Purple", value: "color-deep-purple" }, + { name: "Cyan", value: "color-cyan" }, + { name: "Green", value: "color-green" }, + { name: "Light Green", value: "color-light-green" }, + { name: "Lime", value: "color-lime" }, + { name: "Yellow", value: "color-yellow" }, + { name: "Amber", value: "color-amber" }, + { name: "Orange", value: "color-orange" }, + { name: "Deep Orange", value: "color-deep-orange" }, + { name: "Red", value: "color-red" }, + { name: "Pink", value: "color-pink" } + ]; + + } + + angular.module('umbraco') + .controller('exampleSectionIconsOverlayController', overlayController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.html new file mode 100644 index 0000000..a7defa0 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/iconoverlay.html @@ -0,0 +1,14 @@ +
+ +
+
+ +
+ + <umb-icon icon="{{model.icon.name}}" class="{{vm.activeColor.value}}"></umb-icon> +
+ +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.controller.js new file mode 100644 index 0000000..922681c --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.controller.js @@ -0,0 +1,55 @@ +(function () { + 'use strict'; + + function exampleSectionIconsController(exampleResource, iconHelper, overlayService) { + + var vm = this; + vm.loading = true; + vm.linkAway = exampleResource.linkAway; + + vm.openIconOverlay = openIconOverlay; + + function init() { + + if (iconHelper.getAllIcons !== undefined) { + + iconHelper.getAllIcons().then(function (icons) { + vm.icons = icons; + vm.loading = false; + }); + } + else { + iconHelper.getIcons().then(function (icons) { + vm.icons = icons.map(function (icon) { + return { + name: icon, svgString: null + }; + }); + vm.loading = false; + }); + } + } + + ///////// + + function openIconOverlay(icon) { + + var options = { + view: Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/icons/iconOverlay.html', + title: icon.name, + content: icon.name, + icon: icon, + hideSubmitButton: true, + close: function () { + overlayService.close(); + } + } + overlayService.open(options); + } + + init(); + } + + angular.module('umbraco') + .controller('exampleSectionIconsController', exampleSectionIconsController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.html new file mode 100644 index 0000000..8e2ad07 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/icons.html @@ -0,0 +1,49 @@ +
+ + + + + + + + + <umb-icon + icon="icon-{name}"> + class="small | medium | large"> +</umb-icon> +

+

+
    +
  • small   14px
    • +
  • medium   24px
    • +
  • large   32px
    • +
+

+ + + + + + + + + + + +
+
+ +
{{icon.name}}
+
+
+ + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/lang/en.xml new file mode 100644 index 0000000..d3e246f --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/lang/en.xml @@ -0,0 +1,12 @@ + + + + umb-icon + Use this directive to render a svg icon + The 'icon' parameter determines which icon to show. All names are prefixed with icon-, for example 'icon-alert' and 'icon-checkbox'. See below for a list of all icons and their names. + The 'class' parameter can be used to render the icon with a fixed size: + Without a size class specified the icon will inherit the font-size of their parent container. + Available Icons + The core Umbraco backoffice svg icons + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/package.manifest new file mode 100644 index 0000000..63048f1 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/icons/package.manifest @@ -0,0 +1,6 @@ +{ + "javascript": [ + "~/App_Plugins/uiexamples/icons/icons.controller.js", + "~/App_Plugins/uiexamples/icons/iconoverlay.controller.js" + ] +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/info.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/info.html new file mode 100644 index 0000000..3695ae8 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/info.html @@ -0,0 +1,12 @@ +
+ + + + + + + + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/lang/en.xml new file mode 100644 index 0000000..b6ba465 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/lang/en.xml @@ -0,0 +1,20 @@ + + + + API Documentation + + + UIExamples + + + UI Examples + A backoffice component library as a package + + This package is developed and maintained by the Umbraco Package Team.

+

It contains a quick overview of several backoffice elements and shows you how to use them. The package is also great reference material, if you see something within this section that isn't covered on one of the tabs you can go to your App_Plugins folder and check the source.

+

Everything in this package is frontend only (except for a bit of code that automatically adds this section to all user groups).

+ ]]> + + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/lang/en.xml new file mode 100644 index 0000000..ac7fb14 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/lang/en.xml @@ -0,0 +1,36 @@ + + + + + + Loading indicator + Display a loading indicator while things setup + The umbraco load indicator allows you to show the three progress 'bubbles' while your page initializes or you do work that will take some time.

+

Click the button below for an example, or try it yourself using this sample code:

+ ]]> + Start loading + Stop loading + + + Layout + Classes to aid page layout + + + Umbraco contains many helper methods for controlling how a flexbox and its child items are rendered.

+

For a complete rundown of flexbox behaviour see a guide to flexbox.

+ ]]> + Jusfiy content within a flex layout - good for spacing your content across the page. + Align items within the flex layout, good for aligning text and image boxes of different sizes. + Align content within a flex layout, good for controlling how boxes flow across the page. + + + + Margins + Classes to help with the margins between items + + Umbraco's spacing styles]]> + + + \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.controller.js new file mode 100644 index 0000000..93a3787 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.controller.js @@ -0,0 +1,19 @@ +(function () { + 'use strict'; + + function layoutController($scope, exampleResource) { + var vm = this; + vm.loading = false; + + vm.toggleLoading = toggleLoading; + + function toggleLoading() { + vm.loading = !vm.loading; + } + + vm.linkAway = exampleResource.linkAway; + } + + angular.module('umbraco') + .controller('exampleLayoutController', layoutController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.html new file mode 100644 index 0000000..23ead28 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/layout.html @@ -0,0 +1,249 @@ +
+ +
+
+ +
+ +
+ +
+ + + + + + + + <umb-load-indicator></umb-load-indicator> + + + + + + + + + + + + +

Justify

+ + + + <div class="flex justify-center"></div> + +
+ +
+
justify-start
+
+
One
+
Two
+
Three
+
+
+
+
justify-end
+
+
One
+
Two
+
Three
+
+
+
+
justify-center
+
+
One
+
Two
+
Three
+
+
+
+
justify-between
+
+
One
+
Two
+
Three
+
+
+
+
justify-around
+
+
One
+
Two
+
Three
+
+
+
+ + +

Align items

+ + + + <div class="flex items-center"></div> + +
+ +
+
items-start
+
+
One
thing
+
+
Three
+
+
+
+
items-end
+
+
One
thing
+
+
Three
+
+
+
+
items-center
+
+
One
thing
+
+
Three
+
+
+
+
items-between
+
+
One
thing
+
+
Three
+
+
+
+
items-around
+
+
One
thing
+
+
Three
+
+
+
+ + +

Align Content

+ + + + <div class="flex content-center"></div> + +
+ +
+
content-start
+
+
One
thing
+
+
Third block
+
Four
thing
+
+
Final block
+
+
+
+
content-end
+
+
One
thing
+
+
Third block
+
Four
thing
+
+
Final block
+
+
+
+
content-center
+
+
One
thing
+
+
Third block
+
Four
thing
+
+
Final block
+
+
+
+
content-between
+
+
One
thing
+
+
Third block
+
Four
thing
+
+
Final block
+
+
+
+
content-around
+
+
One
thing
+
+
Third block
+
Four
thing
+
+
Final block
+
+
+
+ + + + + + + + +

Margin Top

+
+
+
.mt{{$index}}
+
+
+ + + +

Margin right

+
+
+
.mr{{$index}}
+
+
+ +

Margin Left

+
+
+
.ml{{$index}}
+
+
+ + + +
+
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/package.manifest new file mode 100644 index 0000000..f984c46 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/layout/package.manifest @@ -0,0 +1,3 @@ +{ + "javascript": [ "~/app_plugins/uiexamples/layout/layout.controller.js" ] +} diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/package.manifest new file mode 100644 index 0000000..baff78c --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/package.manifest @@ -0,0 +1,20 @@ +{ + "javascript": [ + "~/app_plugins/uiexamples/uiexamples.section.controller.js", + "~/app_plugins/uiexamples/uiexamples.resource.js" + ], + "css": [ "~/app_plugins/uiexamples/uiexamples.css" ], + "sections": [ + { + "alias": "uiExamples", + "name": "UI Examples", + } + ], + "dashboards": [ + { + "alias": "uiexample", + "sections": [ "uiExamples" ], + "view": "~/app_plugins/uiexamples/uiexamples.section.html" + } + ] +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/lang/en.xml new file mode 100644 index 0000000..a812f23 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/lang/en.xml @@ -0,0 +1,9 @@ + + + + Tabs + This shows how you can use tabs + API Documentation umbTabsNav + API Documentation umbTabContent + + diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/package.manifest new file mode 100644 index 0000000..f1c2c52 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/package.manifest @@ -0,0 +1,5 @@ +{ + "javascript": [ + "~/app_plugins/uiexamples/tabs/tabs.controller.js" + ] +} diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.controller.js new file mode 100644 index 0000000..5050df8 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.controller.js @@ -0,0 +1,42 @@ +(function () { + 'use strict'; + + function tabsController($scope, $timeout, eventsService, exampleResource) { + + var vm = this; + + vm.loading = true; + vm.tabs = []; + vm.changeTab = changeTab; + + vm.linkAway = exampleResource.linkAway; + + function changeTab(selectedTab) { + vm.tabs.forEach(function (tab) { + tab.active = false; + }); + selectedTab.active = true; + }; + + eventsService.on("app.tabChange", function (event, args) { + $timeout(function () { + if (args.alias === 'tabs') { + vm.tabs = [ + { + "alias": "tabOne", + "label": "HTML", + "active": true + }, + { + "alias": "tabTwo", + "label": "JavaScript" + } + ]; + vm.loading = false; + } + }); + }); + }; + + angular.module('umbraco').controller('tabsController', tabsController); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.html new file mode 100644 index 0000000..dc587e0 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/tabs/tabs.html @@ -0,0 +1,88 @@ +
+ + + + + + + + + +
+ + + + +
+ +<div ng-controller="tabsController as vm"> + <umb-box> + <umb-tabs-nav tabs="vm.tabs" on-tab-change="vm.changeTab(tab)"> + </umb-tabs-nav> + <umb-tab-content ng-repeat="tab in vm.tabs" ng-show="tab.active" tab="tab"> + <div ng-if="tab.alias === 'tabOne'"></div> + <div ng-if="tab.alias === 'tabTwo'"></div> + </umb-tab-content> + </umb-box> +</div> + +
+
+ +(function () { + 'use strict'; + + function tabsController($scope, eventsService) { + + var vm = this; + + vm.changeTab = changeTab; + + vm.tabs = [ + { + "alias": "tabOne", + "label": "Tab 1", + "active": true + }, + { + "alias": "tabTwo", + "label": "Tab 2" + } + ]; + + function changeTab(selectedTab) { + vm.tabs.forEach(function (tab) { + tab.active = false; + }); + selectedTab.active = true; + }; + + eventsService.on("app.tabChange", function (event, args) { + console.log("event", event); + console.log("args", args); + }); + }; + + angular.module('umbraco') + .controller('tabsController', tabsController); +})(); + + +
+ + +
+ + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.css b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.css new file mode 100644 index 0000000..cc44fd1 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.css @@ -0,0 +1,36 @@ +/* simple style addtion so we can outline the boxes in flexbox examples*/ +.uiexamples-outline { + border: 1px solid red; + margin: 1em 0; +} + + .uiexamples-outline > div { + margin: 0.5em 0; + padding: 1em; + border: 1px solid blue; + background-color: #eee; + } + +.uiexamples-outline-no-margin { + border: 1px solid red; + margin: 0 10px; + flex-grow: 2; +} + + .uiexamples-outline-no-margin > div { + border: 1px solid blue; + } + +.uiexamples-umbbox-outline { + border: 1px solid red; +} + + .uiexamples-umbbox-outline > .header { + border: 1px solid blue; + margin: 5px; + } + + .uiexamples-umbbox-outline > .content { + border: 1px solid green; + margin: 5px; + } diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.resource.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.resource.js new file mode 100644 index 0000000..384fcd3 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.resource.js @@ -0,0 +1,11 @@ +function exampleResource($q) { + + return { + linkAway: function(url) { + window.open(url); + } + }; + +} + +angular.module('umbraco.resources').factory('exampleResource', exampleResource); diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.controller.js new file mode 100644 index 0000000..dda2809 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.controller.js @@ -0,0 +1,69 @@ + +(function () { + 'use strict'; + + function exampleSection($scope) { + + var vm = this; + + vm.page = { + title: 'Examples', + description: 'UI Examples', + navigation: [ + { + 'name': 'Info', + 'alias': 'default', + 'icon': 'icon-sprout', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/info.html', + 'active': true + }, + { + 'name': 'Umbbox', + 'alias': 'umbbox', + 'icon': 'icon-box', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/umbbox/umbbox.html' + }, + { + 'name': 'Layout', + 'alias': 'layout', + 'icon': 'icon-layout', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/layout/layout.html' + }, + { + 'name': 'Dialogs', + 'alias': 'dialogs', + 'icon': 'icon-browser-window', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/dialogs/dialogs.html', + }, + { + 'name': 'Icons', + 'alias': 'icons', + 'icon': 'icon-picture', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/icons/icons.html', + }, + { + 'name': 'Buttons', + 'alias': 'buttons', + 'icon': 'icon-checkbox-empty', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/buttons/buttons.html', + }, + { + 'name': 'Tabs', + 'alias': 'tabs', + 'icon': 'icon-tab', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/tabs/tabs.html', + }, + { + 'name': 'Editor Panels', + 'alias': 'editorPanels', + 'icon': 'icon-screensharing', + 'view': Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + '/uiexamples/editorPanels/panels.html', + } + ] + } + + }; + + angular.module('umbraco') + .controller('exampleSectionController', exampleSection); +})(); diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.html new file mode 100644 index 0000000..6a58882 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/uiexamples.section.html @@ -0,0 +1,19 @@ +
+ + + + + + + + + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/lang/en.xml b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/lang/en.xml new file mode 100644 index 0000000..fe37103 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/lang/en.xml @@ -0,0 +1,22 @@ + + + + The umb-box element + + The umb-box element (outlined in red) is used as a wrapper for boxes in Umbraco. It contains a header (outlined in blue) and content element (outlined in green) that are described below in more detail. + ]]> + + The umb-box-header element + + The umb-box-header element is the top part of a box, above the horizontal line. It can contain a title and description or their language keys.

+

Adding a button

+

Anything inside the umb-box-header element will be right aligned, just like the "API Documentation" button at the top of this current box. See the example below:

+ ]]> + + The vm.linkAway method is a method in the angular controller, not a standard Umbraco thing. It calls window.open(url) on the passed in url. + The umb-box-content element + The umb-box-content element is anything within the box and under the header. It is a simple wrapper for whatever you wish to put inside, and comes with no special config options. + + diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/package.manifest b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/package.manifest new file mode 100644 index 0000000..e254c9e --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/package.manifest @@ -0,0 +1,3 @@ +{ + "javascript": [ "~/app_plugins/uiexamples/umbbox/umbbox.controller.js" ] +} diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.controller.js b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.controller.js new file mode 100644 index 0000000..ffa7f79 --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.controller.js @@ -0,0 +1,12 @@ + +(function () { + 'use strict'; + + function umbbox($scope, exampleResource) { + var vm = this; + vm.linkAway = exampleResource.linkAway; + }; + + angular.module('umbraco') + .controller('umbboxController', umbbox); +})(); \ No newline at end of file diff --git a/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.html b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.html new file mode 100644 index 0000000..6034f4b --- /dev/null +++ b/src/UIExamples.v9.Website/App_Plugins/uiexamples/umbbox/umbbox.html @@ -0,0 +1,83 @@ +
+ + + + + + + + + +<umb-box> + <umb-box-header title="this is a title"></umb-box-header> + <umb-box-content> + // Content here + </umb-box-content> +</umb-box> + + + + + + + + + + + + + + +<umb-box-header + [title="{string}"] + [title-key="{string}"] + [description="{string}"] + [description-key="{string}"]> +</umb-box-header> + + + + + +<umb-box-header title-key="umbbox_headerTitle"> + <umb-button action="vm.linkAway('https://our.umbraco.com/apidocs/v8/ui/#/api/umbraco.directives.directive:umbBoxHeader');" + label-key="example_apiDocumentation" + type="button" + button-style="info"> + </umb-button> +</umb-box-header> + + + + + + + + + + + + + + +<umb-box-content> +</umb-box-content> + + + + + + +
\ No newline at end of file diff --git a/src/UIExamples.v9.Website/Program.cs b/src/UIExamples.v9.Website/Program.cs new file mode 100644 index 0000000..e6e5bd7 --- /dev/null +++ b/src/UIExamples.v9.Website/Program.cs @@ -0,0 +1,20 @@ +using Microsoft.AspNetCore.Hosting; +using Microsoft.Extensions.Configuration; +using Microsoft.Extensions.Hosting; +using Microsoft.Extensions.Logging; + +namespace UIExamples.v9.Website +{ + public class Program + { + public static void Main(string[] args) + => CreateHostBuilder(args) + .Build() + .Run(); + + public static IHostBuilder CreateHostBuilder(string[] args) => + Host.CreateDefaultBuilder(args) + .ConfigureLogging(x => x.ClearProviders()) + .ConfigureWebHostDefaults(webBuilder => webBuilder.UseStartup()); + } +} diff --git a/src/UIExamples.v9.Website/Properties/launchSettings.json b/src/UIExamples.v9.Website/Properties/launchSettings.json new file mode 100644 index 0000000..3311b2d --- /dev/null +++ b/src/UIExamples.v9.Website/Properties/launchSettings.json @@ -0,0 +1,29 @@ +{ + "$schema": "https://json.schemastore.org/launchsettings.json", + "iisSettings": { + "windowsAuthentication": false, + "anonymousAuthentication": true, + "iisExpress": { + "applicationUrl": "http://localhost:49346", + "sslPort": 44374 + } + }, + "profiles": { + "IIS Express": { + "commandName": "IISExpress", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + } + }, + "Umbraco.Web.UI.NetCore": { + "commandName": "Project", + "dotnetRunMessages": true, + "launchBrowser": true, + "applicationUrl": "https://localhost:44374;http://localhost:49346", + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + } + } + } +} diff --git a/src/UIExamples.v9.Website/Startup.cs b/src/UIExamples.v9.Website/Startup.cs new file mode 100644 index 0000000..5cfd780 --- /dev/null +++ b/src/UIExamples.v9.Website/Startup.cs @@ -0,0 +1,78 @@ +using Microsoft.AspNetCore.Builder; +using Microsoft.AspNetCore.Hosting; +using Microsoft.Extensions.Configuration; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Extensions.Hosting; + +using System; + +using Umbraco.Cms.Core.DependencyInjection; +using Umbraco.Extensions; + +namespace UIExamples.v9.Website +{ + public class Startup + { + private readonly IWebHostEnvironment _env; + private readonly IConfiguration _config; + + /// + /// Initializes a new instance of the class. + /// + /// The Web Host Environment + /// The Configuration + /// + /// Only a few services are possible to be injected here https://github.com/dotnet/aspnetcore/issues/9337 + /// + public Startup(IWebHostEnvironment webHostEnvironment, IConfiguration config) + { + _env = webHostEnvironment ?? throw new ArgumentNullException(nameof(webHostEnvironment)); + _config = config ?? throw new ArgumentNullException(nameof(config)); + } + + + + /// + /// Configures the services + /// + /// + /// This method gets called by the runtime. Use this method to add services to the container. + /// For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940 + /// + public void ConfigureServices(IServiceCollection services) + { +#pragma warning disable IDE0022 // Use expression body for methods + services.AddUmbraco(_env, _config) + .AddBackOffice() + .AddWebsite() + .AddComposers() + .Build(); +#pragma warning restore IDE0022 // Use expression body for methods + + } + + /// + /// Configures the application + /// + public void Configure(IApplicationBuilder app, IWebHostEnvironment env) + { + if (env.IsDevelopment()) + { + app.UseDeveloperExceptionPage(); + } + + app.UseUmbraco() + .WithMiddleware(u => + { + u.WithBackOffice(); + u.WithWebsite(); + }) + .WithEndpoints(u => + { + u.UseInstallerEndpoints(); + u.UseBackOfficeEndpoints(); + u.UseWebsiteEndpoints(); + }); + } + } +} diff --git a/src/UIExamples.v9.Website/UIExamples.v9.Website.csproj b/src/UIExamples.v9.Website/UIExamples.v9.Website.csproj new file mode 100644 index 0000000..8bee98c --- /dev/null +++ b/src/UIExamples.v9.Website/UIExamples.v9.Website.csproj @@ -0,0 +1,50 @@ + + + net5.0 + + + + + + + + + + + + + + + + + + + + + + + + + + + + true + Always + + + true + Always + + + + + + + + + + + false + false + + diff --git a/src/UIExamples.v9.Website/Views/Partials/blocklist/default.cshtml b/src/UIExamples.v9.Website/Views/Partials/blocklist/default.cshtml new file mode 100644 index 0000000..fffd5e5 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/blocklist/default.cshtml @@ -0,0 +1,13 @@ +@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage +@{ + if (!Model.Any()) { return; } +} +
+ @foreach (var block in Model) + { + if (block?.ContentUdi == null) { continue; } + var data = block.Content; + + @await Html.PartialAsync("BlockList/Components/" + data.ContentType.Alias, block) + } +
diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3-fluid.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3-fluid.cshtml new file mode 100644 index 0000000..8400492 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3-fluid.cshtml @@ -0,0 +1,106 @@ +@using System.Web +@using Microsoft.AspNetCore.Html +@using Newtonsoft.Json.Linq +@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage + +@* + Razor helpers located at the bottom of this file +*@ + +@if (Model != null && Model.GetType() == typeof(JObject) && Model.sections != null) +{ + var oneColumn = ((System.Collections.ICollection)Model.sections).Count == 1; + +
+ @if (oneColumn) + { + foreach (var section in Model.sections) + { +
+ @foreach (var row in section.rows) + { + renderRow(row); + } +
+ } + } + else + { +
+ @foreach (var sec in Model.sections) + { +
+
+ @foreach (var row in sec.rows) + { + renderRow(row); + } +
+
+ } +
+ } +
+} + +@functions{ + + private async Task renderRow(dynamic row) + { +
+
+ @foreach (var area in row.areas) + { +
+
+ @foreach (var control in area.controls) + { + if (control != null && control.editor != null && control.editor.view != null) + { + @await Html.PartialAsync("grid/editors/base", (object)control) + } + } +
+
+ } +
+
+ } +} + +@functions{ + + public static HtmlString RenderElementAttributes(dynamic contentItem) + { + var attrs = new List(); + JObject cfg = contentItem.config; + + if (cfg != null) + { + foreach (JProperty property in cfg.Properties()) + { + var propertyValue = HttpUtility.HtmlAttributeEncode(property.Value.ToString()); + attrs.Add(property.Name + "=\"" + propertyValue + "\""); + } + } + + JObject style = contentItem.styles; + + if (style != null) { + var cssVals = new List(); + foreach (JProperty property in style.Properties()) + { + var propertyValue = property.Value.ToString(); + if (string.IsNullOrWhiteSpace(propertyValue) == false) + { + cssVals.Add(property.Name + ":" + propertyValue + ";"); + } + } + + if (cssVals.Any()) + attrs.Add("style='" + HttpUtility.HtmlAttributeEncode(string.Join(" ", cssVals)) + "'"); + } + + return new HtmlString(string.Join(" ", attrs)); + } +} diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3.cshtml new file mode 100644 index 0000000..ebe1cf7 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/bootstrap3.cshtml @@ -0,0 +1,112 @@ +@using System.Web +@using Microsoft.AspNetCore.Html +@using Newtonsoft.Json.Linq +@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage + +@if (Model != null && Model.GetType() == typeof(JObject) && Model.sections != null) +{ + var oneColumn = ((System.Collections.ICollection)Model.sections).Count == 1; + +
+ @if (oneColumn) + { + foreach (var section in Model.sections) + { +
+ @foreach (var row in section.rows) + { + renderRow(row, true); + } +
+ } + } + else + { +
+
+ @foreach (var sec in Model.sections) + { +
+
+ @foreach (var row in sec.rows) + { + renderRow(row, false); + } +
+
+ } +
+
+ } +
+} + +@functions{ + + private async Task renderRow(dynamic row, bool singleColumn) + { +
+ @if (singleColumn) { + @:
+ } +
+ @foreach (var area in row.areas) + { +
+
+ @foreach (var control in area.controls) + { + if (control != null && control.editor != null && control.editor.view != null) + { + @await Html.PartialAsync("grid/editors/base", (object)control) + } + } +
+
+ } +
+ @if (singleColumn) { + @:
+ } +
+ } + +} + +@functions{ + + public static HtmlString RenderElementAttributes(dynamic contentItem) + { + var attrs = new List(); + JObject cfg = contentItem.config; + + if (cfg != null) + { + foreach (JProperty property in cfg.Properties()) + { + var propertyValue = HttpUtility.HtmlAttributeEncode(property.Value.ToString()); + attrs.Add(property.Name + "=\"" + propertyValue + "\""); + } + } + + JObject style = contentItem.styles; + + if (style != null) + { + var cssVals = new List(); + foreach (JProperty property in style.Properties()) + { + var propertyValue = property.Value.ToString(); + if (string.IsNullOrWhiteSpace(propertyValue) == false) + { + cssVals.Add(property.Name + ":" + propertyValue + ";"); + } + } + + if (cssVals.Any()) + attrs.Add("style=\"" + HttpUtility.HtmlAttributeEncode(string.Join(" ", cssVals)) + "\""); + } + + return new HtmlString(string.Join(" ", attrs)); + } +} diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/base.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/base.cshtml new file mode 100644 index 0000000..eca6381 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/base.cshtml @@ -0,0 +1,27 @@ +@model dynamic + +@try +{ + string editor = EditorView(Model); + @await Html.PartialAsync(editor, (object)Model) +} +catch (Exception ex) +{ + 
@ex.ToString()
+} + +@functions{ + + public static string EditorView(dynamic contentItem) + { + string view = contentItem.editor.render != null ? contentItem.editor.render.ToString() : contentItem.editor.view.ToString(); + view = view.ToLower().Replace(".html", ".cshtml"); + + if (!view.Contains("/")) + { + view = "grid/editors/" + view; + } + + return view; + } +} diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/embed.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/embed.cshtml new file mode 100644 index 0000000..a383046 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/embed.cshtml @@ -0,0 +1,10 @@ +@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage + +@{ + string embedValue = Convert.ToString(Model.value); + embedValue = embedValue.DetectIsJson() ? Model.value.preview : Model.value; +} + +
+ @Html.Raw(embedValue) +
diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/macro.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/macro.cshtml new file mode 100644 index 0000000..0e9661e --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/macro.cshtml @@ -0,0 +1,15 @@ +@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage + +@if (Model.value != null) +{ + string macroAlias = Model.value.macroAlias.ToString(); + var parameters = new Dictionary(); + foreach (var mpd in Model.value.macroParamsDictionary) + { + parameters.Add(mpd.Name, mpd.Value); + } + + + @await Umbraco.RenderMacroAsync(macroAlias, parameters) + +} diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/media.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/media.cshtml new file mode 100644 index 0000000..4cc31d0 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/media.cshtml @@ -0,0 +1,63 @@ +@model dynamic +@using Umbraco.Cms.Core.Media +@using Umbraco.Cms.Core.PropertyEditors.ValueConverters +@inject IImageUrlGenerator ImageUrlGenerator +@if (Model.value != null) +{ + var url = Model.value.image; + + if (Model.editor.config != null && Model.editor.config.size != null) + { + if (Model.value.coordinates != null) + { + url = ImageCropperTemplateCoreExtensions.GetCropUrl( + (string)url, + ImageUrlGenerator, + width: (int)Model.editor.config.size.width, + height: (int)Model.editor.config.size.height, + cropAlias: "default", + cropDataSet: new ImageCropperValue + { + Crops = new[] + { + new ImageCropperValue.ImageCropperCrop + { + Alias = "default", + Coordinates = new ImageCropperValue.ImageCropperCropCoordinates + { + X1 = (decimal)Model.value.coordinates.x1, + Y1 = (decimal)Model.value.coordinates.y1, + X2 = (decimal)Model.value.coordinates.x2, + Y2 = (decimal)Model.value.coordinates.y2 + } + } + } + }); + } + else + { + url = ImageCropperTemplateCoreExtensions.GetCropUrl( + (string)url, + ImageUrlGenerator, + width: (int)Model.editor.config.size.width, + height: (int)Model.editor.config.size.height, + cropDataSet: new ImageCropperValue + { + FocalPoint = new ImageCropperValue.ImageCropperFocalPoint + { + Top = Model.value.focalPoint == null ? 0.5m : Model.value.focalPoint.top, + Left = Model.value.focalPoint == null ? 0.5m : Model.value.focalPoint.left + } + }); + } + } + + var altText = Model.value.altText ?? Model.value.caption ?? string.Empty; + + @altText + + if (Model.value.caption != null) + { +

@Model.value.caption

+ } +} diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/rte.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/rte.cshtml new file mode 100644 index 0000000..e14c6e1 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/rte.cshtml @@ -0,0 +1,13 @@ +@using Umbraco.Cms.Core.Templates +@model dynamic +@inject HtmlLocalLinkParser HtmlLocalLinkParser; +@inject HtmlUrlParser HtmlUrlParser; +@inject HtmlImageSourceParser HtmlImageSourceParser; + +@{ + var value = HtmlLocalLinkParser.EnsureInternalLinks(Model.value.ToString()); + value = HtmlUrlParser.EnsureUrls(value); + value = HtmlImageSourceParser.EnsureImageSources(value); +} + +@Html.Raw(value) diff --git a/src/UIExamples.v9.Website/Views/Partials/grid/editors/textstring.cshtml b/src/UIExamples.v9.Website/Views/Partials/grid/editors/textstring.cshtml new file mode 100644 index 0000000..77d92d6 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/Partials/grid/editors/textstring.cshtml @@ -0,0 +1,23 @@ +@using System.Web +@model dynamic + +@if (Model.editor.config.markup != null) +{ + string markup = Model.editor.config.markup.ToString(); + markup = markup.Replace("#value#", Html.ReplaceLineBreaks(HttpUtility.HtmlEncode((string)Model.value.ToString())).ToString()); + + if (Model.editor.config.style != null) + { + markup = markup.Replace("#style#", Model.editor.config.style.ToString()); + } + + + @Html.Raw(markup) + +} +else +{ + +
@Model.value
+ +} diff --git a/src/UIExamples.v9.Website/Views/_ViewImports.cshtml b/src/UIExamples.v9.Website/Views/_ViewImports.cshtml new file mode 100644 index 0000000..ef21ac0 --- /dev/null +++ b/src/UIExamples.v9.Website/Views/_ViewImports.cshtml @@ -0,0 +1,5 @@ +@using Umbraco.Extensions +@using UIExamples.v9.Website +@using Umbraco.Cms.Web.Common.PublishedModels +@using Umbraco.Cms.Web.Common.Views +@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers diff --git a/src/UIExamples.v9.Website/appsettings.Development.json b/src/UIExamples.v9.Website/appsettings.Development.json new file mode 100644 index 0000000..fee0ce2 --- /dev/null +++ b/src/UIExamples.v9.Website/appsettings.Development.json @@ -0,0 +1,41 @@ +{ + "$schema" : "./umbraco/config/appsettings-schema.json", + "Serilog": { + "MinimumLevel": { + "Default": "Information" + }, + "WriteTo": [ + { + "Name": "Async", + "Args": { + "configure": [ + { + "Name": "Console" + } + ] + } + } + ] + }, + "Umbraco": { + "CMS": { + "Content": { + "MacroErrors": "Throw" + }, + "Global": { + "Smtp": { + "From": "your@email.here", + "Host": "localhost", + "Port": 25 + } + }, + "Hosting": { + "Debug": true + }, + "RuntimeMinification": { + "useInMemoryCache": true, + "cacheBuster": "Timestamp" + } + } + } +} \ No newline at end of file diff --git a/src/UIExamples.v9.Website/appsettings.json b/src/UIExamples.v9.Website/appsettings.json new file mode 100644 index 0000000..c0186e7 --- /dev/null +++ b/src/UIExamples.v9.Website/appsettings.json @@ -0,0 +1,26 @@ +{ + "$schema": "./umbraco/config/appsettings-schema.json", + "Serilog": { + "MinimumLevel": { + "Default": "Information", + "Override": { + "Microsoft": "Warning", + "Microsoft.Hosting.Lifetime": "Information", + "System": "Warning" + } + } + }, + "ConnectionStrings": { + "umbracoDbDSN": "Data Source=|DataDirectory|\\Umbraco.sdf;Flush Interval=1;" + }, + "Umbraco": { + "CMS": { + "Hosting": { + "Debug": false + }, + "Global": { + "Id": "8b0d5978-e51f-4a14-93fa-d463e033f1e6" + } + } + } +} \ No newline at end of file diff --git a/src/UiExamples.sln b/src/UiExamples.sln index 425111b..591ede4 100644 --- a/src/UiExamples.sln +++ b/src/UiExamples.sln @@ -7,6 +7,8 @@ Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Our.Umbraco.UiExamples", "O EndProject Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "UIExamples.Website", "UIExamples.Website\UIExamples.Website.csproj", "{7C6C2FFA-25A4-4CC4-9AA1-49B2DFB68DFC}" EndProject +Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "UIExamples.v9.Website", "UIExamples.v9.Website\UIExamples.v9.Website.csproj", "{278F12BA-8B25-46AE-8BB0-A0B9AB50EEA4}" +EndProject Global GlobalSection(SolutionConfigurationPlatforms) = preSolution Debug|Any CPU = Debug|Any CPU @@ -21,6 +23,10 @@ Global {7C6C2FFA-25A4-4CC4-9AA1-49B2DFB68DFC}.Debug|Any CPU.Build.0 = Debug|Any CPU {7C6C2FFA-25A4-4CC4-9AA1-49B2DFB68DFC}.Release|Any CPU.ActiveCfg = Release|Any CPU {7C6C2FFA-25A4-4CC4-9AA1-49B2DFB68DFC}.Release|Any CPU.Build.0 = Release|Any CPU + {278F12BA-8B25-46AE-8BB0-A0B9AB50EEA4}.Debug|Any CPU.ActiveCfg = Debug|Any CPU + {278F12BA-8B25-46AE-8BB0-A0B9AB50EEA4}.Debug|Any CPU.Build.0 = Debug|Any CPU + {278F12BA-8B25-46AE-8BB0-A0B9AB50EEA4}.Release|Any CPU.ActiveCfg = Release|Any CPU + {278F12BA-8B25-46AE-8BB0-A0B9AB50EEA4}.Release|Any CPU.Build.0 = Release|Any CPU EndGlobalSection GlobalSection(SolutionProperties) = preSolution HideSolutionNode = FALSE diff --git a/src/gulpfile.js b/src/gulpfile.js index cb7b7d2..839f099 100644 --- a/src/gulpfile.js +++ b/src/gulpfile.js @@ -1,61 +1,44 @@ /// -// const { watch, src, dest } = require('gulp'); -var config = require('./paths.json'); -/* - * app_plugin and build script. - */ +const sources = [ + 'Our.Umbraco.UIExamples/App_Plugins' +]; -const appPluginPath = '/App_Plugins/' + config.pluginFolder; +const destinations = [ + 'UIExamples.Website/App_Plugins', + 'UIExamples.v9.WebSite/App_Plugins' +]; -const appPlugin = { - source : config.library + appPluginPath + '/**/*', - src : config.library + appPluginPath + '/', - dest : config.site + appPluginPath -} +function copy(path, base) { + + destinations.forEach(function (target) { + console.log(time(), path.substring(base.length + 1), '>', target.substring(0, target.indexOf('/'))); + src(path, { base: base }) + .pipe(dest(target)); + }); +} -/* - * Copys files from app_plugins folder in a library - * project into a test site. - * - * Your paths.config should look like: - * - * { - * "library": "myPackage.LibraryName", - * "pluginFolder": "MyPackageFolder", - * "site" : "../Sandbox.Site" - * } - * - * This will run in the background, so you don't need - * to rebuild your project when working on script files. - */ - -function copy(path, baseFolder, target) { - - console.log('copy: \x1b[36m%s\x1b[0m %s', path, target); - - return src(path, { base: baseFolder }) - .pipe(dest(target)); +function time() { + return '[' + new Date().toISOString().slice(11, -5) + ']'; } +exports.default = function () { -function watchAppPlugins() { + sources.forEach(function (source) { - console.log() - console.log('Watching : ' + appPlugin.source); - console.log('Target : ' + appPlugin.dest); + var searchPath = source + '/**/*'; - watch(appPlugin.source, { ignoreInitial: false }) - .on('change', function (path, stats) { - copy(path, appPlugin.src, appPlugin.dest) - }) - .on('add', function (path, stats) { - copy(path, appPlugin.src, appPlugin.dest) - }); -} + watch(searchPath, { ignoreInitial: false }) + .on('change', function (path, stats) { + copy(path, source); + }) + .on('add', function (path, stats) { + copy(path, source); + }); + }); +}; + + -exports.default = function () { - watchAppPlugins(); -}; \ No newline at end of file diff --git a/src/package-lock.json b/src/package-lock.json index c6e1eea..e7f1411 100644 --- a/src/package-lock.json +++ b/src/package-lock.json @@ -1,5 +1,5 @@ { - "name": "UIExamples", + "name": "uiexamples", "version": "1.0.0", "lockfileVersion": 1, "requires": true,