010_add_platform_class.js 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. #!/usr/bin/env node
  2. // Add Platform Class
  3. // v1.0
  4. // Automatically adds the platform class to the body tag
  5. // after the `prepare` command. By placing the platform CSS classes
  6. // directly in the HTML built for the platform, it speeds up
  7. // rendering the correct layout/style for the specific platform
  8. // instead of waiting for the JS to figure out the correct classes.
  9. var fs = require('fs');
  10. var path = require('path');
  11. var rootdir = process.argv[2];
  12. function addPlatformBodyTag(indexPath, platform) {
  13. // add the platform class to the body tag
  14. try {
  15. var platformClass = 'platform-' + platform;
  16. var cordovaClass = 'platform-cordova platform-webview';
  17. var html = fs.readFileSync(indexPath, 'utf8');
  18. var bodyTag = findBodyTag(html);
  19. if(!bodyTag) return; // no opening body tag, something's wrong
  20. if(bodyTag.indexOf(platformClass) > -1) return; // already added
  21. var newBodyTag = bodyTag;
  22. var classAttr = findClassAttr(bodyTag);
  23. if(classAttr) {
  24. // body tag has existing class attribute, add the classname
  25. var endingQuote = classAttr.substring(classAttr.length-1);
  26. var newClassAttr = classAttr.substring(0, classAttr.length-1);
  27. newClassAttr += ' ' + platformClass + ' ' + cordovaClass + endingQuote;
  28. newBodyTag = bodyTag.replace(classAttr, newClassAttr);
  29. } else {
  30. // add class attribute to the body tag
  31. newBodyTag = bodyTag.replace('>', ' class="' + platformClass + ' ' + cordovaClass + '">');
  32. }
  33. html = html.replace(bodyTag, newBodyTag);
  34. fs.writeFileSync(indexPath, html, 'utf8');
  35. process.stdout.write('add to body class: ' + platformClass + '\n');
  36. } catch(e) {
  37. process.stdout.write(e);
  38. }
  39. }
  40. function findBodyTag(html) {
  41. // get the body tag
  42. try{
  43. return html.match(/<body(?=[\s>])(.*?)>/gi)[0];
  44. }catch(e){}
  45. }
  46. function findClassAttr(bodyTag) {
  47. // get the body tag's class attribute
  48. try{
  49. return bodyTag.match(/ class=["|'](.*?)["|']/gi)[0];
  50. }catch(e){}
  51. }
  52. if (rootdir) {
  53. // go through each of the platform directories that have been prepared
  54. var platforms = (process.env.CORDOVA_PLATFORMS ? process.env.CORDOVA_PLATFORMS.split(',') : []);
  55. for(var x=0; x<platforms.length; x++) {
  56. // open up the index.html file at the www root
  57. try {
  58. var platform = platforms[x].trim().toLowerCase();
  59. var indexPath;
  60. if(platform == 'android') {
  61. indexPath = path.join('platforms', platform, 'assets', 'www', 'index.html');
  62. } else {
  63. indexPath = path.join('platforms', platform, 'www', 'index.html');
  64. }
  65. if(fs.existsSync(indexPath)) {
  66. addPlatformBodyTag(indexPath, platform);
  67. }
  68. } catch(e) {
  69. process.stdout.write(e);
  70. }
  71. }
  72. }