angular-float-box 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +66 -4
- data/angular-float-box.gemspec +0 -4
- data/lib/angular-float-box/version.rb +1 -1
- data/vendor/assets/javascripts/angular-float-box.js +14 -7
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: d067131d3c8eb400ebdbe96b27936187d55a18ba
|
4
|
+
data.tar.gz: 9eba1b20c6bf11ab0cd10b5a89577cd934bc54ad
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 67b22adf36dfdc7dcc2a34379390c8067a92fb66385ddbc5872aa84f174a926df8d0563cbefa0f1b5e5cd87acb7a0c7b0ca30d9aefd56720fdca0dae7bef5b4d
|
7
|
+
data.tar.gz: 45b573e96fad81fab15ad202e572124ff3c4fb007bbf5e942204cd048b4f0691812b9842c8716f5878152f137d07aaab95fce63d510b849305dd53b07d902217
|
data/README.md
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
# Angular
|
1
|
+
# Angular Float Box
|
2
2
|
|
3
3
|
Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/angular-float-box`. To experiment with that code, run `bin/console` for an interactive prompt.
|
4
4
|
|
@@ -14,15 +14,77 @@ gem 'angular-float-box'
|
|
14
14
|
|
15
15
|
And then execute:
|
16
16
|
|
17
|
-
|
17
|
+
```bash
|
18
|
+
$ bundle
|
19
|
+
```
|
18
20
|
|
19
21
|
Or install it yourself as:
|
20
22
|
|
21
|
-
|
23
|
+
```bash
|
24
|
+
$ gem install angular-float-box
|
25
|
+
```
|
22
26
|
|
23
27
|
## Usage
|
24
28
|
|
25
|
-
|
29
|
+
### Require Assets
|
30
|
+
Require float-box to your application.css:
|
31
|
+
```scss
|
32
|
+
*= require angular-float-box.min
|
33
|
+
```
|
34
|
+
Require float-box to your application.js:
|
35
|
+
```js
|
36
|
+
//= require angular-float-box.min
|
37
|
+
```
|
38
|
+
Add the float-box module as a dependency to your application module:
|
39
|
+
```js
|
40
|
+
var app = angular.module('MyApp', ['angular-float-box'])
|
41
|
+
```
|
42
|
+
Add the float-box service as a dependency to the controller(s) you would like to use it in.
|
43
|
+
```js
|
44
|
+
app.controller("UsersCtrl", ['$scope' 'floatBox',
|
45
|
+
function($scope, floatBox) {
|
46
|
+
...
|
47
|
+
}])
|
48
|
+
```
|
49
|
+
|
50
|
+
### Functions
|
51
|
+
To start using the float-box functionality you will need to initialize it in your controller and pass in the $scope.
|
52
|
+
```js
|
53
|
+
floatBox.initialize($scope);
|
54
|
+
```
|
55
|
+
Float-box is built mobile friendly, which means appearing when you need it and disappearing when you don't. For this purpose, float-box has a handful of functions for showing and hidding.
|
56
|
+
```js
|
57
|
+
// Display float-box
|
58
|
+
floatBox.show();
|
59
|
+
// Hide float-box
|
60
|
+
floatBox.hide();
|
61
|
+
// Show float-box via slide
|
62
|
+
floatBox.slide_in(direction); // right, left, top, down
|
63
|
+
// Hide float-box via slide
|
64
|
+
floatBox.slide_out(direction); // right, left, top, down
|
65
|
+
```
|
66
|
+
Navigating between create, read and update tabs.
|
67
|
+
```js
|
68
|
+
// Show float-box-create-tab if not already shown.
|
69
|
+
floatBox.create();
|
70
|
+
// Show float-box-read-tab if not already shown.
|
71
|
+
floatBox.read();
|
72
|
+
// Show float-box-update-tab if not already shown.
|
73
|
+
floatBox.update();
|
74
|
+
```
|
75
|
+
Formatting float-box
|
76
|
+
```js
|
77
|
+
// Adjust size of float-box-title if it is to large for float-box.
|
78
|
+
floatBox.normalize_title();
|
79
|
+
```
|
80
|
+
|
81
|
+
## Float-Box HTML
|
82
|
+
|
83
|
+
[Float Box Basic HTML](https://github.com/amcritchie/angular-float-box/wiki/Float-Box-HTML)
|
84
|
+
* [Float Box Create Tab HTML](https://github.com/amcritchie/angular-float-box/wiki/Float-Box-HTML-Create-Tab)
|
85
|
+
* [Float Box Read Tab HTML](https://github.com/amcritchie/angular-float-box/wiki/Float-Box-HTML-Read-Tab)
|
86
|
+
* [Float Box Update Tab HTML](https://github.com/amcritchie/angular-float-box/wiki/Float-Box-HTML-Update-Tab)
|
87
|
+
|
26
88
|
|
27
89
|
## Development
|
28
90
|
|
data/angular-float-box.gemspec
CHANGED
@@ -14,11 +14,7 @@ Gem::Specification.new do |spec|
|
|
14
14
|
spec.homepage = "https://github.com/amcritchie/angular-float-box"
|
15
15
|
spec.license = "MIT"
|
16
16
|
|
17
|
-
# Prevent pushing this gem to RubyGems.org. To allow pushes either set the 'allowed_push_host'
|
18
|
-
# to allow pushing to a single host or delete this section to allow pushing to any host.
|
19
17
|
if spec.respond_to?(:metadata)
|
20
|
-
# spec.metadata['allowed_push_host'] = "TODO: Set to 'http://mygemserver.com'"
|
21
|
-
# spec.metadata['allowed_push_host'] = "http://mygemserver.com"
|
22
18
|
spec.metadata['allowed_push_host'] = "https://rubygems.org"
|
23
19
|
else
|
24
20
|
raise "RubyGems 2.0 or newer is required to protect against public gem pushes."
|
@@ -93,15 +93,22 @@
|
|
93
93
|
})
|
94
94
|
}
|
95
95
|
|
96
|
-
// Show float-box
|
97
|
-
this.
|
98
|
-
$( "#float-box" ).show(
|
96
|
+
// Show float-box
|
97
|
+
this.show = function() {
|
98
|
+
$( "#float-box" ).show()
|
99
99
|
}
|
100
|
-
|
101
|
-
|
102
|
-
|
100
|
+
// Hide float-box
|
101
|
+
this.hide = function() {
|
102
|
+
$( "#float-box" ).hide()
|
103
|
+
}
|
104
|
+
// Show float-box via slide in from the direction specified.
|
105
|
+
this.slide_in = function(direction) {
|
106
|
+
$( "#float-box" ).show( "drop", {direction: direction})
|
107
|
+
}
|
108
|
+
// Hide float-box via slide in from the direction specified.
|
109
|
+
this.slide_out = function(direction) {
|
103
110
|
if ($(window).width() < 768) {
|
104
|
-
$( "#float-box" ).hide( "drop", {direction:
|
111
|
+
$( "#float-box" ).hide( "drop", {direction: direction})
|
105
112
|
};
|
106
113
|
}
|
107
114
|
|