Issues (121)

src/js/mivhak.methods.js (6 issues)

1
/**
2
 * jQuery plugin's methods. 
3
 * In all methods, the 'this' keyword is pointing to the calling instance of Mivhak.
4
 * These functions serve as the plugin's public API.
5
 */
6
Mivhak.methods = {
0 ignored issues
show
The variable Mivhak seems to be never declared. If this is a global, consider adding a /** global: Mivhak */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
7
    
8
    /**
9
     * Toggle line wrap on/off for the currently active tab. Initially set to 
10
     * on (true) by default.
11
     */
12
    toggleLineWrap: function() {
13
        var $this = this;
14
        this.state.lineWrap = !this.state.lineWrap;
15
        $.each(this.tabs.tabs, function(i,tab) {
16
            tab.editor.getSession().setUseWrapMode($this.state.lineWrap);
17
            tab.vscroll.refresh();
18
            tab.hscroll.refresh();
19
        });
20
    },
21
    
22
    /**
23
     * copy the code in the currently active tab to clipboard (works in all
24
     * browsers apart from Safari, where it selects the code and prompts the 
25
     * user to press command+c)
26
     */
27
    copyCode: function() {
28
        var editor = this.activeTab.editor;
29
        editor.selection.selectAll();
30
        editor.focus();
31
        if(document.execCommand('copy')) {
32
            editor.selection.clearSelection();
33
            this.notifier.timedNotification('Copied to clipboard!', 2000);
34
        }
35
        else this.notifier.timedNotification('Press ⌘+C to copy the code', 2000);
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
36
    },
37
    
38
    /**
39
     * Collapse the viewport and show a "Show Code" button.
40
     */
41
    collapse: function() {
42
        if(this.state.collapsed) return;
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
43
        var $this = this;
44
        this.state.collapsed = true;
45
        this.notifier.callbackNotification('Show Code', function(){this.hide();$this.callMethod('expand');});
46
        this.$selection.addClass('mivhak-collapsed');
47
        this.callMethod('setHeight',this.notifier.$el.outerHeight(true));
48
    },
49
    
50
    /**
51
     * Expand the viewport if it's collapsed;
52
     */
53
    expand: function() {
54
        if(!this.state.collapsed) return;
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
55
        this.state.collapsed = false;
56
        this.notifier.hide(); // In case it's called by an external script
57
        this.$selection.removeClass('mivhak-collapsed');
58
        this.callMethod('setHeight',this.options.height);
59
    },
60
    
61
    /**
62
     * Show/activate a tab by the given index (zero based).
63
     * @param {number} index
64
     */
65
    showTab: function(index) {
66
        this.tabs.showTab(index);
67
        this.topbar.activateNavTab(index);
68
        if(this.options.runnable)
69
            this.preview.hide();
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
70
    },
71
    
72
    /**
73
     * Set the height of the viewport. One of (auto|min|max|average) or 
74
     * a custom number.
75
     * @param {string|number} height
76
     */
77
    setHeight: function(height) {
78
        var $this = this;
79
        raf(function(){
80
            $this.state.height = $this.calculateHeight(height);
81
            $this.tabs.$el.height($this.state.height);
82
            $.each($this.tabs.tabs, function(i,tab) {
83
                tab.editor.resize();
84
                tab.vscroll.refresh();
85
                tab.hscroll.refresh();
86
            });
87
        });
88
    },
89
    
90
    /**
91
     * Set Mivhak's accent color. Applied to the nav-tabs text color, 
92
     * underline, scrollbars and dropdown menu text color.
93
     * 
94
     * @param {string} color
95
     */
96
    setAccentColor: function(color) {
97
        if(!color) return;
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
98
        this.topbar.$el.find('.mivhak-top-bar-button').css({'color': color});
99
        this.topbar.$el.find('.mivhak-dropdown-button').css({'color': color});
100
        this.topbar.$el.find('.mivhak-controls svg').css({'fill': color});
101
        this.tabs.$el.find('.mivhak-scrollbar-thumb').css({'background-color': color});
102
        this.topbar.line.css({'background-color': color});
103
    }
104
};