first commit
This commit is contained in:
yanwenwu
234
public/assets/js/demo/bootstrap-table-demo.js
vendored
Normal file
234
public/assets/js/demo/bootstrap-table-demo.js
vendored
Normal file
@@ -0,0 +1,234 @@
|
||||
/*!
|
||||
* Remark (http://getbootstrapadmin.com/remark)
|
||||
* Copyright 2015 amazingsurge
|
||||
* Licensed under the Themeforest Standard Licenses
|
||||
*/
|
||||
function cellStyle(value, row, index) {
|
||||
var classes = ['active', 'success', 'info', 'warning', 'danger'];
|
||||
|
||||
if (index % 2 === 0 && index / 2 < classes.length) {
|
||||
return {
|
||||
classes: classes[index / 2]
|
||||
};
|
||||
}
|
||||
return {};
|
||||
}
|
||||
|
||||
function rowStyle(row, index) {
|
||||
var classes = ['active', 'success', 'info', 'warning', 'danger'];
|
||||
|
||||
if (index % 2 === 0 && index / 2 < classes.length) {
|
||||
return {
|
||||
classes: classes[index / 2]
|
||||
};
|
||||
}
|
||||
return {};
|
||||
}
|
||||
|
||||
function scoreSorter(a, b) {
|
||||
if (a > b) return 1;
|
||||
if (a < b) return -1;
|
||||
return 0;
|
||||
}
|
||||
|
||||
function nameFormatter(value) {
|
||||
return value + '<i class="icon wb-book" aria-hidden="true"></i> ';
|
||||
}
|
||||
|
||||
function starsFormatter(value) {
|
||||
return '<i class="icon wb-star" aria-hidden="true"></i> ' + value;
|
||||
}
|
||||
|
||||
function queryParams() {
|
||||
return {
|
||||
type: 'owner',
|
||||
sort: 'updated',
|
||||
direction: 'desc',
|
||||
per_page: 100,
|
||||
page: 1
|
||||
};
|
||||
}
|
||||
|
||||
function buildTable($el, cells, rows) {
|
||||
var i, j, row,
|
||||
columns = [],
|
||||
data = [];
|
||||
|
||||
for (i = 0; i < cells; i++) {
|
||||
columns.push({
|
||||
field: '字段' + i,
|
||||
title: '单元' + i
|
||||
});
|
||||
}
|
||||
for (i = 0; i < rows; i++) {
|
||||
row = {};
|
||||
for (j = 0; j < cells; j++) {
|
||||
row['字段' + j] = 'Row-' + i + '-' + j;
|
||||
}
|
||||
data.push(row);
|
||||
}
|
||||
$el.bootstrapTable('destroy').bootstrapTable({
|
||||
columns: columns,
|
||||
data: data,
|
||||
iconSize: 'outline',
|
||||
icons: {
|
||||
columns: 'glyphicon-list'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
(function(document, window, $) {
|
||||
'use strict';
|
||||
|
||||
// Example Bootstrap Table From Data
|
||||
// ---------------------------------
|
||||
(function() {
|
||||
var bt_data = [{
|
||||
"Tid": "1",
|
||||
"First": "奔波儿灞",
|
||||
"sex": "男",
|
||||
"Score": "50"
|
||||
}, {
|
||||
"Tid": "2",
|
||||
"First": "灞波儿奔",
|
||||
"sex": "男",
|
||||
"Score": "94"
|
||||
}, {
|
||||
"Tid": "3",
|
||||
"First": "作家崔成浩",
|
||||
"sex": "男",
|
||||
"Score": "80"
|
||||
}, {
|
||||
"Tid": "4",
|
||||
"First": "韩寒",
|
||||
"sex": "男",
|
||||
"Score": "67"
|
||||
}, {
|
||||
"Tid": "5",
|
||||
"First": "郭敬明",
|
||||
"sex": "男",
|
||||
"Score": "100"
|
||||
}, {
|
||||
"Tid": "6",
|
||||
"First": "马云",
|
||||
"sex": "男",
|
||||
"Score": "77"
|
||||
}, {
|
||||
"Tid": "7",
|
||||
"First": "范爷",
|
||||
"sex": "女",
|
||||
"Score": "87"
|
||||
}];
|
||||
|
||||
|
||||
$('#exampleTableFromData').bootstrapTable({
|
||||
data: bt_data,
|
||||
// mobileResponsive: true,
|
||||
height: "250"
|
||||
});
|
||||
})();
|
||||
|
||||
// Example Bootstrap Table Columns
|
||||
// -------------------------------
|
||||
(function() {
|
||||
$('#exampleTableColumns').bootstrapTable({
|
||||
url: "js/demo/bootstrap_table_test.json",
|
||||
height: "400",
|
||||
iconSize: 'outline',
|
||||
showColumns: true,
|
||||
icons: {
|
||||
refresh: 'glyphicon-repeat',
|
||||
toggle: 'glyphicon-list-alt',
|
||||
columns: 'glyphicon-list'
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
|
||||
// Example Bootstrap Table Large Columns
|
||||
// -------------------------------------
|
||||
buildTable($('#exampleTableLargeColumns'), 50, 50);
|
||||
|
||||
|
||||
// Example Bootstrap Table Toolbar
|
||||
// -------------------------------
|
||||
(function() {
|
||||
$('#exampleTableToolbar').bootstrapTable({
|
||||
url: "js/demo/bootstrap_table_test2.json",
|
||||
search: true,
|
||||
showRefresh: true,
|
||||
showToggle: true,
|
||||
showColumns: true,
|
||||
toolbar: '#exampleToolbar',
|
||||
iconSize: 'outline',
|
||||
icons: {
|
||||
refresh: 'glyphicon-repeat',
|
||||
toggle: 'glyphicon-list-alt',
|
||||
columns: 'glyphicon-list'
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
|
||||
// Example Bootstrap Table Events
|
||||
// ------------------------------
|
||||
(function() {
|
||||
$('#exampleTableEvents').bootstrapTable({
|
||||
url: "js/demo/bootstrap_table_test.json",
|
||||
search: true,
|
||||
pagination: true,
|
||||
showRefresh: true,
|
||||
showToggle: true,
|
||||
showColumns: true,
|
||||
iconSize: 'outline',
|
||||
toolbar: '#exampleTableEventsToolbar',
|
||||
icons: {
|
||||
refresh: 'glyphicon-repeat',
|
||||
toggle: 'glyphicon-list-alt',
|
||||
columns: 'glyphicon-list'
|
||||
}
|
||||
});
|
||||
|
||||
var $result = $('#examplebtTableEventsResult');
|
||||
|
||||
$('#exampleTableEvents').on('all.bs.table', function(e, name, args) {
|
||||
console.log('Event:', name, ', data:', args);
|
||||
})
|
||||
.on('click-row.bs.table', function(e, row, $element) {
|
||||
$result.text('Event: click-row.bs.table');
|
||||
})
|
||||
.on('dbl-click-row.bs.table', function(e, row, $element) {
|
||||
$result.text('Event: dbl-click-row.bs.table');
|
||||
})
|
||||
.on('sort.bs.table', function(e, name, order) {
|
||||
$result.text('Event: sort.bs.table');
|
||||
})
|
||||
.on('check.bs.table', function(e, row) {
|
||||
$result.text('Event: check.bs.table');
|
||||
})
|
||||
.on('uncheck.bs.table', function(e, row) {
|
||||
$result.text('Event: uncheck.bs.table');
|
||||
})
|
||||
.on('check-all.bs.table', function(e) {
|
||||
$result.text('Event: check-all.bs.table');
|
||||
})
|
||||
.on('uncheck-all.bs.table', function(e) {
|
||||
$result.text('Event: uncheck-all.bs.table');
|
||||
})
|
||||
.on('load-success.bs.table', function(e, data) {
|
||||
$result.text('Event: load-success.bs.table');
|
||||
})
|
||||
.on('load-error.bs.table', function(e, status) {
|
||||
$result.text('Event: load-error.bs.table');
|
||||
})
|
||||
.on('column-switch.bs.table', function(e, field, checked) {
|
||||
$result.text('Event: column-switch.bs.table');
|
||||
})
|
||||
.on('page-change.bs.table', function(e, size, number) {
|
||||
$result.text('Event: page-change.bs.table');
|
||||
})
|
||||
.on('search.bs.table', function(e, text) {
|
||||
$result.text('Event: search.bs.table');
|
||||
});
|
||||
})();
|
||||
})(document, window, jQuery);
|
||||
192
public/assets/js/demo/bootstrap_table_test.json
Normal file
192
public/assets/js/demo/bootstrap_table_test.json
Normal file
@@ -0,0 +1,192 @@
|
||||
|
||||
[
|
||||
{
|
||||
"id": 0,
|
||||
"name": "测试0",
|
||||
"price": "¥0",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"name": "测试1",
|
||||
"price": "¥1",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"name": "测试2",
|
||||
"price": "¥2",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"name": "测试3",
|
||||
"price": "¥3",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"name": "测试4",
|
||||
"price": "¥4",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"name": "测试5",
|
||||
"price": "¥5",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"name": "测试6",
|
||||
"price": "¥6",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"name": "测试7",
|
||||
"price": "¥7",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"name": "测试8",
|
||||
"price": "¥8",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"name": "测试9",
|
||||
"price": "¥9",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 10,
|
||||
"name": "测试10",
|
||||
"price": "¥10",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 11,
|
||||
"name": "测试11",
|
||||
"price": "¥11",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 12,
|
||||
"name": "测试12",
|
||||
"price": "¥12",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 13,
|
||||
"name": "测试13",
|
||||
"price": "¥13",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 14,
|
||||
"name": "测试14",
|
||||
"price": "¥14",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 15,
|
||||
"name": "测试15",
|
||||
"price": "¥15",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 16,
|
||||
"name": "测试16",
|
||||
"price": "¥16",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 17,
|
||||
"name": "测试17",
|
||||
"price": "¥17",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 18,
|
||||
"name": "测试18",
|
||||
"price": "¥18",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 19,
|
||||
"name": "测试19",
|
||||
"price": "¥19",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
},
|
||||
{
|
||||
"id": 20,
|
||||
"name": "测试20",
|
||||
"price": "¥20",
|
||||
"column1": "c10",
|
||||
"column2": "c20",
|
||||
"column3": "c30",
|
||||
"column4": "c40"
|
||||
}
|
||||
]
|
||||
31
public/assets/js/demo/bootstrap_table_test2.json
Normal file
31
public/assets/js/demo/bootstrap_table_test2.json
Normal file
@@ -0,0 +1,31 @@
|
||||
|
||||
[
|
||||
{
|
||||
"name": "asSelect",
|
||||
"star": 777,
|
||||
"license": "MIT",
|
||||
"description": "A jQuery plugin to select multiple elements with checkboxes and radio:)",
|
||||
"url": "<a href='https://github.com/amazingSurger/jquery-asSelect'>https://github.com/amazingSurger/jquery-asSelect</a>"
|
||||
},
|
||||
{
|
||||
"name": "Bootstrap Table",
|
||||
"star": 778,
|
||||
"license": "MIT & XXX",
|
||||
"description": "Bootstrap table displays data in a tabular format and offers rich support to radio, checkbox, sort, pagination and so on. ",
|
||||
"url": "<a href='https://github.com/wenzhixin/bootstrap-table'>https://github.com/wenzhixin/bootstrap-table</a>"
|
||||
},
|
||||
{
|
||||
"name": "asDatepicker",
|
||||
"star": 779,
|
||||
"license": "MIT",
|
||||
"description": "A jQuery datepicker plugin for best .",
|
||||
"url": "<a href='https://github.com/amazingSurger/jquery-asDatepicker'>https://github.com/amazingSurger/jquery-asDatepicker</a>"
|
||||
},
|
||||
{
|
||||
"name": "asColorpicker",
|
||||
"star": 780,
|
||||
"license": "MIT",
|
||||
"description": "A jQuery colorpicker for best .",
|
||||
"url": "<a href='https://github.com/amazingSurger/jquery-asColorpicker'>https://github.com/amazingSurger/jquery-asColorpicker</a>"
|
||||
}
|
||||
]
|
||||
1160
public/assets/js/demo/echarts-demo.js
Normal file
1160
public/assets/js/demo/echarts-demo.js
Normal file
File diff suppressed because it is too large
Load Diff
1266
public/assets/js/demo/flot-demo.js
Normal file
1266
public/assets/js/demo/flot-demo.js
Normal file
File diff suppressed because it is too large
Load Diff
283
public/assets/js/demo/form-advanced-demo.js
Normal file
283
public/assets/js/demo/form-advanced-demo.js
Normal file
@@ -0,0 +1,283 @@
|
||||
$(document).ready(function () {
|
||||
|
||||
var $image = $(".image-crop > img")
|
||||
$($image).cropper({
|
||||
aspectRatio: 1.618,
|
||||
preview: ".img-preview",
|
||||
done: function (data) {
|
||||
// 输出结果
|
||||
}
|
||||
});
|
||||
|
||||
var $inputImage = $("#inputImage");
|
||||
if (window.FileReader) {
|
||||
$inputImage.change(function () {
|
||||
var fileReader = new FileReader(),
|
||||
files = this.files,
|
||||
file;
|
||||
|
||||
if (!files.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
file = files[0];
|
||||
|
||||
if (/^image\/\w+$/.test(file.type)) {
|
||||
fileReader.readAsDataURL(file);
|
||||
fileReader.onload = function () {
|
||||
$inputImage.val("");
|
||||
$image.cropper("reset", true).cropper("replace", this.result);
|
||||
};
|
||||
} else {
|
||||
showMessage("请选择图片文件");
|
||||
}
|
||||
});
|
||||
} else {
|
||||
$inputImage.addClass("hide");
|
||||
}
|
||||
|
||||
$("#download").click(function () {
|
||||
window.open($image.cropper("getDataURL"));
|
||||
});
|
||||
|
||||
$("#zoomIn").click(function () {
|
||||
$image.cropper("zoom", 0.1);
|
||||
});
|
||||
|
||||
$("#zoomOut").click(function () {
|
||||
$image.cropper("zoom", -0.1);
|
||||
});
|
||||
|
||||
$("#rotateLeft").click(function () {
|
||||
$image.cropper("rotate", 45);
|
||||
});
|
||||
|
||||
$("#rotateRight").click(function () {
|
||||
$image.cropper("rotate", -45);
|
||||
});
|
||||
|
||||
$("#setDrag").click(function () {
|
||||
$image.cropper("setDragMode", "crop");
|
||||
});
|
||||
|
||||
$('#data_1 .input-group.date').datepicker({
|
||||
todayBtn: "linked",
|
||||
keyboardNavigation: false,
|
||||
forceParse: false,
|
||||
calendarWeeks: true,
|
||||
autoclose: true
|
||||
});
|
||||
|
||||
$('#data_2 .input-group.date').datepicker({
|
||||
startView: 1,
|
||||
todayBtn: "linked",
|
||||
keyboardNavigation: false,
|
||||
forceParse: false,
|
||||
autoclose: true,
|
||||
format: "yyyy-mm-dd"
|
||||
});
|
||||
|
||||
$('#data_3 .input-group.date').datepicker({
|
||||
startView: 2,
|
||||
todayBtn: "linked",
|
||||
keyboardNavigation: false,
|
||||
forceParse: false,
|
||||
autoclose: true
|
||||
});
|
||||
|
||||
$('#data_4 .input-group.date').datepicker({
|
||||
minViewMode: 1,
|
||||
keyboardNavigation: false,
|
||||
forceParse: false,
|
||||
autoclose: true,
|
||||
todayHighlight: true
|
||||
});
|
||||
|
||||
$('#data_5 .input-daterange').datepicker({
|
||||
keyboardNavigation: false,
|
||||
forceParse: false,
|
||||
autoclose: true
|
||||
});
|
||||
|
||||
var elem = document.querySelector('.js-switch');
|
||||
var switchery = new Switchery(elem, {
|
||||
color: '#1AB394'
|
||||
});
|
||||
|
||||
var elem_2 = document.querySelector('.js-switch_2');
|
||||
var switchery_2 = new Switchery(elem_2, {
|
||||
color: '#ED5565'
|
||||
});
|
||||
|
||||
var elem_3 = document.querySelector('.js-switch_3');
|
||||
var switchery_3 = new Switchery(elem_3, {
|
||||
color: '#1AB394'
|
||||
});
|
||||
|
||||
$('.i-checks').iCheck({
|
||||
checkboxClass: 'icheckbox_square-green',
|
||||
radioClass: 'iradio_square-green'
|
||||
});
|
||||
|
||||
$('.colorpicker-demo1').colorpicker();
|
||||
|
||||
$('.colorpicker-demo2').colorpicker();
|
||||
|
||||
$('.colorpicker-demo3').colorpicker();
|
||||
|
||||
// Code for demos
|
||||
function createColorpickers() {
|
||||
// Api demo
|
||||
var bodyStyle = $('body')[0].style;
|
||||
$('#demo_apidemo').colorpicker({
|
||||
color: bodyStyle.backgroundColor
|
||||
}).on('changeColor', function (ev) {
|
||||
bodyStyle.backgroundColor = ev.color.toHex();
|
||||
});
|
||||
|
||||
// Horizontal mode
|
||||
$('#demo_forceformat').colorpicker({
|
||||
format: 'rgba', // force this format
|
||||
horizontal: true
|
||||
});
|
||||
|
||||
$('.demo-auto').colorpicker();
|
||||
|
||||
// Disabled / enabled triggers
|
||||
$(".disable-button").click(function (e) {
|
||||
e.preventDefault();
|
||||
$("#demo_endis").colorpicker('disable');
|
||||
});
|
||||
|
||||
$(".enable-button").click(function (e) {
|
||||
e.preventDefault();
|
||||
$("#demo_endis").colorpicker('enable');
|
||||
});
|
||||
}
|
||||
|
||||
createColorpickers();
|
||||
|
||||
// Create / destroy instances
|
||||
$('.demo-destroy').click(function (e) {
|
||||
e.preventDefault();
|
||||
$('.demo').colorpicker('destroy');
|
||||
$(".disable-button, .enable-button").off('click');
|
||||
});
|
||||
|
||||
$('.demo-create').click(function (e) {
|
||||
e.preventDefault();
|
||||
createColorpickers();
|
||||
});
|
||||
|
||||
var divStyle = $('.back-change')[0].style;
|
||||
$('#demo_apidemo').colorpicker({
|
||||
color: divStyle.backgroundColor
|
||||
}).on('changeColor', function (ev) {
|
||||
divStyle.backgroundColor = ev.color.toHex();
|
||||
});
|
||||
|
||||
$('.clockpicker').clockpicker();
|
||||
|
||||
$( '#file-pretty input[type="file"]' ).prettyFile();
|
||||
|
||||
});
|
||||
var config = {
|
||||
'.chosen-select': {},
|
||||
'.chosen-select-deselect': {
|
||||
allow_single_deselect: true
|
||||
},
|
||||
'.chosen-select-no-single': {
|
||||
disable_search_threshold: 10
|
||||
},
|
||||
'.chosen-select-no-results': {
|
||||
no_results_text: 'Oops, nothing found!'
|
||||
},
|
||||
'.chosen-select-width': {
|
||||
width: "95%"
|
||||
}
|
||||
}
|
||||
for (var selector in config) {
|
||||
$(selector).chosen(config[selector]);
|
||||
}
|
||||
|
||||
$("#ionrange_1").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 5000,
|
||||
type: 'double',
|
||||
prefix: "¥",
|
||||
maxPostfix: "+",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
|
||||
$("#ionrange_2").ionRangeSlider({
|
||||
min: 0,
|
||||
max: 10,
|
||||
type: 'single',
|
||||
step: 0.1,
|
||||
postfix: " 克",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
|
||||
$("#ionrange_3").ionRangeSlider({
|
||||
min: -50,
|
||||
max: 50,
|
||||
from: 0,
|
||||
postfix: "°",
|
||||
prettify: false,
|
||||
hasGrid: true
|
||||
});
|
||||
|
||||
$("#ionrange_4").ionRangeSlider({
|
||||
values: [
|
||||
"一月", "二月", "三月",
|
||||
"四月", "五月", "六月",
|
||||
"七月", "八月", "九月",
|
||||
"十月", "十一月", "十二月"
|
||||
],
|
||||
type: 'single',
|
||||
hasGrid: true
|
||||
});
|
||||
|
||||
$("#ionrange_5").ionRangeSlider({
|
||||
min: 10000,
|
||||
max: 100000,
|
||||
step: 100,
|
||||
postfix: " km",
|
||||
from: 55000,
|
||||
hideMinMax: true,
|
||||
hideFromTo: false
|
||||
});
|
||||
|
||||
$(".dial").knob();
|
||||
|
||||
$("#basic_slider").noUiSlider({
|
||||
start: 40,
|
||||
behaviour: 'tap',
|
||||
connect: 'upper',
|
||||
range: {
|
||||
'min': 20,
|
||||
'max': 80
|
||||
}
|
||||
});
|
||||
|
||||
$("#range_slider").noUiSlider({
|
||||
start: [40, 60],
|
||||
behaviour: 'drag',
|
||||
connect: true,
|
||||
range: {
|
||||
'min': 20,
|
||||
'max': 80
|
||||
}
|
||||
});
|
||||
|
||||
$("#drag-fixed").noUiSlider({
|
||||
start: [40, 60],
|
||||
behaviour: 'drag-fixed',
|
||||
connect: true,
|
||||
range: {
|
||||
'min': 20,
|
||||
'max': 80
|
||||
}
|
||||
});
|
||||
89
public/assets/js/demo/form-validate-demo.js
Normal file
89
public/assets/js/demo/form-validate-demo.js
Normal file
@@ -0,0 +1,89 @@
|
||||
//以下为修改jQuery Validation插件兼容Bootstrap的方法，没有直接写在插件中是为了便于插件升级
|
||||
$.validator.setDefaults({
|
||||
highlight: function (element) {
|
||||
$(element).closest('.form-group').removeClass('has-success').addClass('has-error');
|
||||
},
|
||||
success: function (element) {
|
||||
element.closest('.form-group').removeClass('has-error').addClass('has-success');
|
||||
},
|
||||
errorElement: "span",
|
||||
errorPlacement: function (error, element) {
|
||||
if (element.is(":radio") || element.is(":checkbox")) {
|
||||
error.appendTo(element.parent().parent().parent());
|
||||
} else {
|
||||
error.appendTo(element.parent());
|
||||
}
|
||||
},
|
||||
errorClass: "help-block m-b-none",
|
||||
validClass: "help-block m-b-none"
|
||||
|
||||
|
||||
});
|
||||
|
||||
//以下为官方示例
|
||||
$().ready(function () {
|
||||
// validate the comment form when it is submitted
|
||||
$("#commentForm").validate();
|
||||
|
||||
// validate signup form on keyup and submit
|
||||
var icon = "<i class='fa fa-times-circle'></i> ";
|
||||
$("#signupForm").validate({
|
||||
rules: {
|
||||
firstname: "required",
|
||||
lastname: "required",
|
||||
username: {
|
||||
required: true,
|
||||
minlength: 2
|
||||
},
|
||||
password: {
|
||||
required: true,
|
||||
minlength: 5
|
||||
},
|
||||
confirm_password: {
|
||||
required: true,
|
||||
minlength: 5,
|
||||
equalTo: "#password"
|
||||
},
|
||||
email: {
|
||||
required: true,
|
||||
email: true
|
||||
},
|
||||
topic: {
|
||||
required: "#newsletter:checked",
|
||||
minlength: 2
|
||||
},
|
||||
agree: "required"
|
||||
},
|
||||
messages: {
|
||||
firstname: icon + "请输入你的姓",
|
||||
lastname: icon + "请输入您的名字",
|
||||
username: {
|
||||
required: icon + "请输入您的用户名",
|
||||
minlength: icon + "用户名必须两个字符以上"
|
||||
},
|
||||
password: {
|
||||
required: icon + "请输入您的密码",
|
||||
minlength: icon + "密码必须5个字符以上"
|
||||
},
|
||||
confirm_password: {
|
||||
required: icon + "请再次输入密码",
|
||||
minlength: icon + "密码必须5个字符以上",
|
||||
equalTo: icon + "两次输入的密码不一致"
|
||||
},
|
||||
email: icon + "请输入您的E-mail",
|
||||
agree: {
|
||||
required: icon + "必须同意协议后才能注册",
|
||||
element: '#agree-error'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// propose username by combining first- and lastname
|
||||
$("#username").focus(function () {
|
||||
var firstname = $("#firstname").val();
|
||||
var lastname = $("#lastname").val();
|
||||
if (firstname && lastname && !this.value) {
|
||||
this.value = firstname + "." + lastname;
|
||||
}
|
||||
});
|
||||
});
|
||||
143
public/assets/js/demo/layer-demo.js
Normal file
143
public/assets/js/demo/layer-demo.js
Normal file
@@ -0,0 +1,143 @@
|
||||
/*! layer demo */ ;
|
||||
! function () {
|
||||
var gather = {
|
||||
htdy: $('html, body')
|
||||
};
|
||||
|
||||
//一睹为快
|
||||
gather.demo1 = $('#demo1');
|
||||
$('#chutiyan>a').on('click', function () {
|
||||
var othis = $(this),
|
||||
index = othis.index();
|
||||
var p = gather.demo1.children('p').eq(index);
|
||||
var top = p.position().top;
|
||||
gather.demo1.animate({
|
||||
scrollTop: gather.demo1.scrollTop() + top
|
||||
}, 0);
|
||||
switch (index) {
|
||||
case 0:
|
||||
var icon = -1;
|
||||
(function changeIcon() {
|
||||
var index = parent.layer.alert('点击确认更换图标', {
|
||||
icon: icon,
|
||||
shadeClose: true,
|
||||
title: icon === -1 ? '初体验' : 'icon：' + icon
|
||||
}, changeIcon);
|
||||
if (8 === ++icon) layer.close(index);
|
||||
}());
|
||||
break;
|
||||
case 1:
|
||||
var icon = 0;
|
||||
(function changeIcon1() {
|
||||
var index = parent.layer.alert('点击确认更换图标', {
|
||||
icon: icon,
|
||||
shadeClose: true,
|
||||
skin: 'layer-ext-moon',
|
||||
shift: 5,
|
||||
title: icon === -1 ? '第三方扩展皮肤' : 'icon：' + icon
|
||||
}, changeIcon1);
|
||||
if (9 === ++icon) {
|
||||
parent.layer.confirm('怎么样，是否很喜欢该皮肤，去下载？', {
|
||||
skin: 'layer-ext-moon'
|
||||
}, function (index, layero) {
|
||||
layero.find('.layui-layer-btn0').attr({
|
||||
href: 'http://layer.layui.com/skin.html',
|
||||
target: '_blank'
|
||||
});
|
||||
parent.layer.close(index);
|
||||
});
|
||||
};
|
||||
}());
|
||||
break;
|
||||
case 6:
|
||||
parent.layer.open({
|
||||
type: 1,
|
||||
area: ['420px', '240px'],
|
||||
skin: 'layui-layer-rim', //加上边框
|
||||
content: '<div style="padding:20px;">即直接给content传入html字符<br>当内容宽高超过定义宽高，会自动出现滚动条。<br><br><br><br><br><br><br><br><br><br><br>很高兴在下面遇见你</div>'
|
||||
});
|
||||
break;
|
||||
case 7:
|
||||
parent.layer.open({
|
||||
type: 1,
|
||||
skin: 'layui-layer-demo',
|
||||
closeBtn: false,
|
||||
area: '350px',
|
||||
shift: 2,
|
||||
shadeClose: true,
|
||||
content: '<div style="padding:20px;">即传入skin:"样式名"，然后你就可以为所欲为了。<br>你怎么样给她整容都行<br><br><br>我是华丽的酱油==。</div>'
|
||||
});
|
||||
break;
|
||||
case 8:
|
||||
layer.tips('Hi，我是tips', this);
|
||||
break;
|
||||
case 11:
|
||||
var ii = parent.layer.load(0, {
|
||||
shade: false
|
||||
});
|
||||
setTimeout(function () {
|
||||
parent.layer.close(ii)
|
||||
}, 5000);
|
||||
break;
|
||||
case 12:
|
||||
var iii = parent.layer.load(1, {
|
||||
shade: [0.1, '#fff']
|
||||
});
|
||||
setTimeout(function () {
|
||||
parent.layer.close(iii)
|
||||
}, 3000);
|
||||
break;
|
||||
case 13:
|
||||
layer.tips('我是另外一个tips，只不过我长得跟之前那位稍有些不一样。', this, {
|
||||
tips: [1, '#3595CC'],
|
||||
time: 4000
|
||||
});
|
||||
break;
|
||||
case 14:
|
||||
parent.layer.prompt({
|
||||
title: '输入任何口令，并确认',
|
||||
formType: 1
|
||||
}, function (pass) {
|
||||
parent.layer.prompt({
|
||||
title: '随便写点啥，并确认',
|
||||
formType: 2
|
||||
}, function (text) {
|
||||
parent.layer.msg('演示完毕！您的口令：' + pass + '<br>您最后写下了：' + text);
|
||||
});
|
||||
});
|
||||
break;
|
||||
case 15:
|
||||
parent.layer.tab({
|
||||
area: ['600px', '300px'],
|
||||
tab: [{
|
||||
title: '无题',
|
||||
content: '<div style="padding:20px; line-height:30px; text-align:center">欢迎体验layer.tab<br>此时此刻不禁让人吟诗一首：<br>一入前端深似海<br>从此妹纸是浮云<br>以下省略七个字<br>。。。。。。。<br>——贤心</div>'
|
||||
}, {
|
||||
title: 'TAB2',
|
||||
content: '<div style="padding:20px;">TAB2该说些啥</div>'
|
||||
}, {
|
||||
title: 'TAB3',
|
||||
content: '<div style="padding:20px;">有一种坚持叫：layer</div>'
|
||||
}]
|
||||
});
|
||||
break;
|
||||
case 16:
|
||||
if (gather.photoJSON) {
|
||||
layer.photos({
|
||||
photos: gather.photoJSON
|
||||
});
|
||||
} else {
|
||||
$.getJSON('js/demo/photos.json?v=', function (json) {
|
||||
gather.photoJSON = json;
|
||||
layer.photos({
|
||||
photos: json
|
||||
});
|
||||
});
|
||||
}
|
||||
break;
|
||||
default:
|
||||
new Function(p.text())();
|
||||
break;
|
||||
}
|
||||
});
|
||||
}();
|
||||
181
public/assets/js/demo/morris-demo.js
Normal file
181
public/assets/js/demo/morris-demo.js
Normal file
@@ -0,0 +1,181 @@
|
||||
$(function() {
|
||||
|
||||
Morris.Line({
|
||||
element: 'morris-one-line-chart',
|
||||
data: [
|
||||
{ year: '2008', value: 5 },
|
||||
{ year: '2009', value: 10 },
|
||||
{ year: '2010', value: 8 },
|
||||
{ year: '2011', value: 22 },
|
||||
{ year: '2012', value: 8 },
|
||||
{ year: '2014', value: 10 },
|
||||
{ year: '2015', value: 5 }
|
||||
],
|
||||
xkey: 'year',
|
||||
ykeys: ['value'],
|
||||
resize: true,
|
||||
lineWidth:4,
|
||||
labels: ['Value'],
|
||||
lineColors: ['#1ab394'],
|
||||
pointSize:5,
|
||||
});
|
||||
|
||||
Morris.Area({
|
||||
element: 'morris-area-chart',
|
||||
data: [{
|
||||
period: '2010 Q1',
|
||||
iphone: 2666,
|
||||
ipad: null,
|
||||
itouch: 2647
|
||||
}, {
|
||||
period: '2010 Q2',
|
||||
iphone: 2778,
|
||||
ipad: 2294,
|
||||
itouch: 2441
|
||||
}, {
|
||||
period: '2010 Q3',
|
||||
iphone: 4912,
|
||||
ipad: 1969,
|
||||
itouch: 2501
|
||||
}, {
|
||||
period: '2010 Q4',
|
||||
iphone: 3767,
|
||||
ipad: 3597,
|
||||
itouch: 5689
|
||||
}, {
|
||||
period: '2011 Q1',
|
||||
iphone: 6810,
|
||||
ipad: 1914,
|
||||
itouch: 2293
|
||||
}, {
|
||||
period: '2011 Q2',
|
||||
iphone: 5670,
|
||||
ipad: 4293,
|
||||
itouch: 1881
|
||||
}, {
|
||||
period: '2011 Q3',
|
||||
iphone: 4820,
|
||||
ipad: 3795,
|
||||
itouch: 1588
|
||||
}, {
|
||||
period: '2011 Q4',
|
||||
iphone: 15073,
|
||||
ipad: 5967,
|
||||
itouch: 5175
|
||||
}, {
|
||||
period: '2012 Q1',
|
||||
iphone: 10687,
|
||||
ipad: 4460,
|
||||
itouch: 2028
|
||||
}, {
|
||||
period: '2012 Q2',
|
||||
iphone: 8432,
|
||||
ipad: 5713,
|
||||
itouch: 1791
|
||||
}],
|
||||
xkey: 'period',
|
||||
ykeys: ['iphone', 'ipad', 'itouch'],
|
||||
labels: ['iPhone', 'iPad', 'iPod Touch'],
|
||||
pointSize: 2,
|
||||
hideHover: 'auto',
|
||||
resize: true,
|
||||
lineColors: ['#87d6c6', '#54cdb4','#1ab394'],
|
||||
lineWidth:2,
|
||||
pointSize:1,
|
||||
});
|
||||
|
||||
Morris.Donut({
|
||||
element: 'morris-donut-chart',
|
||||
data: [{
|
||||
label: "A系列",
|
||||
value: 12
|
||||
}, {
|
||||
label: "B系列",
|
||||
value: 30
|
||||
}, {
|
||||
label: "C系列",
|
||||
value: 20
|
||||
}],
|
||||
resize: true,
|
||||
colors: ['#87d6c6', '#54cdb4','#1ab394'],
|
||||
});
|
||||
|
||||
Morris.Bar({
|
||||
element: 'morris-bar-chart',
|
||||
data: [{
|
||||
y: '2006',
|
||||
a: 60,
|
||||
b: 50
|
||||
}, {
|
||||
y: '2007',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2008',
|
||||
a: 50,
|
||||
b: 40
|
||||
}, {
|
||||
y: '2009',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2010',
|
||||
a: 50,
|
||||
b: 40
|
||||
}, {
|
||||
y: '2011',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2012',
|
||||
a: 100,
|
||||
b: 90
|
||||
}],
|
||||
xkey: 'y',
|
||||
ykeys: ['a', 'b'],
|
||||
labels: ['A系列', 'B系列'],
|
||||
hideHover: 'auto',
|
||||
resize: true,
|
||||
barColors: ['#1ab394', '#cacaca'],
|
||||
});
|
||||
|
||||
Morris.Line({
|
||||
element: 'morris-line-chart',
|
||||
data: [{
|
||||
y: '2006',
|
||||
a: 100,
|
||||
b: 90
|
||||
}, {
|
||||
y: '2007',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2008',
|
||||
a: 50,
|
||||
b: 40
|
||||
}, {
|
||||
y: '2009',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2010',
|
||||
a: 50,
|
||||
b: 40
|
||||
}, {
|
||||
y: '2011',
|
||||
a: 75,
|
||||
b: 65
|
||||
}, {
|
||||
y: '2012',
|
||||
a: 100,
|
||||
b: 90
|
||||
}],
|
||||
xkey: 'y',
|
||||
ykeys: ['a', 'b'],
|
||||
labels: ['A系列', 'B系列'],
|
||||
hideHover: 'auto',
|
||||
resize: true,
|
||||
lineColors: ['#54cdb4','#1ab394'],
|
||||
});
|
||||
|
||||
});
|
||||
33
public/assets/js/demo/peity-demo.js
Normal file
33
public/assets/js/demo/peity-demo.js
Normal file
@@ -0,0 +1,33 @@
|
||||
$(function() {
|
||||
$("span.pie").peity("pie", {
|
||||
fill: ['#1ab394', '#d7d7d7', '#ffffff']
|
||||
})
|
||||
|
||||
$(".line").peity("line",{
|
||||
fill: '#1ab394',
|
||||
stroke:'#169c81',
|
||||
})
|
||||
|
||||
$(".bar").peity("bar", {
|
||||
fill: ["#1ab394", "#d7d7d7"]
|
||||
})
|
||||
|
||||
$(".bar_dashboard").peity("bar", {
|
||||
fill: ["#1ab394", "#d7d7d7"],
|
||||
width:100
|
||||
})
|
||||
|
||||
var updatingChart = $(".updating-chart").peity("line", { fill: '#1ab394',stroke:'#169c81', width: 64 })
|
||||
|
||||
setInterval(function() {
|
||||
var random = Math.round(Math.random() * 10)
|
||||
var values = updatingChart.text().split(",")
|
||||
values.shift()
|
||||
values.push(random)
|
||||
|
||||
updatingChart
|
||||
.text(values.join(","))
|
||||
.change()
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
39
public/assets/js/demo/photos.json
Normal file
39
public/assets/js/demo/photos.json
Normal file
@@ -0,0 +1,39 @@
|
||||
{
|
||||
"status": 1,
|
||||
"msg": "",
|
||||
"title": "JSON请求的相册",
|
||||
"id": 8,
|
||||
"start": 0,
|
||||
"data": [
|
||||
{
|
||||
"name": "越来越喜欢观察微小的事物",
|
||||
"pid": 109,
|
||||
"src": "http://f8.topitme.com/8/99/b0/1100251118d0cb0998l.jpg",
|
||||
"thumb": "http://f8.topitme.com/8/99/b0/1100251118d0cb0998l.jpg",
|
||||
"area": [
|
||||
510,
|
||||
287
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "决定，意味着对与错的并存",
|
||||
"pid": 110,
|
||||
"src": "http://t.williamgates.net/image-9A50_54058FA3.jpg",
|
||||
"thumb": "http://t.williamgates.net/image-9A50_54058FA3.jpg",
|
||||
"area": [
|
||||
690,
|
||||
431
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "给人姐姐般温暖的的邻家女孩",
|
||||
"pid": 111,
|
||||
"src": "http://t.williamgates.net/image-E9BF_54058FA3.jpg",
|
||||
"thumb": "http://t.williamgates.net/image-E9BF_54058FA3.jpg",
|
||||
"area": [
|
||||
690,
|
||||
431
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
103
public/assets/js/demo/rickshaw-demo.js
Normal file
103
public/assets/js/demo/rickshaw-demo.js
Normal file
@@ -0,0 +1,103 @@
|
||||
$(function() {
|
||||
var graph = new Rickshaw.Graph( {
|
||||
element: document.querySelector("#chart"),
|
||||
series: [{
|
||||
color: '#1ab394',
|
||||
data: [
|
||||
{ x: 0, y: 40 },
|
||||
{ x: 1, y: 49 },
|
||||
{ x: 2, y: 38 },
|
||||
{ x: 3, y: 30 },
|
||||
{ x: 4, y: 32 } ]
|
||||
}]
|
||||
});
|
||||
graph.render();
|
||||
|
||||
var graph2 = new Rickshaw.Graph( {
|
||||
element: document.querySelector("#rickshaw_multi"),
|
||||
renderer: 'area',
|
||||
stroke: true,
|
||||
series: [ {
|
||||
data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 20 }, { x: 4, y: 16 } ],
|
||||
color: '#1ab394',
|
||||
stroke: '#17997f'
|
||||
}, {
|
||||
data: [ { x: 0, y: 22 }, { x: 1, y: 25 }, { x: 2, y: 38 }, { x: 3, y: 44 }, { x: 4, y: 46 } ],
|
||||
color: '#eeeeee',
|
||||
stroke: '#d7d7d7'
|
||||
} ]
|
||||
} );
|
||||
graph2.renderer.unstack = true;
|
||||
graph2.render();
|
||||
|
||||
var graph3 = new Rickshaw.Graph({
|
||||
element: document.querySelector("#rickshaw_line"),
|
||||
renderer: 'line',
|
||||
series: [ {
|
||||
data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 30 }, { x: 4, y: 32 } ],
|
||||
color: '#1ab394'
|
||||
} ]
|
||||
} );
|
||||
graph3.render();
|
||||
|
||||
var graph4 = new Rickshaw.Graph({
|
||||
element: document.querySelector("#rickshaw_multi_line"),
|
||||
renderer: 'line',
|
||||
series: [{
|
||||
data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 30 }, { x: 4, y: 32 } ],
|
||||
color: '#1ab394'
|
||||
}, {
|
||||
data: [ { x: 0, y: 20 }, { x: 1, y: 24 }, { x: 2, y: 19 }, { x: 3, y: 15 }, { x: 4, y: 16 } ],
|
||||
color: '#d7d7d7'
|
||||
}]
|
||||
});
|
||||
graph4.render();
|
||||
|
||||
var graph5 = new Rickshaw.Graph( {
|
||||
element: document.querySelector("#rickshaw_bars"),
|
||||
renderer: 'bar',
|
||||
series: [ {
|
||||
data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 30 }, { x: 4, y: 32 } ],
|
||||
color: '#1ab394'
|
||||
} ]
|
||||
} );
|
||||
graph5.render();
|
||||
|
||||
var graph6 = new Rickshaw.Graph( {
|
||||
element: document.querySelector("#rickshaw_bars_stacked"),
|
||||
renderer: 'bar',
|
||||
series: [
|
||||
{
|
||||
data: [ { x: 0, y: 40 }, { x: 1, y: 49 }, { x: 2, y: 38 }, { x: 3, y: 30 }, { x: 4, y: 32 } ],
|
||||
color: '#1ab394'
|
||||
}, {
|
||||
data: [ { x: 0, y: 20 }, { x: 1, y: 24 }, { x: 2, y: 19 }, { x: 3, y: 15 }, { x: 4, y: 16 } ],
|
||||
color: '#d7d7d7'
|
||||
} ]
|
||||
} );
|
||||
graph6.render();
|
||||
|
||||
var graph7 = new Rickshaw.Graph( {
|
||||
element: document.querySelector("#rickshaw_scatterplot"),
|
||||
renderer: 'scatterplot',
|
||||
stroke: true,
|
||||
padding: { top: 0.05, left: 0.05, right: 0.05 },
|
||||
series: [ {
|
||||
data: [ { x: 0, y: 15 },
|
||||
{ x: 1, y: 18 },
|
||||
{ x: 2, y: 10 },
|
||||
{ x: 3, y: 12 },
|
||||
{ x: 4, y: 15 },
|
||||
{ x: 5, y: 24 },
|
||||
{ x: 6, y: 28 },
|
||||
{ x: 7, y: 31 },
|
||||
{ x: 8, y: 22 },
|
||||
{ x: 9, y: 18 },
|
||||
{ x: 10, y: 16 }
|
||||
],
|
||||
color: '#1ab394'
|
||||
} ]
|
||||
} );
|
||||
graph7.render();
|
||||
|
||||
});
|
||||
51
public/assets/js/demo/sparkline-demo.js
Normal file
51
public/assets/js/demo/sparkline-demo.js
Normal file
@@ -0,0 +1,51 @@
|
||||
$(function () {
|
||||
$("#sparkline1").sparkline([34, 43, 43, 35, 44, 32, 44, 52, 25], {
|
||||
type: 'line',
|
||||
lineColor: '#17997f',
|
||||
fillColor: '#1ab394',
|
||||
});
|
||||
$("#sparkline2").sparkline([5, 6, 7, 2, 0, -4, -2, 4], {
|
||||
type: 'bar',
|
||||
barColor: '#1ab394',
|
||||
negBarColor: '#c6c6c6'});
|
||||
|
||||
$("#sparkline3").sparkline([1, 1, 2], {
|
||||
type: 'pie',
|
||||
sliceColors: ['#1ab394', '#b3b3b3', '#e4f0fb']});
|
||||
|
||||
$("#sparkline4").sparkline([34, 43, 43, 35, 44, 32, 15, 22, 46, 33, 86, 54, 73, 53, 12, 53, 23, 65, 23, 63, 53, 42, 34, 56, 76, 15, 54, 23, 44], {
|
||||
type: 'line',
|
||||
lineColor: '#17997f',
|
||||
fillColor: '#ffffff',
|
||||
});
|
||||
|
||||
$("#sparkline5").sparkline([1, 1, 0, 1, -1, -1, 1, -1, 0, 0, 1, 1], {
|
||||
type: 'tristate',
|
||||
posBarColor: '#1ab394',
|
||||
negBarColor: '#bfbfbf'});
|
||||
|
||||
|
||||
$("#sparkline6").sparkline([4, 6, 7, 7, 4, 3, 2, 1, 4, 4, 5, 6, 3, 4, 5, 8, 7, 6, 9, 3, 2, 4, 1, 5, 6, 4, 3, 7, ], {
|
||||
type: 'discrete',
|
||||
lineColor: '#1ab394'});
|
||||
|
||||
$("#sparkline7").sparkline([52, 12, 44], {
|
||||
type: 'pie',
|
||||
height: '150px',
|
||||
sliceColors: ['#1ab394', '#b3b3b3', '#e4f0fb']});
|
||||
|
||||
$("#sparkline8").sparkline([5, 6, 7, 2, 0, 4, 2, 4, 5, 7, 2, 4, 12, 14, 4, 2, 14, 12, 7], {
|
||||
type: 'bar',
|
||||
barWidth: 8,
|
||||
height: '150px',
|
||||
barColor: '#1ab394',
|
||||
negBarColor: '#c6c6c6'});
|
||||
|
||||
$("#sparkline9").sparkline([34, 43, 43, 35, 44, 32, 15, 22, 46, 33, 86, 54, 73, 53, 12, 53, 23, 65, 23, 63, 53, 42, 34, 56, 76, 15, 54, 23, 44], {
|
||||
type: 'line',
|
||||
lineWidth: 1,
|
||||
height: '150px',
|
||||
lineColor: '#17997f',
|
||||
fillColor: '#ffffff',
|
||||
});
|
||||
});
|
||||
36
public/assets/js/demo/table_base.json
Normal file
36
public/assets/js/demo/table_base.json
Normal file
@@ -0,0 +1,36 @@
|
||||
[{
|
||||
"Tid": "1",
|
||||
"First": "奔波儿灞",
|
||||
"sex": "男",
|
||||
"Score": "50"
|
||||
}, {
|
||||
"Tid": "2",
|
||||
"First": "灞波儿奔",
|
||||
"sex": "男",
|
||||
"Score": "94"
|
||||
}, {
|
||||
"Tid": "3",
|
||||
"First": "作家崔成浩",
|
||||
"sex": "男",
|
||||
"Score": "80"
|
||||
}, {
|
||||
"Tid": "4",
|
||||
"First": "韩寒",
|
||||
"sex": "男",
|
||||
"Score": "67"
|
||||
}, {
|
||||
"Tid": "5",
|
||||
"First": "郭敬明",
|
||||
"sex": "男",
|
||||
"Score": "100"
|
||||
}, {
|
||||
"Tid": "6",
|
||||
"First": "马云",
|
||||
"sex": "男",
|
||||
"Score": "77"
|
||||
}, {
|
||||
"Tid": "7",
|
||||
"First": "范爷",
|
||||
"sex": "女",
|
||||
"Score": "87"
|
||||
}]
|
||||
240
public/assets/js/demo/treeview-demo.js
Normal file
240
public/assets/js/demo/treeview-demo.js
Normal file
@@ -0,0 +1,240 @@
|
||||
$(function () {
|
||||
|
||||
var defaultData = [
|
||||
{
|
||||
text: '父节点 1',
|
||||
href: '#parent1',
|
||||
tags: ['4'],
|
||||
nodes: [
|
||||
{
|
||||
text: '子节点 1',
|
||||
href: '#child1',
|
||||
tags: ['2'],
|
||||
nodes: [
|
||||
{
|
||||
text: '孙子节点 1',
|
||||
href: '#grandchild1',
|
||||
tags: ['0']
|
||||
},
|
||||
{
|
||||
text: '孙子节点 2',
|
||||
href: '#grandchild2',
|
||||
tags: ['0']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
text: '子节点 2',
|
||||
href: '#child2',
|
||||
tags: ['0']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
text: '父节点 2',
|
||||
href: '#parent2',
|
||||
tags: ['0']
|
||||
},
|
||||
{
|
||||
text: '父节点 3',
|
||||
href: '#parent3',
|
||||
tags: ['0']
|
||||
},
|
||||
{
|
||||
text: '父节点 4',
|
||||
href: '#parent4',
|
||||
tags: ['0']
|
||||
},
|
||||
{
|
||||
text: '父节点 5',
|
||||
href: '#parent5',
|
||||
tags: ['0']
|
||||
}
|
||||
];
|
||||
|
||||
var alternateData = [
|
||||
{
|
||||
text: '父节点 1',
|
||||
tags: ['2'],
|
||||
nodes: [
|
||||
{
|
||||
text: '子节点 1',
|
||||
tags: ['3'],
|
||||
nodes: [
|
||||
{
|
||||
text: '孙子节点 1',
|
||||
tags: ['6']
|
||||
},
|
||||
{
|
||||
text: '孙子节点 2',
|
||||
tags: ['3']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
text: '子节点 2',
|
||||
tags: ['3']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
text: '父节点 2',
|
||||
tags: ['7']
|
||||
},
|
||||
{
|
||||
text: '父节点 3',
|
||||
icon: 'glyphicon glyphicon-earphone',
|
||||
href: '#demo',
|
||||
tags: ['11']
|
||||
},
|
||||
{
|
||||
text: '父节点 4',
|
||||
icon: 'glyphicon glyphicon-cloud-download',
|
||||
href: '/demo.html',
|
||||
tags: ['19'],
|
||||
selected: true
|
||||
},
|
||||
{
|
||||
text: '父节点 5',
|
||||
icon: 'glyphicon glyphicon-certificate',
|
||||
color: 'pink',
|
||||
backColor: 'red',
|
||||
href: 'http://www.tesco.com',
|
||||
tags: ['available', '0']
|
||||
}
|
||||
];
|
||||
|
||||
var json = '[' +
|
||||
'{' +
|
||||
'"text": "父节点 1",' +
|
||||
'"nodes": [' +
|
||||
'{' +
|
||||
'"text": "子节点 1",' +
|
||||
'"nodes": [' +
|
||||
'{' +
|
||||
'"text": "孙子节点 1"' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "孙子节点 2"' +
|
||||
'}' +
|
||||
']' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "子节点 2"' +
|
||||
'}' +
|
||||
']' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "父节点 2"' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "父节点 3"' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "父节点 4"' +
|
||||
'},' +
|
||||
'{' +
|
||||
'"text": "父节点 5"' +
|
||||
'}' +
|
||||
']';
|
||||
|
||||
|
||||
$('#treeview1').treeview({
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview2').treeview({
|
||||
levels: 1,
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview3').treeview({
|
||||
levels: 99,
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview4').treeview({
|
||||
|
||||
color: "#428bca",
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview5').treeview({
|
||||
color: "#428bca",
|
||||
expandIcon: 'glyphicon glyphicon-chevron-right',
|
||||
collapseIcon: 'glyphicon glyphicon-chevron-down',
|
||||
nodeIcon: 'glyphicon glyphicon-bookmark',
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview6').treeview({
|
||||
color: "#428bca",
|
||||
expandIcon: "glyphicon glyphicon-stop",
|
||||
collapseIcon: "glyphicon glyphicon-unchecked",
|
||||
nodeIcon: "glyphicon glyphicon-user",
|
||||
showTags: true,
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview7').treeview({
|
||||
color: "#428bca",
|
||||
showBorder: false,
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview8').treeview({
|
||||
expandIcon: "glyphicon glyphicon-stop",
|
||||
collapseIcon: "glyphicon glyphicon-unchecked",
|
||||
nodeIcon: "glyphicon glyphicon-user",
|
||||
color: "yellow",
|
||||
backColor: "purple",
|
||||
onhoverColor: "orange",
|
||||
borderColor: "red",
|
||||
showBorder: false,
|
||||
showTags: true,
|
||||
highlightSelected: true,
|
||||
selectedColor: "yellow",
|
||||
selectedBackColor: "darkorange",
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview9').treeview({
|
||||
expandIcon: "glyphicon glyphicon-stop",
|
||||
collapseIcon: "glyphicon glyphicon-unchecked",
|
||||
nodeIcon: "glyphicon glyphicon-user",
|
||||
color: "yellow",
|
||||
backColor: "purple",
|
||||
onhoverColor: "orange",
|
||||
borderColor: "red",
|
||||
showBorder: false,
|
||||
showTags: true,
|
||||
highlightSelected: true,
|
||||
selectedColor: "yellow",
|
||||
selectedBackColor: "darkorange",
|
||||
data: alternateData
|
||||
});
|
||||
|
||||
$('#treeview10').treeview({
|
||||
color: "#428bca",
|
||||
enableLinks: true,
|
||||
data: defaultData
|
||||
});
|
||||
|
||||
$('#treeview11').treeview({
|
||||
color: "#428bca",
|
||||
data: defaultData,
|
||||
onNodeSelected: function (event, node) {
|
||||
$('#event_output').prepend('<p>您单击了 ' + node.text + '</p>');
|
||||
}
|
||||
});
|
||||
|
||||
// $('#treeview11').on('nodeSelected', function (event, node) {
|
||||
// $('#event_output').prepend('<p>您单击了 ' + node.text + '</p>');
|
||||
// });
|
||||
|
||||
|
||||
$('#treeview12').treeview({
|
||||
data: json
|
||||
});
|
||||
|
||||
});
|
||||
438
public/assets/js/demo/webuploader-demo.js
Normal file
438
public/assets/js/demo/webuploader-demo.js
Normal file
@@ -0,0 +1,438 @@
|
||||
jQuery(function() {
|
||||
var $ = jQuery, // just in case. Make sure it's not an other libaray.
|
||||
|
||||
$wrap = $('#uploader'),
|
||||
|
||||
// 图片容器
|
||||
$queue = $('<ul class="filelist"></ul>')
|
||||
.appendTo( $wrap.find('.queueList') ),
|
||||
|
||||
// 状态栏，包括进度和控制按钮
|
||||
$statusBar = $wrap.find('.statusBar'),
|
||||
|
||||
// 文件总体选择信息。
|
||||
$info = $statusBar.find('.info'),
|
||||
|
||||
// 上传按钮
|
||||
$upload = $wrap.find('.uploadBtn'),
|
||||
|
||||
// 没选择文件之前的内容。
|
||||
$placeHolder = $wrap.find('.placeholder'),
|
||||
|
||||
// 总体进度条
|
||||
$progress = $statusBar.find('.progress').hide(),
|
||||
|
||||
// 添加的文件数量
|
||||
fileCount = 0,
|
||||
|
||||
// 添加的文件总大小
|
||||
fileSize = 0,
|
||||
|
||||
// 优化retina, 在retina下这个值是2
|
||||
ratio = window.devicePixelRatio || 1,
|
||||
|
||||
// 缩略图大小
|
||||
thumbnailWidth = 110 * ratio,
|
||||
thumbnailHeight = 110 * ratio,
|
||||
|
||||
// 可能有pedding, ready, uploading, confirm, done.
|
||||
state = 'pedding',
|
||||
|
||||
// 所有文件的进度信息，key为file id
|
||||
percentages = {},
|
||||
|
||||
supportTransition = (function(){
|
||||
var s = document.createElement('p').style,
|
||||
r = 'transition' in s ||
|
||||
'WebkitTransition' in s ||
|
||||
'MozTransition' in s ||
|
||||
'msTransition' in s ||
|
||||
'OTransition' in s;
|
||||
s = null;
|
||||
return r;
|
||||
})(),
|
||||
|
||||
// WebUploader实例
|
||||
uploader;
|
||||
|
||||
if ( !WebUploader.Uploader.support() ) {
|
||||
alert( 'Web Uploader 不支持您的浏览器！如果你使用的是IE浏览器，请尝试升级 flash 播放器');
|
||||
throw new Error( 'WebUploader does not support the browser you are using.' );
|
||||
}
|
||||
|
||||
// 实例化
|
||||
uploader = WebUploader.create({
|
||||
pick: {
|
||||
id: '#filePicker',
|
||||
label: '点击选择图片'
|
||||
},
|
||||
dnd: '#uploader .queueList',
|
||||
paste: document.body,
|
||||
|
||||
accept: {
|
||||
title: 'Images',
|
||||
extensions: 'gif,jpg,jpeg,bmp,png',
|
||||
mimeTypes: 'image/*'
|
||||
},
|
||||
|
||||
// swf文件路径
|
||||
swf: BASE_URL + '/Uploader.swf',
|
||||
|
||||
disableGlobalDnd: true,
|
||||
|
||||
chunked: true,
|
||||
// server: 'http://webuploader.duapp.com/server/fileupload.php',
|
||||
server: 'http://2betop.net/fileupload.php',
|
||||
fileNumLimit: 300,
|
||||
fileSizeLimit: 5 * 1024 * 1024, // 200 M
|
||||
fileSingleSizeLimit: 1 * 1024 * 1024 // 50 M
|
||||
});
|
||||
|
||||
// 添加“添加文件”的按钮，
|
||||
uploader.addButton({
|
||||
id: '#filePicker2',
|
||||
label: '继续添加'
|
||||
});
|
||||
|
||||
// 当有文件添加进来时执行，负责view的创建
|
||||
function addFile( file ) {
|
||||
var $li = $( '<li id="' + file.id + '">' +
|
||||
'<p class="title">' + file.name + '</p>' +
|
||||
'<p class="imgWrap"></p>'+
|
||||
'<p class="progress"><span></span></p>' +
|
||||
'</li>' ),
|
||||
|
||||
$btns = $('<div class="file-panel">' +
|
||||
'<span class="cancel">删除</span>' +
|
||||
'<span class="rotateRight">向右旋转</span>' +
|
||||
'<span class="rotateLeft">向左旋转</span></div>').appendTo( $li ),
|
||||
$prgress = $li.find('p.progress span'),
|
||||
$wrap = $li.find( 'p.imgWrap' ),
|
||||
$info = $('<p class="error"></p>'),
|
||||
|
||||
showError = function( code ) {
|
||||
switch( code ) {
|
||||
case 'exceed_size':
|
||||
text = '文件大小超出';
|
||||
break;
|
||||
|
||||
case 'interrupt':
|
||||
text = '上传暂停';
|
||||
break;
|
||||
|
||||
default:
|
||||
text = '上传失败，请重试';
|
||||
break;
|
||||
}
|
||||
|
||||
$info.text( text ).appendTo( $li );
|
||||
};
|
||||
|
||||
if ( file.getStatus() === 'invalid' ) {
|
||||
showError( file.statusText );
|
||||
} else {
|
||||
// @todo lazyload
|
||||
$wrap.text( '预览中' );
|
||||
uploader.makeThumb( file, function( error, src ) {
|
||||
if ( error ) {
|
||||
$wrap.text( '不能预览' );
|
||||
return;
|
||||
}
|
||||
|
||||
var img = $('<img src="'+src+'">');
|
||||
$wrap.empty().append( img );
|
||||
}, thumbnailWidth, thumbnailHeight );
|
||||
|
||||
percentages[ file.id ] = [ file.size, 0 ];
|
||||
file.rotation = 0;
|
||||
}
|
||||
|
||||
file.on('statuschange', function( cur, prev ) {
|
||||
if ( prev === 'progress' ) {
|
||||
$prgress.hide().width(0);
|
||||
} else if ( prev === 'queued' ) {
|
||||
$li.off( 'mouseenter mouseleave' );
|
||||
$btns.remove();
|
||||
}
|
||||
|
||||
// 成功
|
||||
if ( cur === 'error' || cur === 'invalid' ) {
|
||||
console.log( file.statusText );
|
||||
showError( file.statusText );
|
||||
percentages[ file.id ][ 1 ] = 1;
|
||||
} else if ( cur === 'interrupt' ) {
|
||||
showError( 'interrupt' );
|
||||
} else if ( cur === 'queued' ) {
|
||||
percentages[ file.id ][ 1 ] = 0;
|
||||
} else if ( cur === 'progress' ) {
|
||||
$info.remove();
|
||||
$prgress.css('display', 'block');
|
||||
} else if ( cur === 'complete' ) {
|
||||
$li.append( '<span class="success"></span>' );
|
||||
}
|
||||
|
||||
$li.removeClass( 'state-' + prev ).addClass( 'state-' + cur );
|
||||
});
|
||||
|
||||
$li.on( 'mouseenter', function() {
|
||||
$btns.stop().animate({height: 30});
|
||||
});
|
||||
|
||||
$li.on( 'mouseleave', function() {
|
||||
$btns.stop().animate({height: 0});
|
||||
});
|
||||
|
||||
$btns.on( 'click', 'span', function() {
|
||||
var index = $(this).index(),
|
||||
deg;
|
||||
|
||||
switch ( index ) {
|
||||
case 0:
|
||||
uploader.removeFile( file );
|
||||
return;
|
||||
|
||||
case 1:
|
||||
file.rotation += 90;
|
||||
break;
|
||||
|
||||
case 2:
|
||||
file.rotation -= 90;
|
||||
break;
|
||||
}
|
||||
|
||||
if ( supportTransition ) {
|
||||
deg = 'rotate(' + file.rotation + 'deg)';
|
||||
$wrap.css({
|
||||
'-webkit-transform': deg,
|
||||
'-mos-transform': deg,
|
||||
'-o-transform': deg,
|
||||
'transform': deg
|
||||
});
|
||||
} else {
|
||||
$wrap.css( 'filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation='+ (~~((file.rotation/90)%4 + 4)%4) +')');
|
||||
// use jquery animate to rotation
|
||||
// $({
|
||||
// rotation: rotation
|
||||
// }).animate({
|
||||
// rotation: file.rotation
|
||||
// }, {
|
||||
// easing: 'linear',
|
||||
// step: function( now ) {
|
||||
// now = now * Math.PI / 180;
|
||||
|
||||
// var cos = Math.cos( now ),
|
||||
// sin = Math.sin( now );
|
||||
|
||||
// $wrap.css( 'filter', "progid:DXImageTransform.Microsoft.Matrix(M11=" + cos + ",M12=" + (-sin) + ",M21=" + sin + ",M22=" + cos + ",SizingMethod='auto expand')");
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
$li.appendTo( $queue );
|
||||
}
|
||||
|
||||
// 负责view的销毁
|
||||
function removeFile( file ) {
|
||||
var $li = $('#'+file.id);
|
||||
|
||||
delete percentages[ file.id ];
|
||||
updateTotalProgress();
|
||||
$li.off().find('.file-panel').off().end().remove();
|
||||
}
|
||||
|
||||
function updateTotalProgress() {
|
||||
var loaded = 0,
|
||||
total = 0,
|
||||
spans = $progress.children(),
|
||||
percent;
|
||||
|
||||
$.each( percentages, function( k, v ) {
|
||||
total += v[ 0 ];
|
||||
loaded += v[ 0 ] * v[ 1 ];
|
||||
} );
|
||||
|
||||
percent = total ? loaded / total : 0;
|
||||
|
||||
spans.eq( 0 ).text( Math.round( percent * 100 ) + '%' );
|
||||
spans.eq( 1 ).css( 'width', Math.round( percent * 100 ) + '%' );
|
||||
updateStatus();
|
||||
}
|
||||
|
||||
function updateStatus() {
|
||||
var text = '', stats;
|
||||
|
||||
if ( state === 'ready' ) {
|
||||
text = '选中' + fileCount + '张图片，共' +
|
||||
WebUploader.formatSize( fileSize ) + '。';
|
||||
} else if ( state === 'confirm' ) {
|
||||
stats = uploader.getStats();
|
||||
if ( stats.uploadFailNum ) {
|
||||
text = '已成功上传' + stats.successNum+ '张照片至XX相册，'+
|
||||
stats.uploadFailNum + '张照片上传失败，<a class="retry" href="#">重新上传</a>失败图片或<a class="ignore" href="#">忽略</a>'
|
||||
}
|
||||
|
||||
} else {
|
||||
stats = uploader.getStats();
|
||||
text = '共' + fileCount + '张（' +
|
||||
WebUploader.formatSize( fileSize ) +
|
||||
'），已上传' + stats.successNum + '张';
|
||||
|
||||
if ( stats.uploadFailNum ) {
|
||||
text += '，失败' + stats.uploadFailNum + '张';
|
||||
}
|
||||
}
|
||||
|
||||
$info.html( text );
|
||||
}
|
||||
|
||||
function setState( val ) {
|
||||
var file, stats;
|
||||
|
||||
if ( val === state ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$upload.removeClass( 'state-' + state );
|
||||
$upload.addClass( 'state-' + val );
|
||||
state = val;
|
||||
|
||||
switch ( state ) {
|
||||
case 'pedding':
|
||||
$placeHolder.removeClass( 'element-invisible' );
|
||||
$queue.parent().removeClass('filled');
|
||||
$queue.hide();
|
||||
$statusBar.addClass( 'element-invisible' );
|
||||
uploader.refresh();
|
||||
break;
|
||||
|
||||
case 'ready':
|
||||
$placeHolder.addClass( 'element-invisible' );
|
||||
$( '#filePicker2' ).removeClass( 'element-invisible');
|
||||
$queue.parent().addClass('filled');
|
||||
$queue.show();
|
||||
$statusBar.removeClass('element-invisible');
|
||||
uploader.refresh();
|
||||
break;
|
||||
|
||||
case 'uploading':
|
||||
$( '#filePicker2' ).addClass( 'element-invisible' );
|
||||
$progress.show();
|
||||
$upload.text( '暂停上传' );
|
||||
break;
|
||||
|
||||
case 'paused':
|
||||
$progress.show();
|
||||
$upload.text( '继续上传' );
|
||||
break;
|
||||
|
||||
case 'confirm':
|
||||
$progress.hide();
|
||||
$upload.text( '开始上传' ).addClass( 'disabled' );
|
||||
|
||||
stats = uploader.getStats();
|
||||
if ( stats.successNum && !stats.uploadFailNum ) {
|
||||
setState( 'finish' );
|
||||
return;
|
||||
}
|
||||
break;
|
||||
case 'finish':
|
||||
stats = uploader.getStats();
|
||||
if ( stats.successNum ) {
|
||||
alert( '上传成功' );
|
||||
} else {
|
||||
// 没有成功的图片，重设
|
||||
state = 'done';
|
||||
location.reload();
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
updateStatus();
|
||||
}
|
||||
|
||||
uploader.onUploadProgress = function( file, percentage ) {
|
||||
var $li = $('#'+file.id),
|
||||
$percent = $li.find('.progress span');
|
||||
|
||||
$percent.css( 'width', percentage * 100 + '%' );
|
||||
percentages[ file.id ][ 1 ] = percentage;
|
||||
updateTotalProgress();
|
||||
};
|
||||
|
||||
uploader.onFileQueued = function( file ) {
|
||||
fileCount++;
|
||||
fileSize += file.size;
|
||||
|
||||
if ( fileCount === 1 ) {
|
||||
$placeHolder.addClass( 'element-invisible' );
|
||||
$statusBar.show();
|
||||
}
|
||||
|
||||
addFile( file );
|
||||
setState( 'ready' );
|
||||
updateTotalProgress();
|
||||
};
|
||||
|
||||
uploader.onFileDequeued = function( file ) {
|
||||
fileCount--;
|
||||
fileSize -= file.size;
|
||||
|
||||
if ( !fileCount ) {
|
||||
setState( 'pedding' );
|
||||
}
|
||||
|
||||
removeFile( file );
|
||||
updateTotalProgress();
|
||||
|
||||
};
|
||||
|
||||
uploader.on( 'all', function( type ) {
|
||||
var stats;
|
||||
switch( type ) {
|
||||
case 'uploadFinished':
|
||||
setState( 'confirm' );
|
||||
break;
|
||||
|
||||
case 'startUpload':
|
||||
setState( 'uploading' );
|
||||
break;
|
||||
|
||||
case 'stopUpload':
|
||||
setState( 'paused' );
|
||||
break;
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
uploader.onError = function( code ) {
|
||||
alert( 'Eroor: ' + code );
|
||||
};
|
||||
|
||||
$upload.on('click', function() {
|
||||
if ( $(this).hasClass( 'disabled' ) ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if ( state === 'ready' ) {
|
||||
uploader.upload();
|
||||
} else if ( state === 'paused' ) {
|
||||
uploader.upload();
|
||||
} else if ( state === 'uploading' ) {
|
||||
uploader.stop();
|
||||
}
|
||||
});
|
||||
|
||||
$info.on( 'click', '.retry', function() {
|
||||
uploader.retry();
|
||||
} );
|
||||
|
||||
$info.on( 'click', '.ignore', function() {
|
||||
alert( 'todo' );
|
||||
} );
|
||||
|
||||
$upload.addClass( 'state-' + state );
|
||||
updateTotalProgress();
|
||||
});
|
||||
Reference in New Issue
Block a user