Optimizing a bit of stuff
This commit is contained in:
		@ -64,6 +64,9 @@ export class Footer extends Component<{}, { synced: boolean, syncing: boolean }>
 | 
			
		||||
            <span>
 | 
			
		||||
                Welcome <b>{Notes.name}</b>
 | 
			
		||||
            </span>
 | 
			
		||||
            <span style="color: lightgrey;">
 | 
			
		||||
                v1.0
 | 
			
		||||
            </span>
 | 
			
		||||
        </footer>
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -42,7 +42,7 @@ export class Router extends Component<{}, { next?: JSX.Element, current: JSX.Ele
 | 
			
		||||
            {this.state.next}
 | 
			
		||||
         </div>
 | 
			
		||||
      }
 | 
			
		||||
      return <div style="position: relative; overflow-x: hidden; width: 100vw; height: 100vh;">
 | 
			
		||||
      return <div style="position: relative; overflow-x: hidden; width: 100vw; height: calc(100vh - 2rem);">
 | 
			
		||||
         <div class="transition_container uk-background-default" key={this.state.current.key} ref={elm => this.mounted = elm}>
 | 
			
		||||
            {this.state.current}
 | 
			
		||||
         </div>
 | 
			
		||||
 | 
			
		||||
@ -1,14 +1,12 @@
 | 
			
		||||
import { h, Component } from "preact"
 | 
			
		||||
import Notes, { IVault, ViewNote } from "../../../notes";
 | 
			
		||||
import { IVault, ViewNote } from "../../../notes";
 | 
			
		||||
import Trash from "feather-icons/dist/icons/trash-2.svg"
 | 
			
		||||
import X from "feather-icons/dist/icons/x.svg"
 | 
			
		||||
import Save from "feather-icons/dist/icons/save.svg"
 | 
			
		||||
 | 
			
		||||
import Navigation from "../../../navigation";
 | 
			
		||||
import { YesNoModal } from "../../modals/YesNoModal";
 | 
			
		||||
import LoadingModal from "../../modals/LoadingModal";
 | 
			
		||||
import Notifications, { MessageType } from "../../../notifications";
 | 
			
		||||
import Modal from "../../modals/Modal";
 | 
			
		||||
 | 
			
		||||
const minRows = 3;
 | 
			
		||||
export default class EntryComponent extends Component<{ vault: Promise<IVault>, id: string | undefined, note: string | undefined }, { title: string, changed: boolean }> {
 | 
			
		||||
@ -21,15 +19,23 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
 | 
			
		||||
   private skip_save: boolean = false;
 | 
			
		||||
 | 
			
		||||
   private inputElm: HTMLInputElement;
 | 
			
		||||
 | 
			
