GithubHelp home page GithubHelp logo

nix-united / pix Goto Github PK

View Code? Open in Web Editor NEW
3.0 2.0 1.0 6.16 MB

PIX - Gallery for your Google Drive

Home Page: https://nix-united.github.io/pix/

License: MIT License

JavaScript 0.47% HTML 3.16% TypeScript 68.11% SCSS 28.25%

pix's Introduction

Welcome to PIX πŸ‘‹

Contents

Project overview

An application designed to view photos and videos from Google Drive.

Authorization is carried out using gmail account. You must provide access to all specified actions with your Google Drive.

image

You can view your photos and videos in a convenient format. All you have to do is go to your media folder.

image

You can navigate through folders using the folder block. Folders can be sorted by date added and name. Navigation is also possible with the help of breadcrumbs.
You can copy the link to the current folder, so that for example, another user could also view media files (if access is configured for this user).

image

In the media files section, you can see your photos and videos stored in the current folder. The total number of files is displayed (if there are more than 50 on the current page, then 50+, 100+, etc. will be indicated).
There is a view-layout change functionality:

  • Inline
  • Columns
  • Grid

image image

When we opened the image, the functionality is available:

  • turning on / off thumbnails (by clicking on them, we can move to the image);
  • switching to full screen mode;
  • starting a slide show;
  • downloading the current image;
  • copying the link to the current image.

It also displays information about the date the file was uploaded to Google Drive and its size.

image

Installation and Setup Instructions

Clone down this repository. You will need node and npm installed on your machine. Install yarn package manager with the following command npm i -g yarn, and then in project folder run yarn to download the required dependencies.

Аfter installing the packages, you must create a .env file in the root of the project and fill in it according to the template given in the file .env.example.

Set up your Google Cloud project: here.

How to Enable Google Drive API on the Google Console: here

Available Scripts

In the project directory, you can run:

– yarn dev - runs the app in the development mode.

Open http://localhost:8080 to view it in the browser. The page will reload if you make edits.

– yarn build - builds the app for production to the dist folder.

It optimizes the build for the best performance by minifying JavaScript, CSS, and HTML, resizing and optimizing images and so on. Your app is ready to be deployed!

– yarn preview - locally preview production build. You can see what your already built application looks like and correct the errors.

License

The project is developed by NIX and distributed under MIT LICENSE

pix's People

Contributors

less-nik13 avatar antonshevchuk avatar

Stargazers

Dmitriy Troyan avatar  avatar  avatar

Watchers

Dmytro Chyrkin avatar  avatar

Forkers

cree-yoo

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.