custom_loader 0.1.0 → 0.2.0
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 +20 -7
- data/lib/custom_loader.rb +59 -52
- data/lib/custom_loader/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 1ee5c43c2e1e5eb4c3641d1294d895243646a752
|
4
|
+
data.tar.gz: 69a9637417ddfa8be0223806174c09250f3a66c9
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 17217805f979943fb0241bb2f80037e194f2afe899e6c2cf198d04afddce06ad6803ff0ff74b790b4fe08c9fcd3a328da684fe341c3f7bcf32e062abfd7d4d21
|
7
|
+
data.tar.gz: 906a01dbd5ca993488782acb55454293c71abfd7307c44658da6b380044338eb565db9d36e267fc16f087d0db3d940a1d580b045754137cf83a7614549372518
|
data/README.md
CHANGED
@@ -25,20 +25,33 @@ I would suggest including the below line in application.html layout but you can
|
|
25
25
|
|
26
26
|
<%= CustomLoader.setup_custom_loader_images.html_safe%>
|
27
27
|
|
28
|
-
|
28
|
+
Now if you are planning to include your own custom images which are not existing in your rails asset path and you are having some open source URLs of your images then pass those URLs in an array with the named parameter as mentioned below:
|
29
29
|
|
30
|
-
CustomLoader.
|
30
|
+
<%= CustomLoader.setup_custom_loader_images(my_img_urls: ["URL1","URL2",....,"URLn"]).html_safe%>
|
31
31
|
|
32
|
-
|
32
|
+
This command will include all loader images on viewport . If you will not include this then all loaders images that are not existing in your assets folder will take time to render on first load. Now add the below line where ever you want to add the loader:
|
33
33
|
|
34
|
-
|
34
|
+
CustomLoader.custom_loader(NAMED PARAMETERS).html_safe
|
35
35
|
|
36
|
-
|
36
|
+
The custom_loader method Named Parameters are described below:
|
37
37
|
|
38
|
-
|
38
|
+
element_reference_name: Provide the HTML elements(div,span,etc) identifier where the loader needs to be appended, for example it can be an elements ID, Class or you can specify the HTML tags like: body, span, label, etc...
|
39
|
+
|
40
|
+
reference_type: Here specify that what kind of identifier is your previous parameter(element_reference_name) , for example :- "id","class", for other cases you need not initialize this parameter.
|
41
|
+
|
42
|
+
image_url: If you wish to use your own custom image, you can pass its URL here. You can use asset_path to provide assets image URL or can pass a open source web URL directly.
|
43
|
+
|
44
|
+
loader_type: If you wish to use some custom loader images provided by us you can simply leave image_url parameter and specify the loader type to be rendered from the following sets of loaders: stream, circle, blob, blue_diameter, bouncing_balls, dna, gears1, gears2, pie_loader_cyan, snake_game, sand_clock, sliding_discs.
|
45
|
+
|
46
|
+
content_position: Specify the position of text with respect to image in loader. It can be: "up", "down", "left", "right", "middle"
|
47
|
+
|
48
|
+
content: Enter the text to be displayed with the loader, if nil then Loading will be displayed as default.
|
39
49
|
|
40
|
-
|
50
|
+
text_color: Enter the text color to be displayed with the loader, if nil then black text will be displayed as default. If you want to customize the color but not the Default text then pass parameter 3 as nil .
|
41
51
|
|
52
|
+
Suppose you need to provide a loader in a div with id: "test_div" and want a stream Loader with text in golden color, so you can define loader as below example:
|
53
|
+
|
54
|
+
CustomLoader.custom_loader(element_reference_name: "test_div", reference_type: "id", loader_type: "stream", text_color: "gold").html_safe
|
42
55
|
|
43
56
|
## Development
|
44
57
|
|
data/lib/custom_loader.rb
CHANGED
@@ -2,77 +2,84 @@ require "custom_loader/version"
|
|
2
2
|
|
3
3
|
module CustomLoader
|
4
4
|
class Error < StandardError; end
|
5
|
-
def self.custom_loader(
|
5
|
+
def self.custom_loader(element_reference_name: nil, reference_type: nil, image_url: nil, loader_type: nil, content_position: nil, content: nil, text_color: nil)
|
6
6
|
loader_label=''
|
7
|
-
|
8
|
-
|
7
|
+
content||="Loading"
|
8
|
+
text_color||=""
|
9
|
+
content_position||="down"
|
10
|
+
loader_type||="bouncing_balls"
|
11
|
+
reference_type||="id"
|
12
|
+
element_reference_name||=""
|
13
|
+
image_url||=""
|
14
|
+
if image_url.empty?
|
15
|
+
image_path="https://raw.githubusercontent.com/RajDhruv/hubCafe/master/app/assets/images/custom_loader"
|
16
|
+
case loader_type
|
17
|
+
when "stream"
|
18
|
+
image_url="#{image_path}/stream_loader.gif"
|
19
|
+
when "circle"
|
20
|
+
image_url="#{image_path}/circle_loader.gif"
|
21
|
+
when "blob"
|
22
|
+
image_url="#{image_path}/blob.gif"
|
23
|
+
when "blue_diameter"
|
24
|
+
image_url="#{image_path}/blue_diameter.gif"
|
25
|
+
when "bouncing_balls"
|
26
|
+
image_url="#{image_path}/bouncing_balls.gif"
|
27
|
+
when "dna"
|
28
|
+
image_url="#{image_path}/dna.gif"
|
29
|
+
when "gears1"
|
30
|
+
image_url="#{image_path}/gears1.gif"
|
31
|
+
when "gears2"
|
32
|
+
image_url="#{image_path}/gears2.gif"
|
33
|
+
when "pie_loader_cyan"
|
34
|
+
image_url="#{image_path}/pie_loader_cyan.gif"
|
35
|
+
when "snake_game"
|
36
|
+
image_url="#{image_path}/snake_game.gif"
|
37
|
+
when "sand_clock"
|
38
|
+
image_url="#{image_path}/sand_clock.gif"
|
39
|
+
when "sliding_discs"
|
40
|
+
image_url="#{image_path}/sliding_discs.gif"
|
41
|
+
end
|
9
42
|
end
|
10
|
-
if
|
11
|
-
|
43
|
+
if content_position=="up"
|
44
|
+
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div>"+content+"</div><div><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></div></center>"
|
45
|
+
elsif content_position=="down"
|
46
|
+
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
47
|
+
elsif content_position=="left"
|
48
|
+
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
|
49
|
+
elsif content_position=="right"
|
50
|
+
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td></tr></table></center>"
|
51
|
+
elsif content_position=="middle"
|
52
|
+
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_url}\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
|
53
|
+
end
|
54
|
+
return_string=""
|
55
|
+
if reference_type=="id"
|
56
|
+
return_string="$(\"#"+element_reference_name+"\").html(\""+loader_label+"\")"
|
57
|
+
elsif reference_type=="class"
|
58
|
+
return_string="$(\"."+element_reference_name+"\").html(\""+loader_label+"\")"
|
59
|
+
else
|
60
|
+
return_string="$(\""+element_reference_name+"\").html(\""+loader_label+"\")"
|
12
61
|
end
|
13
|
-
|
14
|
-
if loader_type=="stream"
|
15
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'>"+content+" <img src=\'#{image_path}/stream_loader.gif\' alt=\'...\' width=\'50\'/></center>"
|
16
|
-
elsif loader_type=="circle"
|
17
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/circle_loader.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
18
|
-
elsif loader_type=="blob"
|
19
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/blob.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
20
|
-
elsif loader_type=="blue_diameter"
|
21
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/blue_diameter.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
22
|
-
elsif loader_type=="bouncing_balls"
|
23
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/bouncing_balls.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
24
|
-
elsif loader_type=="dna"
|
25
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/dna.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
26
|
-
elsif loader_type=="gears1"
|
27
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/gears1.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
28
|
-
elsif loader_type=="gears2"
|
29
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/gears2.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
30
|
-
elsif loader_type=="pie_loader_cyan"
|
31
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/pie_loader_cyan.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
32
|
-
elsif loader_type=="snake_game"
|
33
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/snake_game.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
34
|
-
elsif loader_type=="sand_clock_up"
|
35
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
36
|
-
elsif loader_type=="sliding_discs_up"
|
37
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><div><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></div><div>"+content+"</div></center>"
|
38
|
-
elsif loader_type=="sand_clock"
|
39
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td></tr></table></center>"
|
40
|
-
elsif loader_type=="sliding_discs"
|
41
|
-
loader_label=loader_label+"<center style=\'margin-top:20px;color:"+text_color+"\'><table><tr><td align=\'center\'><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></td><td align=\'center\'>"+content+"</td><td align=\'center\'><img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\'/></td></tr></table></center>"
|
42
|
-
end
|
43
|
-
"$(\"#"+div_id+"\").html(\""+loader_label+"\")"
|
62
|
+
return_string
|
44
63
|
end
|
45
64
|
|
46
|
-
def self.setup_custom_loader_images()
|
65
|
+
def self.setup_custom_loader_images(my_img_urls: [])
|
47
66
|
loader_label_img=''
|
48
67
|
image_path="https://raw.githubusercontent.com/RajDhruv/hubCafe/master/app/assets/images/custom_loader"
|
49
68
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/stream_loader.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
50
|
-
|
51
69
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/circle_loader.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
52
|
-
|
53
70
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/blob.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
54
|
-
|
55
71
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/blue_diameter.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
56
|
-
|
57
72
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/bouncing_balls.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
58
|
-
|
59
73
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/dna.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
60
|
-
|
61
74
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/gears1.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
62
|
-
|
63
75
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/gears2.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
64
|
-
|
65
76
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/pie_loader_cyan.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
66
|
-
|
67
77
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/snake_game.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
68
|
-
|
69
|
-
loader_label_img=loader_label_img+"<img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
70
|
-
|
71
|
-
loader_label_img=loader_label_img+"<img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
72
|
-
|
73
78
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/sand_clock.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
74
|
-
|
75
79
|
loader_label_img=loader_label_img+"<img src=\'#{image_path}/sliding_discs.gif\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
80
|
+
my_img_urls.each do |url|
|
81
|
+
loader_label_img=loader_label_img+"<img src=\'#{url}\' alt=\'...\' width=\'50\' style=\'display:none;\'/>"
|
82
|
+
end
|
76
83
|
loader_label_img
|
77
84
|
end
|
78
85
|
end
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: custom_loader
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.2.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Dhruv Raj
|
8
8
|
autorequire:
|
9
9
|
bindir: exe
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-04-
|
11
|
+
date: 2019-04-09 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|