Scrapped QuickDocs data for css and html from MDN to css.json and htm…

…l.json (#13268)

* Scrapped summary and values of css properties from MDN to css.json

* Migrated mozilla's extension of MDNDocs to Brackets with some minor changes

* Removed redundant file

* Fixed faling tests, modified a test to test HTML docs

* Renamed all WebPlatformDocs strings to MDNDocs

* Addressed review comments

* Removed the usage of array for supported languages

src/extensions/default/WebPlatformDocs/InlineDocsViewer.html → src/extensions/default/MDNDocs/InlineDocsViewer.html

@@ -1,4 +1,4 @@
-<div class="css-prop-defn" tabIndex="0"> <!-- tabIndex needed: otherwise click focuses CodeMirror scroller and Esc won't work -->
+<div class="css-prop-defn {{#fullscreenSummary}}fullscreen-summary{{/fullscreenSummary}}" tabIndex="0"> <!-- tabIndex needed: otherwise click focuses CodeMirror scroller and Esc won't work -->
     <div class="css-prop-summary">
         <h1>{{propName}}</h1>
         <div>{{{summary}}}</div>

src/extensions/default/WebPlatformDocs/InlineDocsViewer.js → src/extensions/default/MDNDocs/InlineDocsViewer.js

@@ -22,7 +22,7 @@
  */
 
 /**
- * Inline widget to display WebPlatformDocs JSON data nicely formatted
+ * Inline widget to display MDNDocs JSON data nicely formatted
  */
 define(function (require, exports, module) {
     'use strict';
@@ -42,22 +42,23 @@ define(function (require, exports, module) {
     var SCROLL_LINE_HEIGHT = 40;
 
     // Load CSS
-    ExtensionUtils.loadStyleSheet(module, "WebPlatformDocs.less");
+    ExtensionUtils.loadStyleSheet(module, "MDNDocs.less");
 
 
     /**
      * @param {!string} cssPropName
      * @param {!{SUMMARY:string, URL:string, VALUES:?Array.<{value:string, description:string}>}} cssPropDetails
      */
-    function InlineDocsViewer(cssPropName, cssPropDetails) {
+    function InlineDocsViewer(PropName, PropDetails) {
         InlineWidget.call(this);
 
         var templateVars = {
-            propName    : cssPropName,
-            summary     : cssPropDetails.SUMMARY,
-            propValues  : cssPropDetails.VALUES || [],
-            url         : cssPropDetails.URL,
-            Strings     : Strings
+            propName            : PropName,
+            summary             : PropDetails.SUMMARY,
+            fullscreenSummary   : !(PropDetails.VALUES && PropDetails.VALUES.length),
+            propValues          : PropDetails.VALUES || [],
+            url                 : PropDetails.URL,
+            Strings             : Strings
         };
 
         var html = Mustache.render(inlineEditorTemplate, templateVars);

src/extensions/default/WebPlatformDocs/WebPlatformDocs.less → src/extensions/default/MDNDocs/MDNDocs.less

@@ -144,6 +144,16 @@
     }
 }
 
+.fullscreen-summary {
+    .css-prop-summary {
+        width: 95%;
+    }
+
+    .css-prop-values, .divider-holder {
+        display: none;
+    }
+}
+
 .content-bottom {
     // Used to pull bottom edge of .css-prop-defn down below its two floated children.
     // Also prevents .more-info (after us in DOM order) from overlapping the float: right content.

src/extensions/default/MDNDocs/README.md

@@ -0,0 +1,3 @@
+# Updating the Docs
+* Use the Node script [scrape-mdn](https://github.com/mozilla/brackets/tree/master/src/extensions/extra/MDNDocs/tools/scrape-mdn) to update the `css.json` and `html.json` contents:
+* Both the JSON files will have URL and Summary, but for css.json we need to have possible values of each css property along with small description, so use this Node script [MDNDocsScrapper](https://github.com/saurabh95/MDNDocsScrapper), this takes css.json as input and then creates a newcss.json with the desired content.