Icon Manager

[soumak77]

Create an angular service (IconManager) which will be responsible for configuring which icons to use in the application. Currently the framework supports a subset of icons from Iconic. The desire is to be able to use any icon library such as Ionicons or Material Icons (or others down the line). The framework should allow configuring which icon library to use via an IconManagerProvider. Ideally, the framework will lazy load the icon library files so that only libraries enabled are loaded.

The IconManagerProvider should provide the following functionality:

• A configuration object for iconic
  • Enabled by default
  • See current implementation for Iconic provider for other configuration options
• A configuration object for ionicons
  • Disabled by default
• A configuration object for materialicons
  • Disabled by default

The IconManager should provide the following functionality:

• Support icons from Iconic
  • See current implementation for Iconic service and zf-iconic directive
• Support icons from Ionicons
• Support icons from Material Icons
• Allow lazy loading library files
  • See https://github.com/urish/angular-load
  • Path to files can be part of config object. By default the paths can be configured to point to a CDN where the files are hosted. The developer can choose to override this with local paths if they want to host their own files.
  • Once lazy loading is supported, it should still allow the developer to not lazy load the files, in the event they want to include the icon library source in their application source for backwards compatibility.

Add following directives:

• ba-iconic
  • should be interchangeable with zf-iconic since zf-iconic will become ba-iconic after prefix rename (Remove reference to foundation in all files #31)
• ba-ionicons
  • options should be similar to ba-iconic for consistency
• ba-material-icons
  • options should be similar to ba-iconic for consistency

[soumak77]

@tolyo let me know if you have any feedback on the requirements and feel free to assign it to yourself if you want to start working on it. I probably won't get to it for some time.

[tolyo]

@soumak77 Thanks. I like the direction with lazy loading. I will look into it. Np.

[soumak77]

@tolyo This might be worth pulling out of the framework so that it can be used by any angular app. The current implementation for iconic only uses the framework to subscribe to resize events, so there is no real dependency on angular base apps.

[soumak77]

See existing implementations for angular icons:

• (Iconic) https://github.com/felixdulfer/angular-iconic
• (Material Icons) https://github.com/klarsys/angular-material-icons
• (Ionicon) https://github.com/cobolab/ionicon

Perhaps a new angular-icons library can be created which combines the functionality per the requirements above to allow a plugin type interface thus enabling other icon libraries to be added in the future.

[soumak77]

I've created a new angular-icons repository to store the logic for integrating the icons into angular (JS). The styling of the icons is still part of angular base apps (SCSS).