Skip to content

Commit

Permalink
First commit
Browse files Browse the repository at this point in the history
  • Loading branch information
Paul Varache committed Oct 13, 2017
0 parents commit fc097e0
Show file tree
Hide file tree
Showing 14 changed files with 800 additions and 0 deletions.
11 changes: 11 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
# OS generated files #
######################
.DS_Store
.DS_Store?
._*
.Spotlight-V100
.Trashes
ehthumbs.db
Thumbs.db

bower_components/
56 changes: 56 additions & 0 deletions Jenkinsfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
#!groovy

pipeline {
agent {
label 'win-test'
}

stages {
// pulls down locally the sources for the component
stage('checkout') {
steps {
checkout scm
}
}

// Install the bower dependencies of the component
stage('install dependencies') {
steps {
script {
sh "bower --version || npm i -g bower"
sh "polymer --version || npm i -g polymer-cli"
sh "npm install -g https://github.com/marcelmeulemans/wct-junit-reporter.git"
sh "bower i"
}
}
}

// Lints, and tests the component
stage('test') {
steps {
script {
sh "polymer lint"
sh "polymer test --local chrome"
junit allowEmptyResults: true, testResults: 'wct.xml'
}
}
}

stage('documentation') {
steps {
script {
if (env.BRANCH_NAME == 'master') {
build job: 'Kano/components-doc/master', parameters: [
text(name: 'repoUrl', value: 'https://github.com/KanoComponents/kwc-file-picker'),
text(name: 'componentName', value: 'kwc-file-picker')
], wait: false
}
}
}
}
}

options {
buildDiscarder(logRotator(numToKeepStr: '20'))
}
}
25 changes: 25 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
# \<kwc-file-picker\>

A set of elements to display file explorer style views.

## Installation
Clone this repository.
Run `bower i`

## Install the Polymer-CLI

First, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) installed. Then run `polymer serve` to serve your element locally.

## Viewing Your Element

```
$ polymer serve
```

## Running Tests

```
$ polymer test --skip-plugin junit-reporter
```

Your application is already set up to be tested via [web-component-tester](https://github.com/Polymer/web-component-tester). Run `polymer test` to run your application's test suite locally.
18 changes: 18 additions & 0 deletions bower.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"name": "kwc-file-picker",
"description": "Display a list of items from a tree as a file picker would",
"main": "kwc-file-picker-list.html",
"dependencies": {
"polymer": "Polymer/polymer#^1.9.0",
"iron-list": "PolymerElements/iron-list#^2.0.9"
},
"devDependencies": {
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"web-component-tester": "Polymer/web-component-tester#^6.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.2"
},
"resolutions": {
"webcomponentsjs": "^1.0.2"
}
}
124 changes: 124 additions & 0 deletions demo/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,124 @@
<!doctype html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">

<title>kwc-file-picker-list demo</title>

<script src="../../webcomponentsjs/webcomponents-lite.js"></script>

<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
<link rel="import" href="../kwc-file-picker-list.html">

<custom-style>
<style is="custom-style" include="demo-pages-shared-styles">
[hidden] {
display: none !important;
}
</style>
</custom-style>
</head>

<body>
<div class="vertical-section-container centered">
<h3>Basic kwc-file-picker-list demo</h3>
<demo-snippet>
<template>
<!-- A template is required to render the elements of a directory -->
<kwc-file-picker-list id="list">
<template>
<button path-name$="[[item.name]]">[[item.name]]</button>
</template>
</kwc-file-picker-list>
<script>
const list = document.getElementById('list');
list.rootDir = {
name: 'My files',
children: [{
name: 'jump',
children: [{
name: 'to',
children: [{
name: 'the',
children: [{
name: 'beat'
}, {
name: 'music'
}]
}]
}]
}]
};
</script>
</template>
</demo-snippet>
<h3>Customised kwc-file-picker-list demo</h3>
<demo-snippet>
<template>
<kwc-file-picker-list id="custom-list">
<template slot="breadcrumbs">
<span hidden$="[[!index]]">&gt;</span>
<span path-index$="[[index]]">[[item]]</span>
</template>
<template>
<div>
<button class="item" path-name$="[[item.name]]" hidden$="[[!item.children]]">
<span>[[item.name]]</span>
<span>&gt;</span>
</button>
<div class="item" hidden$="[[item.children]]">
<span>[[item.name]]</span>
</div>
</div>
</template>
</kwc-file-picker-list>
<style>
.item {
display: flex;
border: 0px;
padding: 7px;
width: 100%;
cursor: pointer;
background: white;
font-size: 16px;
}
.item:hover {
background: lightgrey;
}
.item>* {
pointer-events: none;
}
.item>span:first-of-type {
flex: 1;
text-align: left;
}
</style>
<script>
const customList = document.getElementById('custom-list');
customList.rootDir = {
name: 'My files',
children: [{
name: 'jump',
children: [{
name: 'to',
children: [{
name: 'the',
children: [{
name: 'beat'
}, {
name: 'music'
}]
}]
}]
}]
};
</script>
</template>
</demo-snippet>
</div>
</body>

</html>
62 changes: 62 additions & 0 deletions demo/kwc-file-breadcrumbs.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
<!doctype html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">

<title>kwc-file-picker-list demo</title>

<script src="../../webcomponentsjs/webcomponents-lite.js"></script>

<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
<link rel="import" href="../kwc-file-breadcrumbs.html">

<custom-style>
<style is="custom-style" include="demo-pages-shared-styles">
span.custom {
color: red;
}
</style>
</custom-style>
</head>

<body>
<div class="vertical-section-container centered">
<h3>Basic kwc-file-breadcrumbs demo</h3>
<demo-snippet>
<template>
<kwc-file-breadcrumbs id="list"></kwc-file-breadcrumbs>
<script>
const list = document.getElementById('list');
list.parts = ['jump', 'to', 'the', 'next', 'beat'];
list.push('parts', 'lol');
</script>
</template>
</demo-snippet>
<h3>Basic kwc-file-breadcrumbs with cutom template</h3>
<demo-snippet>
<template>
<kwc-file-breadcrumbs id="custom-list">
<template>
<span hidden$="[[!index]]">+++</span>
<span class="custom">[[item]]</span>
</template>
</kwc-file-breadcrumbs>
<style>
span.custom {
color: red;
}
</style>
<script>
const customList = document.getElementById('custom-list');
customList.parts = ['jump', 'to', 'the', 'next', 'beat'];
customList.push('parts', 'lol');
</script>
</template>
</demo-snippet>
</div>
</body>

</html>
16 changes: 16 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">

<title>kwc-file-picker-list</title>

<script src="../webcomponentsjs/webcomponents-lite.js"></script>

<link rel="import" href="../iron-component-page/iron-component-page.html">
</head>
<body>
<iron-component-page src="kwc-file-picker-list.html"></iron-component-page>
</body>
</html>
Loading

0 comments on commit fc097e0

Please sign in to comment.