Initial commit
3
.gitignore
vendored
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
internal_saves
|
||||||
|
media
|
||||||
|
*.sage.py
|
3
.idea/.gitignore
vendored
Executable file
|
@ -0,0 +1,3 @@
|
||||||
|
# Default ignored files
|
||||||
|
/shelf/
|
||||||
|
/workspace.xml
|
10
.idea/STARK-web.iml
Executable file
|
@ -0,0 +1,10 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<module type="PYTHON_MODULE" version="4">
|
||||||
|
<component name="NewModuleRootManager">
|
||||||
|
<content url="file://$MODULE_DIR$">
|
||||||
|
<excludeFolder url="file://$MODULE_DIR$/venv" />
|
||||||
|
</content>
|
||||||
|
<orderEntry type="inheritedJdk" />
|
||||||
|
<orderEntry type="sourceFolder" forTests="false" />
|
||||||
|
</component>
|
||||||
|
</module>
|
5
.idea/codeStyles/codeStyleConfig.xml
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
<component name="ProjectCodeStyleConfiguration">
|
||||||
|
<state>
|
||||||
|
<option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
|
||||||
|
</state>
|
||||||
|
</component>
|
6
.idea/inspectionProfiles/profiles_settings.xml
Executable file
|
@ -0,0 +1,6 @@
|
||||||
|
<component name="InspectionProjectProfileManager">
|
||||||
|
<settings>
|
||||||
|
<option name="USE_PROJECT_PROFILE" value="false" />
|
||||||
|
<version value="1.0" />
|
||||||
|
</settings>
|
||||||
|
</component>
|
10
.idea/misc.xml
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="Black">
|
||||||
|
<option name="sdkName" value="Python 3.10 (STARK-web)" />
|
||||||
|
</component>
|
||||||
|
<component name="ProjectRootManager" version="2" project-jdk-name="Python 3.10 (STARK-web)" project-jdk-type="Python SDK" />
|
||||||
|
<component name="PyCharmProfessionalAdvertiser">
|
||||||
|
<option name="shown" value="true" />
|
||||||
|
</component>
|
||||||
|
</project>
|
8
.idea/modules.xml
Executable file
|
@ -0,0 +1,8 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="ProjectModuleManager">
|
||||||
|
<modules>
|
||||||
|
<module fileurl="file://$PROJECT_DIR$/.idea/STARK-web.iml" filepath="$PROJECT_DIR$/.idea/STARK-web.iml" />
|
||||||
|
</modules>
|
||||||
|
</component>
|
||||||
|
</project>
|
BIN
__pycache__/app.cpython-310.pyc
Normal file
198
app.py
Executable file
|
@ -0,0 +1,198 @@
|
||||||
|
import configparser
|
||||||
|
import os
|
||||||
|
|
||||||
|
import requests
|
||||||
|
from flask import Flask, render_template, request, send_file
|
||||||
|
from werkzeug.utils import secure_filename
|
||||||
|
|
||||||
|
from stark import run
|
||||||
|
|
||||||
|
app = Flask(__name__)
|
||||||
|
UPLOAD_FOLDER = 'uploads'
|
||||||
|
ALLOWED_EXTENSIONS = {'conllu'}
|
||||||
|
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
|
||||||
|
|
||||||
|
|
||||||
|
def create_default_configs():
|
||||||
|
configs = {}
|
||||||
|
# mandatory parameters
|
||||||
|
configs['input_path'] = 'data/sl_ssj-ud_v2.4.conllu'
|
||||||
|
configs['output'] = 'results/out_official.tsv'
|
||||||
|
configs['tree_size'] = '2-4'
|
||||||
|
configs['node_type'] = 'upos'
|
||||||
|
|
||||||
|
# mandatory parameters with default value
|
||||||
|
configs['internal_saves'] = './internal_saves'
|
||||||
|
configs['cpu_cores'] = 12
|
||||||
|
configs['complete_tree_type'] = True
|
||||||
|
configs['dependency_type'] = True
|
||||||
|
configs['node_order'] = True
|
||||||
|
configs['association_measures'] = False
|
||||||
|
|
||||||
|
configs['label_whitelist'] = []
|
||||||
|
configs['root_whitelist'] = []
|
||||||
|
|
||||||
|
configs['query'] = None
|
||||||
|
|
||||||
|
configs['compare'] = None
|
||||||
|
|
||||||
|
configs['frequency_threshold'] = 0
|
||||||
|
configs['lines_threshold'] = None
|
||||||
|
|
||||||
|
configs['continuation_processing'] = False
|
||||||
|
|
||||||
|
configs['nodes_number'] = True
|
||||||
|
configs['print_root'] = True
|
||||||
|
|
||||||
|
if configs['compare'] is not None:
|
||||||
|
configs['other_input_path'] = configs['compare']
|
||||||
|
return configs
|
||||||
|
|
||||||
|
|
||||||
|
def allowed_file(filename):
|
||||||
|
return '.' in filename and \
|
||||||
|
filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS
|
||||||
|
|
||||||
|
@app.route('/upload')
|
||||||
|
def upload_file2():
|
||||||
|
return render_template('upload.html')
|
||||||
|
|
||||||
|
|
||||||
|
@app.route('/uploader', methods=['GET', 'POST'])
|
||||||
|
def upload_file():
|
||||||
|
if request.method == 'POST':
|
||||||
|
f = request.files['file']
|
||||||
|
f.save(secure_filename(f.filename))
|
||||||
|
return 'file uploaded successfully'
|
||||||
|
|
||||||
|
|
||||||
|
@app.route('/', methods=['GET', 'POST'])
|
||||||
|
def index():
|
||||||
|
if request.method == 'POST':
|
||||||
|
form = request.form
|
||||||
|
a = request
|
||||||
|
configs = {}
|
||||||
|
# mandatory parameters
|
||||||
|
configs['input_path'] = 'data/sl_ssj-ud_v2.4.conllu'
|
||||||
|
validation = {}
|
||||||
|
|
||||||
|
|
||||||
|
# handling input
|
||||||
|
if 'file' in request.files and request.files['file']:
|
||||||
|
# TODO ADD OPTION FOR MULTIPLE FILES - ZIP!
|
||||||
|
# store file
|
||||||
|
f = request.files['file']
|
||||||
|
input_path = os.path.join('media', secure_filename(f.filename))
|
||||||
|
f.save(input_path)
|
||||||
|
|
||||||
|
configs['input_path'] = input_path
|
||||||
|
|
||||||
|
if 'input_url' in form and form['input_url']:
|
||||||
|
validation['file'] = 'Please insert either input url or file, not both of them.'
|
||||||
|
validation['input_url'] = 'Please insert either input url or file, not both of them.'
|
||||||
|
# TODO OPTIONALLY ADD conllu FILE CHECK
|
||||||
|
elif 'input_url' in form and form['input_url']:
|
||||||
|
try:
|
||||||
|
input_path = os.path.join('media', 'input.conllu')
|
||||||
|
response = requests.get(form['input_url'])
|
||||||
|
open(input_path, "wb").write(response.content)
|
||||||
|
configs['input_path'] = input_path
|
||||||
|
except:
|
||||||
|
validation['input_url'] = 'Incorrect URL!'
|
||||||
|
else:
|
||||||
|
validation['file'] = 'Please insert either input url or provide a file.'
|
||||||
|
validation['input_url'] = 'Please insert either input url or provide a file.'
|
||||||
|
|
||||||
|
tree_size_min = None
|
||||||
|
if 'tree_size_min' in form:
|
||||||
|
tree_size_min = form['tree_size_min']
|
||||||
|
|
||||||
|
tree_size_max = None
|
||||||
|
if 'tree_size_max' in form:
|
||||||
|
tree_size_max = form['tree_size_max']
|
||||||
|
|
||||||
|
def validate_tree_size(tree_size_min, tree_size_max):
|
||||||
|
if tree_size_min is None or tree_size_max is None:
|
||||||
|
validation['tree_size'] = 'Please provide information about minimum and maximum tree size.'
|
||||||
|
return False
|
||||||
|
|
||||||
|
if int(tree_size_min) > int(tree_size_max):
|
||||||
|
validation['tree_size'] = 'Tree size minimum should be smaller than tree size maximum.'
|
||||||
|
return False
|
||||||
|
return True
|
||||||
|
|
||||||
|
if validate_tree_size(tree_size_min, tree_size_max):
|
||||||
|
configs['tree_size'] = f'{tree_size_min}-{tree_size_max}' if tree_size_min != tree_size_max else f'{tree_size_min}'
|
||||||
|
|
||||||
|
def validate_node_type(node_type):
|
||||||
|
# TODO EXPAND NODE TYPE
|
||||||
|
node_type_options = {'upos', 'form', 'lemma', 'upos', 'xpos', 'feats', 'deprel'}
|
||||||
|
if len(node_type) == 0:
|
||||||
|
validation['node_type'] = 'Please provide information about node type.'
|
||||||
|
return False
|
||||||
|
|
||||||
|
for el in node_type:
|
||||||
|
if el not in node_type_options:
|
||||||
|
validation['node_type'] = f'Node option {el} is not supported. Please enter valid options.'
|
||||||
|
return False
|
||||||
|
|
||||||
|
return True
|
||||||
|
|
||||||
|
# TODO radio button (maybe checkbutton)
|
||||||
|
node_type = []
|
||||||
|
if 'node_type' in form:
|
||||||
|
node_type = form['node_type']
|
||||||
|
|
||||||
|
if validate_node_type(node_type):
|
||||||
|
configs['node_type'] = '+'.join(node_type)
|
||||||
|
|
||||||
|
# mandatory parameters with default value
|
||||||
|
configs['internal_saves'] = None
|
||||||
|
|
||||||
|
# TODO depends on computer
|
||||||
|
configs['cpu_cores'] = 12
|
||||||
|
|
||||||
|
# TODO FINALIZE THIS!
|
||||||
|
configs['complete_tree_type'] = True
|
||||||
|
configs['dependency_type'] = True
|
||||||
|
configs['node_order'] = True
|
||||||
|
configs['association_measures'] = False
|
||||||
|
|
||||||
|
configs['label_whitelist'] = []
|
||||||
|
configs['root_whitelist'] = []
|
||||||
|
|
||||||
|
configs['query'] = None
|
||||||
|
|
||||||
|
configs['compare'] = None
|
||||||
|
|
||||||
|
configs['frequency_threshold'] = 0
|
||||||
|
configs['lines_threshold'] = None
|
||||||
|
|
||||||
|
configs['continuation_processing'] = False
|
||||||
|
|
||||||
|
configs['nodes_number'] = True
|
||||||
|
configs['print_root'] = True
|
||||||
|
|
||||||
|
if configs['compare'] is not None:
|
||||||
|
configs['other_input_path'] = configs['compare']
|
||||||
|
|
||||||
|
########################################
|
||||||
|
#config = configparser.ConfigParser()
|
||||||
|
#config.read('config.ini')
|
||||||
|
|
||||||
|
# configs = read_configs(config, args)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
configs['output'] = os.path.join('media', 'result.tsv')
|
||||||
|
configs['complete_tree_type'] = form['complete'] == 'yes'
|
||||||
|
|
||||||
|
run(configs)
|
||||||
|
# TODO DELETE STORED FILE AFTER PROCESSING
|
||||||
|
return send_file(configs['output'], as_attachment=True)
|
||||||
|
# return render_template('index.html')
|
||||||
|
return render_template('index.html')
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
app.run(debug=True)
|
151
gui.py
Executable file
|
@ -0,0 +1,151 @@
|
||||||
|
# -*- coding: utf-8 -*-
|
||||||
|
import configparser
|
||||||
|
|
||||||
|
# Form implementation generated from reading ui file 'gui/designer/data.ui'
|
||||||
|
#
|
||||||
|
# Created by: PyQt5 UI code generator 5.15.4
|
||||||
|
#
|
||||||
|
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
|
||||||
|
# run again. Do not edit this file unless you know what you are doing.
|
||||||
|
|
||||||
|
|
||||||
|
from PyQt5 import QtCore, QtGui, QtWidgets
|
||||||
|
|
||||||
|
from stark import parse_args, read_configs, run
|
||||||
|
|
||||||
|
|
||||||
|
def create_default_configs():
|
||||||
|
configs = {}
|
||||||
|
# mandatory parameters
|
||||||
|
configs['input'] = 'data/sl_ssj-ud_v2.4.conllu'
|
||||||
|
configs['input_path'] = 'data/sl_ssj-ud_v2.4.conllu'
|
||||||
|
configs['output'] = 'results/out_official.tsv'
|
||||||
|
configs['tree_size'] = '2-4'
|
||||||
|
configs['node_type'] = 'upos'
|
||||||
|
|
||||||
|
# mandatory parameters with default value
|
||||||
|
configs['internal_saves'] = './internal_saves'
|
||||||
|
configs['cpu_cores'] = 12
|
||||||
|
configs['complete_tree_type'] = True
|
||||||
|
configs['dependency_type'] = True
|
||||||
|
configs['node_order'] = True
|
||||||
|
configs['association_measures'] = False
|
||||||
|
|
||||||
|
configs['label_whitelist'] = []
|
||||||
|
configs['root_whitelist'] = []
|
||||||
|
|
||||||
|
configs['query'] = None
|
||||||
|
|
||||||
|
configs['compare'] = None
|
||||||
|
|
||||||
|
configs['frequency_threshold'] = 0
|
||||||
|
configs['lines_threshold'] = None
|
||||||
|
|
||||||
|
configs['continuation_processing'] = False
|
||||||
|
|
||||||
|
configs['nodes_number'] = True
|
||||||
|
configs['print_root'] = True
|
||||||
|
|
||||||
|
if configs['compare'] is not None:
|
||||||
|
configs['other_input_path'] = configs['compare']
|
||||||
|
return configs
|
||||||
|
|
||||||
|
|
||||||
|
class Ui_STARK(object):
|
||||||
|
def setupUi(self, STARK):
|
||||||
|
self.fixed = True
|
||||||
|
|
||||||
|
STARK.setObjectName("STARK")
|
||||||
|
STARK.resize(800, 600)
|
||||||
|
self.buttonBox = QtWidgets.QDialogButtonBox(STARK)
|
||||||
|
self.buttonBox.setGeometry(QtCore.QRect(430, 540, 341, 32))
|
||||||
|
self.buttonBox.setOrientation(QtCore.Qt.Horizontal)
|
||||||
|
self.buttonBox.setStandardButtons(QtWidgets.QDialogButtonBox.Cancel|QtWidgets.QDialogButtonBox.Ok)
|
||||||
|
self.buttonBox.setObjectName("buttonBox")
|
||||||
|
self.formLayoutWidget = QtWidgets.QWidget(STARK)
|
||||||
|
self.formLayoutWidget.setGeometry(QtCore.QRect(30, 30, 741, 481))
|
||||||
|
self.formLayoutWidget.setObjectName("formLayoutWidget")
|
||||||
|
self.formLayout = QtWidgets.QFormLayout(self.formLayoutWidget)
|
||||||
|
self.formLayout.setContentsMargins(0, 0, 0, 0)
|
||||||
|
self.formLayout.setObjectName("formLayout")
|
||||||
|
self.label = QtWidgets.QLabel(self.formLayoutWidget)
|
||||||
|
self.label.setObjectName("label")
|
||||||
|
self.formLayout.setWidget(0, QtWidgets.QFormLayout.LabelRole, self.label)
|
||||||
|
self.textEdit = QtWidgets.QTextEdit(self.formLayoutWidget)
|
||||||
|
self.textEdit.setObjectName("textEdit")
|
||||||
|
self.formLayout.setWidget(0, QtWidgets.QFormLayout.FieldRole, self.textEdit)
|
||||||
|
self.label_2 = QtWidgets.QLabel(self.formLayoutWidget)
|
||||||
|
self.label_2.setObjectName("label_2")
|
||||||
|
self.formLayout.setWidget(1, QtWidgets.QFormLayout.LabelRole, self.label_2)
|
||||||
|
self.textEdit_2 = QtWidgets.QTextEdit(self.formLayoutWidget)
|
||||||
|
self.textEdit_2.setObjectName("textEdit_2")
|
||||||
|
self.formLayout.setWidget(1, QtWidgets.QFormLayout.FieldRole, self.textEdit_2)
|
||||||
|
self.label_3 = QtWidgets.QLabel(self.formLayoutWidget)
|
||||||
|
self.label_3.setObjectName("label_3")
|
||||||
|
self.formLayout.setWidget(2, QtWidgets.QFormLayout.LabelRole, self.label_3)
|
||||||
|
self.verticalLayout = QtWidgets.QVBoxLayout()
|
||||||
|
self.verticalLayout.setObjectName("verticalLayout")
|
||||||
|
self.radioButton = QtWidgets.QRadioButton(self.formLayoutWidget)
|
||||||
|
self.radioButton.setObjectName("radioButton")
|
||||||
|
self.radioButton.setChecked(True)
|
||||||
|
self.radioButton.clicked.connect(self.fixed_click_on)
|
||||||
|
self.verticalLayout.addWidget(self.radioButton)
|
||||||
|
self.radioButton_2 = QtWidgets.QRadioButton(self.formLayoutWidget)
|
||||||
|
self.radioButton_2.setObjectName("radioButton_2")
|
||||||
|
self.radioButton_2.clicked.connect(self.fixed_click_off)
|
||||||
|
self.verticalLayout.addWidget(self.radioButton_2)
|
||||||
|
self.formLayout.setLayout(2, QtWidgets.QFormLayout.FieldRole, self.verticalLayout)
|
||||||
|
self.label_4 = QtWidgets.QLabel(self.formLayoutWidget)
|
||||||
|
self.label_4.setObjectName("label_4")
|
||||||
|
self.formLayout.setWidget(3, QtWidgets.QFormLayout.LabelRole, self.label_4)
|
||||||
|
|
||||||
|
self.retranslateUi(STARK)
|
||||||
|
self.buttonBox.accepted.connect(self.process)
|
||||||
|
#self.buttonBox.rejected.connect(self.process)
|
||||||
|
self.buttonBox.rejected.connect(STARK.reject)
|
||||||
|
QtCore.QMetaObject.connectSlotsByName(STARK)
|
||||||
|
|
||||||
|
def fixed_click_on(self):
|
||||||
|
self.fixed = True
|
||||||
|
|
||||||
|
def fixed_click_off(self):
|
||||||
|
self.fixed = False
|
||||||
|
|
||||||
|
def retranslateUi(self, STARK):
|
||||||
|
_translate = QtCore.QCoreApplication.translate
|
||||||
|
STARK.setWindowTitle(_translate("STARK", "Dialog"))
|
||||||
|
self.label.setText(_translate("STARK", "Input"))
|
||||||
|
self.label_2.setText(_translate("STARK", "Output"))
|
||||||
|
self.label_3.setText(_translate("STARK", "Fixed"))
|
||||||
|
self.radioButton.setText(_translate("STARK", "Yes"))
|
||||||
|
self.radioButton_2.setText(_translate("STARK", "No"))
|
||||||
|
|
||||||
|
def process(self):
|
||||||
|
config = configparser.ConfigParser()
|
||||||
|
config.read('config.ini')
|
||||||
|
|
||||||
|
#configs = read_configs(config, args)
|
||||||
|
configs = create_default_configs()
|
||||||
|
|
||||||
|
input_path = self.textEdit.toPlainText()
|
||||||
|
output_path = self.textEdit_2.toPlainText()
|
||||||
|
|
||||||
|
fixed = self.fixed
|
||||||
|
|
||||||
|
configs['input'] = configs['input'] if not input_path else input_path
|
||||||
|
configs['input_path'] = configs['input_path'] if not input_path else input_path
|
||||||
|
configs['output'] = configs['output'] if not output_path else output_path
|
||||||
|
configs['node_order'] = configs['node_order'] if not fixed else fixed
|
||||||
|
|
||||||
|
run(configs)
|
||||||
|
print('DONE!')
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
import sys
|
||||||
|
app = QtWidgets.QApplication(sys.argv)
|
||||||
|
STARK = QtWidgets.QDialog()
|
||||||
|
ui = Ui_STARK()
|
||||||
|
ui.setupUi(STARK)
|
||||||
|
STARK.show()
|
||||||
|
sys.exit(app.exec_())
|
14
requirements.txt
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
blinker==1.6.2
|
||||||
|
certifi==2023.7.22
|
||||||
|
charset-normalizer==3.3.0
|
||||||
|
click==8.1.7
|
||||||
|
Flask==3.0.0
|
||||||
|
idna==3.4
|
||||||
|
itsdangerous==2.1.2
|
||||||
|
Jinja2==3.1.2
|
||||||
|
MarkupSafe==2.1.3
|
||||||
|
pyconll==3.2.0
|
||||||
|
requests==2.31.0
|
||||||
|
stark @ git+https://github.com/clarinsi/STARK@f6c7f810979c55f96b8dac111bf2017c0dd58429
|
||||||
|
urllib3==2.0.6
|
||||||
|
Werkzeug==3.0.0
|
21
static/LICENSE
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2014-2018 Materialize
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
91
static/README.md
Normal file
|
@ -0,0 +1,91 @@
|
||||||
|
<p align="center">
|
||||||
|
<a href="http://materializecss.com/">
|
||||||
|
<img src="http://materializecss.com/res/materialize.svg" width="150">
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h3 align="center">MaterializeCSS</h3>
|
||||||
|
|
||||||
|
<p align="center">
|
||||||
|
Materialize, a CSS Framework based on material design.
|
||||||
|
<br>
|
||||||
|
<a href="http://materializecss.com/"><strong>-- Browse the docs --</strong></a>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<a href="https://travis-ci.org/Dogfalo/materialize">
|
||||||
|
<img src="https://travis-ci.org/Dogfalo/materialize.svg?branch=master" alt="Travis CI badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://badge.fury.io/js/materialize-css">
|
||||||
|
<img src="https://badge.fury.io/js/materialize-css.svg" alt="npm version badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://cdnjs.com/libraries/materialize">
|
||||||
|
<img src="https://img.shields.io/cdnjs/v/materialize.svg" alt="CDNJS version badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://david-dm.org/Dogfalo/materialize">
|
||||||
|
<img src="https://david-dm.org/Dogfalo/materialize/status.svg" alt="dependencies Status badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://david-dm.org/Dogfalo/materialize#info=devDependencies">
|
||||||
|
<img src="https://david-dm.org/Dogfalo/materialize/dev-status.svg" alt="devDependency Status badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://gitter.im/Dogfalo/materialize">
|
||||||
|
<img src="https://badges.gitter.im/Join%20Chat.svg" alt="Gitter badge">
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
## Table of Contents
|
||||||
|
- [Quickstart](#quickstart)
|
||||||
|
- [Documentation](#documentation)
|
||||||
|
- [Supported Browsers](#supported-browsers)
|
||||||
|
- [Changelog](#changelog)
|
||||||
|
- [Testing](#testing)
|
||||||
|
- [Contributing](#contributing)
|
||||||
|
- [Copyright and license](#copyright-and-license)
|
||||||
|
|
||||||
|
## Quickstart:
|
||||||
|
Read the [getting started guide](http://materializecss.com/getting-started.html) for more information on how to use materialize.
|
||||||
|
|
||||||
|
- [Download the latest release](https://github.com/Dogfalo/materialize/releases/latest) of materialize directly from GitHub. ([Beta](https://github.com/Dogfalo/materialize/releases/))
|
||||||
|
- Clone the repo: `git clone https://github.com/Dogfalo/materialize.git` (Beta: `git clone -b v1-dev https://github.com/Dogfalo/materialize.git`)
|
||||||
|
- Include the files via [cdnjs](https://cdnjs.com/libraries/materialize). More [here](http://materializecss.com/getting-started.html). ([Beta](https://cdnjs.com/libraries/materialize/1.0.0-beta))
|
||||||
|
- Install with [npm](https://www.npmjs.com): `npm install materialize-css` (Beta: `npm install materialize-css@next`)
|
||||||
|
- Install with [Bower](https://bower.io): `bower install materialize` ([DEPRECATED](https://bower.io/blog/2017/how-to-migrate-away-from-bower/))
|
||||||
|
- Install with [Atmosphere](https://atmospherejs.com): `meteor add materialize:materialize` (Beta: `meteor add materialize:materialize@=1.0.0-beta`)
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
The documentation can be found at <http://materializecss.com>. To run the documentation locally on your machine, you need [Node.js](https://nodejs.org/en/) installed on your computer.
|
||||||
|
|
||||||
|
### Running documentation locally
|
||||||
|
Run these commands to set up the documentation:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone https://github.com/Dogfalo/materialize
|
||||||
|
cd materialize
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
Then run `grunt monitor` to compile the documentation. When it finishes, open a new browser window and navigate to `localhost:8000`. We use [BrowserSync](https://www.browsersync.io/) to display the documentation.
|
||||||
|
|
||||||
|
### Documentation for previous releases
|
||||||
|
Previous releases and their documentation are available for [download](https://github.com/Dogfalo/materialize/releases).
|
||||||
|
|
||||||
|
## Supported Browsers:
|
||||||
|
Materialize is compatible with:
|
||||||
|
|
||||||
|
- Chrome 35+
|
||||||
|
- Firefox 31+
|
||||||
|
- Safari 9+
|
||||||
|
- Opera
|
||||||
|
- Edge
|
||||||
|
- IE 11+
|
||||||
|
|
||||||
|
## Changelog
|
||||||
|
For changelogs, check out [the Releases section of materialize](https://github.com/Dogfalo/materialize/releases) or the [CHANGELOG.md](CHANGELOG.md).
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
We use Jasmine as our testing framework and we're trying to write a robust test suite for our components. If you want to help, [here's a starting guide on how to write tests in Jasmine](CONTRIBUTING.md#jasmine-testing-guide).
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
Check out the [CONTRIBUTING document](CONTRIBUTING.md) in the root of the repository to learn how you can contribute. You can also browse the [help-wanted](https://github.com/Dogfalo/materialize/labels/help-wanted) tag in our issue tracker to find things to do.
|
||||||
|
|
||||||
|
## Copyright and license
|
||||||
|
Code Copyright 2018 Materialize. Code released under the MIT license.
|
9067
static/css/materialize.css
vendored
Normal file
13
static/css/materialize.min.css
vendored
Normal file
406
static/css/nouislider.css
Normal file
|
@ -0,0 +1,406 @@
|
||||||
|
/*!
|
||||||
|
* Materialize v0.100.2 (http://materializecss.com)
|
||||||
|
* Copyright 2014-2015 Materialize
|
||||||
|
* MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*! nouislider - 9.1.0 - 2016-12-10 16:00:32 */
|
||||||
|
|
||||||
|
|
||||||
|
/* Functional styling;
|
||||||
|
* These styles are required for noUiSlider to function.
|
||||||
|
* You don't need to change these rules to apply your design.
|
||||||
|
*/
|
||||||
|
.noUi-target,
|
||||||
|
.noUi-target * {
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-ms-touch-action: none;
|
||||||
|
touch-action: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.noUi-target {
|
||||||
|
position: relative;
|
||||||
|
direction: ltr;
|
||||||
|
}
|
||||||
|
.noUi-base {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1; /* Fix 401 */
|
||||||
|
}
|
||||||
|
.noUi-connect {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
.noUi-origin {
|
||||||
|
position: absolute;
|
||||||
|
height: 0;
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
.noUi-handle {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.noUi-state-tap .noUi-connect,
|
||||||
|
.noUi-state-tap .noUi-origin {
|
||||||
|
-webkit-transition: top 0.25s, right 0.25s, bottom 0.25s, left 0.25s;
|
||||||
|
transition: top 0.25s, right 0.25s, bottom 0.25s, left 0.25s;
|
||||||
|
}
|
||||||
|
.noUi-state-drag * {
|
||||||
|
cursor: inherit !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-handle-touch-area{
|
||||||
|
position: relative;
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
left: -15px;
|
||||||
|
top: -15px;
|
||||||
|
}
|
||||||
|
/* Painting and performance;
|
||||||
|
* Browsers can paint handles in their own layer.
|
||||||
|
*/
|
||||||
|
.noUi-base,
|
||||||
|
.noUi-handle {
|
||||||
|
-webkit-transform: translate3d(0,0,0);
|
||||||
|
transform: translate3d(0,0,0);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Slider size and handle placement;
|
||||||
|
*/
|
||||||
|
.noUi-horizontal {
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
.noUi-horizontal .noUi-handle {
|
||||||
|
width: 34px;
|
||||||
|
height: 28px;
|
||||||
|
left: -17px;
|
||||||
|
top: -6px;
|
||||||
|
}
|
||||||
|
.noUi-vertical {
|
||||||
|
width: 18px;
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-handle {
|
||||||
|
width: 28px;
|
||||||
|
height: 34px;
|
||||||
|
left: -6px;
|
||||||
|
top: -17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Styling;
|
||||||
|
*/
|
||||||
|
.noUi-target {
|
||||||
|
background: #cdcdcd;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
}
|
||||||
|
.noUi-connect {
|
||||||
|
background: #26A69A;
|
||||||
|
-webkit-transition: background 450ms;
|
||||||
|
transition: background 450ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Handles and cursors;
|
||||||
|
*/
|
||||||
|
.noUi-draggable {
|
||||||
|
cursor: ew-resize;
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-draggable {
|
||||||
|
cursor: ns-resize;
|
||||||
|
}
|
||||||
|
.noUi-handle {
|
||||||
|
border: 1px solid #D9D9D9;
|
||||||
|
border-radius: 3px;
|
||||||
|
background: #FFF;
|
||||||
|
cursor: default;
|
||||||
|
box-shadow: inset 0 0 1px #FFF,
|
||||||
|
inset 0 1px 7px #EBEBEB,
|
||||||
|
0 3px 6px -3px #BBB;
|
||||||
|
}
|
||||||
|
.noUi-active {
|
||||||
|
box-shadow: inset 0 0 1px #FFF,
|
||||||
|
inset 0 1px 7px #DDD,
|
||||||
|
0 3px 6px -3px #BBB;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Handle stripes
|
||||||
|
*/
|
||||||
|
.noUi-handle:before,
|
||||||
|
.noUi-handle:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
height: 14px;
|
||||||
|
width: 1px;
|
||||||
|
background: #E8E7E6;
|
||||||
|
left: 14px;
|
||||||
|
top: 6px;
|
||||||
|
}
|
||||||
|
.noUi-handle:after {
|
||||||
|
left: 17px;
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-handle:before,
|
||||||
|
.noUi-vertical .noUi-handle:after {
|
||||||
|
width: 14px;
|
||||||
|
height: 1px;
|
||||||
|
left: 6px;
|
||||||
|
top: 14px;
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-handle:after {
|
||||||
|
top: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Disabled state;
|
||||||
|
*/
|
||||||
|
|
||||||
|
[disabled] .noUi-connect {
|
||||||
|
background: #B8B8B8;
|
||||||
|
}
|
||||||
|
[disabled].noUi-target,
|
||||||
|
[disabled].noUi-handle,
|
||||||
|
[disabled] .noUi-handle {
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Base;
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
.noUi-pips,
|
||||||
|
.noUi-pips * {
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.noUi-pips {
|
||||||
|
position: absolute;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Values;
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
.noUi-value {
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.noUi-value-sub {
|
||||||
|
color: #ccc;
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Markings;
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
.noUi-marker {
|
||||||
|
position: absolute;
|
||||||
|
background: #CCC;
|
||||||
|
}
|
||||||
|
.noUi-marker-sub {
|
||||||
|
background: #AAA;
|
||||||
|
}
|
||||||
|
.noUi-marker-large {
|
||||||
|
background: #AAA;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Horizontal layout;
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
.noUi-pips-horizontal {
|
||||||
|
padding: 10px 0;
|
||||||
|
height: 80px;
|
||||||
|
top: 100%;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.noUi-value-horizontal {
|
||||||
|
-webkit-transform: translate3d(-50%,50%,0);
|
||||||
|
transform: translate3d(-50%,50%,0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-marker-horizontal.noUi-marker {
|
||||||
|
margin-left: -1px;
|
||||||
|
width: 2px;
|
||||||
|
height: 5px;
|
||||||
|
}
|
||||||
|
.noUi-marker-horizontal.noUi-marker-sub {
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
.noUi-marker-horizontal.noUi-marker-large {
|
||||||
|
height: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Vertical layout;
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
.noUi-pips-vertical {
|
||||||
|
padding: 0 10px;
|
||||||
|
height: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 100%;
|
||||||
|
}
|
||||||
|
.noUi-value-vertical {
|
||||||
|
-webkit-transform: translate3d(0,50%,0);
|
||||||
|
transform: translate3d(0,50%,0);
|
||||||
|
padding-left: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-marker-vertical.noUi-marker {
|
||||||
|
width: 5px;
|
||||||
|
height: 2px;
|
||||||
|
margin-top: -1px;
|
||||||
|
}
|
||||||
|
.noUi-marker-vertical.noUi-marker-sub {
|
||||||
|
width: 10px;
|
||||||
|
}
|
||||||
|
.noUi-marker-vertical.noUi-marker-large {
|
||||||
|
width: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-tooltip {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
border-radius: 3px;
|
||||||
|
background: #fff;
|
||||||
|
color: #000;
|
||||||
|
padding: 5px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.noUi-horizontal .noUi-tooltip {
|
||||||
|
-webkit-transform: translate(-50%, 0);
|
||||||
|
transform: translate(-50%, 0);
|
||||||
|
left: 50%;
|
||||||
|
bottom: 120%;
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-tooltip {
|
||||||
|
-webkit-transform: translate(0, -50%);
|
||||||
|
transform: translate(0, -50%);
|
||||||
|
top: 50%;
|
||||||
|
right: 120%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Materialize Styles */
|
||||||
|
.noUi-target {
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.noUi-horizontal {
|
||||||
|
height: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-vertical {
|
||||||
|
height: 100%;
|
||||||
|
width: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-horizontal .noUi-handle,
|
||||||
|
.noUi-vertical .noUi-handle {
|
||||||
|
width: 15px;
|
||||||
|
height: 15px;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: none;
|
||||||
|
background-color: #26A69A;
|
||||||
|
border: none;
|
||||||
|
left: -5px;
|
||||||
|
top: -6px;
|
||||||
|
transition: width .2s cubic-bezier(0.215, 0.610, 0.355, 1.000),
|
||||||
|
height .2s cubic-bezier(0.215, 0.610, 0.355, 1.000),
|
||||||
|
left .2s cubic-bezier(0.215, 0.610, 0.355, 1.000),
|
||||||
|
top .2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
}
|
||||||
|
.noUi-handle:before {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
.noUi-handle:after {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-target .noUi-active.noUi-handle {
|
||||||
|
width: 3px;
|
||||||
|
height: 3px;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-target.noUi-horizontal .noUi-tooltip {
|
||||||
|
position: absolute;
|
||||||
|
height: 30px;
|
||||||
|
width: 30px;
|
||||||
|
top: -17px;
|
||||||
|
left: -2px;
|
||||||
|
background-color: #26A69A;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: border-radius .25s cubic-bezier(0.215, 0.610, 0.355, 1.000),
|
||||||
|
transform .25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
transform: scale(.5) rotate(-45deg);
|
||||||
|
transform-origin: 50% 100%;
|
||||||
|
}
|
||||||
|
.noUi-target.noUi-horizontal .noUi-active .noUi-tooltip {
|
||||||
|
border-radius: 15px 15px 15px 0;
|
||||||
|
transform: rotate(-45deg) translate(23px, -25px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-tooltip span {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
top: 6px;
|
||||||
|
left: -1px;
|
||||||
|
transition: opacity .25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-horizontal .noUi-tooltip span {
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-vertical .noUi-tooltip span {
|
||||||
|
transform: rotate(135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.noUi-target.noUi-vertical .noUi-tooltip {
|
||||||
|
position: absolute;
|
||||||
|
height: 30px;
|
||||||
|
width: 30px;
|
||||||
|
top: -17px;
|
||||||
|
left: -2px;
|
||||||
|
background-color: #26A69A;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: border-radius .25s cubic-bezier(0.215, 0.610, 0.355, 1.000),
|
||||||
|
transform .25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
transform: scale(.5) rotate(-45deg);
|
||||||
|
transform-origin: 50% 100%;
|
||||||
|
}
|
||||||
|
.noUi-target.noUi-vertical .noUi-active .noUi-tooltip {
|
||||||
|
border-radius: 15px 15px 15px 0;
|
||||||
|
transform: rotate(-135deg) translate(35px, -10px);
|
||||||
|
}
|
||||||
|
.noUi-vertical .noUi-tooltip span {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
transform: rotate(135deg);
|
||||||
|
opacity: 0;
|
||||||
|
position: absolute;
|
||||||
|
top: 7px;
|
||||||
|
left: -1px;
|
||||||
|
transition: opacity .25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-horizontal .noUi-active .noUi-tooltip span,
|
||||||
|
.noUi-vertical .noUi-active .noUi-tooltip span {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
1
static/css/nouislider.min.css
vendored
Normal file
|
@ -0,0 +1 @@
|
||||||
|
.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;right:0;height:100%;width:100%;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-origin:0 0;transform-style:flat}.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin{left:0;right:auto}.noUi-vertical .noUi-origin{top:-100%;width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{-webkit-transition:transform .3s;transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;right:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;right:-6px;bottom:-17px}.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle{left:-17px;right:auto}.noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-connects{border-radius:3px}.noUi-connect{background:#3FB8AF}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-sub{background:#AAA}.noUi-marker-large{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{-webkit-transform:translate(-50%,50%);transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{-webkit-transform:translate(50%,50%);transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{-webkit-transform:translate(0,50%);transform:translate(0,50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap}.noUi-horizontal .noUi-tooltip{-webkit-transform:translate(-50%,0);transform:translate(-50%,0);left:50%;bottom:120%}.noUi-vertical .noUi-tooltip{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);top:50%;right:120%}.noUi-horizontal .noUi-origin>.noUi-tooltip{-webkit-transform:translate(50%,0);transform:translate(50%,0);left:auto;bottom:10px}.noUi-vertical .noUi-origin>.noUi-tooltip{-webkit-transform:translate(0,-18px);transform:translate(0,-18px);top:auto;right:28px}
|
23
static/css/style.css
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
/* Custom Stylesheet */
|
||||||
|
/**
|
||||||
|
* Use this file to override Materialize files so you can update
|
||||||
|
* the core Materialize files in the future
|
||||||
|
*
|
||||||
|
* Made By MaterializeCSS.com
|
||||||
|
*/
|
||||||
|
|
||||||
|
.icon-block {
|
||||||
|
padding: 0 15px;
|
||||||
|
}
|
||||||
|
.icon-block .material-icons {
|
||||||
|
font-size: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**** Custom styles for Range ****/
|
||||||
|
.noUi-tooltip span {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noUi-target.noUi-horizontal .noUi-tooltip {
|
||||||
|
transform: scale(1) rotate(-45deg) translate(0px, 4px);
|
||||||
|
}
|
61
static/js/init.js
Normal file
|
@ -0,0 +1,61 @@
|
||||||
|
document.addEventListener("DOMContentLoaded", function(event) {
|
||||||
|
var valuesForSlider = [2,3,4,5];
|
||||||
|
|
||||||
|
var format = {
|
||||||
|
to: function(value) {
|
||||||
|
return valuesForSlider[Math.round(value)];
|
||||||
|
},
|
||||||
|
from: function (value) {
|
||||||
|
return valuesForSlider.indexOf(Number(value));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var slider = document.getElementById('slider');
|
||||||
|
noUiSlider.create(slider, {
|
||||||
|
start: [2, 3],
|
||||||
|
connect: true,
|
||||||
|
tooltips: true,
|
||||||
|
step: 1,
|
||||||
|
range: {
|
||||||
|
'min': 0,
|
||||||
|
'max': valuesForSlider.length - 1
|
||||||
|
},
|
||||||
|
format: format
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
(function($){
|
||||||
|
$(function(){
|
||||||
|
|
||||||
|
$('.sidenav').sidenav();
|
||||||
|
|
||||||
|
}); // end of document ready
|
||||||
|
$(document).ready(function(){
|
||||||
|
// slider
|
||||||
|
// var valuesForSlider = [2,3,4,5];
|
||||||
|
// var slider = document.getElementById('slider');
|
||||||
|
// var format = {
|
||||||
|
// to: function(value) {
|
||||||
|
// return valuesForSlider[Math.round(value)];
|
||||||
|
// },
|
||||||
|
// from: function (value) {
|
||||||
|
// return valuesForSlider.indexOf(Number(value));
|
||||||
|
// }
|
||||||
|
// };
|
||||||
|
//
|
||||||
|
// noUiSlider.create(slider, {
|
||||||
|
// start: [3, 4],
|
||||||
|
// connect: true,
|
||||||
|
// step: 1,
|
||||||
|
// orientation: 'horizontal', // 'horizontal' or 'vertical'
|
||||||
|
// range: {
|
||||||
|
// 'min': 0,
|
||||||
|
// 'max': valuesForSlider.length - 1
|
||||||
|
// },
|
||||||
|
// format: wNumb({
|
||||||
|
// decimals: 0
|
||||||
|
// })
|
||||||
|
// });
|
||||||
|
|
||||||
|
});
|
||||||
|
})(jQuery); // end of jQuery name space
|
||||||
|
|
12374
static/js/materialize.js
vendored
Normal file
6
static/js/materialize.min.js
vendored
Normal file
2282
static/js/nouislider.js
Normal file
1
static/js/nouislider.min.js
vendored
Normal file
381
static/js/wNumb.js
Normal file
|
@ -0,0 +1,381 @@
|
||||||
|
(function(factory) {
|
||||||
|
if (typeof define === "function" && define.amd) {
|
||||||
|
// AMD. Register as an anonymous module.
|
||||||
|
define([], factory);
|
||||||
|
} else if (typeof exports === "object") {
|
||||||
|
// Node/CommonJS
|
||||||
|
module.exports = factory();
|
||||||
|
} else {
|
||||||
|
// Browser globals
|
||||||
|
window.wNumb = factory();
|
||||||
|
}
|
||||||
|
})(function() {
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
var FormatOptions = [
|
||||||
|
"decimals",
|
||||||
|
"thousand",
|
||||||
|
"mark",
|
||||||
|
"prefix",
|
||||||
|
"suffix",
|
||||||
|
"encoder",
|
||||||
|
"decoder",
|
||||||
|
"negativeBefore",
|
||||||
|
"negative",
|
||||||
|
"edit",
|
||||||
|
"undo"
|
||||||
|
];
|
||||||
|
|
||||||
|
// General
|
||||||
|
|
||||||
|
// Reverse a string
|
||||||
|
function strReverse(a) {
|
||||||
|
return a
|
||||||
|
.split("")
|
||||||
|
.reverse()
|
||||||
|
.join("");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if a string starts with a specified prefix.
|
||||||
|
function strStartsWith(input, match) {
|
||||||
|
return input.substring(0, match.length) === match;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check is a string ends in a specified suffix.
|
||||||
|
function strEndsWith(input, match) {
|
||||||
|
return input.slice(-1 * match.length) === match;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Throw an error if formatting options are incompatible.
|
||||||
|
function throwEqualError(F, a, b) {
|
||||||
|
if ((F[a] || F[b]) && F[a] === F[b]) {
|
||||||
|
throw new Error(a);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if a number is finite and not NaN
|
||||||
|
function isValidNumber(input) {
|
||||||
|
return typeof input === "number" && isFinite(input);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Provide rounding-accurate toFixed method.
|
||||||
|
// Borrowed: http://stackoverflow.com/a/21323330/775265
|
||||||
|
function toFixed(value, exp) {
|
||||||
|
value = value.toString().split("e");
|
||||||
|
value = Math.round(+(value[0] + "e" + (value[1] ? +value[1] + exp : exp)));
|
||||||
|
value = value.toString().split("e");
|
||||||
|
return (+(value[0] + "e" + (value[1] ? +value[1] - exp : -exp))).toFixed(exp);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Formatting
|
||||||
|
|
||||||
|
// Accept a number as input, output formatted string.
|
||||||
|
function formatTo(
|
||||||
|
decimals,
|
||||||
|
thousand,
|
||||||
|
mark,
|
||||||
|
prefix,
|
||||||
|
suffix,
|
||||||
|
encoder,
|
||||||
|
decoder,
|
||||||
|
negativeBefore,
|
||||||
|
negative,
|
||||||
|
edit,
|
||||||
|
undo,
|
||||||
|
input
|
||||||
|
) {
|
||||||
|
var originalInput = input,
|
||||||
|
inputIsNegative,
|
||||||
|
inputPieces,
|
||||||
|
inputBase,
|
||||||
|
inputDecimals = "",
|
||||||
|
output = "";
|
||||||
|
|
||||||
|
// Apply user encoder to the input.
|
||||||
|
// Expected outcome: number.
|
||||||
|
if (encoder) {
|
||||||
|
input = encoder(input);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Stop if no valid number was provided, the number is infinite or NaN.
|
||||||
|
if (!isValidNumber(input)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Rounding away decimals might cause a value of -0
|
||||||
|
// when using very small ranges. Remove those cases.
|
||||||
|
if (decimals !== false && parseFloat(input.toFixed(decimals)) === 0) {
|
||||||
|
input = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Formatting is done on absolute numbers,
|
||||||
|
// decorated by an optional negative symbol.
|
||||||
|
if (input < 0) {
|
||||||
|
inputIsNegative = true;
|
||||||
|
input = Math.abs(input);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Reduce the number of decimals to the specified option.
|
||||||
|
if (decimals !== false) {
|
||||||
|
input = toFixed(input, decimals);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Transform the number into a string, so it can be split.
|
||||||
|
input = input.toString();
|
||||||
|
|
||||||
|
// Break the number on the decimal separator.
|
||||||
|
if (input.indexOf(".") !== -1) {
|
||||||
|
inputPieces = input.split(".");
|
||||||
|
|
||||||
|
inputBase = inputPieces[0];
|
||||||
|
|
||||||
|
if (mark) {
|
||||||
|
inputDecimals = mark + inputPieces[1];
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// If it isn't split, the entire number will do.
|
||||||
|
inputBase = input;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Group numbers in sets of three.
|
||||||
|
if (thousand) {
|
||||||
|
inputBase = strReverse(inputBase).match(/.{1,3}/g);
|
||||||
|
inputBase = strReverse(inputBase.join(strReverse(thousand)));
|
||||||
|
}
|
||||||
|
|
||||||
|
// If the number is negative, prefix with negation symbol.
|
||||||
|
if (inputIsNegative && negativeBefore) {
|
||||||
|
output += negativeBefore;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prefix the number
|
||||||
|
if (prefix) {
|
||||||
|
output += prefix;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Normal negative option comes after the prefix. Defaults to '-'.
|
||||||
|
if (inputIsNegative && negative) {
|
||||||
|
output += negative;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Append the actual number.
|
||||||
|
output += inputBase;
|
||||||
|
output += inputDecimals;
|
||||||
|
|
||||||
|
// Apply the suffix.
|
||||||
|
if (suffix) {
|
||||||
|
output += suffix;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Run the output through a user-specified post-formatter.
|
||||||
|
if (edit) {
|
||||||
|
output = edit(output, originalInput);
|
||||||
|
}
|
||||||
|
|
||||||
|
// All done.
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Accept a sting as input, output decoded number.
|
||||||
|
function formatFrom(
|
||||||
|
decimals,
|
||||||
|
thousand,
|
||||||
|
mark,
|
||||||
|
prefix,
|
||||||
|
suffix,
|
||||||
|
encoder,
|
||||||
|
decoder,
|
||||||
|
negativeBefore,
|
||||||
|
negative,
|
||||||
|
edit,
|
||||||
|
undo,
|
||||||
|
input
|
||||||
|
) {
|
||||||
|
var originalInput = input,
|
||||||
|
inputIsNegative,
|
||||||
|
output = "";
|
||||||
|
|
||||||
|
// User defined pre-decoder. Result must be a non empty string.
|
||||||
|
if (undo) {
|
||||||
|
input = undo(input);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Test the input. Can't be empty.
|
||||||
|
if (!input || typeof input !== "string") {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// If the string starts with the negativeBefore value: remove it.
|
||||||
|
// Remember is was there, the number is negative.
|
||||||
|
if (negativeBefore && strStartsWith(input, negativeBefore)) {
|
||||||
|
input = input.replace(negativeBefore, "");
|
||||||
|
inputIsNegative = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Repeat the same procedure for the prefix.
|
||||||
|
if (prefix && strStartsWith(input, prefix)) {
|
||||||
|
input = input.replace(prefix, "");
|
||||||
|
}
|
||||||
|
|
||||||
|
// And again for negative.
|
||||||
|
if (negative && strStartsWith(input, negative)) {
|
||||||
|
input = input.replace(negative, "");
|
||||||
|
inputIsNegative = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove the suffix.
|
||||||
|
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice
|
||||||
|
if (suffix && strEndsWith(input, suffix)) {
|
||||||
|
input = input.slice(0, -1 * suffix.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove the thousand grouping.
|
||||||
|
if (thousand) {
|
||||||
|
input = input.split(thousand).join("");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set the decimal separator back to period.
|
||||||
|
if (mark) {
|
||||||
|
input = input.replace(mark, ".");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prepend the negative symbol.
|
||||||
|
if (inputIsNegative) {
|
||||||
|
output += "-";
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add the number
|
||||||
|
output += input;
|
||||||
|
|
||||||
|
// Trim all non-numeric characters (allow '.' and '-');
|
||||||
|
output = output.replace(/[^0-9\.\-.]/g, "");
|
||||||
|
|
||||||
|
// The value contains no parse-able number.
|
||||||
|
if (output === "") {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Covert to number.
|
||||||
|
output = Number(output);
|
||||||
|
|
||||||
|
// Run the user-specified post-decoder.
|
||||||
|
if (decoder) {
|
||||||
|
output = decoder(output);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check is the output is valid, otherwise: return false.
|
||||||
|
if (!isValidNumber(output)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Framework
|
||||||
|
|
||||||
|
// Validate formatting options
|
||||||
|
function validate(inputOptions) {
|
||||||
|
var i,
|
||||||
|
optionName,
|
||||||
|
optionValue,
|
||||||
|
filteredOptions = {};
|
||||||
|
|
||||||
|
if (inputOptions["suffix"] === undefined) {
|
||||||
|
inputOptions["suffix"] = inputOptions["postfix"];
|
||||||
|
}
|
||||||
|
|
||||||
|
for (i = 0; i < FormatOptions.length; i += 1) {
|
||||||
|
optionName = FormatOptions[i];
|
||||||
|
optionValue = inputOptions[optionName];
|
||||||
|
|
||||||
|
if (optionValue === undefined) {
|
||||||
|
// Only default if negativeBefore isn't set.
|
||||||
|
if (optionName === "negative" && !filteredOptions.negativeBefore) {
|
||||||
|
filteredOptions[optionName] = "-";
|
||||||
|
// Don't set a default for mark when 'thousand' is set.
|
||||||
|
} else if (optionName === "mark" && filteredOptions.thousand !== ".") {
|
||||||
|
filteredOptions[optionName] = ".";
|
||||||
|
} else {
|
||||||
|
filteredOptions[optionName] = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Floating points in JS are stable up to 7 decimals.
|
||||||
|
} else if (optionName === "decimals") {
|
||||||
|
if (optionValue >= 0 && optionValue < 8) {
|
||||||
|
filteredOptions[optionName] = optionValue;
|
||||||
|
} else {
|
||||||
|
throw new Error(optionName);
|
||||||
|
}
|
||||||
|
|
||||||
|
// These options, when provided, must be functions.
|
||||||
|
} else if (
|
||||||
|
optionName === "encoder" ||
|
||||||
|
optionName === "decoder" ||
|
||||||
|
optionName === "edit" ||
|
||||||
|
optionName === "undo"
|
||||||
|
) {
|
||||||
|
if (typeof optionValue === "function") {
|
||||||
|
filteredOptions[optionName] = optionValue;
|
||||||
|
} else {
|
||||||
|
throw new Error(optionName);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Other options are strings.
|
||||||
|
} else {
|
||||||
|
if (typeof optionValue === "string") {
|
||||||
|
filteredOptions[optionName] = optionValue;
|
||||||
|
} else {
|
||||||
|
throw new Error(optionName);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Some values can't be extracted from a
|
||||||
|
// string if certain combinations are present.
|
||||||
|
throwEqualError(filteredOptions, "mark", "thousand");
|
||||||
|
throwEqualError(filteredOptions, "prefix", "negative");
|
||||||
|
throwEqualError(filteredOptions, "prefix", "negativeBefore");
|
||||||
|
|
||||||
|
return filteredOptions;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pass all options as function arguments
|
||||||
|
function passAll(options, method, input) {
|
||||||
|
var i,
|
||||||
|
args = [];
|
||||||
|
|
||||||
|
// Add all options in order of FormatOptions
|
||||||
|
for (i = 0; i < FormatOptions.length; i += 1) {
|
||||||
|
args.push(options[FormatOptions[i]]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Append the input, then call the method, presenting all
|
||||||
|
// options as arguments.
|
||||||
|
args.push(input);
|
||||||
|
return method.apply("", args);
|
||||||
|
}
|
||||||
|
|
||||||
|
function wNumb(options) {
|
||||||
|
if (!(this instanceof wNumb)) {
|
||||||
|
return new wNumb(options);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof options !== "object") {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
options = validate(options);
|
||||||
|
|
||||||
|
// Call 'formatTo' with proper arguments.
|
||||||
|
this.to = function(input) {
|
||||||
|
return passAll(options, formatTo, input);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Call 'formatFrom' with proper arguments.
|
||||||
|
this.from = function(input) {
|
||||||
|
return passAll(options, formatFrom, input);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return wNumb;
|
||||||
|
});
|
223
static_old/css/home.css
Executable file
|
@ -0,0 +1,223 @@
|
||||||
|
/**
|
||||||
|
* WEBSITE: https://themefisher.com
|
||||||
|
* TWITTER: https://twitter.com/themefisher
|
||||||
|
* FACEBOOK: https://www.facebook.com/themefisher
|
||||||
|
* GITHUB: https://github.com/themefisher/
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hero-area {
|
||||||
|
height: 650px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
position: relative;
|
||||||
|
overflow-x: hidden;
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
background-image: url("../images/home/slider-5.jpg");
|
||||||
|
background-size: cover;
|
||||||
|
background-attachment: fixed;
|
||||||
|
}
|
||||||
|
.hero-area .block {
|
||||||
|
position: relative;
|
||||||
|
z-index: 999999;
|
||||||
|
}
|
||||||
|
.hero-area h1 {
|
||||||
|
font-size: 100px;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-family: "Open Sans", sans-serif;
|
||||||
|
}
|
||||||
|
.hero-area p {
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 32px;
|
||||||
|
color: #f9f9f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.template-list {
|
||||||
|
padding: 100px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.template-item {
|
||||||
|
margin-bottom: 50px;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.template-item:hover img {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
.template-item .ticker {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 50%;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 1;
|
||||||
|
font-size: 10px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: 700;
|
||||||
|
background: #4be6e6;
|
||||||
|
}
|
||||||
|
.template-item a {
|
||||||
|
box-shadow: 0 15px 45px -9px rgba(0, 0, 0, 0.25);
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.template-item a img {
|
||||||
|
border-radius: 5px;
|
||||||
|
transition: 0.3s all;
|
||||||
|
}
|
||||||
|
.template-item h4 {
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #252525;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.template-item a {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.call-to-action {
|
||||||
|
background: #3483de;
|
||||||
|
color: #fff;
|
||||||
|
padding: 80px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.call-to-action h2 {
|
||||||
|
line-height: 45px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.call-to-action .btn-buy-button {
|
||||||
|
background: #fff;
|
||||||
|
padding: 18px 45px;
|
||||||
|
border-radius: 30px;
|
||||||
|
margin-top: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 12px;
|
||||||
|
display: inline-block;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll {
|
||||||
|
position: absolute;
|
||||||
|
margin: auto;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
z-index: 9999;
|
||||||
|
bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll span {
|
||||||
|
display: block;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
transform: rotate(45deg);
|
||||||
|
border-right: 2px solid #fff;
|
||||||
|
border-bottom: 2px solid #fff;
|
||||||
|
margin: 0 0 3px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll .mouse {
|
||||||
|
height: 40px;
|
||||||
|
width: 22px;
|
||||||
|
border-radius: 10px;
|
||||||
|
transform: none;
|
||||||
|
border: 2px solid #ffffff;
|
||||||
|
top: 170px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll .mouse-in {
|
||||||
|
height: 5px;
|
||||||
|
width: 2px;
|
||||||
|
display: block;
|
||||||
|
margin: 5px auto;
|
||||||
|
background: #ffffff;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mouse-scroll .mouse-in {
|
||||||
|
-webkit-animation: animated-mouse 1.2s ease infinite;
|
||||||
|
animation: mouse-animated 1.2s ease infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes animated-mouse {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(6px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes mouse-scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes mouse-scroll {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
background: #01252d;
|
||||||
|
padding: 30px 0;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer p {
|
||||||
|
color: #fff;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a {
|
||||||
|
color: #fff;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a:hover {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.overly {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.overly:before {
|
||||||
|
content: "";
|
||||||
|
background: rgba(0, 0, 0, 0.51);
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=home.css.map */
|
8
static_old/css/home.css.map
Executable file
2340
static_old/css/style.css
Executable file
8
static_old/css/style.css.map
Executable file
BIN
static_old/images/about/about.jpg
Executable file
After Width: | Height: | Size: 16 KiB |
BIN
static_old/images/about/awards-logo.png
Executable file
After Width: | Height: | Size: 6.5 KiB |
BIN
static_old/images/avater.jpg
Executable file
After Width: | Height: | Size: 44 KiB |
BIN
static_old/images/backgrounds/bg-1.jpg
Executable file
After Width: | Height: | Size: 164 KiB |
BIN
static_old/images/backgrounds/coming-soon-bg.jpg
Executable file
After Width: | Height: | Size: 480 KiB |
BIN
static_old/images/blog/avater-1.jpg
Executable file
After Width: | Height: | Size: 44 KiB |
BIN
static_old/images/blog/avater-2.jpg
Executable file
After Width: | Height: | Size: 41 KiB |
BIN
static_old/images/blog/avater-3.jpg
Executable file
After Width: | Height: | Size: 44 KiB |
BIN
static_old/images/blog/avater-4.jpg
Executable file
After Width: | Height: | Size: 52 KiB |
BIN
static_old/images/blog/blog-post-1.jpg
Executable file
After Width: | Height: | Size: 55 KiB |
BIN
static_old/images/blog/blog-post-2.jpg
Executable file
After Width: | Height: | Size: 83 KiB |
BIN
static_old/images/blog/blog-post-3.jpg
Executable file
After Width: | Height: | Size: 110 KiB |
BIN
static_old/images/blog/blog-post-4.jpg
Executable file
After Width: | Height: | Size: 108 KiB |
BIN
static_old/images/blog/blog-post-5.jpg
Executable file
After Width: | Height: | Size: 132 KiB |
BIN
static_old/images/blog/blog-post-6.jpg
Executable file
After Width: | Height: | Size: 239 KiB |
BIN
static_old/images/blog/post-thumb-2.jpg
Executable file
After Width: | Height: | Size: 26 KiB |
BIN
static_old/images/blog/post-thumb-3.jpg
Executable file
After Width: | Height: | Size: 30 KiB |
BIN
static_old/images/blog/post-thumb-4.jpg
Executable file
After Width: | Height: | Size: 30 KiB |
BIN
static_old/images/blog/post-thumb-5.jpg
Executable file
After Width: | Height: | Size: 42 KiB |
BIN
static_old/images/blog/post-thumb-6.jpg
Executable file
After Width: | Height: | Size: 23 KiB |
BIN
static_old/images/blog/post-thumb-7.jpg
Executable file
After Width: | Height: | Size: 26 KiB |
BIN
static_old/images/blog/post-thumb.jpg
Executable file
After Width: | Height: | Size: 26 KiB |
BIN
static_old/images/favicon.png
Executable file
After Width: | Height: | Size: 1004 B |
BIN
static_old/images/logo.png
Executable file
After Width: | Height: | Size: 1.7 KiB |
BIN
static_old/images/shop/cart/cart-1.jpg
Executable file
After Width: | Height: | Size: 6.2 KiB |
BIN
static_old/images/shop/cart/cart-2.jpg
Executable file
After Width: | Height: | Size: 8.4 KiB |
BIN
static_old/images/shop/cart/cart-3.jpg
Executable file
After Width: | Height: | Size: 12 KiB |
BIN
static_old/images/shop/category/category-1.jpg
Executable file
After Width: | Height: | Size: 35 KiB |
BIN
static_old/images/shop/category/category-2.jpg
Executable file
After Width: | Height: | Size: 36 KiB |
BIN
static_old/images/shop/category/category-3.jpg
Executable file
After Width: | Height: | Size: 60 KiB |
BIN
static_old/images/shop/header-img.jpg
Executable file
After Width: | Height: | Size: 17 KiB |
BIN
static_old/images/shop/products/modal-product.jpg
Executable file
After Width: | Height: | Size: 45 KiB |
BIN
static_old/images/shop/products/product-1.jpg
Executable file
After Width: | Height: | Size: 31 KiB |
BIN
static_old/images/shop/products/product-2.jpg
Executable file
After Width: | Height: | Size: 15 KiB |
BIN
static_old/images/shop/products/product-3.jpg
Executable file
After Width: | Height: | Size: 14 KiB |
BIN
static_old/images/shop/products/product-4.jpg
Executable file
After Width: | Height: | Size: 19 KiB |
BIN
static_old/images/shop/products/product-5.jpg
Executable file
After Width: | Height: | Size: 6.3 KiB |
BIN
static_old/images/shop/products/product-6.jpg
Executable file
After Width: | Height: | Size: 8.7 KiB |
BIN
static_old/images/shop/products/product-7.jpg
Executable file
After Width: | Height: | Size: 15 KiB |
BIN
static_old/images/shop/products/product-8.jpg
Executable file
After Width: | Height: | Size: 11 KiB |
BIN
static_old/images/shop/products/product-9.jpg
Executable file
After Width: | Height: | Size: 8.4 KiB |
BIN
static_old/images/shop/products/single-product.jpg
Executable file
After Width: | Height: | Size: 17 KiB |
BIN
static_old/images/shop/single-products/product-1.jpg
Executable file
After Width: | Height: | Size: 50 KiB |
BIN
static_old/images/shop/single-products/product-2.jpg
Executable file
After Width: | Height: | Size: 48 KiB |
BIN
static_old/images/shop/single-products/product-3.jpg
Executable file
After Width: | Height: | Size: 54 KiB |
BIN
static_old/images/shop/single-products/product-4.jpg
Executable file
After Width: | Height: | Size: 47 KiB |
BIN
static_old/images/shop/single-products/product-5.jpg
Executable file
After Width: | Height: | Size: 31 KiB |
BIN
static_old/images/shop/single-products/product-6.jpg
Executable file
After Width: | Height: | Size: 24 KiB |
BIN
static_old/images/shop/verified.png
Executable file
After Width: | Height: | Size: 10 KiB |
BIN
static_old/images/slider/slider-1.jpg
Executable file
After Width: | Height: | Size: 190 KiB |
BIN
static_old/images/slider/slider-2.jpg
Executable file
After Width: | Height: | Size: 95 KiB |
BIN
static_old/images/slider/slider-3.jpg
Executable file
After Width: | Height: | Size: 86 KiB |
BIN
static_old/images/team/team-1.jpg
Executable file
After Width: | Height: | Size: 32 KiB |
BIN
static_old/images/team/team-2.jpg
Executable file
After Width: | Height: | Size: 34 KiB |
BIN
static_old/images/team/team-3.jpg
Executable file
After Width: | Height: | Size: 28 KiB |
97
static_old/js/script.js
Executable file
|
@ -0,0 +1,97 @@
|
||||||
|
/**
|
||||||
|
* WEBSITE: https://themefisher.com
|
||||||
|
* TWITTER: https://twitter.com/themefisher
|
||||||
|
* FACEBOOK: https://www.facebook.com/themefisher
|
||||||
|
* GITHUB: https://github.com/themefisher/
|
||||||
|
*/
|
||||||
|
|
||||||
|
(function ($) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
// Preloader
|
||||||
|
$(window).on('load', function () {
|
||||||
|
$('#preloader').fadeOut('slow', function () {
|
||||||
|
$(this).remove();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// Instagram Feed
|
||||||
|
if (($('#instafeed').length) !== 0) {
|
||||||
|
var accessToken = $('#instafeed').attr('data-accessToken');
|
||||||
|
var userFeed = new Instafeed({
|
||||||
|
get: 'user',
|
||||||
|
resolution: 'low_resolution',
|
||||||
|
accessToken: accessToken,
|
||||||
|
template: '<a href="{{link}}"><img src="{{image}}" alt="instagram-image"></a>'
|
||||||
|
});
|
||||||
|
userFeed.run();
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(function () {
|
||||||
|
$('.instagram-slider').slick({
|
||||||
|
dots: false,
|
||||||
|
speed: 300,
|
||||||
|
// autoplay: true,
|
||||||
|
arrows: false,
|
||||||
|
slidesToShow: 6,
|
||||||
|
slidesToScroll: 1,
|
||||||
|
responsive: [{
|
||||||
|
breakpoint: 1024,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 4
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 600,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 3
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 480,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 2
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 1500);
|
||||||
|
|
||||||
|
|
||||||
|
// e-commerce touchspin
|
||||||
|
$('input[name=\'product-quantity\']').TouchSpin();
|
||||||
|
|
||||||
|
|
||||||
|
// Video Lightbox
|
||||||
|
$(document).on('click', '[data-toggle="lightbox"]', function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
$(this).ekkoLightbox();
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// Count Down JS
|
||||||
|
$('#simple-timer').syotimer({
|
||||||
|
year: 2022,
|
||||||
|
month: 5,
|
||||||
|
day: 9,
|
||||||
|
hour: 20,
|
||||||
|
minute: 30
|
||||||
|
});
|
||||||
|
|
||||||
|
//Hero Slider
|
||||||
|
$('.hero-slider').slick({
|
||||||
|
// autoplay: true,
|
||||||
|
infinite: true,
|
||||||
|
arrows: true,
|
||||||
|
prevArrow: '<button type=\'button\' class=\'heroSliderArrow prevArrow tf-ion-chevron-left\'></button>',
|
||||||
|
nextArrow: '<button type=\'button\' class=\'heroSliderArrow nextArrow tf-ion-chevron-right\'></button>',
|
||||||
|
dots: true,
|
||||||
|
autoplaySpeed: 7000,
|
||||||
|
pauseOnFocus: false,
|
||||||
|
pauseOnHover: false
|
||||||
|
});
|
||||||
|
$('.hero-slider').slickAnimation();
|
||||||
|
|
||||||
|
|
||||||
|
})(jQuery);
|
21
static_old/materialize/LICENSE
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2014-2018 Materialize
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
91
static_old/materialize/README.md
Normal file
|
@ -0,0 +1,91 @@
|
||||||
|
<p align="center">
|
||||||
|
<a href="http://materializecss.com/">
|
||||||
|
<img src="http://materializecss.com/res/materialize.svg" width="150">
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h3 align="center">MaterializeCSS</h3>
|
||||||
|
|
||||||
|
<p align="center">
|
||||||
|
Materialize, a CSS Framework based on material design.
|
||||||
|
<br>
|
||||||
|
<a href="http://materializecss.com/"><strong>-- Browse the docs --</strong></a>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<a href="https://travis-ci.org/Dogfalo/materialize">
|
||||||
|
<img src="https://travis-ci.org/Dogfalo/materialize.svg?branch=master" alt="Travis CI badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://badge.fury.io/js/materialize-css">
|
||||||
|
<img src="https://badge.fury.io/js/materialize-css.svg" alt="npm version badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://cdnjs.com/libraries/materialize">
|
||||||
|
<img src="https://img.shields.io/cdnjs/v/materialize.svg" alt="CDNJS version badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://david-dm.org/Dogfalo/materialize">
|
||||||
|
<img src="https://david-dm.org/Dogfalo/materialize/status.svg" alt="dependencies Status badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://david-dm.org/Dogfalo/materialize#info=devDependencies">
|
||||||
|
<img src="https://david-dm.org/Dogfalo/materialize/dev-status.svg" alt="devDependency Status badge">
|
||||||
|
</a>
|
||||||
|
<a href="https://gitter.im/Dogfalo/materialize">
|
||||||
|
<img src="https://badges.gitter.im/Join%20Chat.svg" alt="Gitter badge">
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
## Table of Contents
|
||||||
|
- [Quickstart](#quickstart)
|
||||||
|
- [Documentation](#documentation)
|
||||||
|
- [Supported Browsers](#supported-browsers)
|
||||||
|
- [Changelog](#changelog)
|
||||||
|
- [Testing](#testing)
|
||||||
|
- [Contributing](#contributing)
|
||||||
|
- [Copyright and license](#copyright-and-license)
|
||||||
|
|
||||||
|
## Quickstart:
|
||||||
|
Read the [getting started guide](http://materializecss.com/getting-started.html) for more information on how to use materialize.
|
||||||
|
|
||||||
|
- [Download the latest release](https://github.com/Dogfalo/materialize/releases/latest) of materialize directly from GitHub. ([Beta](https://github.com/Dogfalo/materialize/releases/))
|
||||||
|
- Clone the repo: `git clone https://github.com/Dogfalo/materialize.git` (Beta: `git clone -b v1-dev https://github.com/Dogfalo/materialize.git`)
|
||||||
|
- Include the files via [cdnjs](https://cdnjs.com/libraries/materialize). More [here](http://materializecss.com/getting-started.html). ([Beta](https://cdnjs.com/libraries/materialize/1.0.0-beta))
|
||||||
|
- Install with [npm](https://www.npmjs.com): `npm install materialize-css` (Beta: `npm install materialize-css@next`)
|
||||||
|
- Install with [Bower](https://bower.io): `bower install materialize` ([DEPRECATED](https://bower.io/blog/2017/how-to-migrate-away-from-bower/))
|
||||||
|
- Install with [Atmosphere](https://atmospherejs.com): `meteor add materialize:materialize` (Beta: `meteor add materialize:materialize@=1.0.0-beta`)
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
The documentation can be found at <http://materializecss.com>. To run the documentation locally on your machine, you need [Node.js](https://nodejs.org/en/) installed on your computer.
|
||||||
|
|
||||||
|
### Running documentation locally
|
||||||
|
Run these commands to set up the documentation:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone https://github.com/Dogfalo/materialize
|
||||||
|
cd materialize
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
Then run `grunt monitor` to compile the documentation. When it finishes, open a new browser window and navigate to `localhost:8000`. We use [BrowserSync](https://www.browsersync.io/) to display the documentation.
|
||||||
|
|
||||||
|
### Documentation for previous releases
|
||||||
|
Previous releases and their documentation are available for [download](https://github.com/Dogfalo/materialize/releases).
|
||||||
|
|
||||||
|
## Supported Browsers:
|
||||||
|
Materialize is compatible with:
|
||||||
|
|
||||||
|
- Chrome 35+
|
||||||
|
- Firefox 31+
|
||||||
|
- Safari 9+
|
||||||
|
- Opera
|
||||||
|
- Edge
|
||||||
|
- IE 11+
|
||||||
|
|
||||||
|
## Changelog
|
||||||
|
For changelogs, check out [the Releases section of materialize](https://github.com/Dogfalo/materialize/releases) or the [CHANGELOG.md](CHANGELOG.md).
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
We use Jasmine as our testing framework and we're trying to write a robust test suite for our components. If you want to help, [here's a starting guide on how to write tests in Jasmine](CONTRIBUTING.md#jasmine-testing-guide).
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
Check out the [CONTRIBUTING document](CONTRIBUTING.md) in the root of the repository to learn how you can contribute. You can also browse the [help-wanted](https://github.com/Dogfalo/materialize/labels/help-wanted) tag in our issue tracker to find things to do.
|
||||||
|
|
||||||
|
## Copyright and license
|
||||||
|
Code Copyright 2018 Materialize. Code released under the MIT license.
|
9067
static_old/materialize/css/materialize.css
vendored
Normal file
13
static_old/materialize/css/materialize.min.css
vendored
Normal file
12374
static_old/materialize/js/materialize.js
vendored
Normal file
6
static_old/materialize/js/materialize.min.js
vendored
Normal file
3623
static_old/plugins/animate/animate.css
vendored
Executable file
383
static_old/plugins/bootstrap-touchspin/demo/demo.css
Executable file
|
@ -0,0 +1,383 @@
|
||||||
|
body {
|
||||||
|
font-family: Arial, Ubuntu, Helvetica, sans-serif;
|
||||||
|
color: #333;
|
||||||
|
padding-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
||||||
|
font-family: Arial, Ubuntu, Helvetica, sans-serif;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border-color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:hover {
|
||||||
|
color: #d64513;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-family: "Century Gothic", Arial, Ubuntu, Helvetica, sans-serif;
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 small {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-family: "Century Gothic", Arial, Ubuntu, Helvetica, sans-serif;
|
||||||
|
font-size: 26px;
|
||||||
|
margin: 30px 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 small {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin-top: 25px;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 small {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 small {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h5 {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h5 small {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 small {
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dl-horizontal dt {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dl-horizontal dd {
|
||||||
|
margin-left: 220px;
|
||||||
|
}
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand {
|
||||||
|
padding: 5px 0px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-default {
|
||||||
|
font-family: "Century Gothic", Arial, sans-serif;
|
||||||
|
background: #000 url(img/bg-menu.png) repeat-x left top; /*#377fa0;*/
|
||||||
|
color: #fff;
|
||||||
|
text-transform: uppercase;
|
||||||
|
border: none;
|
||||||
|
box-shadow: 0px 0px 1px #000;
|
||||||
|
/*background-image: linear-gradient(to top, rgb(62, 86, 112) 0%, rgb(69, 94, 122) 100%)*/;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-default .navbar-nav > .dropdown > a .caret,
|
||||||
|
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
|
||||||
|
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
|
||||||
|
border-top-color: #fff;
|
||||||
|
border-bottom-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar > .container .navbar-brand {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .nav > li > a {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-default .navbar-brand,
|
||||||
|
.navbar-default .navbar-brand:hover,
|
||||||
|
.navbar-default .navbar-brand:focus {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .nav > .active {
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .nav > .active > a,
|
||||||
|
.navbar .nav > .active > a:hover,
|
||||||
|
.navbar .nav > .active > a:focus,
|
||||||
|
.navbar .nav li.dropdown.active > .dropdown-toggle,
|
||||||
|
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
|
||||||
|
background: url(img/bg-menu-selected.png) no-repeat center bottom; /*#a5360f;*/
|
||||||
|
background: #BC451B;
|
||||||
|
color: #fff;
|
||||||
|
/*height: 65px;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .nav > li > a:focus,
|
||||||
|
.navbar .nav > li > a:hover,
|
||||||
|
.navbar .nav li.dropdown.open > .dropdown-toggle {
|
||||||
|
background: rgba(188, 69, 27, 0.6);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
border-radius: 0;
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a,
|
||||||
|
.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
|
||||||
|
background: #d64513;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tabs .open .dropdown-toggle, .nav-pills .open .dropdown-toggle, .nav > li.dropdown.open.active > a:hover {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu > li > a {
|
||||||
|
padding: 10px 20px;
|
||||||
|
color: #585858;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .addthis_toolbox {
|
||||||
|
margin-top: 9px;
|
||||||
|
float: right;
|
||||||
|
margin-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .followus {
|
||||||
|
display: none;
|
||||||
|
float: right;
|
||||||
|
color: white;
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel {
|
||||||
|
border-radius: 10px;
|
||||||
|
background: #f5f5f5;
|
||||||
|
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
|
||||||
|
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
|
||||||
|
-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel-heading {
|
||||||
|
border-bottom: 1px solid #ddd;
|
||||||
|
color: #4d4d4d;
|
||||||
|
font-size: 14px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel-heading a {
|
||||||
|
color: #4d4d4d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel-body {
|
||||||
|
border-top: 1px solid #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.abstract {
|
||||||
|
min-height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-info {
|
||||||
|
border: none;
|
||||||
|
background: #d64513;
|
||||||
|
color: #fff;
|
||||||
|
box-shadow: none;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .btn-info.disabled, .btn-info[disabled] {
|
||||||
|
background: #a5360f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons,
|
||||||
|
.addthis_toolbox {
|
||||||
|
min-height: 26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-fluid .socialbuttons {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .socialbuttons {
|
||||||
|
float: right;
|
||||||
|
height: 20px;
|
||||||
|
width: 220px;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .btn-navbar {
|
||||||
|
background: #474747;
|
||||||
|
-webkit-box-shadow: none;
|
||||||
|
-moz-box-shadow: none;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .btn-navbar {
|
||||||
|
background: #a5360f;
|
||||||
|
border: none;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .btn-navbar:hover, .navbar .btn-navbar:focus, .navbar .btn-navbar:active, .navbar .btn-navbar.active, .navbar .btn-navbar.disabled, .navbar .btn-navbar[disabled] {
|
||||||
|
background: #474747;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* woodpaul on board */
|
||||||
|
.hero-unit {
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 0 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-unit h1 {
|
||||||
|
font-size: 48px;
|
||||||
|
text-align: center;
|
||||||
|
text-shadow: 1px 1px 0px rgba(255,255,255,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-unit h1 small {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-unit .btn {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons {
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 0 -15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons iframe {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons .addthis_toolbox {
|
||||||
|
width: 420px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons .share-github {
|
||||||
|
position: relative;
|
||||||
|
top: -5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socialbuttons .addthis_button_facebook_like {
|
||||||
|
margin: 0 30px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr{
|
||||||
|
background-color: transparent;
|
||||||
|
border-top: 1px solid #ddd;
|
||||||
|
border-bottom: 1px solid #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls-row {
|
||||||
|
margin: 0 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* table */
|
||||||
|
.table thead th {
|
||||||
|
font-family: "Century Gothic", Arial, sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: normal;
|
||||||
|
background-color: #bc451b;
|
||||||
|
color: #fff;
|
||||||
|
vertical-align: middle!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
padding: 1px 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.navbar-collapse {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown:hover .dropdown-menu {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1000px) {
|
||||||
|
.navbar .followus {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
body {
|
||||||
|
padding-top: 110px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-collapse {
|
||||||
|
background: #000 url(img/bg-menu.png) repeat-x left top; /*#377fa0;*/
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle,
|
||||||
|
.navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus,
|
||||||
|
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
|
||||||
|
background: #d64513;
|
||||||
|
color: #fff;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-fixed-top > .container {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar > .container .navbar-brand {
|
||||||
|
margin-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .socialbuttons {
|
||||||
|
position: absolute;
|
||||||
|
right: 100px;
|
||||||
|
top: 0;
|
||||||
|
width: 200px;
|
||||||
|
margin-top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .addthis_toolbox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
BIN
static_old/plugins/bootstrap-touchspin/demo/favicon.ico
Executable file
After Width: | Height: | Size: 32 KiB |
777
static_old/plugins/bootstrap-touchspin/demo/index.html
Executable file
|
@ -0,0 +1,777 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Bootstrap TouchSpin</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="description" content="A mobile and touch friendly input spinner component for Bootstrap 3.">
|
||||||
|
<meta name="author" content="István Ujj-Mészáros">
|
||||||
|
|
||||||
|
<meta itemprop="name" content="Bootstrap Touchspin">
|
||||||
|
<meta itemprop="description" content="A mobile and touch friendly input spinner component for Bootstrap 3.">
|
||||||
|
|
||||||
|
<link rel="shortcut icon" href="favicon.ico">
|
||||||
|
|
||||||
|
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
|
||||||
|
<link href="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.css" rel="stylesheet" type="text/css" media="all">
|
||||||
|
<link href="../src/jquery.bootstrap-touchspin.css" rel="stylesheet" type="text/css" media="all">
|
||||||
|
<link href="demo.css" rel="stylesheet" type="text/css" media="all">
|
||||||
|
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js"></script>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.js"></script>
|
||||||
|
<script src="../src/jquery.bootstrap-touchspin.js"></script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<div class="hero-unit">
|
||||||
|
|
||||||
|
<h1>Bootstrap TouchSpin</h1>
|
||||||
|
|
||||||
|
<a id="link-ghp" class="btn btn-primary" href="https://github.com/istvan-ujjmeszaros/bootstrap-touchspin"><span class="glyphicon glyphicon-link"></span> Github project page</a>
|
||||||
|
<a id="link-ghdl" href="https://github.com/istvan-ujjmeszaros/bootstrap-touchspin/archive/master.zip"
|
||||||
|
class="btn btn-primary" title="download"><span class="glyphicon glyphicon-download"></span> Download</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
A mobile and touch friendly input spinner component for Bootstrap 3.<br>
|
||||||
|
It supports the mousewheel and the up/down keys.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h2>Examples</h2>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo0">Example using data attributes:</label> <input
|
||||||
|
id="demo0"
|
||||||
|
type="text"
|
||||||
|
value="40"
|
||||||
|
name="demo0"
|
||||||
|
data-bts-min="0"
|
||||||
|
data-bts-max="100"
|
||||||
|
data-bts-init-val=""
|
||||||
|
data-bts-step="1"
|
||||||
|
data-bts-decimal="0"
|
||||||
|
data-bts-step-interval="100"
|
||||||
|
data-bts-force-step-divisibility="round"
|
||||||
|
data-bts-step-interval-delay="500"
|
||||||
|
data-bts-prefix=""
|
||||||
|
data-bts-postfix=""
|
||||||
|
data-bts-prefix-extra-class=""
|
||||||
|
data-bts-postfix-extra-class=""
|
||||||
|
data-bts-booster="true"
|
||||||
|
data-bts-boostat="10"
|
||||||
|
data-bts-max-boosted-step="false"
|
||||||
|
data-bts-mousewheel="true"
|
||||||
|
data-bts-button-down-class="btn btn-default"
|
||||||
|
data-bts-button-up-class="btn btn-default"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo0"
|
||||||
|
type="text"
|
||||||
|
value="55"
|
||||||
|
name="demo0"
|
||||||
|
data-bts-min="0"
|
||||||
|
data-bts-max="100"
|
||||||
|
data-bts-init-val=""
|
||||||
|
data-bts-step="1"
|
||||||
|
data-bts-decimal="0"
|
||||||
|
data-bts-step-interval="100"
|
||||||
|
data-bts-force-step-divisibility="round"
|
||||||
|
data-bts-step-interval-delay="500"
|
||||||
|
data-bts-prefix=""
|
||||||
|
data-bts-postfix=""
|
||||||
|
data-bts-prefix-extra-class=""
|
||||||
|
data-bts-postfix-extra-class=""
|
||||||
|
data-bts-booster="true"
|
||||||
|
data-bts-boostat="10"
|
||||||
|
data-bts-max-boosted-step="false"
|
||||||
|
data-bts-mousewheel="true"
|
||||||
|
data-bts-button-down-class="btn btn-default"
|
||||||
|
data-bts-button-up-class="btn btn-default"
|
||||||
|
/>
|
||||||
|
<script>
|
||||||
|
$("input[name='demo0']").TouchSpin({
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo0']").TouchSpin({
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo_vertical">Vertical button alignment:</label> <input id="demo3" type="text" value="" name="demo_vertical">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo_vertical" type="text" value="" name="demo_vertical">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo_vertical']").TouchSpin({
|
||||||
|
verticalbuttons: true
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo_vertical']").TouchSpin({
|
||||||
|
verticalbuttons: true
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo_vertical2">Vertical buttons with custom icons:</label> <input id="demo3" type="text" value="" name="demo_vertical2">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo_vertical2" type="text" value="" name="demo_vertical2">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo_vertical2']").TouchSpin({
|
||||||
|
verticalbuttons: true,
|
||||||
|
verticalupclass: 'glyphicon glyphicon-plus',
|
||||||
|
verticaldownclass: 'glyphicon glyphicon-minus'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo_vertical2']").TouchSpin({
|
||||||
|
verticalbuttons: true,
|
||||||
|
verticalupclass: 'glyphicon glyphicon-plus',
|
||||||
|
verticaldownclass: 'glyphicon glyphicon-minus'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo1">Example with postfix (large):</label> <input id="demo1" type="text" value="55" name="demo1">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo1" type="text" value="55" name="demo1">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo1']").TouchSpin({
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 0.1,
|
||||||
|
decimals: 2,
|
||||||
|
boostat: 5,
|
||||||
|
maxboostedstep: 10,
|
||||||
|
postfix: '%'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo1']").TouchSpin({
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 0.1,
|
||||||
|
decimals: 2,
|
||||||
|
boostat: 5,
|
||||||
|
maxboostedstep: 10,
|
||||||
|
postfix: '%'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<form class="form-horizontal" role="form">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="demo2" class="col-md-5 control-label">With prefix</label> <input id="demo2" type="text"
|
||||||
|
value="0" name="demo2"
|
||||||
|
class="col-md-7 form-control">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<form class="form-horizontal" role="form">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="demo2" class="col-md-5 control-label">Example:</label> <input id="demo2" type="text" value="0" name="demo2" class="col-md-7 form-control">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo2']").TouchSpin({
|
||||||
|
min: -1000000000,
|
||||||
|
max: 1000000000,
|
||||||
|
stepinterval: 50,
|
||||||
|
maxboostedstep: 10000000,
|
||||||
|
prefix: '$'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
<script>
|
||||||
|
$("input[name='demo2']").TouchSpin({
|
||||||
|
min: -1000000000,
|
||||||
|
max: 1000000000,
|
||||||
|
stepinterval: 50,
|
||||||
|
maxboostedstep: 10000000,
|
||||||
|
prefix: '$'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo3">Init with empty value:</label> <input id="demo3" type="text" value="" name="demo3">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo3" type="text" value="" name="demo3">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo3']").TouchSpin();
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo3']").TouchSpin();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<p>
|
||||||
|
The <code>initval</code> setting is only applied when no explicit value is set on the input with the
|
||||||
|
<code>value</code> attribute.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo3_21">Value attribute is not set
|
||||||
|
<small>(applying settings.initval)</small>
|
||||||
|
:</label> <input id="demo3_21" type="text" value="" name="demo3_21">
|
||||||
|
<label for="demo3_22">Value is set explicitly to 33
|
||||||
|
<small>(skipping settings.initval)</small>
|
||||||
|
:</label> <input id="demo3_22" type="text" value="33" name="demo3_22">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo3_21" type="text" value="" name="demo3_21">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo3_21']").TouchSpin({
|
||||||
|
initval: 40
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<input id="demo3_22" type="text" value="33" name="demo3_22">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo3_22']").TouchSpin({
|
||||||
|
initval: 40
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo3_21']").TouchSpin({
|
||||||
|
initval: 40
|
||||||
|
});
|
||||||
|
$("input[name='demo3_22']").TouchSpin({
|
||||||
|
initval: 40
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Size of the whole controller can be set with applying <code>input-sm</code> or <code>input-lg</code> class on the
|
||||||
|
input, or by applying the plugin on an input inside an <code>input-group</code> with the proper size class(<code>input-group-sm</code>
|
||||||
|
or <code>input-group-lg</code>).
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo4">Button postfix (small):</label> <input id="demo4" type="text" value="" name="demo4"
|
||||||
|
class="input-sm">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<input id="demo4" type="text" value="" name="demo4" class="input-sm">
|
||||||
|
<script>
|
||||||
|
$("input[name='demo4']").TouchSpin({
|
||||||
|
postfix: "a button",
|
||||||
|
postfix_extraclass: "btn btn-default"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo4']").TouchSpin({
|
||||||
|
postfix: "a button",
|
||||||
|
postfix_extraclass: "btn btn-default"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo4">Button postfix (large):</label>
|
||||||
|
|
||||||
|
<div class="input-group input-group-lg">
|
||||||
|
<input id="demo4_2" type="text" value="" name="demo4_2" class="form-control input-lg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<div class="input-group input-group-lg">
|
||||||
|
<input id="demo4_2" type="text" value="" name="demo4_2" class="form-control input-lg">
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
$("input[name='demo4_2']").TouchSpin({
|
||||||
|
postfix: "a button",
|
||||||
|
postfix_extraclass: "btn btn-default"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo4_2']").TouchSpin({
|
||||||
|
postfix: "a button",
|
||||||
|
postfix_extraclass: "btn btn-default"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
|
||||||
|
<label for="demo5">Button group:</label>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<input id="demo5" type="text" class="form-control" name="demo5" value="50">
|
||||||
|
|
||||||
|
<div class="input-group-btn">
|
||||||
|
<button type="button" class="btn btn-default">Action</button>
|
||||||
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
|
||||||
|
<span class="caret"></span>
|
||||||
|
<span class="sr-only">Toggle Dropdown</span>
|
||||||
|
</button>
|
||||||
|
<ul class="dropdown-menu pull-right" role="menu">
|
||||||
|
<li><a href="#">Action</a></li>
|
||||||
|
<li><a href="#">Another action</a></li>
|
||||||
|
<li><a href="#">Something else here</a></li>
|
||||||
|
<li class="divider"></li>
|
||||||
|
<li><a href="#">Separated link</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
<div class="input-group">
|
||||||
|
<input id="demo5" type="text" class="form-control" name="demo5" value="50">
|
||||||
|
<div class="input-group-btn">
|
||||||
|
<button type="button" class="btn btn-default">Action</button>
|
||||||
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
|
||||||
|
<span class="caret"></span>
|
||||||
|
<span class="sr-only">Toggle Dropdown</span>
|
||||||
|
</button>
|
||||||
|
<ul class="dropdown-menu pull-right" role="menu">
|
||||||
|
<li><a href="#">Action</a></li>
|
||||||
|
<li><a href="#">Another action</a></li>
|
||||||
|
<li><a href="#">Something else here</a></li>
|
||||||
|
<li class="divider"></li>
|
||||||
|
<li><a href="#">Separated link</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
$("input[name='demo5']").TouchSpin({
|
||||||
|
prefix: "pre",
|
||||||
|
postfix: "post"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo5']").TouchSpin({
|
||||||
|
prefix: "pre",
|
||||||
|
postfix: "post"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo6">Change button class:</label> <input id="demo6" type="text" value="50" name="demo6">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
$("input[name='demo6']").TouchSpin({
|
||||||
|
buttondown_class: "btn btn-link",
|
||||||
|
buttonup_class: "btn btn-link"
|
||||||
|
});
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo6']").TouchSpin({
|
||||||
|
buttondown_class: "btn btn-link",
|
||||||
|
buttonup_class: "btn btn-link"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-5">
|
||||||
|
<label for="demo7">Blank/Non-Number replaced:</label> <input id="demo7" type="text" value="50" name="demo7">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-md-7">
|
||||||
|
<pre class="prettyprint">
|
||||||
|
$("input[name='demo7']").TouchSpin({
|
||||||
|
replacementval: 10
|
||||||
|
});
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$("input[name='demo7']").TouchSpin({
|
||||||
|
replacementval: 10
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>Event demo</h3>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-3">
|
||||||
|
<input id="demo7" type="text" value="50" name="demo7">
|
||||||
|
</div>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<pre id="demo7textarea" style="height:200px;overflow:auto;"></pre>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var i = $("input[name='demo7']"),
|
||||||
|
demoarea = $("#demo7textarea"),
|
||||||
|
text = "";
|
||||||
|
|
||||||
|
function writeLine(line) {
|
||||||
|
text += line + "\n";
|
||||||
|
demoarea.text(text);
|
||||||
|
demoarea.scrollTop(
|
||||||
|
demoarea[0].scrollHeight - demoarea.height()
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
i.TouchSpin({});
|
||||||
|
i.on("touchspin.on.startspin", function () {
|
||||||
|
writeLine("touchspin.on.startspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.startupspin", function () {
|
||||||
|
writeLine("touchspin.on.startupspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.startdownspin", function () {
|
||||||
|
writeLine("touchspin.on.startdownspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.stopspin", function () {
|
||||||
|
writeLine("touchspin.on.stopspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.stopupspin", function () {
|
||||||
|
writeLine("touchspin.on.stopupspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.stopdownspin", function () {
|
||||||
|
writeLine("touchspin.on.stopdownspin");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.min", function () {
|
||||||
|
writeLine("touchspin.on.min");
|
||||||
|
});
|
||||||
|
i.on("touchspin.on.max", function () {
|
||||||
|
writeLine("touchspin.on.max");
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2>Settings</h2>
|
||||||
|
<table class="table table-striped table-bordered docs">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Option</th>
|
||||||
|
<th>Default</th>
|
||||||
|
<th>Description</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>initval</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Applied when no explicit value is set on the input with the <code>value</code> attribute. Empty string means
|
||||||
|
that the value remains empty on initialization.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>replacementval</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Applied when user leaves the field empty/blank or enters non-number. Empty string means that the value will not be replaced.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>min</code></td>
|
||||||
|
<td><code>0</code></td>
|
||||||
|
<td>Minimum value.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>max</code></td>
|
||||||
|
<td><code>100</code></td>
|
||||||
|
<td>Maximum value.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>step</code></td>
|
||||||
|
<td><code>1</code></td>
|
||||||
|
<td>Incremental/decremental step on up/down change.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>forcestepdivisibility</code></td>
|
||||||
|
<td><code>'round'</code></td>
|
||||||
|
<td>How to force the value to be divisible by step value: <code>'none'</code> | <code>'round'</code> | <code>'floor'</code>
|
||||||
|
| <code>'ceil'</code></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>decimals</code></td>
|
||||||
|
<td><code>0</code></td>
|
||||||
|
<td>Number of decimal points.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>stepinterval</code></td>
|
||||||
|
<td><code>100</code></td>
|
||||||
|
<td>Refresh rate of the spinner in milliseconds.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>stepintervaldelay</code></td>
|
||||||
|
<td><code>500</code></td>
|
||||||
|
<td>Time in milliseconds before the spinner starts to spin.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>verticalbuttons</code></td>
|
||||||
|
<td><code>false</code></td>
|
||||||
|
<td>Enables the traditional up/down buttons.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>verticalupclass</code></td>
|
||||||
|
<td><code>'glyphicon glyphicon-chevron-up'</code></td>
|
||||||
|
<td>Class of the up button with vertical buttons mode enabled.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>verticaldownclass</code></td>
|
||||||
|
<td><code>'glyphicon glyphicon-chevron-down'</code></td>
|
||||||
|
<td>Class of the down button with vertical buttons mode enabled.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>prefix</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Text before the input.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>postfix</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Text after the input.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>prefix_extraclass</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Extra class(es) for prefix.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>postfix_extraclass</code></td>
|
||||||
|
<td><code>""</code></td>
|
||||||
|
<td>Extra class(es) for postfix.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>booster</code></td>
|
||||||
|
<td><code>true</code></td>
|
||||||
|
<td>If enabled, the the spinner is continually becoming faster as holding the button.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>boostat</code></td>
|
||||||
|
<td><code>10</code></td>
|
||||||
|
<td>Boost at every nth step.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>maxboostedstep</code></td>
|
||||||
|
<td><code>false</code></td>
|
||||||
|
<td>Maximum step when boosted.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>mousewheel</code></td>
|
||||||
|
<td><code>true</code></td>
|
||||||
|
<td>Enables the mouse wheel to change the value of the input.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>buttondown_class</code></td>
|
||||||
|
<td><code>'btn btn-default'</code></td>
|
||||||
|
<td>Class(es) of down button.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>buttonup_class</code></td>
|
||||||
|
<td><code>'btn btn-default'</code></td>
|
||||||
|
<td>Class(es) of up button.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>buttondown_txt</code></td>
|
||||||
|
<td><code>'-'</code></td>
|
||||||
|
<td>Content inside the down button.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>buttonup_txt</code></td>
|
||||||
|
<td><code>'+'</code></td>
|
||||||
|
<td>Content inside the up button.</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<h2>Events</h2>
|
||||||
|
|
||||||
|
<h3>Triggered events</h3>
|
||||||
|
|
||||||
|
<p>The following events are triggered on the original input by the plugin and can be listened on.</p>
|
||||||
|
|
||||||
|
<table class="table table-striped table-bordered docs">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Event</th>
|
||||||
|
<th>Description</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>change</code></td>
|
||||||
|
<td>Triggered when the value is changed with one of the buttons (but not triggered when the spinner hits the
|
||||||
|
limit set by <code>settings.min</code> or <code>settings.max</code>.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.startspin</code></td>
|
||||||
|
<td>Triggered when the spinner starts spinning upwards or downwards.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.startupspin</code></td>
|
||||||
|
<td>Triggered when the spinner starts spinning upwards.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.startdownspin</code></td>
|
||||||
|
<td>Triggered when the spinner starts spinning downwards.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.stopspin</code></td>
|
||||||
|
<td>Triggered when the spinner stops spinning.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.stopupspin</code></td>
|
||||||
|
<td>Triggered when the spinner stops upspinning.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.stopdownspin</code></td>
|
||||||
|
<td>Triggered when the spinner stops downspinning.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.min</code></td>
|
||||||
|
<td>Triggered when the spinner hits the limit set by <code>settings.min</code>.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.on.max</code></td>
|
||||||
|
<td>Triggered when the spinner hits the limit set by <code>settings.max</code>.</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<h3>Callable events</h3>
|
||||||
|
|
||||||
|
<p>The following events can be triggered on the original input.</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Example usages:<br>
|
||||||
|
<code class="prettyprint">$("input").trigger("touchspin.uponce");</code><br>
|
||||||
|
<code class="prettyprint">$("input").trigger("touchspin.updatesettings", {max: 1000});</code>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<table class="table table-striped table-bordered docs">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Event</th>
|
||||||
|
<th>Description</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.updatesettings</code></td>
|
||||||
|
<td><code>function(newoptions)</code>: Update any setting of an already initialized TouchSpin instance.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.uponce</code></td>
|
||||||
|
<td>Increase the value by one step.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.downonce</code></td>
|
||||||
|
<td>Decrease the value by one step.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.startupspin</code></td>
|
||||||
|
<td>Starts the spinner upwards.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.startdownspin</code></td>
|
||||||
|
<td>Starts the spinner downwards.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>touchspin.stopspin</code></td>
|
||||||
|
<td>Stops the spinner.</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<h2>Download</h2>
|
||||||
|
|
||||||
|
<p><a id="link-ghd" href="https://github.com/istvan-ujjmeszaros/bootstrap-touchspin">Download</a> from
|
||||||
|
github. Please report issues and suggestions to github's issue tracker or contact me on <a id="link-gp"
|
||||||
|
href="https://plus.google.com/101242556570448529330/posts"
|
||||||
|
target="_blank">g+</a> or
|
||||||
|
<a id="link-tw" href="https://twitter.com/styu007">twitter</a>!</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
prettyPrint();
|
||||||
|
</script>
|
45
static_old/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.css
vendored
Executable file
|
@ -0,0 +1,45 @@
|
||||||
|
/*
|
||||||
|
* Bootstrap TouchSpin - v3.1.2
|
||||||
|
* A mobile and touch friendly input spinner component for Bootstrap 3.
|
||||||
|
* http://www.virtuosoft.eu/code/bootstrap-touchspin/
|
||||||
|
*
|
||||||
|
* Made by István Ujj-Mészáros
|
||||||
|
* Under Apache License v2.0 License
|
||||||
|
*/
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical {
|
||||||
|
position: relative;
|
||||||
|
white-space: nowrap;
|
||||||
|
width: 1%;
|
||||||
|
vertical-align: middle;
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical > .btn {
|
||||||
|
display: block;
|
||||||
|
float: none;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: 8px 10px;
|
||||||
|
margin-left: -1px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up {
|
||||||
|
border-radius: 0;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
|
||||||
|
margin-top: -2px;
|
||||||
|
border-radius: 0;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical i {
|
||||||
|
position: absolute;
|
||||||
|
top: 3px;
|
||||||
|
left: 5px;
|
||||||
|
font-size: 9px;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
705
static_old/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.js
vendored
Executable file
|
@ -0,0 +1,705 @@
|
||||||
|
/*
|
||||||
|
* Bootstrap TouchSpin - v3.1.2
|
||||||
|
* A mobile and touch friendly input spinner component for Bootstrap 3.
|
||||||
|
* http://www.virtuosoft.eu/code/bootstrap-touchspin/
|
||||||
|
*
|
||||||
|
* Made by István Ujj-Mészáros
|
||||||
|
* Under Apache License v2.0 License
|
||||||
|
*/
|
||||||
|
(function($) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var _currentSpinnerId = 0;
|
||||||
|
|
||||||
|
function _scopedEventName(name, id) {
|
||||||
|
return name + '.touchspin_' + id;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _scopeEventNames(names, id) {
|
||||||
|
return $.map(names, function(name) {
|
||||||
|
return _scopedEventName(name, id);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$.fn.TouchSpin = function(options) {
|
||||||
|
|
||||||
|
if (options === 'destroy') {
|
||||||
|
this.each(function() {
|
||||||
|
var originalinput = $(this),
|
||||||
|
originalinput_data = originalinput.data();
|
||||||
|
$(document).off(_scopeEventNames([
|
||||||
|
'mouseup',
|
||||||
|
'touchend',
|
||||||
|
'touchcancel',
|
||||||
|
'mousemove',
|
||||||
|
'touchmove',
|
||||||
|
'scroll',
|
||||||
|
'scrollstart'], originalinput_data.spinnerid).join(' '));
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var defaults = {
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
initval: '',
|
||||||
|
replacementval: '',
|
||||||
|
step: 1,
|
||||||
|
decimals: 0,
|
||||||
|
stepinterval: 100,
|
||||||
|
forcestepdivisibility: 'round', // none | floor | round | ceil
|
||||||
|
stepintervaldelay: 500,
|
||||||
|
verticalbuttons: false,
|
||||||
|
verticalupclass: 'glyphicon glyphicon-chevron-up',
|
||||||
|
verticaldownclass: 'glyphicon glyphicon-chevron-down',
|
||||||
|
prefix: '',
|
||||||
|
postfix: '',
|
||||||
|
prefix_extraclass: '',
|
||||||
|
postfix_extraclass: '',
|
||||||
|
booster: true,
|
||||||
|
boostat: 10,
|
||||||
|
maxboostedstep: false,
|
||||||
|
mousewheel: true,
|
||||||
|
buttondown_class: 'btn btn-default',
|
||||||
|
buttonup_class: 'btn btn-default',
|
||||||
|
buttondown_txt: '-',
|
||||||
|
buttonup_txt: '+'
|
||||||
|
};
|
||||||
|
|
||||||
|
var attributeMap = {
|
||||||
|
min: 'min',
|
||||||
|
max: 'max',
|
||||||
|
initval: 'init-val',
|
||||||
|
replacementval: 'replacement-val',
|
||||||
|
step: 'step',
|
||||||
|
decimals: 'decimals',
|
||||||
|
stepinterval: 'step-interval',
|
||||||
|
verticalbuttons: 'vertical-buttons',
|
||||||
|
verticalupclass: 'vertical-up-class',
|
||||||
|
verticaldownclass: 'vertical-down-class',
|
||||||
|
forcestepdivisibility: 'force-step-divisibility',
|
||||||
|
stepintervaldelay: 'step-interval-delay',
|
||||||
|
prefix: 'prefix',
|
||||||
|
postfix: 'postfix',
|
||||||
|
prefix_extraclass: 'prefix-extra-class',
|
||||||
|
postfix_extraclass: 'postfix-extra-class',
|
||||||
|
booster: 'booster',
|
||||||
|
boostat: 'boostat',
|
||||||
|
maxboostedstep: 'max-boosted-step',
|
||||||
|
mousewheel: 'mouse-wheel',
|
||||||
|
buttondown_class: 'button-down-class',
|
||||||
|
buttonup_class: 'button-up-class',
|
||||||
|
buttondown_txt: 'button-down-txt',
|
||||||
|
buttonup_txt: 'button-up-txt'
|
||||||
|
};
|
||||||
|
|
||||||
|
return this.each(function() {
|
||||||
|
|
||||||
|
var settings,
|
||||||
|
originalinput = $(this),
|
||||||
|
originalinput_data = originalinput.data(),
|
||||||
|
container,
|
||||||
|
elements,
|
||||||
|
value,
|
||||||
|
downSpinTimer,
|
||||||
|
upSpinTimer,
|
||||||
|
downDelayTimeout,
|
||||||
|
upDelayTimeout,
|
||||||
|
spincount = 0,
|
||||||
|
spinning = false;
|
||||||
|
|
||||||
|
init();
|
||||||
|
|
||||||
|
|
||||||
|
function init() {
|
||||||
|
if (originalinput.data('alreadyinitialized')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
originalinput.data('alreadyinitialized', true);
|
||||||
|
_currentSpinnerId += 1;
|
||||||
|
originalinput.data('spinnerid', _currentSpinnerId);
|
||||||
|
|
||||||
|
|
||||||
|
if (!originalinput.is('input')) {
|
||||||
|
console.log('Must be an input.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
_initSettings();
|
||||||
|
_setInitval();
|
||||||
|
_checkValue();
|
||||||
|
_buildHtml();
|
||||||
|
_initElements();
|
||||||
|
_hideEmptyPrefixPostfix();
|
||||||
|
_bindEvents();
|
||||||
|
_bindEventsInterface();
|
||||||
|
elements.input.css('display', 'block');
|
||||||
|
}
|
||||||
|
|
||||||
|
function _setInitval() {
|
||||||
|
if (settings.initval !== '' && originalinput.val() === '') {
|
||||||
|
originalinput.val(settings.initval);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeSettings(newsettings) {
|
||||||
|
_updateSettings(newsettings);
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
var value = elements.input.val();
|
||||||
|
|
||||||
|
if (value !== '') {
|
||||||
|
value = Number(elements.input.val());
|
||||||
|
elements.input.val(value.toFixed(settings.decimals));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _initSettings() {
|
||||||
|
settings = $.extend({}, defaults, originalinput_data, _parseAttributes(), options);
|
||||||
|
}
|
||||||
|
|
||||||
|
function _parseAttributes() {
|
||||||
|
var data = {};
|
||||||
|
$.each(attributeMap, function(key, value) {
|
||||||
|
var attrName = 'bts-' + value + '';
|
||||||
|
if (originalinput.is('[data-' + attrName + ']')) {
|
||||||
|
data[key] = originalinput.data(attrName);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _updateSettings(newsettings) {
|
||||||
|
settings = $.extend({}, settings, newsettings);
|
||||||
|
|
||||||
|
// Update postfix and prefix texts if those settings were changed.
|
||||||
|
if (newsettings.postfix) {
|
||||||
|
originalinput.parent().find('.bootstrap-touchspin-postfix').text(newsettings.postfix);
|
||||||
|
}
|
||||||
|
if (newsettings.prefix) {
|
||||||
|
originalinput.parent().find('.bootstrap-touchspin-prefix').text(newsettings.prefix);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _buildHtml() {
|
||||||
|
var initval = originalinput.val(),
|
||||||
|
parentelement = originalinput.parent();
|
||||||
|
|
||||||
|
if (initval !== '') {
|
||||||
|
initval = Number(initval).toFixed(settings.decimals);
|
||||||
|
}
|
||||||
|
|
||||||
|
originalinput.data('initvalue', initval).val(initval);
|
||||||
|
originalinput.addClass('form-control');
|
||||||
|
|
||||||
|
if (parentelement.hasClass('input-group')) {
|
||||||
|
_advanceInputGroup(parentelement);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
_buildInputGroup();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _advanceInputGroup(parentelement) {
|
||||||
|
parentelement.addClass('bootstrap-touchspin');
|
||||||
|
|
||||||
|
var prev = originalinput.prev(),
|
||||||
|
next = originalinput.next();
|
||||||
|
|
||||||
|
var downhtml,
|
||||||
|
uphtml,
|
||||||
|
prefixhtml = '<span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span>',
|
||||||
|
postfixhtml = '<span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span>';
|
||||||
|
|
||||||
|
if (prev.hasClass('input-group-btn')) {
|
||||||
|
downhtml = '<button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button>';
|
||||||
|
prev.append(downhtml);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
downhtml = '<span class="input-group-btn"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button></span>';
|
||||||
|
$(downhtml).insertBefore(originalinput);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (next.hasClass('input-group-btn')) {
|
||||||
|
uphtml = '<button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button>';
|
||||||
|
next.prepend(uphtml);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
uphtml = '<span class="input-group-btn"><button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button></span>';
|
||||||
|
$(uphtml).insertAfter(originalinput);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(prefixhtml).insertBefore(originalinput);
|
||||||
|
$(postfixhtml).insertAfter(originalinput);
|
||||||
|
|
||||||
|
container = parentelement;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _buildInputGroup() {
|
||||||
|
var html;
|
||||||
|
|
||||||
|
if (settings.verticalbuttons) {
|
||||||
|
html = '<div class="input-group bootstrap-touchspin"><span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span><span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span><span class="input-group-btn-vertical"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-up" type="button"><i class="' + settings.verticalupclass + '"></i></button><button class="' + settings.buttonup_class + ' bootstrap-touchspin-down" type="button"><i class="' + settings.verticaldownclass + '"></i></button></span></div>';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
html = '<div class="input-group bootstrap-touchspin"><span class="input-group-btn"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button></span><span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span><span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span><span class="input-group-btn"><button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button></span></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
container = $(html).insertBefore(originalinput);
|
||||||
|
|
||||||
|
$('.bootstrap-touchspin-prefix', container).after(originalinput);
|
||||||
|
|
||||||
|
if (originalinput.hasClass('input-sm')) {
|
||||||
|
container.addClass('input-group-sm');
|
||||||
|
}
|
||||||
|
else if (originalinput.hasClass('input-lg')) {
|
||||||
|
container.addClass('input-group-lg');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _initElements() {
|
||||||
|
elements = {
|
||||||
|
down: $('.bootstrap-touchspin-down', container),
|
||||||
|
up: $('.bootstrap-touchspin-up', container),
|
||||||
|
input: $('input', container),
|
||||||
|
prefix: $('.bootstrap-touchspin-prefix', container).addClass(settings.prefix_extraclass),
|
||||||
|
postfix: $('.bootstrap-touchspin-postfix', container).addClass(settings.postfix_extraclass)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function _hideEmptyPrefixPostfix() {
|
||||||
|
if (settings.prefix === '') {
|
||||||
|
elements.prefix.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.postfix === '') {
|
||||||
|
elements.postfix.hide();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _bindEvents() {
|
||||||
|
originalinput.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 38) {
|
||||||
|
if (spinning !== 'up') {
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
else if (code === 40) {
|
||||||
|
if (spinning !== 'down') {
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 38) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
else if (code === 40) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('blur', function() {
|
||||||
|
_checkValue();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
if (spinning !== 'down') {
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
if (spinning !== 'up') {
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mousedown.touchspin', function(ev) {
|
||||||
|
elements.down.off('touchstart.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('touchstart.touchspin', function(ev) {
|
||||||
|
elements.down.off('mousedown.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mousedown.touchspin', function(ev) {
|
||||||
|
elements.up.off('touchstart.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('touchstart.touchspin', function(ev) {
|
||||||
|
elements.up.off('mousedown.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mouseout touchleave touchend touchcancel', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mouseout touchleave touchend touchcancel', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mousemove touchmove', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mousemove touchmove', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on(_scopeEventNames(['mouseup', 'touchend', 'touchcancel'], _currentSpinnerId).join(' '), function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on(_scopeEventNames(['mousemove', 'touchmove', 'scroll', 'scrollstart'], _currentSpinnerId).join(' '), function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('mousewheel DOMMouseScroll', function(ev) {
|
||||||
|
if (!settings.mousewheel || !originalinput.is(':focus')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var delta = ev.originalEvent.wheelDelta || -ev.originalEvent.deltaY || -ev.originalEvent.detail;
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
|
||||||
|
if (delta < 0) {
|
||||||
|
downOnce();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
upOnce();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function _bindEventsInterface() {
|
||||||
|
originalinput.on('touchspin.uponce', function() {
|
||||||
|
stopSpin();
|
||||||
|
upOnce();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.downonce', function() {
|
||||||
|
stopSpin();
|
||||||
|
downOnce();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.startupspin', function() {
|
||||||
|
startUpSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.startdownspin', function() {
|
||||||
|
startDownSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.stopspin', function() {
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.updatesettings', function(e, newsettings) {
|
||||||
|
changeSettings(newsettings);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function _forcestepdivisibility(value) {
|
||||||
|
switch (settings.forcestepdivisibility) {
|
||||||
|
case 'round':
|
||||||
|
return (Math.round(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
case 'floor':
|
||||||
|
return (Math.floor(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
case 'ceil':
|
||||||
|
return (Math.ceil(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
default:
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _checkValue() {
|
||||||
|
var val, parsedval, returnval;
|
||||||
|
|
||||||
|
val = originalinput.val();
|
||||||
|
|
||||||
|
if (val === '') {
|
||||||
|
if (settings.replacementval !== '') {
|
||||||
|
originalinput.val(settings.replacementval);
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.decimals > 0 && val === '.') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
parsedval = parseFloat(val);
|
||||||
|
|
||||||
|
if (isNaN(parsedval)) {
|
||||||
|
if (settings.replacementval !== '') {
|
||||||
|
parsedval = settings.replacementval;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
parsedval = 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
returnval = parsedval;
|
||||||
|
|
||||||
|
if (parsedval.toString() !== val) {
|
||||||
|
returnval = parsedval;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parsedval < settings.min) {
|
||||||
|
returnval = settings.min;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parsedval > settings.max) {
|
||||||
|
returnval = settings.max;
|
||||||
|
}
|
||||||
|
|
||||||
|
returnval = _forcestepdivisibility(returnval);
|
||||||
|
|
||||||
|
if (Number(val).toString() !== returnval.toString()) {
|
||||||
|
originalinput.val(returnval);
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _getBoostedStep() {
|
||||||
|
if (!settings.booster) {
|
||||||
|
return settings.step;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
var boosted = Math.pow(2, Math.floor(spincount / settings.boostat)) * settings.step;
|
||||||
|
|
||||||
|
if (settings.maxboostedstep) {
|
||||||
|
if (boosted > settings.maxboostedstep) {
|
||||||
|
boosted = settings.maxboostedstep;
|
||||||
|
value = Math.round((value / boosted)) * boosted;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return Math.max(settings.step, boosted);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function upOnce() {
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
value = parseFloat(elements.input.val());
|
||||||
|
if (isNaN(value)) {
|
||||||
|
value = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
var initvalue = value,
|
||||||
|
boostedstep = _getBoostedStep();
|
||||||
|
|
||||||
|
value = value + boostedstep;
|
||||||
|
|
||||||
|
if (value > settings.max) {
|
||||||
|
value = settings.max;
|
||||||
|
originalinput.trigger('touchspin.on.max');
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
|
||||||
|
elements.input.val(Number(value).toFixed(settings.decimals));
|
||||||
|
|
||||||
|
if (initvalue !== value) {
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function downOnce() {
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
value = parseFloat(elements.input.val());
|
||||||
|
if (isNaN(value)) {
|
||||||
|
value = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
var initvalue = value,
|
||||||
|
boostedstep = _getBoostedStep();
|
||||||
|
|
||||||
|
value = value - boostedstep;
|
||||||
|
|
||||||
|
if (value < settings.min) {
|
||||||
|
value = settings.min;
|
||||||
|
originalinput.trigger('touchspin.on.min');
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
|
||||||
|
elements.input.val(value.toFixed(settings.decimals));
|
||||||
|
|
||||||
|
if (initvalue !== value) {
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function startDownSpin() {
|
||||||
|
stopSpin();
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = 'down';
|
||||||
|
|
||||||
|
originalinput.trigger('touchspin.on.startspin');
|
||||||
|
originalinput.trigger('touchspin.on.startdownspin');
|
||||||
|
|
||||||
|
downDelayTimeout = setTimeout(function() {
|
||||||
|
downSpinTimer = setInterval(function() {
|
||||||
|
spincount++;
|
||||||
|
downOnce();
|
||||||
|
}, settings.stepinterval);
|
||||||
|
}, settings.stepintervaldelay);
|
||||||
|
}
|
||||||
|
|
||||||
|
function startUpSpin() {
|
||||||
|
stopSpin();
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = 'up';
|
||||||
|
|
||||||
|
originalinput.trigger('touchspin.on.startspin');
|
||||||
|
originalinput.trigger('touchspin.on.startupspin');
|
||||||
|
|
||||||
|
upDelayTimeout = setTimeout(function() {
|
||||||
|
upSpinTimer = setInterval(function() {
|
||||||
|
spincount++;
|
||||||
|
upOnce();
|
||||||
|
}, settings.stepinterval);
|
||||||
|
}, settings.stepintervaldelay);
|
||||||
|
}
|
||||||
|
|
||||||
|
function stopSpin() {
|
||||||
|
clearTimeout(downDelayTimeout);
|
||||||
|
clearTimeout(upDelayTimeout);
|
||||||
|
clearInterval(downSpinTimer);
|
||||||
|
clearInterval(upSpinTimer);
|
||||||
|
|
||||||
|
switch (spinning) {
|
||||||
|
case 'up':
|
||||||
|
originalinput.trigger('touchspin.on.stopupspin');
|
||||||
|
originalinput.trigger('touchspin.on.stopspin');
|
||||||
|
break;
|
||||||
|
case 'down':
|
||||||
|
originalinput.trigger('touchspin.on.stopdownspin');
|
||||||
|
originalinput.trigger('touchspin.on.stopspin');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
10
static_old/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.css
vendored
Executable file
|
@ -0,0 +1,10 @@
|
||||||
|
/*
|
||||||
|
* Bootstrap TouchSpin - v3.1.2
|
||||||
|
* A mobile and touch friendly input spinner component for Bootstrap 3.
|
||||||
|
* http://www.virtuosoft.eu/code/bootstrap-touchspin/
|
||||||
|
*
|
||||||
|
* Made by István Ujj-Mészáros
|
||||||
|
* Under Apache License v2.0 License
|
||||||
|
*/
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical{position:relative;white-space:nowrap;width:1%;vertical-align:middle;display:table-cell}.bootstrap-touchspin .input-group-btn-vertical>.btn{display:block;float:none;width:100%;max-width:100%;padding:8px 10px;margin-left:-1px;position:relative}.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up{border-radius:0;border-top-right-radius:4px}.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down{margin-top:-2px;border-radius:0;border-bottom-right-radius:4px}.bootstrap-touchspin .input-group-btn-vertical i{position:absolute;top:3px;left:5px;font-size:9px;font-weight:400}
|
9
static_old/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.js
vendored
Executable file
37
static_old/plugins/bootstrap-touchspin/src/jquery.bootstrap-touchspin.css
Executable file
|
@ -0,0 +1,37 @@
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical {
|
||||||
|
position: relative;
|
||||||
|
white-space: nowrap;
|
||||||
|
width: 1%;
|
||||||
|
vertical-align: middle;
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical > .btn {
|
||||||
|
display: block;
|
||||||
|
float: none;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: 8px 10px;
|
||||||
|
margin-left: -1px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up {
|
||||||
|
border-radius: 0;
|
||||||
|
border-top-right-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down {
|
||||||
|
margin-top: -2px;
|
||||||
|
border-radius: 0;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bootstrap-touchspin .input-group-btn-vertical i {
|
||||||
|
position: absolute;
|
||||||
|
top: 3px;
|
||||||
|
left: 5px;
|
||||||
|
font-size: 9px;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
697
static_old/plugins/bootstrap-touchspin/src/jquery.bootstrap-touchspin.js
Executable file
|
@ -0,0 +1,697 @@
|
||||||
|
(function($) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var _currentSpinnerId = 0;
|
||||||
|
|
||||||
|
function _scopedEventName(name, id) {
|
||||||
|
return name + '.touchspin_' + id;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _scopeEventNames(names, id) {
|
||||||
|
return $.map(names, function(name) {
|
||||||
|
return _scopedEventName(name, id);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$.fn.TouchSpin = function(options) {
|
||||||
|
|
||||||
|
if (options === 'destroy') {
|
||||||
|
this.each(function() {
|
||||||
|
var originalinput = $(this),
|
||||||
|
originalinput_data = originalinput.data();
|
||||||
|
$(document).off(_scopeEventNames([
|
||||||
|
'mouseup',
|
||||||
|
'touchend',
|
||||||
|
'touchcancel',
|
||||||
|
'mousemove',
|
||||||
|
'touchmove',
|
||||||
|
'scroll',
|
||||||
|
'scrollstart'], originalinput_data.spinnerid).join(' '));
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var defaults = {
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
initval: '',
|
||||||
|
replacementval: '',
|
||||||
|
step: 1,
|
||||||
|
decimals: 0,
|
||||||
|
stepinterval: 100,
|
||||||
|
forcestepdivisibility: 'round', // none | floor | round | ceil
|
||||||
|
stepintervaldelay: 500,
|
||||||
|
verticalbuttons: false,
|
||||||
|
verticalupclass: 'glyphicon glyphicon-chevron-up',
|
||||||
|
verticaldownclass: 'glyphicon glyphicon-chevron-down',
|
||||||
|
prefix: '',
|
||||||
|
postfix: '',
|
||||||
|
prefix_extraclass: '',
|
||||||
|
postfix_extraclass: '',
|
||||||
|
booster: true,
|
||||||
|
boostat: 10,
|
||||||
|
maxboostedstep: false,
|
||||||
|
mousewheel: true,
|
||||||
|
buttondown_class: 'btn btn-default',
|
||||||
|
buttonup_class: 'btn btn-default',
|
||||||
|
buttondown_txt: '-',
|
||||||
|
buttonup_txt: '+'
|
||||||
|
};
|
||||||
|
|
||||||
|
var attributeMap = {
|
||||||
|
min: 'min',
|
||||||
|
max: 'max',
|
||||||
|
initval: 'init-val',
|
||||||
|
replacementval: 'replacement-val',
|
||||||
|
step: 'step',
|
||||||
|
decimals: 'decimals',
|
||||||
|
stepinterval: 'step-interval',
|
||||||
|
verticalbuttons: 'vertical-buttons',
|
||||||
|
verticalupclass: 'vertical-up-class',
|
||||||
|
verticaldownclass: 'vertical-down-class',
|
||||||
|
forcestepdivisibility: 'force-step-divisibility',
|
||||||
|
stepintervaldelay: 'step-interval-delay',
|
||||||
|
prefix: 'prefix',
|
||||||
|
postfix: 'postfix',
|
||||||
|
prefix_extraclass: 'prefix-extra-class',
|
||||||
|
postfix_extraclass: 'postfix-extra-class',
|
||||||
|
booster: 'booster',
|
||||||
|
boostat: 'boostat',
|
||||||
|
maxboostedstep: 'max-boosted-step',
|
||||||
|
mousewheel: 'mouse-wheel',
|
||||||
|
buttondown_class: 'button-down-class',
|
||||||
|
buttonup_class: 'button-up-class',
|
||||||
|
buttondown_txt: 'button-down-txt',
|
||||||
|
buttonup_txt: 'button-up-txt'
|
||||||
|
};
|
||||||
|
|
||||||
|
return this.each(function() {
|
||||||
|
|
||||||
|
var settings,
|
||||||
|
originalinput = $(this),
|
||||||
|
originalinput_data = originalinput.data(),
|
||||||
|
container,
|
||||||
|
elements,
|
||||||
|
value,
|
||||||
|
downSpinTimer,
|
||||||
|
upSpinTimer,
|
||||||
|
downDelayTimeout,
|
||||||
|
upDelayTimeout,
|
||||||
|
spincount = 0,
|
||||||
|
spinning = false;
|
||||||
|
|
||||||
|
init();
|
||||||
|
|
||||||
|
|
||||||
|
function init() {
|
||||||
|
if (originalinput.data('alreadyinitialized')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
originalinput.data('alreadyinitialized', true);
|
||||||
|
_currentSpinnerId += 1;
|
||||||
|
originalinput.data('spinnerid', _currentSpinnerId);
|
||||||
|
|
||||||
|
|
||||||
|
if (!originalinput.is('input')) {
|
||||||
|
console.log('Must be an input.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
_initSettings();
|
||||||
|
_setInitval();
|
||||||
|
_checkValue();
|
||||||
|
_buildHtml();
|
||||||
|
_initElements();
|
||||||
|
_hideEmptyPrefixPostfix();
|
||||||
|
_bindEvents();
|
||||||
|
_bindEventsInterface();
|
||||||
|
elements.input.css('display', 'block');
|
||||||
|
}
|
||||||
|
|
||||||
|
function _setInitval() {
|
||||||
|
if (settings.initval !== '' && originalinput.val() === '') {
|
||||||
|
originalinput.val(settings.initval);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeSettings(newsettings) {
|
||||||
|
_updateSettings(newsettings);
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
var value = elements.input.val();
|
||||||
|
|
||||||
|
if (value !== '') {
|
||||||
|
value = Number(elements.input.val());
|
||||||
|
elements.input.val(value.toFixed(settings.decimals));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _initSettings() {
|
||||||
|
settings = $.extend({}, defaults, originalinput_data, _parseAttributes(), options);
|
||||||
|
}
|
||||||
|
|
||||||
|
function _parseAttributes() {
|
||||||
|
var data = {};
|
||||||
|
$.each(attributeMap, function(key, value) {
|
||||||
|
var attrName = 'bts-' + value + '';
|
||||||
|
if (originalinput.is('[data-' + attrName + ']')) {
|
||||||
|
data[key] = originalinput.data(attrName);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _updateSettings(newsettings) {
|
||||||
|
settings = $.extend({}, settings, newsettings);
|
||||||
|
|
||||||
|
// Update postfix and prefix texts if those settings were changed.
|
||||||
|
if (newsettings.postfix) {
|
||||||
|
originalinput.parent().find('.bootstrap-touchspin-postfix').text(newsettings.postfix);
|
||||||
|
}
|
||||||
|
if (newsettings.prefix) {
|
||||||
|
originalinput.parent().find('.bootstrap-touchspin-prefix').text(newsettings.prefix);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _buildHtml() {
|
||||||
|
var initval = originalinput.val(),
|
||||||
|
parentelement = originalinput.parent();
|
||||||
|
|
||||||
|
if (initval !== '') {
|
||||||
|
initval = Number(initval).toFixed(settings.decimals);
|
||||||
|
}
|
||||||
|
|
||||||
|
originalinput.data('initvalue', initval).val(initval);
|
||||||
|
originalinput.addClass('form-control');
|
||||||
|
|
||||||
|
if (parentelement.hasClass('input-group')) {
|
||||||
|
_advanceInputGroup(parentelement);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
_buildInputGroup();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _advanceInputGroup(parentelement) {
|
||||||
|
parentelement.addClass('bootstrap-touchspin');
|
||||||
|
|
||||||
|
var prev = originalinput.prev(),
|
||||||
|
next = originalinput.next();
|
||||||
|
|
||||||
|
var downhtml,
|
||||||
|
uphtml,
|
||||||
|
prefixhtml = '<span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span>',
|
||||||
|
postfixhtml = '<span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span>';
|
||||||
|
|
||||||
|
if (prev.hasClass('input-group-btn')) {
|
||||||
|
downhtml = '<button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button>';
|
||||||
|
prev.append(downhtml);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
downhtml = '<span class="input-group-btn"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button></span>';
|
||||||
|
$(downhtml).insertBefore(originalinput);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (next.hasClass('input-group-btn')) {
|
||||||
|
uphtml = '<button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button>';
|
||||||
|
next.prepend(uphtml);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
uphtml = '<span class="input-group-btn"><button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button></span>';
|
||||||
|
$(uphtml).insertAfter(originalinput);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(prefixhtml).insertBefore(originalinput);
|
||||||
|
$(postfixhtml).insertAfter(originalinput);
|
||||||
|
|
||||||
|
container = parentelement;
|
||||||
|
}
|
||||||
|
|
||||||
|
function _buildInputGroup() {
|
||||||
|
var html;
|
||||||
|
|
||||||
|
if (settings.verticalbuttons) {
|
||||||
|
html = '<div class="input-group bootstrap-touchspin"><span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span><span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span><span class="input-group-btn-vertical"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-up" type="button"><i class="' + settings.verticalupclass + '"></i></button><button class="' + settings.buttonup_class + ' bootstrap-touchspin-down" type="button"><i class="' + settings.verticaldownclass + '"></i></button></span></div>';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
html = '<div class="input-group bootstrap-touchspin"><span class="input-group-btn"><button class="' + settings.buttondown_class + ' bootstrap-touchspin-down" type="button">' + settings.buttondown_txt + '</button></span><span class="input-group-addon bootstrap-touchspin-prefix">' + settings.prefix + '</span><span class="input-group-addon bootstrap-touchspin-postfix">' + settings.postfix + '</span><span class="input-group-btn"><button class="' + settings.buttonup_class + ' bootstrap-touchspin-up" type="button">' + settings.buttonup_txt + '</button></span></div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
container = $(html).insertBefore(originalinput);
|
||||||
|
|
||||||
|
$('.bootstrap-touchspin-prefix', container).after(originalinput);
|
||||||
|
|
||||||
|
if (originalinput.hasClass('input-sm')) {
|
||||||
|
container.addClass('input-group-sm');
|
||||||
|
}
|
||||||
|
else if (originalinput.hasClass('input-lg')) {
|
||||||
|
container.addClass('input-group-lg');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _initElements() {
|
||||||
|
elements = {
|
||||||
|
down: $('.bootstrap-touchspin-down', container),
|
||||||
|
up: $('.bootstrap-touchspin-up', container),
|
||||||
|
input: $('input', container),
|
||||||
|
prefix: $('.bootstrap-touchspin-prefix', container).addClass(settings.prefix_extraclass),
|
||||||
|
postfix: $('.bootstrap-touchspin-postfix', container).addClass(settings.postfix_extraclass)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function _hideEmptyPrefixPostfix() {
|
||||||
|
if (settings.prefix === '') {
|
||||||
|
elements.prefix.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.postfix === '') {
|
||||||
|
elements.postfix.hide();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _bindEvents() {
|
||||||
|
originalinput.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 38) {
|
||||||
|
if (spinning !== 'up') {
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
else if (code === 40) {
|
||||||
|
if (spinning !== 'down') {
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 38) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
else if (code === 40) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('blur', function() {
|
||||||
|
_checkValue();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
if (spinning !== 'down') {
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('keydown', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
if (spinning !== 'up') {
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
}
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('keyup', function(ev) {
|
||||||
|
var code = ev.keyCode || ev.which;
|
||||||
|
|
||||||
|
if (code === 32 || code === 13) {
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mousedown.touchspin', function(ev) {
|
||||||
|
elements.down.off('touchstart.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('touchstart.touchspin', function(ev) {
|
||||||
|
elements.down.off('mousedown.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
downOnce();
|
||||||
|
startDownSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mousedown.touchspin', function(ev) {
|
||||||
|
elements.up.off('touchstart.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('touchstart.touchspin', function(ev) {
|
||||||
|
elements.up.off('mousedown.touchspin'); // android 4 workaround
|
||||||
|
|
||||||
|
if (originalinput.is(':disabled')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
upOnce();
|
||||||
|
startUpSpin();
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mouseout touchleave touchend touchcancel', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mouseout touchleave touchend touchcancel', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.down.on('mousemove touchmove', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
elements.up.on('mousemove touchmove', function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on(_scopeEventNames(['mouseup', 'touchend', 'touchcancel'], _currentSpinnerId).join(' '), function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on(_scopeEventNames(['mousemove', 'touchmove', 'scroll', 'scrollstart'], _currentSpinnerId).join(' '), function(ev) {
|
||||||
|
if (!spinning) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('mousewheel DOMMouseScroll', function(ev) {
|
||||||
|
if (!settings.mousewheel || !originalinput.is(':focus')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var delta = ev.originalEvent.wheelDelta || -ev.originalEvent.deltaY || -ev.originalEvent.detail;
|
||||||
|
|
||||||
|
ev.stopPropagation();
|
||||||
|
ev.preventDefault();
|
||||||
|
|
||||||
|
if (delta < 0) {
|
||||||
|
downOnce();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
upOnce();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function _bindEventsInterface() {
|
||||||
|
originalinput.on('touchspin.uponce', function() {
|
||||||
|
stopSpin();
|
||||||
|
upOnce();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.downonce', function() {
|
||||||
|
stopSpin();
|
||||||
|
downOnce();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.startupspin', function() {
|
||||||
|
startUpSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.startdownspin', function() {
|
||||||
|
startDownSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.stopspin', function() {
|
||||||
|
stopSpin();
|
||||||
|
});
|
||||||
|
|
||||||
|
originalinput.on('touchspin.updatesettings', function(e, newsettings) {
|
||||||
|
changeSettings(newsettings);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function _forcestepdivisibility(value) {
|
||||||
|
switch (settings.forcestepdivisibility) {
|
||||||
|
case 'round':
|
||||||
|
return (Math.round(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
case 'floor':
|
||||||
|
return (Math.floor(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
case 'ceil':
|
||||||
|
return (Math.ceil(value / settings.step) * settings.step).toFixed(settings.decimals);
|
||||||
|
default:
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _checkValue() {
|
||||||
|
var val, parsedval, returnval;
|
||||||
|
|
||||||
|
val = originalinput.val();
|
||||||
|
|
||||||
|
if (val === '') {
|
||||||
|
if (settings.replacementval !== '') {
|
||||||
|
originalinput.val(settings.replacementval);
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.decimals > 0 && val === '.') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
parsedval = parseFloat(val);
|
||||||
|
|
||||||
|
if (isNaN(parsedval)) {
|
||||||
|
if (settings.replacementval !== '') {
|
||||||
|
parsedval = settings.replacementval;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
parsedval = 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
returnval = parsedval;
|
||||||
|
|
||||||
|
if (parsedval.toString() !== val) {
|
||||||
|
returnval = parsedval;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parsedval < settings.min) {
|
||||||
|
returnval = settings.min;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parsedval > settings.max) {
|
||||||
|
returnval = settings.max;
|
||||||
|
}
|
||||||
|
|
||||||
|
returnval = _forcestepdivisibility(returnval);
|
||||||
|
|
||||||
|
if (Number(val).toString() !== returnval.toString()) {
|
||||||
|
originalinput.val(returnval);
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function _getBoostedStep() {
|
||||||
|
if (!settings.booster) {
|
||||||
|
return settings.step;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
var boosted = Math.pow(2, Math.floor(spincount / settings.boostat)) * settings.step;
|
||||||
|
|
||||||
|
if (settings.maxboostedstep) {
|
||||||
|
if (boosted > settings.maxboostedstep) {
|
||||||
|
boosted = settings.maxboostedstep;
|
||||||
|
value = Math.round((value / boosted)) * boosted;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return Math.max(settings.step, boosted);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function upOnce() {
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
value = parseFloat(elements.input.val());
|
||||||
|
if (isNaN(value)) {
|
||||||
|
value = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
var initvalue = value,
|
||||||
|
boostedstep = _getBoostedStep();
|
||||||
|
|
||||||
|
value = value + boostedstep;
|
||||||
|
|
||||||
|
if (value > settings.max) {
|
||||||
|
value = settings.max;
|
||||||
|
originalinput.trigger('touchspin.on.max');
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
|
||||||
|
elements.input.val(Number(value).toFixed(settings.decimals));
|
||||||
|
|
||||||
|
if (initvalue !== value) {
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function downOnce() {
|
||||||
|
_checkValue();
|
||||||
|
|
||||||
|
value = parseFloat(elements.input.val());
|
||||||
|
if (isNaN(value)) {
|
||||||
|
value = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
var initvalue = value,
|
||||||
|
boostedstep = _getBoostedStep();
|
||||||
|
|
||||||
|
value = value - boostedstep;
|
||||||
|
|
||||||
|
if (value < settings.min) {
|
||||||
|
value = settings.min;
|
||||||
|
originalinput.trigger('touchspin.on.min');
|
||||||
|
stopSpin();
|
||||||
|
}
|
||||||
|
|
||||||
|
elements.input.val(value.toFixed(settings.decimals));
|
||||||
|
|
||||||
|
if (initvalue !== value) {
|
||||||
|
originalinput.trigger('change');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function startDownSpin() {
|
||||||
|
stopSpin();
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = 'down';
|
||||||
|
|
||||||
|
originalinput.trigger('touchspin.on.startspin');
|
||||||
|
originalinput.trigger('touchspin.on.startdownspin');
|
||||||
|
|
||||||
|
downDelayTimeout = setTimeout(function() {
|
||||||
|
downSpinTimer = setInterval(function() {
|
||||||
|
spincount++;
|
||||||
|
downOnce();
|
||||||
|
}, settings.stepinterval);
|
||||||
|
}, settings.stepintervaldelay);
|
||||||
|
}
|
||||||
|
|
||||||
|
function startUpSpin() {
|
||||||
|
stopSpin();
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = 'up';
|
||||||
|
|
||||||
|
originalinput.trigger('touchspin.on.startspin');
|
||||||
|
originalinput.trigger('touchspin.on.startupspin');
|
||||||
|
|
||||||
|
upDelayTimeout = setTimeout(function() {
|
||||||
|
upSpinTimer = setInterval(function() {
|
||||||
|
spincount++;
|
||||||
|
upOnce();
|
||||||
|
}, settings.stepinterval);
|
||||||
|
}, settings.stepintervaldelay);
|
||||||
|
}
|
||||||
|
|
||||||
|
function stopSpin() {
|
||||||
|
clearTimeout(downDelayTimeout);
|
||||||
|
clearTimeout(upDelayTimeout);
|
||||||
|
clearInterval(downSpinTimer);
|
||||||
|
clearInterval(upSpinTimer);
|
||||||
|
|
||||||
|
switch (spinning) {
|
||||||
|
case 'up':
|
||||||
|
originalinput.trigger('touchspin.on.stopupspin');
|
||||||
|
originalinput.trigger('touchspin.on.stopspin');
|
||||||
|
break;
|
||||||
|
case 'down':
|
||||||
|
originalinput.trigger('touchspin.on.stopdownspin');
|
||||||
|
originalinput.trigger('touchspin.on.stopspin');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
spincount = 0;
|
||||||
|
spinning = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|