updating master to include all README, pipeline and semantic-release …

…updates

.eslintignore

@@ -0,0 +1,5 @@
+# path/to/project/root/.eslintignore
+# /node_modules/* and /bower_components/* in the project root are ignored by default
+
+# Ignore 
+src/js/vendor/*

.gitignore

@@ -1 +1,3 @@
 /node_modules
+/build
+**/.DS_Store

.releaserc

@@ -0,0 +1,13 @@
+{
+  "branches": [
+    {name: 'beta', release: true},
+    {name: 'main', prerelease: 'beta'},
+    {name: 'development', prerelease: 'dev-beta'}
+  ],
+  "plugins": [
+    "@semantic-release/commit-analyzer",
+    "@semantic-release/release-notes-generator",
+    "@semantic-release/changelog",
+    "@semantic-release/git"
+  ]
+}

README.md

@@ -1,3 +1,4 @@
+
 # UCLA FRACTAL Components Library
 
 ## This readme is for Developers and the Governance team.
@@ -13,21 +14,68 @@ Clone repository and run `npm install`
 
 Run and watch locally
 ```
-gulp fractalStart
+gulp watch
 ```
 Site will be viewable at http://localhost:3000
 
 
-Generate Assets
+Generate Assets with compiles css and javascript.
 ```
 gulp build
 ```
 
-Generate Assets with Compiled CSS.
+
+Generate Assets with Compiled CSS, javascript, and images.
 ```
 gulp production
 ```
 
