/WebDesignUserExperienceProject-PowerpointCanvas

Web Design and User Experience Project - Powerpoint Canvas

Primary LanguageJavaScriptMIT LicenseMIT

Steps to use the application:

  1. Double click on slides.html file.
  2. Click on image/text button from the toolbar
  3. On clicking the text button you will see a text box which is created in the canvas.
  4. You can type your text in the textbox, as soon as you type you will see a toolbar to style your text as bold,italic,underline etc.
  5. You can drag the textbox anywhere.
  6. Create multiple textboxes with text button in the toolbar
  7. On clicking the image button, you will be given an option to browse the image in your computer, and once you select an image and click ok, image will appear in canvas. you can drag the image anywhere
  8. You can also resize the textboxes and images.

References: https://www.w3schools.com/howto/howto_js_draggable.asp

https://medium.com/the-z/making-a-resizable-div-in-js-is-not-easy-as-you-think-bda19a1bc53d

https://www.google.com/slides/about/

Quick start

# clone the repo
git clone https://github.com/neu-mis-info6150-fall-2018/extra-credit-assignment-ppt-CharmyDesai306.git

# change directory to repo
cd example-app

# Use npm or yarn to install the dependencies:
npm install

# OR
yarn

# start the server
ng serve