Coder Social home page Coder Social logo

rlugojr / phosphor-sectionlist Goto Github PK

View Code? Open in Web Editor NEW

This project forked from phosphorjs/phosphor-sectionlist

0.0 3.0 0.0 126 KB

A data structure for a collection of variable sized sections.

License: BSD 3-Clause "New" or "Revised" License

Shell 3.11% TypeScript 96.89%

phosphor-sectionlist's Introduction

phosphor-sectionlist

Build Status Coverage Status

A data structure for a collection of variable sized sections.

A section list is well suited to managing row heights in virtually scrolling list controls. In these controls, most rows are uniform height while a handful of rows are variable sized. A pair of lists can be used to efficiently manage a virtually scrolling data grid.

A section list has guaranteed O(log n) worst-case performance for most operations, where n is the number of variable sized sections.

API Docs

Package Install

Prerequisites

npm install --save phosphor-sectionlist

Source Build

Prerequisites

git clone https://github.com/phosphorjs/phosphor-sectionlist.git
cd phosphor-sectionlist
npm install

Rebuild

npm run clean
npm run build

Run Tests

Follow the source build instructions first.

npm test

Build Docs

Follow the source build instructions first.

npm run docs

Navigate to docs/index.html.

Supported Runtimes

The runtime versions which are currently known to work are listed below. Earlier versions may also work, but come with no guarantees.

  • Node 0.12.7+
  • IE 11+
  • Firefox 32+
  • Chrome 38+

Bundle for the Browser

Follow the package install instructions first.

npm install --save-dev browserify
browserify myapp.js -o mybundle.js

Usage Examples

Note: This module is fully compatible with Node/Babel/ES6/ES5. Simply omit the type declarations when using a language other than TypeScript.

import { SectionList } from 'phosphor-sectionlist';


// Create a new list with 100 sections of size 10
var list = new SectionList();
list.insert(0, 100, 10);

// Prepend 20 sections of size 50
list.insert(0, 20, 50);

// Append 10 sections of size 20
list.insert(120, 10, 20);

// Insert 5 sections of size 5 in the middle
list.insert(65, 5, 5);


// Query the total count and size
list.size;   // 2225
list.count;  // 135


// Query for the index of various offsets
list.indexOf(0);     // 0
list.indexOf(2224);  // 134
list.indexOf(155);   // 3
list.indexOf(1035);  // 23
list.indexOf(2003);  // 122
list.indexOf(2038);  // 125
list.indexOf(-100);  // -1
list.indexOf(5000);  // -1


// Query for the offset of various indices
list.offsetOf(0);     // 0
list.offsetOf(134);   // 2205
list.offsetOf(21);    // 1010
list.offsetOf(68);    // 1465
list.offsetOf(125);   // 2025
list.offsetOf(-100);  // -1
list.offsetOf(5000);  // -1


// Query for the size of various indices
list.sizeOf(0);     // 0
list.sizeOf(134);   // 20
list.sizeOf(21);    // 10
list.sizeOf(68);    // 5
list.sizeOf(125);   // 20
list.sizeOf(-100);  // -1
list.sizeOf(5000);  // -1


// Remove 10 sections starting at index 50
list.remove(50, 10);
list.size;   // 2125
list.count;  // 125


// Resize the first 20 sections to 1
list.resize(0, 20, 1);
list.size;        // 1145
list.count;       // 125
list.sizeOf(0);   // 1
list.sizeOf(19);  // 1
list.sizeOf(20);  // 10

phosphor-sectionlist's People

Contributors

blink1073 avatar sccolbert avatar

Watchers

 avatar  avatar  avatar

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.