+## Branch / Bucket Information (BETA)
+
+The "main" branch is deployed at the S3 bucket [here](https://s3.console.aws.amazon.com/s3/buckets/webcomponents.ucla.edu/?region=us-west-1), while "development" branch is deployed at the S3 bucket [here](https://s3.console.aws.amazon.com/s3/buckets/dev-webcomponents.ucla.edu/?region=us-west-1)
+
+DURING BETA:
+
+1. "main" - This is the "production" branch. Approved releases from the "development" branch should be merged into this branch. Changes in this branch triggers the pipeline to deploy to the "webcomponents.ucla.edu" S3 bucket.
+
+1. "development" - This is the "development" branch. Approved releases from the "campus" branch should be merged into this branch. This will trigger the deployment pipeline to the "dev-webcomponents.ucla.edu" S3 bucket.
+
+1. "campus" - Campus partners/developers should create their update branches and send PRs for their updates to merge into this branch. Once approved, reviewers should merge this branch into "development" branch.
+
+## Contributing Flow (BETA)
+
+1. Developer creates a branch based off of the "campus" branch
+1. Following the "Contributing Flow", the campus partner/developer makes changes, commits and push changes to the "campus" branch. (Please use the "Commit Message Automation Flow" below)
+1. PR is reviewed, tags are checked, and branch is merged into "campus" branch
+1. On development release day (schedule TBA), reviewers will release the updates from "campus" branch by merging the branch to "development"
+1. On production release day (schedule TBA), reviewers will release the updates from "development" branch by merging the branch to "main".
+
+## Semantic Versioning Automation (BETA)
+
+Semantic Versioning is automated with the [semantic-release](https://github.com/semantic-release/semantic-release) library. This library will check the project's commit messages during the pipeline build to upgrade version numbers accordingly.
+
+## Commit Message Automation Flow (BETA)
+
+Semantic Versioning Automation requires commit messages to follow "Angular" commit messages. Be sure to run `npm install` to install the semantic-release plugin that will help auto generate this. Then follow the following commiting flow:
+
+1. `git add <filenames or all>`
+1. `npm run commit`  <!-- Answer questions to generate Angular commit message -->
+1. `git push`
+
+## Commit Message Automation Questions (BETA)
+
+When running `npm run commit`, a prompt with the below questions will appear in the command line to create a commit message in "Angular" style.
+
+1. Select the type of change that you're committing - Choose the option that best describes your changes
+2. What is the scope of this change - Include the filename(s), component name(s), or documentation name(s) being changed
+3. Write a short, imperative tense description of the change - Include a short brief of changes being made
+4. Provide a longer description of the change - (if any) Include more details of changes made
+5. Are there any breaking changes? - Yes, if this update will break usage of the library previous to this update
+6. (If "Yes" from #5) A BREAKING CHANGE commit requires a body. Please enter a longer description of the commit itself - Include details on what will break from this commit
+7. If "Yes" from #5) Describe the breaking changes - (If any) Include more details on what will break from this commit
+8. Does this change affect any open issues? - Yes, if this change was assigned through a JIRA ticket (StratComm Team) or change is to fix an issue from our issue board
+9. (If "Yes" from #8) Add issue references - Include JIRA ticket number or link to issue board
+
 ## Component Status Types
 
 - Ready - Component is ready for production sites
@@ -45,3 +93,9 @@ After the ssh has been created run the following command:
 ```
 npm install ssh://bitbucket.org/uclaucomm/ucla-bruin-components.git --save
 ```
+
+## Add to documentation
+
+This library is documented in the docs folder of this repository. The markdown pages follow github markdown rules.
+
+[More on Github Markdown]https://guides.github.com/features/mastering-markdown/

bitbucket-pipelines.yml

@@ -1,47 +1,174 @@
-# This is a build configuration for PHP.
-# Check our guides at https://confluence.atlassian.com/x/e8YWN for more examples.
-# Only use spaces to indent your .yml configuration
-# -----
+## Author: Kevin Ma
 
-# Specify a docker image from Docker Hub as your build environment
-# All of your pipelines scripts will be executed within this docker image.
-# image: php:7.2-cli
+## Pipeline:
+#1) Runs semantic library to get semantic version
+#2) Update version # in documentation (download URL) and package.json
+#3) Deploys version's build folder in S3 (/build/x.x.x/)
+#4) Deploys public folder in S3 (/public/x.x.x/)
+#5) Deploys docs styles folder in S3 (/build/x.x.x/docs/)
+#6) Deploys icon assets to root of S3
+#7) Make and deploy index.html used to redirect users to the most updated docs
+
+## TODO
+#1) Only deploy updated files
+#2) Invalidate CDN urls on pipeline success (manually update @ https://console.aws.amazon.com/cloudfront/home?#distribution-settings:EUU3JRBWPI1HQ)
+#3) Only invalidate updated files
+
+
+image: node:latest
 
 pipelines:
   branches:
-    '{master}':
+    main:
       - step:
-          name: Fractal Build
-          image: atlassian/default-image:2
+          name: Web Components Production
           caches:
             - node
           script:
-            - npm install
+            # Get an oauth access token using the client credentials, parsing out the token with jq (json processor).
+            - apt-get update && apt-get install -y curl jq moreutils
+            - export BB_TOKEN=$(echo "x-token-auth:")$(curl -s -X POST -u "${CLIENT_ID}:${CLIENT_SECRET}" https://bitbucket.org/site/oauth2/access_token -d grant_type=client_credentials -d scopes="repository" | jq --raw-output '.access_token')
             - npm install -g gulp
-            - gulp
+            - npm install @semantic-release/changelog @semantic-release/commit-analyzer @semantic-release/git @semantic-release/release-notes-generator
+            - npx semantic-release
+            # set current tag number -- this will be used to deploy to the correct S3 public folder
+            - export updateTag=$(git describe --tags --abbrev=0)
+            - export updateTag="${updateTag#?}"
+            # update version # in package.json
+            - jq --arg updateTag $updateTag '.version = $updateTag' package.json|sponge package.json
+            # update version # in asset URL documentation page
+            - find src \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i "s/%!CurrentVersion%!/"$updateTag"/g"
             - gulp production
-            - apt-get update
-            - apt-get install -y zip
-            - zip -r application.zip .
-            - pipe: atlassian/aws-code-deploy:0.2.9
-              variables:
-                AWS_ACCESS_KEY_ID: 'AKIAX3FU5UAQSFPXDSBO'
-                AWS_SECRET_ACCESS_KEY: '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'
-                AWS_DEFAULT_REGION: 'us-west-2'
-                APPLICATION_NAME: deployment-components
-                S3_BUCKET: deployment-ucla-components
-                COMMAND: 'upload'
-                ZIP_FILE: 'application.zip'
-                DEPLOYMENT_GROUP: componentsDeploy
-            - pipe: atlassian/aws-code-deploy:0.2.9
-              variables:
-                AWS_ACCESS_KEY_ID: 'AKIAX3FU5UAQSFPXDSBO'
-                AWS_SECRET_ACCESS_KEY: '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'
-                AWS_DEFAULT_REGION: 'us-west-2'
-                APPLICATION_NAME: deployment-components
-                DEPLOYMENT_GROUP: componentsDeploy
-                S3_BUCKET: deployment-ucla-components
-                COMMAND: 'deploy'
-                WAIT: 'true'
-                IGNORE_APPLICATION_STOP_FAILURES: 'true'
-                FILE_EXISTS_BEHAVIOR: 'OVERWRITE'
+            # add updated package.json and compiled public assets
+            - git add package.json package-lock.json public/*
+            - set +e git commit -m "[skip ci] Current tag upgraded to ${updateTag}"
+            - git push
+            - set -e
+            # deploy build to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_PROD
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_PROD
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_PROD
+                S3_BUCKET: webcomponents.ucla.edu/build/${updateTag}
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/build
+                ACL: 'public-read'
+                EXTRA_ARGS: "--delete"
+            # deploy public to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_PROD
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_PROD
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_PROD
+                S3_BUCKET: webcomponents.ucla.edu/public/${updateTag}
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/public
+                ACL: 'public-read'
+                EXTRA_ARGS: "--exclude=/public/docs/"
+                EXTRA_ARGS: "--delete"
+            # deploy public/docs to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_PROD
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_PROD
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_PROD
+                S3_BUCKET: webcomponents.ucla.edu/build/${updateTag}/docs
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/build/docs
+                ACL: 'private'
+                EXTRA_ARGS: "--delete"
+            # deploy icon images to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_PROD
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_PROD
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_PROD
+                S3_BUCKET: webcomponents.ucla.edu/img
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/src/components/img/icons
+                EXTRA_ARGS: "--delete"
+            - mkdir redirection
+            - touch ./redirection/index.html
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_PROD
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_PROD
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_PROD
+                S3_BUCKET: webcomponents.ucla.edu
+                LOCAL_PATH: ./redirection
+                EXTRA_ARGS: "--website-redirect=https://webcomponents.ucla.edu/build/${updateTag}/index.html"
+            - rm -rf ./redirection
+            - echo "Updates from the branch ==> $BITBUCKET_BRANCH <== has been included in S3 with the tag ==> $updateTag <=="
+    development:
+      - step:
+          name: Web Components Development
+          caches:
+            - node
+          script:
+            # Get an oauth access token using the client credentials, parsing out the token with jq (json processor).
+            - apt-get update && apt-get install -y curl jq moreutils
+            - export BB_TOKEN=$(echo "x-token-auth:")$(curl -s -X POST -u "${CLIENT_ID}:${CLIENT_SECRET}" https://bitbucket.org/site/oauth2/access_token -d grant_type=client_credentials -d scopes="repository" | jq --raw-output '.access_token')
+            - npm install -g gulp
+            - npm install @semantic-release/changelog @semantic-release/commit-analyzer @semantic-release/git @semantic-release/release-notes-generator
+            - npx semantic-release
+            # set current tag number -- this will be used to deploy to the correct S3 public folder
+            - export updateTag=$(git describe --tags --abbrev=0)
+            - export updateTag="${updateTag#?}"
+            # update version # in asset URL documentation page
+            - find src \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i "s/build\/%!CurrentVersion%!/dev-webcomponents.ucla.edu\/build\/"$updateTag"/g"
+            - find src \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i "s/%!CurrentVersion%!/"$updateTag"/g"
+            - gulp production
+            # add updated package.json and compiled public assets
+            - git add public/*
+            - set +e git commit -m "[skip ci] Current tag upgraded to ${updateTag}"
+            - git push
+            - set -e
+            # deploy build to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_DEV
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_DEV
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_DEV
+                S3_BUCKET: dev-webcomponents.ucla.edu/build/${updateTag}
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/build
+                ACL: 'public-read'
+                EXTRA_ARGS: "--delete"
+            # deploy public to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_DEV
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_DEV
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_DEV
+                S3_BUCKET: dev-webcomponents.ucla.edu/public/${updateTag}
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/public
+                ACL: 'public-read'
+                EXTRA_ARGS: "--exclude=/public/docs/"
+                EXTRA_ARGS: "--delete"
+            # deploy public/docs to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_DEV
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_DEV
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_DEV
+                S3_BUCKET: dev-webcomponents.ucla.edu/build/${updateTag}/docs
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/build/docs
+                ACL: 'private'
+                EXTRA_ARGS: "--delete"
+            # deploy icon images to S3
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_DEV
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_DEV
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_DEV
+                S3_BUCKET: dev-webcomponents.ucla.edu/img
+                LOCAL_PATH: ${BITBUCKET_CLONE_DIR}/src/components/img/icons
+                EXTRA_ARGS: "--delete"
+            - mkdir redirection
+            - touch ./redirection/index.html
+            - pipe: atlassian/aws-s3-deploy:0.4.3
+              variables:
+                AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID_DEV
+                AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY_DEV
+                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION_DEV
+                S3_BUCKET: dev-webcomponents.ucla.edu
+                LOCAL_PATH: ./redirection
+                EXTRA_ARGS: "--website-redirect=https://s3-us-west-1.amazonaws.com/dev-webcomponents.ucla.edu/build/${updateTag}/index.html"
+            - rm -rf ./redirection
+            - echo "Updates from the branch ==> $BITBUCKET_BRANCH <== has been included in S3 with the tag ==> $updateTag <=="