Merge pull request #3734 from guillaumejenkins/ionicHtmlIntellisense

Adding descriptions of Ionic HTML tags

src/vs/languages/html/common/htmlTags.ts

@@ -319,71 +319,71 @@ export const HTML_TAGS: ITagSet = {
 };
 
 export const IONIC_TAGS: ITagSet = {
-	'ion-checkbox': new HTMLTagSpecification('',
+	'ion-checkbox': new HTMLTagSpecification(nls.localize('tags.ion.checkbox', 'The checkbox is no different than the HTML checkbox input, except it\'s styled differently. The checkbox behaves like any AngularJS checkbox.'),
 		['name', 'ng-false-value', 'ng-model', 'ng-true-value']),
-	'ion-content': new HTMLTagSpecification('',
+	'ion-content': new HTMLTagSpecification(nls.localize('tags.ion.content', 'The ionContent directive provides an easy to use content area that can be configured to use Ionic\'s custom Scroll View, or the built-in overflow scrolling of the browser.'),
 		['delegate-handle', 'direction:scrolldir', 'has-bouncing:b', 'locking:b', 'on-scroll', 'on-scroll-complete', 'overflow-scroll:b', 'padding:b', 'scroll:b', 'scrollbar-x:b', 'scrollbar-y:b', 'start-x', 'start-y']),
-	'ion-delete-button': new HTMLTagSpecification('',
+	'ion-delete-button': new HTMLTagSpecification(nls.localize('tags.ion.deletebutton', 'Child of ionItem'),
 		[]),
-	'ion-footer-bar': new HTMLTagSpecification('',
+	'ion-footer-bar': new HTMLTagSpecification(nls.localize('tags.ion.footerbar', 'Adds a fixed footer bar below some content. Can also be a subfooter (higher up) if the "bar-subfooter" class is applied.'),
 		['align-title:align', 'keyboard-attach:v']),
-	'ion-header-bar': new HTMLTagSpecification('',
+	'ion-header-bar': new HTMLTagSpecification(nls.localize('tags.ion.headerbar', 'Adds a fixed header bar above some content. Can also be a subheader (lower down) if the "bar-subheader" class is applied.'),
 		['align-title:align', 'no-tap-scroll:b']),
-	'ion-infinite-scroll': new HTMLTagSpecification('',
+	'ion-infinite-scroll': new HTMLTagSpecification(nls.localize('tags.ion.infinitescroll', 'Child of ionContent or ionScroll. The ionInfiniteScroll directive allows you to call a function whenever the user gets to the bottom of the page or near the bottom of the page.'),
 		['distance', 'icon', 'immediate-check:b', 'on-infinite', 'spinner']),
-	'ion-input': new HTMLTagSpecification('',
+	'ion-input': new HTMLTagSpecification(nls.localize('tags.ion.input', 'ionInput is meant for text type inputs only. Ionic uses an actual <input type="text"> HTML element within the component, with Ionic wrapping to better handle the user experience and interactivity.'),
 		['type:inputtype', 'clearInput:v']),
-	'ion-item': new HTMLTagSpecification('',
+	'ion-item': new HTMLTagSpecification(nls.localize('tags.ion.item', 'Child of ionList.'),
 		[]),
-	'ion-list': new HTMLTagSpecification('',
+	'ion-list': new HTMLTagSpecification(nls.localize('tags.ion.list', 'The List is a widely used interface element in almost any mobile app, and can include content ranging from basic text all the way to buttons, toggles, icons, and thumbnails.'),
 		['can-swipe:b', 'delegate-handle', 'show-delete:b', 'show-reorder:b', 'type:listtype']),
-	'ion-modal-view': new HTMLTagSpecification('',
+	'ion-modal-view': new HTMLTagSpecification(nls.localize('tags.ion.modalview', 'The Modal is a content pane that can go over the user\'s main view temporarily. Usually used for making a choice or editing an item.'),
 		[]),
-	'ion-nav-back-button': new HTMLTagSpecification('',
+	'ion-nav-back-button': new HTMLTagSpecification(nls.localize('tags.ion.navbackbutton', 'Child of ionNavBar. Creates a back button inside an ionNavBar. The back button will appear when the user is able to go back in the current navigation stack.'),
 		[]),
-	'ion-nav-bar': new HTMLTagSpecification('',
+	'ion-nav-bar': new HTMLTagSpecification(nls.localize('tags.ion.navbar', 'If you have an ionNavView directive, you can also create an <ion-nav-bar>, which will create a topbar that updates as the application state changes.'),
 		['align-title:align', 'delegate-handle', 'no-tap-scroll:b']),
-	'ion-nav-buttons': new HTMLTagSpecification('',
+	'ion-nav-buttons': new HTMLTagSpecification(nls.localize('tags.ion.navbuttons', 'Child of ionNavView. Use ionNavButtons to set the buttons on your ionNavBar from within an ionView.'),
 		['side:navsides']),
-	'ion-nav-title': new HTMLTagSpecification('',
+	'ion-nav-title': new HTMLTagSpecification(nls.localize('tags.ion.navtitle', 'Child of ionNavView. The ionNavTitle directive replaces an ionNavBar title text with custom HTML from within an ionView template.'),
 		[]),
-	'ion-nav-view': new HTMLTagSpecification('',
+	'ion-nav-view': new HTMLTagSpecification(nls.localize('tags.ion.navview', 'The ionNavView directive is used to render templates in your application. Each template is part of a state. States are usually mapped to a url, and are defined programatically using angular-ui-router.'),
 		['name']),
-	'ion-option-button': new HTMLTagSpecification('',
+	'ion-option-button': new HTMLTagSpecification(nls.localize('tags.ion.optionbutton', 'Child of ionItem. Creates an option button inside a list item, that is visible when the item is swiped to the left by the user.'),
 		[]),
-	'ion-pane': new HTMLTagSpecification('',
+	'ion-pane': new HTMLTagSpecification(nls.localize('tags.ion.pane', 'A simple container that fits content, with no side effects. Adds the "pane" class to the element.'),
 		[]),
-	'ion-popover-view': new HTMLTagSpecification('',
+	'ion-popover-view': new HTMLTagSpecification(nls.localize('tags.ion.popoverview', 'The Popover is a view that floats above an app\'s content. Popovers provide an easy way to present or gather information from the user.'),
 		[]),
-	'ion-radio': new HTMLTagSpecification('',
+	'ion-radio': new HTMLTagSpecification(nls.localize('tags.ion.radio', 'The radio ionRirective is no different than the HTML radio input, except it\'s styled differently. The ionRadio behaves like AngularJS radio input.'),
 		['disabled:b', 'icon', 'name', 'ng-disabled:b', 'ng-model', 'ng-value', 'value']),
-	'ion-refresher': new HTMLTagSpecification('',
+	'ion-refresher': new HTMLTagSpecification(nls.localize('tags.ion.refresher', 'Child of ionContent or ionScroll. Allows you to add pull-to-refresh to a scrollView. Place it as the first child of your ionContent or ionScroll element.'),
 		['disable-pulling-rotation:b', 'on-pulling', 'on-refresh', 'pulling-icon', 'pulling-text', 'refreshing-icon', 'spinner']),
-	'ion-reorder-button': new HTMLTagSpecification('',
+	'ion-reorder-button': new HTMLTagSpecification(nls.localize('tags.ion.reorderbutton', 'Child of ionItem.'),
 		['on-reorder']),
-	'ion-scroll': new HTMLTagSpecification('',
+	'ion-scroll': new HTMLTagSpecification(nls.localize('tags.ion.scroll', 'Creates a scrollable container for all content inside.'),
 		['delegate-handle', 'direction:scrolldir', 'has-bouncing:b', 'locking:b', 'max-zoom', 'min-zoom', 'on-refresh', 'on-scroll', 'paging:b', 'scrollbar-x:b', 'scrollbar-y:b', 'zooming:b']),
-	'ion-side-menu': new HTMLTagSpecification('',
+	'ion-side-menu': new HTMLTagSpecification(nls.localize('tags.ion.sidemenu', 'Child of ionSideMenus. A container for a side menu, sibling to an ionSideMenuContent directive.'),
 		['is-enabled:b', 'expose-aside-when', 'side:navsides', 'width']),
-	'ion-side-menu-content': new HTMLTagSpecification('',
+	'ion-side-menu-content': new HTMLTagSpecification(nls.localize('tags.ion.sidemenucontent', 'Child of ionSideMenus. A container for the main visible content, sibling to one or more ionSideMenu directives.'),
 		['drag-content:b', 'edge-drag-threshold']),
-	'ion-side-menus': new HTMLTagSpecification('',
+	'ion-side-menus': new HTMLTagSpecification(nls.localize('tags.ion.sidemenus', 'A container element for side menu(s) and the main content. Allows the left and/or right side menu to be toggled by dragging the main content area side to side.'),
 		['delegate-handle', 'enable-menu-with-back-views:b']),
-	'ion-slide': new HTMLTagSpecification('',
+	'ion-slide': new HTMLTagSpecification(nls.localize('tags.ion.slide', 'Child of ionSlideBox. Displays a slide inside of a slidebox.'),
 		[]),
-	'ion-slide-box': new HTMLTagSpecification('',
+	'ion-slide-box': new HTMLTagSpecification(nls.localize('tags.ion.slidebox', 'The Slide Box is a multi-page container where each page can be swiped or dragged between.'),
 		['active-slide', 'auto-play:b', 'delegate-handle', 'does-continue:b', 'on-slide-changed', 'pager-click', 'show-pager:b', 'slide-interval']),
-	'ion-spinner': new HTMLTagSpecification('',
+	'ion-spinner': new HTMLTagSpecification(nls.localize('tags.ion.spinner', 'The ionSpinner directive provides a variety of animated spinners.'),
 		['icon']),
-	'ion-tab': new HTMLTagSpecification('',
+	'ion-tab': new HTMLTagSpecification(nls.localize('tags.ion.tab', 'Child of ionTabs. Contains a tab\'s content. The content only exists while the given tab is selected.'),
 		['badge', 'badge-style', 'disabled', 'hidden', 'href', 'icon', 'icon-off', 'icon-on', 'ng-click', 'on-deselect', 'on-select', 'title']),
-	'ion-tabs': new HTMLTagSpecification('',
+	'ion-tabs': new HTMLTagSpecification(nls.localize('tags.ion.tabs', 'Powers a multi-tabbed interface with a tab bar and a set of "pages" that can be tabbed through.'),
 		['delegate-handle']),
-	'ion-title': new HTMLTagSpecification('',
+	'ion-title': new HTMLTagSpecification(nls.localize('tags.ion.title', 'ion-title is a component that sets the title of the ionNavbar'),
 		[]),
-	'ion-toggle': new HTMLTagSpecification('',
+	'ion-toggle': new HTMLTagSpecification(nls.localize('tags.ion.toggle', 'A toggle is an animated switch which binds a given model to a boolean. Allows dragging of the switch\'s nub. The toggle behaves like any AngularJS checkbox otherwise.'),
 		['name', 'ng-false-value', 'ng-model', 'ng-true-value', 'toggle-class']),
-	'ion-view ': new HTMLTagSpecification('',
+	'ion-view ': new HTMLTagSpecification(nls.localize('tags.ion.view', 'Child of ionNavView. A container for view content and any navigational and header bar information.'),
 		['cache-view:b', 'can-swipe-back:b', 'hide-back-button:b', 'hide-nav-bar:b', 'view-title'])
 };