-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
e0eb75d
commit cab1c0a
Showing
4 changed files
with
113 additions
and
71 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,67 +1,3 @@ | ||
| <main class="App__main"> | ||
| <div class="App__projects-container" *ngIf="projectConfigs.length; else noGitConfigs"> | ||
| <label for="projects-dropdown"> Click on checkbox <span class="App__checkbox-control-container"><span class="App__checkbox-control"></span></span> to connect project to Razroo | ||
| </label> | ||
| <vscode-dropdown [style]="'height: ' + ((((projectConfigs.length + 1) * 18) >= 200) ? 200 : (projectConfigs.length * 30) + 8) + 'px'" | ||
| class="App__dropdown" id="projects-dropdown" multiple open> | ||
| <ng-container *ngFor="let projectOption of projectConfigs"> | ||
| <div> | ||
| <vscode-option [class]="(projectOption | isProjectSelected : selectedProjects) ? 'App__dropdown-selected App__vscode-option' : 'App__vscode-option'" (click)="toggleProjectOption(projectOption, projectConfigs)"> | ||
| <vscode-checkbox [checked]="(projectOption | isProjectSelected : selectedProjects)">{{projectOption?.packageJsonParams?.name | idToTitle}}</vscode-checkbox> | ||
| </vscode-option> | ||
| </div> | ||
| </ng-container> | ||
| </vscode-dropdown> | ||
|
|
||
| <vscode-button class="App__button" [disabled]="authIsLoading || (!(selectedProjects?.length) && !(originalSelectedProjects?.length))" (click)="connectProjects(selectedProjects)">{{authIsLoading ? 'Connecting...' : (selectedProjects | connectText : originalSelectedProjects)}}</vscode-button> | ||
| <ng-container *ngIf="orgId && userId"> | ||
| <label for="org_dropdown" class="App__org"> | ||
| <p *ngIf="orgId !== userId"><i>You are <a href="http://razroo.com" target="_blank">logged into {{organizations.length ? (orgId | zetaOrganizations : organizations)[0].displayName : ''}}</a></i></p> | ||
| <p *ngIf="orgId === userId"><i>You are <a href="http://razroo.com" target="_blank">logged into your personal workspace</a></i></p> | ||
| </label> | ||
| <vscode-dropdown formControlName="orgDropdown" (change)="changeOrgDropdownValue($event)" class="App__organizations-dropdown" id="org_dropdown"> | ||
| <ng-container *ngFor="let organization of (orgId | zetaOrganizations : organizations)"> | ||
| <vscode-option [value]="organization?.orgId">{{organization?.displayName | ||
| ? (organization?.displayName | titlecase) | ||
| : (organization.orgId === organization.userId ? 'Personal Workspace' : organization.orgId)}}</vscode-option> | ||
| </ng-container> | ||
| </vscode-dropdown> | ||
| </ng-container> | ||
| </div> | ||
|
|
||
| <ng-template #noGitConfigs> | ||
| <ng-container *ngIf="authIsLoading"> | ||
| <div>Razroo is loading...</div> | ||
| </ng-container> | ||
| <ng-container *ngIf="!authIsLoading"> | ||
| <div class="App__projects-container"> | ||
| <pre class="ascii-art ascii-art--error"> | ||
| _______ ________ ________ ________ ________ | ||
| |\ ___ \ |\ __ \|\ __ \|\ __ \|\ __ \ | ||
| \ \ __/|\ \ \|\ \ \ \|\ \ \ \|\ \ \ \|\ \ | ||
| \ \ \_|/_\ \ _ _\ \ _ _\ \ \\\ \ \ _ _\ | ||
| \ \ \_|\ \ \ \\ \\ \ \\ \\ \ \\\ \ \ \\ \ | ||
| \ \_______\ \__\\ _\\ \__\\ _\\ \_______\ \__\\ __\ | ||
| \|_______|\|__|\|__|\|__|\|__|\|_______|\|__|\|__| | ||
| </pre> | ||
| Will need atleast one project that uses Git in your VSCode Workspace to use Razroo Projects. | ||
| </div> | ||
| <hr class="starters-hr"> | ||
| <div class="App__new-project"> | ||
| <div>Use Razroo to create a new project</div> | ||
| <vscode-dropdown (change)="changeStarterDropdownValue($event)" class="App__organizations-dropdown" class="starters_dropdown"> | ||
| <ng-container *ngFor="let starter of razrooStarters"> | ||
| <vscode-option [value]="starter.pathId">{{starter?.corePathId | titlecase}}</vscode-option> | ||
| </ng-container> | ||
| </vscode-dropdown> | ||
| <vscode-text-field class="starter-project-input" (keyup)="changeProjectName($event)" type="text" placeholder="Project Name"></vscode-text-field> | ||
| <vscode-button class="App__button" [disabled]="createProjectCalled" (click)="createProject()">{{createProjectCalled ? 'Creating...' : 'Create'}}</vscode-button> | ||
| </div> | ||
| </ng-container> | ||
| </ng-template> | ||
|
|
||
| <div class="App__user-login-container"> | ||
| <i class="App__logout-text">Log out to sign in as a different user</i> | ||
| <vscode-button appearance="secondary" class="App__user-logout-button" (click)="logout()">Logout</vscode-button> | ||
| </div> | ||
| Test web view | ||
| </main> |
2 changes: 1 addition & 1 deletion
2
generate-code-ui/src/app/pipes/is-project-selected/is-project-selected.pipe.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,106 @@ | ||
| import { getUri } from '../utils/webview-utils/getUri'; | ||
| import * as vscode from 'vscode'; | ||
| import { getNonce } from '../utils/webview-utils/getNonce'; | ||
| import { COMMAND_CONNECT_PROJECTS_TRY_TO_AUTH, COMMAND_TRY_TO_AUTH, COMMAND_LOG_OUT_USER, COMMAND_CREATE_PROJECT } from '../constants'; | ||
|
|
||
| export class ProjectsWebview implements vscode.WebviewViewProvider { | ||
|
|
||
| public static readonly viewType = 'razroo.generate'; | ||
| private _disposables: vscode.Disposable[] = []; | ||
|
|
||
| view?: vscode.WebviewView; | ||
| _extensionUri = this.extensionContext.extensionUri; | ||
|
|
||
| constructor( | ||
| private extensionContext: vscode.ExtensionContext | ||
| ) { } | ||
|
|
||
| public resolveWebviewView( | ||
| webviewView: vscode.WebviewView, | ||
| context: vscode.WebviewViewResolveContext, | ||
| _token: vscode.CancellationToken | ||
| ): void { | ||
| this.view = webviewView; | ||
|
|
||
| webviewView.webview.options = { | ||
| // Allow scripts in the webview | ||
| enableScripts: true, | ||
|
|
||
| localResourceRoots: [ | ||
| this._extensionUri | ||
| ] | ||
| }; | ||
|
|
||
| webviewView.webview.html = this._getWebviewContent(webviewView.webview, this._extensionUri); | ||
|
|
||
| this._setWebviewMessageListener(webviewView.webview, context); | ||
| } | ||
|
|
||
| private _getWebviewContent(webview: vscode.Webview, extensionUri: vscode.Uri) { | ||
| // The CSS file from the Angular build output | ||
| const stylesUri = getUri(webview, extensionUri, ["dist", "generate-code-webview-ui", "styles.css"]); | ||
| // The JS files from the Angular build output | ||
| const runtimeUri = getUri(webview, extensionUri, ["dist", "generate-code-webview-ui", "runtime.js"]); | ||
| const polyfillsUri = getUri(webview, extensionUri, ["dist", "generate-code-webview-ui", "polyfills.js"]); | ||
| const scriptUri = getUri(webview, extensionUri, ["dist", "generate-code-webview-ui", "main.js"]); | ||
|
|
||
| const nonce = getNonce(); | ||
|
|
||
| // Tip: Install the es6-string-html VS Code extension to enable code highlighting below | ||
| return /*html*/ ` | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <link rel="stylesheet" type="text/css" href="${stylesUri}"> | ||
| <title>Razroo Projects</title> | ||
| </head> | ||
| <body> | ||
| <app-root></app-root> | ||
| <script type="module" nonce="${nonce}" src="${runtimeUri}"></script> | ||
| <script type="module" nonce="${nonce}" src="${polyfillsUri}"></script> | ||
| <script type="module" nonce="${nonce}" src="${scriptUri}"></script> | ||
| </body> | ||
| </html> | ||
| `; | ||
| } | ||
|
|
||
| /** | ||
| * Sets up an event listener to listen for messages passed from the webview context and | ||
| * executes code based on the message that is recieved. | ||
| * | ||
| * @param webview A reference to the extension webview | ||
| * @param context A reference to the extension context | ||
| */ | ||
| private _setWebviewMessageListener(webview: vscode.Webview, context: vscode.WebviewViewResolveContext) { | ||
| // Handle messages sent from the extension | ||
| webview.onDidReceiveMessage( | ||
| (message: any) => { | ||
| const {command, selectedProjects, path, projectName, disconnectedProjects, text, data, orgId} = message; | ||
|
|
||
| switch (command) { | ||
| case "connectProjects": | ||
| vscode.commands.executeCommand(COMMAND_CONNECT_PROJECTS_TRY_TO_AUTH, {selectedProjects, disconnectedProjects, orgId}); | ||
| return; | ||
| case "initialAuthInfoRequest": | ||
| vscode.commands.executeCommand(COMMAND_TRY_TO_AUTH); | ||
| return; | ||
| case "unConnectProject": | ||
| vscode.commands.executeCommand('extension.logout'); | ||
| return; | ||
| case "logoutUser": | ||
| vscode.commands.executeCommand(COMMAND_LOG_OUT_USER); | ||
| return; | ||
| case "createProject": | ||
| vscode.commands.executeCommand(COMMAND_CREATE_PROJECT, {path, projectName}); | ||
| return; | ||
| // Add more switch case statements here as more webview message commands | ||
| // are created within the webview context (i.e. inside media/main.js) | ||
| } | ||
| }, | ||
| undefined, | ||
| this._disposables | ||
| ); | ||
| } | ||
| } |