		||||
   constructor(props) {
 | 
			
		||||
      super(props);
 | 
			
		||||
      this.state = { changed: false, title: "" };
 | 
			
		||||
      this.textAreaChange = this.textAreaChange.bind(this);
 | 
			
		||||
      this.textAreaKeyPress = this.textAreaKeyPress.bind(this);
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   private toVault() {
 | 
			
		||||
      history.back();
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   componentDidMount() {
 | 
			
		||||
      this.inputElm.focus();
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   async componentWillMount() {
 | 
			
		||||
      this.text = "";
 | 
			
		||||
      this.vault = undefined;
 | 
			
		||||
@ -39,8 +45,6 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
      this.setState({ changed: false, title: "" });
 | 
			
		||||
      try {
 | 
			
		||||
         this.skip_save = false;
 | 
			
		||||
         // this.loading = new LoadingModal();
 | 
			
		||||
         // this.loading.show();
 | 
			
		||||
 | 
			
		||||
         this.vault = await this.props.vault;
 | 
			
		||||
         let note: ViewNote;
 | 
			
		||||
@ -57,7 +61,6 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
 | 
			
		||||
         if (!note) {
 | 
			
		||||
            Notifications.sendNotification("Note not found!", MessageType.ERROR);
 | 
			
		||||
            // this.toVault()
 | 
			
		||||
         } else {
 | 
			
		||||
            this.note = note;
 | 
			
		||||
            this.text = note.__value;
 | 
			
		||||
@ -65,14 +68,8 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
            if (rows !== this.rows) {
 | 
			
		||||
               this.rows = rows;
 | 
			
		||||
            }
 | 
			
		||||
            // async onKeypress(event) {
 | 
			
		||||
            //    event = event || window.event;
 | 
			
		||||
            //    
 | 
			
		||||
            // }
 | 
			
		||||
            let [title] = this.text.split("\n", 1);
 | 
			
		||||
            this.setState({ title, changed })
 | 
			
		||||
            // if (this.loading)
 | 
			
		||||
            // this.loading.close();
 | 
			
		||||
         }
 | 
			
		||||
      } catch (err) {
 | 
			
		||||
         Notifications.sendError(err);
 | 
			
		||||
@ -108,11 +105,12 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
 | 
			
		||||
   textAreaChange(evt: KeyboardEvent) {
 | 
			
		||||
      if (evt.keyCode === 17 || evt.keyCode === 27) return; //No character, so not relevant for this function
 | 
			
		||||
      if (!this.state.changed && this.textAreaKeyPress(evt)) this.setState({ changed: true })
 | 
			
		||||
 | 
			
		||||
      let target = (evt.target as HTMLTextAreaElement)
 | 
			
		||||
      let value = target.value;
 | 
			
		||||
 | 
			
		||||
      this.text = value;
 | 
			
		||||
      if (!this.state.changed && this.textAreaKeyPress(evt)) this.setState({ changed: true })
 | 
			
		||||
 | 
			
		||||
      let [title] = value.split("\n", 1);
 | 
			
		||||
      if (title !== this.state.title)
 | 
			
		||||
@ -138,6 +136,7 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   textAreaKeyPress(evt: KeyboardEvent) {
 | 
			
		||||
      console.log(evt);
 | 
			
		||||
      if ((evt.keyCode === 83 || evt.keyCode === 13) && evt.ctrlKey) {
 | 
			
		||||
         evt.preventDefault()
 | 
			
		||||
         this.save();
 | 
			
		||||
@ -161,39 +160,27 @@ export default class EntryComponent extends Component<{ vault: Promise<IVault>,
 | 
			
		||||
      const delete_handler = async () => {
 | 
			
		||||
         await this.vault.deleteNote(this.props.id);
 | 
			
		||||
         this.toVault()
 | 
			
		||||
         // async onKeypress(event) {
 | 
			
		||||
         //    event = event || window.event;
 | 
			
		||||
         //    
 | 
			
		||||
         // }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      console.log("Rerender")
 | 
			
		||||
 | 
			
		||||
      return <div>
 | 
			
		||||
         <header class="uk-background-primary">
 | 
			
		||||
            {/* <div> */}
 | 
			
		||||
            <a class="header-icon-button" onClick={() => this.exitHandler()}><X height={undefined} width={undefined} /></a>
 | 
			
		||||
            {this.state.changed ? <a class="header-icon-button" style="margin-left: 0.5em;" onClick={() => save_handler()}><Save height={undefined} width={undefined} /></a> : undefined}
 | 
			
		||||
            {/* </div> */}
 | 
			
		||||
            <h3 style="display:inline" class="button header-title">{this.state.title}</h3>
 | 
			
		||||
            <a class="header-icon-button" onClick={() => delete_handler()}><Trash height={undefined} width={undefined} /></a>
 | 
			
		||||
         </header>
 | 
			
		||||
         <div class="uk-container">
 | 
			
		||||
            <textarea
 | 
			
		||||
               // async onKeypress(event) {
 | 
			
		||||
               //    event = event || window.event;
 | 
			
		||||
               //    
 | 
			
		||||
               // }
 | 
			
		||||
               autofocus
 | 
			
		||||
               value={this.text}
 | 
			
		||||
               rows={this.rows}
 | 
			
		||||
               class="doc uk-textarea"
 | 
			
		||||
               style="width:100%;"
 | 
			
		||||
               onInput={evt => this.textAreaChange(evt as KeyboardEvent)}
 | 
			
		||||
               onKeyDown={evt => this.textAreaKeyPress(evt)}
 | 
			
		||||
               onChange={evt => this.textAreaChange(evt as KeyboardEvent)}
 | 
			
		||||
               ref={elm => {
 | 
			
		||||
                  if (elm)
 | 
			
		||||
                     setTimeout(() => elm.focus(), 500)
 | 
			
		||||
               }}
 | 
			
		||||
               onInput={this.textAreaChange}
 | 
			
		||||
               onKeyDown={this.textAreaKeyPress}
 | 
			
		||||
               onChange={this.textAreaChange}
 | 
			
		||||
               ref={elm => this.inputElm = elm}
 | 
			
		||||
            />
 | 
			
		||||
         </div>
 | 
			
		||||
      </div>
 | 
			
		||||
 | 
			
		||||
@ -72,7 +72,6 @@ export default class EntryList extends Component<{ vault: Promise<IVault> }, { n
 | 
			
		||||
         } else {
 | 
			
		||||
            Notifications.sendError("Sharing not possible on this device")
 | 
			
		||||
         }
 | 
			
		||||
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      let share;
 | 
			
		||||
 | 
			
		||||
@ -1,7 +1,10 @@
 | 
			
		||||
 | 
			
		||||
.uk-container> :last-child {
 | 
			
		||||
   margin-bottom: 15px !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.vault-vault {
 | 
			
		||||
   width: 100%;
 | 
			
		||||
 | 
			
		||||
   >div {
 | 
			
		||||
      width: 100%;
 | 
			
		||||
      font-size: 1rem;
 | 
			
		||||
@ -17,7 +20,7 @@
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   >div:empty {
 | 
			
		||||
      &::before{
 | 
			
		||||
      &::before {
 | 
			
		||||
         content: " ";
 | 
			
		||||
         white-space: pre;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -218,7 +218,7 @@ export default class VaultsPage extends Page<VaultsProps, { vaults: VaultList, m
 | 
			
		||||
         {this.state.context}
 | 
			
		||||
         <header class="uk-background-primary">
 | 
			
		||||
            <span></span>
 | 
			
		||||
            <h3 style="display:inline" class="header_title" onClick={() => Navigation.setPage("/")}>Your vaults:</h3>
 | 
			
		||||
            <h3 style="display:inline" onClick={() => Navigation.setPage("/")}>Your vaults:</h3>
 | 
			
		||||
            <span></span>
 | 
			
		||||
         </header>
 | 
			
		||||
         <AddButton onClick={() => this.addButtonClick()} />
 | 
			
		||||
 | 
			
		||||
@ -5,7 +5,6 @@
 | 
			
		||||
   height: 100%;
 | 
			
		||||
   width: 100%;
 | 
			
		||||
   overflow: auto;
 | 
			
		||||
   padding-bottom: 40px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.transition_slidein {
 | 
			
		||||
@ -21,6 +20,7 @@
 | 
			
		||||
   from {
 | 
			
		||||
      left: 100%;
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
   to {
 | 
			
		||||
      left: 0%;
 | 
			
		||||
   }
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user